The document discusses PeopleSoft's Fluid user interface as an alternative to the classic interface. It provides an overview of Fluid and the development tools available. Key decisions for an organization adopting Fluid include whether to use Fluid, whether to use the Fluid homepage or classic portal, and whether to develop new apps in Fluid or classic. The document outlines several design patterns combining classic and Fluid components and provides examples from Oxfam GB and Spire Healthcare of real-world Fluid implementations.

1. PeopleSoft UI: Fluid, Classic, or Both?
A Decision for Every Customer
Graham Smith

2. Who am I ? – Graham Smith
Lead Consultant at Cedar Consulting
Oracle ACE Director
Chair of the PeopleTools SIG at UK Oracle User Group
7th year presenting at Oracle OpenWorld
http://i-like-trains.blogspot.co.uk

3. About Cedar
 Oracle Gold Partner
 PeopleSoft, HCM Cloud and Taleo Experts
 Support, Managed Services, Hosting Centre
 Around 70 consultants with Offices in UK, Switzerland, India and
Australia
 15 Upgrades to PeopleSoft 9.2 completed

4. Agenda
 Fluid: What’s it all about?
 User and Device Profiling
 Decisions and Design Patterns
 End user Stories

5. Fluid: What’s it all about?

6. Fluid: What’s it all about?
 Why?
 Application usability
 More intuitive & easier to use
 Expectation of users
“Fluid represents PeopleSoft’s
strategic direction for delivering
a robust and intuitive, yet
familiar, experience for your
application users.”
“A new paradigm and model”
“not just a new user interface”
“direction of all future PS
development”

7. Classic alongside Fluid

8. Classic Interface
Source: Wiktionary.org
Classic Portal Classic Component

9. PeopleTools 8.55
 From 8.55 Fluid will be the default interface
8.55 Related Actions
 Dashboards
 Fluid Forms Builder
 Simplified Analytics
 Activity Guides
 Master/Detail Pages
 Resizable tiles
 Tile Wizard
New Fluid
Features

10. Useful References & Guides
 FLUID UI: PeopleSoft Fluid User
Interface Documentation Updates
(Doc ID 1909955.1)
 Converting Classic PIA Components
to PeopleSoft Fluid User Interface
(Doc ID 1984833.1)
 PeopleSoft Fluid Navigation
Standards White Papers (Doc ID
2063602.1)

11. Fluid Navigation Standards White Papers (2063602.1)
Grid Standards
Message Standards
Related Action Standards
Icon Standards

12. PeopleSoft Spotlight Series

13. What do you get with Fluid UI ?
1. PeopleTools Fluid UI development tools
 Fluid Helper Tools
2. Fluid Components (or Apps)

14. Dev Tools - Application Start Pages

15. Dev Tools - Homepages and Tiles
 Recommend no more than 9
tiles per Homepage
 No more than 5 Homepages
 Bring key information onto
the Tile itself
 Think of these as a new form
of Pagelet
 Summary data
 Signal action
 Navigation

16. Windows and Fluid

17. Helper Tools
 Tile Wizard (new in 8.55)
 Fluid Search Results
 Notifications (Actually MAP not Fluid)
 replaces Worklist and is now cross system
 Pivot Grids
 Activity Guides (new in 8.55)
 Navigation Collections (new in 8.55)
 Unified header branding (new in 8.55)

18. User and Device Profiling

19. User and Device Profiling
1. People and their Roles
 Self service
 Executive
 Power
2. Devices they may use
 Phone
 Tablet
 Desktop/Laptop

20. Profile Users by Device
Tablets
PCs
Smart
Phones
Desktop Browsers:
• Google Chrome
• Internet Explorer
• Mozilla FireFox
• Apple Safari
• *Dolphin
• *Opera
• Microsoft Edge
Mobile Browsers:
• Google Chrome
• Apple Safari
• *23+ others
*Not certified

21. Profile Users by Application Type
Tablet
Users
Desk
Based
Users
Smart
Phone
Users
Executive
Power
Self
Service

22. Decisions and Design Patterns

23. What are the decisions to be made
Use Fluid
(Y / N) ?
Fluid
Homepage
& Portal ?
Fluid or
Classic Apps
“direction of all future PS
development”

24. Use Fluid (Y/N) ?
 Do you need PeopleSoft on mobile device ?
 Either now or in the future?
 Do you want a Cleaner, Simpler user interface for Self Service and
Executive users?
 Do you want to take advantage of new features?
Use Fluid
(Y / N) ?

25. Landing Page or PeopleSoft Portal?
 Fluid Homepages designed for mobile devices
 Works well on desktops too
