PeopleSoft Fluid Navigation Standards

Fluid User Experience

ORACLE WHITE PAPER | OCTOBER 2015

Disclaimer
The following is intended to outline our general product direction. It is intended for information
purposes only, and may not be incorporated into any contract. It is not a commitment to deliver any
material, code, or functionality, and should not be relied upon in making purchasing decisions. The
development, release, and timing of any features or functionality described for Oracles products
remains at the sole discretion of Oracle.

FLUID NAVIGATION STANDARDS

Table of Contents
Disclaimer

Overview

Homepages

Add To Drop-Down Menu

Interaction Hub Environment

Notifications

Actions

Alerts

Actions List

NavBar

10

Tiles

10

Second Level Content

11

Recent Places

12

My Favorites

12

Navigator

12

Search Results

13

Application Start Pages

16

Fluid and Classic Coexistence

17

Example Flow: Benefits Summary

18

Example Flow: Benefits Enrollment

19

Example Flow: Life Events

20

Small Form Factor

21

FLUID NAVIGATION STANDARDS

Non-Small Form Factor

22

Application Homepages

23

Single Component with Page Tabs and Page Subtabs

25

Activity Guides

26

Navigation Collections

27

NavBar Tile Navigation Collection

28

Optimized Application Start Page

28

Non-Optimized Application Start Page

29

Related Actions

30

Pivot Grids

31

Comparison of Design Patterns

31

FLUID NAVIGATION STANDARDS

Overview
The philosophy of Fluid navigation focuses on:
Multiple paths for users to access functionality.
Users ability to choose the path that is most effective for them.
Use of Related Actions to make navigation work across all paths.

The Classic PIA navigation uses a locator link (breadcrumb) menu with a deep hierarchy. Fluid
navigation uses homepages and tiles as the starting points for navigating to both Fluid and Classic PIA
pages. Further categorization and navigation to Fluid and Classic transactions is achieved through the
use of Fluid Application Start pages and Fluid Application Homepages.
Create new homepages.
Add tiles to homepages via the Tile Repository.
Add a component tile to any homepage from within the component.
Add tiles to the NavBar.
Reorder tiles in the NavBar.
Add favorite components to My Favorites in the NavBar.

Homepages
Homepages are the starting point for Fluid navigation. Users can have several homepages and one default
homepage that appears after they log in.
Homepages are role based and will have titles that reflect various roles, such as:
Manager
Employee
Administrator
Cash Manager
Procurement Officer
The following examples show the navigation launch points on the Employee Self Service Homepage for small and
medium form factors:

1 | FLUID NAVIGATION STANDARDS

Figure 1: Examples of drop-down list and swipe on Homepage for small and medium form factors

PeopleSoft recommends that:

Individual users not have more than five delivered homepages.
A homepage not have more than 9 tiles for a given user.

Add To Drop-Down Menu

End users can add any component they are currently viewing to any one of their homepages. PeopleSoft
recommends that each Fluid or Classic component contain a unique image for the component in order to improve
usability by making it easier for users to identify individual components that were added to their homepages.
The following example shows the tile that is added to the Fluid Homepage when the Create Job Opening
component is added:

2 | FLUID NAVIGATION STANDARDS

Figure 2: Example of new tile added to the Fluid Homepage when Create Job Opening component is added

The tile that is placed on the Fluid Homepage will have the default image shown below if no image is specified in the
content reference for that component:

Figure 3: Example of default image for new tile

PeopleSoft recommends that all components have a unique image defined for Fluid.

Interaction Hub Environment

3 | FLUID NAVIGATION STANDARDS

In an Interaction Hub environment, databases across pillars that contain homepages with the same name will
automatically have the tiles merged into a single homepage of that name. For example, a single homepage with a
title of Employee Self Service will be created in a Interaction Hub environment when FSCM and HCM databases
both have homepages named Employee Self Service. The system will display all of the tiles from the FSCM
Employee Self Service Homepage and all of the tiles from the HCM Employee Self Service Homepage in a single
homepage named Employee Self Service in the Interaction Hub environment.
The ordering of the tiles on the merged homepage is based on the sequence number provided in the Content
Reference for each tile across databases.
Guidelines and recommendations for a homepage in a Interaction Hub environment:
Frequently used transactions across database pillars will have higher sequence numbers than less frequently
used transactions.
When a new transaction is added to a homepage that is shared across pillars, the sequence numbers of all tiles
across pillars should be evaluated, and the new tile should be given an appropriate sequence number so that it
will appear in logical order when in a Interaction Hub Environment.
To avoid confusion in a Interaction Hub Environment, tiles in different databases that are merged should not
repeat the same title in two different tiles.

Notifications
The Notifications framework provided by PeopleTools will display a badge with a count on the flag icon in the banner
to notify users of any new Actions or Alerts. The following example shows a count of three Notifications:

Figure 4: Example of banner showing three Notifications in a badge overlaying the flag icon

Tapping the flag icon opens a modal window that displays Actions and Alerts:

4 | FLUID NAVIGATION STANDARDS

Figure 5: Example of Notifications modal window showing Actions and Alerts when user clicks the flag icon

Actions and Alerts that have not been viewed yet will have a blue circle next to them:

Figure 6: Example of unviewed Actions in Notifications modal window

5 | FLUID NAVIGATION STANDARDS

Tap an individual Action or Alert to transfer to the transaction. Alternatively, tap the View All link to see a detailed list
of the transactions:

Figure 7: Example of View All link in Notifications modal window

After tapping the View All link, the View All Notifications window opens:

Figure 8: Example of the View All Notifications window

Once the user has viewed the Actions and Alerts, the blue circle will no longer appear next to them, and the system
will recalculate the count for the Notifications flag:

6 | FLUID NAVIGATION STANDARDS

Figure 9: Example of already viewed Actions and Alerts

The Notifications framework may be used to provide users with easy navigation to transactions that need their
attention.
The two types of Notifications are:
Actions: Allow transfer to a transaction where some action may be performed.
Alerts: An informational message that may be deleted by the user. A transfer to the transaction may also be
performed, but this is optional.

Actions
Actions are Notifications that enable users to navigate directly to transactions that need their attention. The following
example shows a list of Actions that are awaiting an Approval action:

7 | FLUID NAVIGATION STANDARDS

Figure 10: Example of Actions requiring an Approval action

Alerts
Alerts enable users to navigate to a transaction where a status or some other information may have changed, thus
enabling users to see details of the change. The following example shows a count of 9 Alerts indicating that request
for approval was granted. In this scenario, since the alert is informational, the user has the option of tapping the X
icon to dismiss the alert because no action is required:

Figure 11: Example of informational Alerts that require no action

8 | FLUID NAVIGATION STANDARDS

Guidelines and recommendations for Notifications:

Use an Action type notification when a time-sensitive action must be taken. This type of notification is similar to
workflow and can be used to notify a user that a transaction is awaiting input.
Use an Alert when it is important to communicate to the user that the status or some other transaction change
was made. Allow transfer to the transaction if it makes sense for the functionality.

Actions List
The Actions List contains system-level actions as well as context actions:
Context Action: An action that is specific to the current component. Context Actions may enable the user to
navigate to component-specific pages.
System Action: An action that is at the system level and is not related to a component.
The following example from Company Directory shows three context actions and five system actions:

Figure 12: Example of expanded Actions List showing three context actions (outlined) and five system actions

Note: Context Actions are always listed first, followed by System Actions.
Guidelines and recommendations for Context Actions:
Navigation from the Actions List should be used for non-primary actions.
Primary navigation should be placed in the main content area or in the left panel for component or page tab
navigation.
When a page is accessed less frequently, the Actions List may be used for navigation so that the main content
area can be used for primary tasks.
In general, the total number of Context Actions displayed for a component should not exceed six.

9 | FLUID NAVIGATION STANDARDS

 Do not use the Actions List as a set of Quick Links.

NavBar
The NavBar contains the following elements:
Tiles
Second Level Content
Recent Places
My Favorites
Navigator
Each of these elements is shown in the following example and described in the sections that follow.
NavBar

Recent Places

My Favorites

Navigator

Related Actions

Second Level
Content

NavBar Tile
Figure 13: Example showing NavBar elements