Fluid Homepage
• Tiles limited v Pagelets
• No Wizard
• Simple UI
• Great on mobile
Classic Portal
• Pagelets Rich content
• Pagelet Wizard
• Can look cluttered
• Limited on mobile
Fluid
Homepage
& Portal ?

26. The User Experience

39. Classic comp

42. Header Branding - Fluid and Classic

43. Header Branding - Fluid and Classic

44. Changing the Header in 8.54
 PeopleTools > Portal > Branding > Define Headers and Footers

45. Design Patterns

46. Design Pattern #1– Classic Portal
 Classic design using available
technology prior to
PeopleTools 8.54
 Good for desktop users
 Bad for mobile users
 Functionally rich, familiar
Classic portal framework
Login
Classic
Portal
Classic
Component
Classic
WorkCentre

47. Design Pattern #2– Classic Portal with Fluid Apps
 Good for both desktop &
mobile users
 Avoid Portal for mobile users
using bookmark direct to
Fluid components
 Great introduction to Fluid
 No Fluid Homepage to
maintain
 Self Service or Dashboards
Login
Classic
Portal
Classic
Component
Classic
WorkCentre
Fluid
Component
Mobile
Bookmark

48. Design Pattern #3 – Only Fluid
 Good for all devices – mobile &
desktop
 Limited breadth of Fluid apps
(increasing with every PUM
release)
 Included for completeness
Login
Fluid
Homepage
Fluid
Component

49. Design Pattern #4 Fluid Home - Classic & Fluid Apps
 No classic portal
 Tidy clean and simple
 All users get same login and
navigation experience
 Less functionality compare
to Portal
 But can replace with
WorkCentres
 No New Window
Login
Classic
Component
Classic
WorkCentre
Fluid
Component
Fluid
Homepage

50. Design Pattern #5– Classic Only or Fluid Only
Login
Fluid
Component
Fluid
Homepage
Classic
Portal
 Single point of login
 Drive UI on who you
are, what you’re doing
or what device
 Could be confusing
 Clear divide between
mobile and desktop
 Maybe restrictive if no
Fluid App available
Classic
Component
Classic
WorkCentre
?

51. Fluid
Component
Fluid
Dashboard
Design Pattern #6– Both Homepage and Portal
 Some Classic
acceptable on
Mobile device
 Complex to
administer
 Best of all worlds
Mobile
Login
Classic
Component
Classic
WorkCentre
Classic
Portal
Desktop
Login
Fluid
Homepage
Classic
WorkCentre

52. Real World Examples

53. Fluid Example from Oxfam GB
 Great example of Design Pattern #4
 Built by the amazing PeopleSoft Team at Oxfam
 (Not built by Cedar Consulting)
 Introduced as part of a HR 9.0 to 9.2 Upgrade Project
 1,200+ users worldwide (900+ self service)

54. Fluid UI @
 Exclusively Fluid Homepage
 Regardless of user device
 Even if users don’t use Fluid Apps
 Use Fluid apps where delivered
 Convert custom self service into Fluid

55. Homepage for most users

56. Homepage for Power Users

57. Spire Healthcare PeopleSoft Fluid Recruitment
 UK’s 2nd largest
provider of private
healthcare
 Job site built
around Classic
Candidate Gateway
 Cedar built Fluid
application

58. Design Pattern #2 – Classic Portal with Fluid Apps
Guest Login

59. Desktop BrowserCell Phone

60. Desktop BrowserCell Phone

61. Rotate Cell PhoneCell Phone

63. A strategy for converting to Fluid
• Record
• Record
• Record
• Record
• Record
• Record
C 1 C 2 C 3 F 4 F 5 F 6
1) Create new Fluid pages
C 4 C 5 C 6
2) Rename original pages
F 1 F 2 F 3 3) Rename Fluid to original names
Component

64. In Conclusion
 Understand what you have with Fluid
 Profile your users and devices – look to the future
 Decide Classic or Fluid ?
 Classic Portal and/or Fluid Landing page
 Classic Apps and/or Fluid Apps
 Choose a design that suits your profile and infrastructure
 Pilot some Fluid Apps in low risk area

65. New PeopleTools Book!
 Fluid UI
 MAP
 REST and Documents
 jQuery Mobile
 AngularJS
 Cordova
 Android
 Oracle Mobile
Application Framework
Jim & Sarah Marion

66. Who is Jeffrey?

67. Any Questions or Observations?
http://i-like-trains.blogspot.co.uk
graham.smith@cedarconsulting.co.uk