Tiles
The two types of behavior for tiles on the NavBar when tapped are:
Transfer the user to a component.
Open Second Level Content.

10 | FLUID NAVIGATION STANDARDS

A set of NavBar tiles is delivered out of the box. The system always displays the Recent Places, My Favorites, and
Navigator PeopleTools tiles.
Guidelines and recommendations for NavBar tiles:
The first three tiles that appear should appear at the top of the NavBar in the following order:
Recent Places
My Favorites
Navigator
Tiles selected to be in the NavBar should be the most frequently used functionality.
As delivered, no more than five tiles should be placed in the NavBar for a given user; all first-level tiles should be
visible to the user.
In a Interaction Hub environment, the system will display all NavBar tiles selected across pillars, and the ordering
will follow the sequence number defined for the tile in the content reference. When adding a new tile to the
NavBar, work across pillars to determine what the sequence number of that tile will be when merged with all tiles
from all pillars.

Second Level Content

Second Level Content in the NavBar enables users to:
Transfer to another page.
Open a modal window.
Second Level Content may enable users to navigate to transactions. In the My Team example that follows, users
have two options for navigating from the Second Level Content:
Navigate to a transaction via the Related Content icon.
Navigate to My Team via the Go to My Team button.

Figure 14: Example of two options for navigating from Second Level Content, the Related Content icon or the Go to My Team button

11 | FLUID NAVIGATION STANDARDS

Second Level Content may also enable users to perform actions without navigating away from the current context.
In the following Project Team example, the Notify Resource action opens a modal window where an email can be
sent to a member of the project team. When the modal window is dismissed, the user remains in the same context
they were in before launching the modal window to send an email:

Figure 15: Example of modal window that enables users to perform an action without leaving initial context

Guidelines and recommendations for NavBar Second Level Content:

Second Level Content may be informational only and does not need to provide navigation to another location.
Tapping Second Level Content may enable the user to navigate to another transaction. When the Second Level
Content allows navigation to another transaction, use a chevron to indicate that the row is tappable.
Second Level Content may contain Related Actions that provide navigation to a transaction.
To avoid mis-tapping, do not provide a Related Action hotspot on top of a tappable row.
Do not have a hotspot on top of a tappable row because hotspots on tappable rows may cause mis-tapping and
accessibility issues.

Recent Places
The Recent Places tile in the NavBar stores a list of recently visited components. Users can easily navigate back to
components from this list.

My Favorites
The My Favorites tile in the NavBar stores a list of components the user has marked as Favorites. This tile enables
the user to choose frequently visited components and add them to a list for easy access.

Navigator

12 | FLUID NAVIGATION STANDARDS

The Navigator provides navigation access to all components that are registered in the Portal Registry as Content
References and are marked as visible in the PeopleTools Portal Structure and Content. The following example
shows the top level when the Navigator NavBar tile is selected in a Interaction Hub environment:

Figure 16: Example of top level when Navigator NavBar tile is selected in Interaction Hub environment

Guidelines and recommendations for NavBar Navigator:

The Navigator is not intended to be the primary method of Fluid navigation.
The primary method for Fluid navigation is via Homepages, the NavBar, Application Start pages, and Application
Homepages. The Navigator supports legacy PeopleSoft hierarchical navigation to Classic components.

Search Results
Global Search uses the SES and PeopleTools Global Search framework. Global Search is accessed differently
based on the size of the device or window:
Access is from the Actions List when the window width becomes small enough that the search operation is moved
into the Actions List.
Access is from the magnifying glass icon in the banner when the window width is large enough to accommodate
the Search icon.

13 | FLUID NAVIGATION STANDARDS

Example of a Global Search from the banner:

Figure 18: Example of accessing Global Search from the banner

Example of a Global Search from the Actions List:

Figure 19: Example of accessing Global Search from the Actions List

The system displays the search results in a two-panel layout on form factors other than the small form factor:

14 | FLUID NAVIGATION STANDARDS

Figure 20: Example of Global Search results in non-small form factor device

Global Search results may display Related Actions when the component-level related action was configured in
Related Content Services:

15 | FLUID NAVIGATION STANDARDS

Figure 21: Example of Global Search results with Related Actions

General guidelines and recommendations for Global Search Results:

Include Related Actions in the search results when the user may navigate to a number of different transactions
from the search results.
Enable users to access components using free text search without having to provide required key fields such as
SetID, Business Unit, and so on.
Provide users with keyword search capability that spawns an entire suite of functionality instead of a particular
component.
Show search results only as a List view; Grid view and other views are not supported.

Application Start Pages

Use an Application Start page to reduce the navigation burden. The Fluid navigation paradigm moves away from the
deep locator link (breadcrumb) hierarchy used in Classic PIA that may require a user to click many times to
navigate the Classic menu hierarchy. Instead, components are grouped into an Application Start page, where a user
can easily navigate among the different components. Application Start pages are typically accessed via the
homepage and are only one click away. This ease of access provides the user with two-click access to navigate to
the components they need to open.
Application Start pages are also used to reduce the total number of tiles on a homepage. Refer to the Homepages
topic for guidelines on limiting the number of tiles on a homepage. Grouping components into an Application Start

16 | FLUID NAVIGATION STANDARDS

page allows developers to reduce the total number of tiles that would be required if they mapped a single tile to
every Fluid component.

Fluid and Classic Coexistence

With PeopleTools 8.55, PeopleSoft will deliver a single Fluid homepage with one overall branding theme that will be
the same whether the user is in a Classic PIA component or a Fluid component:

Figure 23: Progression to single Fluid Homepage with one overall branding theme

Navigation between Fluid and Classic components will no longer be separate. Every user will land on a Fluid
Homepage that may contain tiles that transfer the user to a Fluid or a Classic component. Similarly, an Application
Start page may contain both Classic components and Fluid components in the left panel.
The following navigational flows may be used based on functional requirements:
1. Left Panel item directly opens a Fluid component.

Left Panel Item

Fluid Component

2. Left Panel item directly opens a Classic component.

Left Panel Item

Classic Component

3. Left Panel item directly opens a Fluid component, which in turn opens a Classic component.

Left Panel Item

Fluid Component

Classic Component

The following Application Start page contains an example of each of the three navigational flows shown previously:

17 | FLUID NAVIGATION STANDARDS

Figure 24: Example of three navigational flows

Example Flow: Benefits Summary

Left Panel Item

Fluid Component

Benefits Summary

Benefits Summary

18 | FLUID NAVIGATION STANDARDS

Figure 25: Example of Left Panel item directly opens a Fluid component

Example Flow: Benefits Enrollment

Left Panel Item

Classic Component

Benefits Enrollment

Benefits Enrollment

19 | FLUID NAVIGATION STANDARDS

Figure 26: Example of Left Panel item directly opens a Classic component

Example Flow: Life Events

Left Panel Item

Fluid Component

Classic Component

Life Events

Life Events

Selected Event

20 | FLUID NAVIGATION STANDARDS

Figure 27: Example of Left Panel item directly opens a Fluid component, which in turn opens a Classic component

Small Form Factor

On the small form factor, instead of a two panel layout, a component is used to display the left panel content that is
shown in non-small form factors.

Figure 28: Example on a small form factor

21 | FLUID NAVIGATION STANDARDS

On the small form factor:

No component is selected when the page is opened.
A list view with icon construct is used to display each component in the list.
The back button in the upper left of the selected component returns the user to the list of components on the
Application Start page.
This example shows the navigation flow using the small form factor:

Figure 29: Example of navigation flow using the small form factor

Non-Small Form Factor

For non-small factors, an Application Start page uses a two-panel layout with a list of related components in the left
panel and the selected component displayed in the content area. The selected component changes to green.
In non-small form factors:
The first component in the list is selected when the page is opened.
A list of components appears in the left panel, and the selected component appears in the content area.
The back button in the upper left of the selected component returns the user to the previous page, typically a Fluid
homepage.
The following example shows an Application Start page on a tablet:

22 | FLUID NAVIGATION STANDARDS

Figure 30: Example of Application Start page on a tablet device

Guidelines and recommendations for Application Start pages:

Group functionally similar components in an Application Start page.
Provide each component with a unique image so that when it is added to a homepage, that unique image will
appear on the homepage tile and it should match the image that appears next to that component in the
Application Start page.
Ensure that the page contains no more than eight to ten components.
Ensure that the first component in the list will be selected and loaded when the start page is first opened for tablet
and larger form factors.
Ensure that no items will be selected on the small form factor when it is first opened.
Ensure that the Application Start page will handle user security.
Order the components based on the level of usage. Administrators and end users will not have the ability to
reorder the components.
In general, make the left panel fixed and not collapsible for medium and larger form factors. The left panel may be
set to collapsible when the entire right content area needs to be displayed to accommodate a large amount of
information. For example, Org Chart Viewer requires a large amount of horizontal space.

Application Homepages
An Application Homepage provides navigation launch points to components, similar to an Application Start page.
However, an Application Homepage contains tiles rather than a list of links, as is seen in the Application Start page.

23 | FLUID NAVIGATION STANDARDS

The tiles in the Application Homepage contain charts and other live data. Use an Application Homepage when you
want to convey high-level summary information to users that will allow them to determine whether they want to open
the component.
These examples show a side-by-side comparison of an Application Start page and an Application Homepage:

Figure 31: Example of Application Start page on left and Application Homepage on right

In both cases, functionally similar components are grouped. In the Application Start page, however, navigation
between components is done by selecting a component in the left panel of the page, which contains only an icon
and a label. In the Application Homepage, navigation between components is done by returning to the Application
Homepage and selecting a component. The Application Homepage contains tiles with live data that provides
additional information to the user. The following example shows navigation to the Application Homepage from a
homepage tile:

Figure 32: Example of navigating from a homepage tile to an Application Homepage

24 | FLUID NAVIGATION STANDARDS

Guidelines and recommendations for Application Homepages:

Provide live data in the tiles showing a high-level summary of information that is important to the user.
As with an Application Start page, the Application Homepage should group functionally similar components.
Do not add unnecessary hierarchy to the navigation that requires users to tap through multiple tiles to reach their
destination. When intermediary tiles are used, they should add value for the user.
Do not use a homepage tile to transfer to another homepage. This action will confuse the user, and they will not
know how to get back to the homepage from which they started. Instead, use the Application Homepage that will
be available in PeopleTools Release 8.55.

Single Component with Page Tabs and Page Subtabs

Use page tabs when a large amount of information must be displayed to the user. Rather than placing all of the
fields on a single page and allowing it to scroll, break up the information into logical groupings and place on separate
pages. Use page tabs to navigate among the separate groups of information.
Horizontal page tabs in Fluid are not recommended because they do not display well in the space provided in the
small form factor, and the overflow of tabs becomes an issue as browser window width is reduced. Tabs displayed
vertically in the left panel provide a responsive design that renders well on all form factors.
The following example shows the traditional, horizontal display of tabs found in Classic PIA. This representation of
tabs consumes a large amount of horizontal space:

Figure 33: Example of Classic PIA tab layout, which consumes a large amount of horizontal space

In Fluid, two design patterns are available in a two-panel layout for navigating various sections of a component:
Page with tabs
Page with tabs and subtabs
The following example shows how page tabs and page subtabs can be placed in the left panel, where the tabs can
scroll vertically:

25 | FLUID NAVIGATION STANDARDS

Figure 34: Example of page tabs and subtabs in left panel, where they can scroll vertically

Note: Page subtabs may only be one level deep, as shown in Figure 34.
Guidelines and recommendations for a component with page tabs and subpage tabs:
Do not display a long list of navigation links horizontally across the page because it will result in horizontal
scrolling in smaller windows and in a portrait orientation in smaller form factors. Consider using page tabs and
subtabs instead.
Display page tabs and page subtabs in the left panel of a two-panel layout, as shown in the previous figure. Do
not display page tabs horizontally across a page.
By default, display the contents of the first tab in the list in the left panel in the right side content area. Select the
primary information as the first tab.

Activity Guides
The Activity Guide Framework will be updated in PeopleTools Release 8.55. An Activity Guide standard is
scheduled to be written but does not currently exist.
The Activity Guide provides a user friendly framework for guiding a user through a set of related tasks either
sequentially or non-sequentially. The user navigates through a set of steps created by the Activity Guide Designer.
In general, once a user is in the Activity Guide, they should not have actions that would allow them to navigate away
from the Activity Guide before it is complete or before they purposefully exit it.

26 | FLUID NAVIGATION STANDARDS

The options for navigating to an Activity Guide are via:

Homepage tiles
Application Homepage tiles
Application Start pages
WorkCenters
Related Actions
Component page links
NavBar tiles
USING OPTIMIZED AND NON-OPTIMIZED ACTIVITY GUIDES

Activity Guide Type

Guidelines for Use

Optimized Activity Guide

Use when the Activity Guide does not contain any steps that display
a left panel or application header. An optimized Activity Guide:

Is designed to be optimized for the Activity guide framework.

Supports both sequential and nonsequential processes.
Discourages user from transferring away from the process.
Does not use the left panel.
Does not use custom applications header.
Could be a Single Unit of Work design.
Evaluates Applications Save button placement as part of the
optimization process.
Uses the modified PeopleTools banner in Guided mode:
New navigation functionality: Exit, Next, Previous
Actions List contains Home
Optional functionality: Notification
Not available in Guided mode: Search, NavBar

Non-optimized Activity Guide

Use when you have an Activity Guide step that contains a page with
a left panel or application header.
When a step contains a page with a left panel, the left panel
contents of the page will appear, and the list of Activity Guide steps
will move to a drop down list in the banner.
A non-optimized Activity Guide:
Supports both sequential and nonsequential processes.
Discourages user from transferring away from the process.
Uses the modified PeopleTools banner in Guided mode:
New navigation functionality: Exit, Next, Previous
Actions List contains Home
Optional functionality: Notification
Not available in Guided mode: Search, NavBar

Guidelines and recommendations for Activity Guides:

Do not navigate to an Activity Guide from a modal window.
Do not use Activity Guides in the content area of a two-panel layout.

Navigation Collections
In PeopleTools Release 8.55, you can use Navigation Collections to:
Create NavBar tiles that open the list of links from the Navigation Collection in the Second Level Content area of
the NavBar.

27 | FLUID NAVIGATION STANDARDS

 Render an Application Start page with the links from the Navigation Collection in the left panel of an Activity
Guide. The Navigation Collection is used in conjunction with a Content Reference, and the Activity Guide is used
to render the page. It does not require any setup in the Activity Guide Framework.

NavBar Tile Navigation Collection

A NavBar tile opens Navigation Collection links in the Second Level Content area:

Figure 35: Example of Navigation Collection links opened in the Second Level Content area from a NavBar tile

Optimized Application Start Page

The Application Start page shown here is optimized. The left panel contains a list of links defined by a Navigation
Collection, and none of the links opens a Fluid page with a left panel or application header:

28 | FLUID NAVIGATION STANDARDS

Figure 36: Example of optimized Application Start page

Non-Optimized Application Start Page

The Application Start page shown here is non-optimized. The links from the Navigation Collection are contained in
the banner drop-down menu.

29 | FLUID NAVIGATION STANDARDS

Figure 37: Example of non-optimized Application Start page

GUIDELINES FOR USING NAVBAR TILES AND APPLICATION START PAGES

Type
NavBar tiles

Application Start pages

Guidelines for Use

Use when a group of links is needed for quick navigation.
Navigation Collections allow an unlimited number of grouping
levels for the transaction links; limit the number of levels in the
Navigation Collection to four or less.
Provide meaningful Navigation Collection names and folder names
for the groups of links.
Use when you want to navigate between components, from the left
panel, or from the banner drop-down menu.
Ensure that Navigation Collections are no more than two levels
deep.

Related Actions
Related Actions are key to providing seamless, quick navigation between components without requiring the user to
perform a large number of clicks, taps, and page refreshes when moving from one component to another. Rather
than requiring the user to back out of a component to the homepage and then move forward again to open a new
component, Related Actions enable the user to move directly between components.
Guidelines and recommendations for Related Actions:

30 | FLUID NAVIGATION STANDARDS

 When designing new Fluid pages, evaluate each page to see if it makes sense to place Related Actions on the
page to help the user in navigating through their various business processes.
If it is possible to assist the user by reducing navigation click counts through the use of Related Actions, then
place the appropriate Related Actions on the page.
Do not provide excessive unrelated Related Actions on a page. Navigating through a deep menu hierarchy in the
Related Actions structure would require numerous clicks, which would be burdensome to the user and should be
avoided.

Pivot Grids
You may use Pivot Grids to guide the user to specific components and transactions based on aggregated business
data. Users may drill into more and more detailed aggregated data within the Pivot Grid, which leads to a list of links
for navigating to specific transactions of interest. Pivot Grids and Charts may be used to provide summary level data
to users with the ability to change a particular view of the data easily and, ultimately, to allow users to navigate to
specific transactions where they may take an action based on their data analysis.

Comparison of Design Patterns

The following table provides a guide to the appropriate use of each of the different design patterns in this document.
Use this guide to help you determine the best navigation approach for your functionality.
DESIGN PATTERNS

Homepage

Application Start

Application

Page

Homepage

8.54

8.54

8.55

Description

Page containing tiles that

appear following login.

Page displaying a list of

Page containing
related components in the functionally similar tiles
left panel with the
with live data.
selected component in the
right panel.

Page displaying a list of

steps in the left panel with
the selected step in the
right panel or a page
displaying a simple
horizontal train stop.

Navigation

Login > Homepage

Homepage > Tile >

Application Start page

Homepage > Tile >

Activity Guide

Minimum

Activity Guide

8.55

PeopleTools
Release

Homepage > Tile >

Application Homepage

Homepage > Tile >

Application Start Page >
Activity Guide
Homepage > Tile >
Component > Activity
Guide

Implementation

Group functionally similar

tiles on a Role Based
Homepage. Allows
groupings of tiles based
on the users role, for
example, Manager,
Employee, Administrator.

31 | FLUID NAVIGATION STANDARDS

Group functionally similar

components in a page
with a two-panel layout.
The list of components
contains an icon, a title,
and an optional count.
Allows groupings of

Group functionally similar

live tiles on a page.
Similar to an Application
Start page but uses live
data on tiles to convey
high-level information to
users.

Use the PeopleTools

Release 8.55 Activity
Guide Framework to
create Activity Guides.

similar components to
improve the experience of
navigating quickly from
component to component.

Usage

Use no more than 5

homepages per user and
no more than 9 tiles per
homepage.

32 | FLUID NAVIGATION STANDARDS

Use this construct to

avoid having a large
number of tiles on a
homepage or a large
number of homepages.
Use when no summarylevel metric data is
available to be displayed
for each component. If
you have summary-level
data to display for each
component, consider
using the Application
Homepage.

Use this construct to

avoid having a large
number of tiles on a
homepage or a large
number of homepages.
Use when you have
summary-level data to
display in tiles and you do
not want to open any
component by default.

Use this framework when

it will improve the users
experience to be guided
through a set of steps to
complete an activity.

Oracle Corporation, World Headquarters

Worldwide Inquiries

500 Oracle Parkway

Phone: +1.650.506.7000

Redwood Shores, CA 94065, USA

Fax: +1.650.506.7200

CONNECT W ITH US

blogs.oracle.com/oracle
facebook.com/oracle
twitter.com/oracle
oracle.com

Copyright 2015, Oracle and/or its affiliates. All rights reserved. This document is provided for information purposes only, and the
contents hereof are subject to change without notice. This document is not warranted to be error-free, nor subject to any other
warranties or conditions, whether expressed orally or implied in law, including implied warranties and conditions of merchantability or
fitness for a particular purpose. We specifically disclaim any liability with respect to this document, and no contractual obligations are
formed either directly or indirectly by this document. This document may not be reproduced or transmitted in any form or by any
means, electronic or mechanical, for any purpose, without our prior written permission.
Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners.
Intel and Intel Xeon are trademarks or registered trademarks of Intel Corporation. All SPARC trademarks are used under license and
are trademarks or registered trademarks of SPARC International, Inc. AMD, Opteron, the AMD logo, and the AMD Opteron logo are
trademarks or registered trademarks of Advanced Micro Devices. UNIX is a registered trademark of The Open Group. 0615
White Paper Title
October 2015
Author: [OPTIONAL]
Contributing Authors: [OPTIONAL]