CFS 9.2 MP 3.0 2018 New User Interface - Fluid

CFS 9.2 MP 3.0

2018

New User Interface - Fluid

Carmen Arreguin

Steve SharifiCMS - CFS

Chancellor’s Office

1February 2018

Topics

• Road to Fluid!

• Fluid Overview

• Fluid Components

• Phase I

• Phase II

• Transition

• Questions?

Topics

2February 2018

Road to Fluid

3February 2018

Road to Fluid

PeopleSoft MobileEvolution Of PeopleTools

Fluid UI/ Responsive Web Design

Windows Client 100% Internet

4February 2018

• Advances in technology with mobile devices and the internet• User expectations have increased

Road to Fluid

5February 2018

Fluid - Enabling a Mobile Workforce!

Fluid Overview

• Fluid uses the latest technology HMTL5/JavaScript /CSS3 enabling PeopleSoft Fluid pages to scale gracefully from large screens devices of desktops to reduced viewing space of smartphones and tablets.

6February 2018

Fluid User Interface

• Access PeopleSoft application across multiple form factors

• Several different paths for users to access functionality

• Users can personalize navigation to accommodate organization

• Significantly improves efficiency over Classic UI

• Reduces new users’ navigation learning curve

• Facilitates customized business process and training

Fluid Overview

7February 2018

Fluid - Minimum Browser Version Requirements

Device Type Browser

PC Internet Explorer 11Firefox 24Chrome 35Safari 6 (Max Only)

Mobile Internet Explorer 11 for windows 8.1 (tablets only) not smartphonesSafari iOS7Chrome on Android 4.4

• To access Fluid features, you must have at least the following minimum browser version on your device

Fluid Overview

8February 2018

Fluid Components• Fluid UI

- Banner / Icons Homepage Pages

- Navigation Bar (NavBar)- Homepages- Tiles

Fluid Components

9February 2018

Banner / Icons - Homepage

Banners/Icons

• A standard banner appears at the top of every Fluid page that includes the page title and some standard icons.

Icon Description ActionHome Icon Takes you to your home page

Search Icon Enables you to Search

Alerts Icon Notifications window to view actions and alerts

Action Icon Tap to see a list of Actions available for the current window: My Preferences, Help, Sign Out

NavBar Icon Tap to expand NavBar window. Options available: Navigator, Recent Places, My Favorites, My Preferences, Classic Home

10February 2018

Banner / Icons - Pages

Banners/Icons

• Icons on the application pages are slightly re-arranged

• The Banner variance will be eliminated with Phase II implementation

Icon Description Action

Home Icon Takes you to your home page

Search Bar Enables you to Search

Sign Out Icon Ends user’s session and signs out

Notification Icon Tap to see a list of Notifications

NavBar Icon Tap to expand NavBar window. Options available: Navigator, Recent Places, My Favorites, My Preferences, Classic Home

Add To Drop-Down Tap to view Add drop-down options: Homepage, NavBar, Favorites

11February 2018

The Fluid Navigation Bar (NavBar)

NavBar

• Tap or click on the Icon to expand the NavBar window

- Five Delivered Tiles Navigator Recent Places My Favorites My Preferences Classic Home

Tile List Can be PersonalizedAdd TilesRemove TilesAlter Tile Sequence

12February 2018

The Fluid Navigation Bar (NavBar)

NavBar

• Navigator- Fluid Main Menu

13February 2018

The Fluid Navigation Bar (NavBar)

NavBar

• Recent Places

• My Favorites

• My Preferences

14February 2018

The Fluid Navigation Bar (NavBar)

NavBar

• Classic Main Menu

15February 2018

MP3.0 Fluid User Interface

• Phase I CFS 9.2 MP3.0 Go Live Date: April 30, 2018

CFS 9.2 Homepage

Tiles Classic Main Menu / Breadcrumbs (Available During Transition)

Phase I

16February 2018

Current Sample AP Navigation

Navigating to Voucher Entry Page

Phase I

17February 2018

Current sample GL Navigation

Navigating to Journal Entry Page

Phase I

18February 2018

Fluid User Interface Structure

……

…

Phase I

CFS 9.2 Homepage

Tile 1

Tile 2

Tile 9

Phase I

User

19February 2018

Fluid User Interface Structure – Cont.Homepages

CFS 9.2 Fluid Homepage

Phase I

20February 2018

Fluid User Interface Structure – Cont.Tiles

Direct Link to a CFS PagePhase I

Phase I

21February 2018

Fluid User Interface Structure – Cont.Tiles – Adding Tile to CFS 9.2 Homepage

Phase I

22February 2018

Fluid User Interface Structure – Cont.Tiles – Adding Tile to CFS 9.2 Homepage

Phase I

23February 2018

Fluid User Interface Structure – Cont.Tiles – Adding Tile to the NavBar

Phase I

24February 2018

Fluid User Interface Structure – Cont.Tiles – Adding Tile to Favorites

NavBar

25February 2018

MP3.0 Fluid User Interface

• Phase II CFS 9.2 MP3.0 Go Live Date: TBD

CFS 9.2 Homepage

Personalize Homepages

TilesClassic Main Menu / Breadcrumbs (Phased Out)

Phase II

26February 2018

Fluid User Interface Structure

……

…

Phase II

CFS 9.2 Homepage

Tile 1

Tile 2

Tile 9

Homepage 1 Homepage 2 Homepage 9……

……

…

Tile 1

Tile 2

Tile 9

……

…Tile 1

Tile 2

Tile 9

……

…

Tile 1

Tile 2

Tile 9

……

……

……

Phase II

User

27February 2018

Fluid User Interface Structure – Cont.Homepages

Phase II

28February 2018

Fluid User Interface Structure – Cont.Homepages – Cont.

Phase II

29February 2018

Fluid User Interface StructureHomepages – Cont.

User Defined Homepages

Phase II

30February 2018

Fluid User Interface Structure – Cont.Tiles

Fluid WorkCenters (AP, GL, Buyer)

Dynamic Tiles (Chart, Pivot Grid)

Direct Link to a CFS Page

Navigation Collection

Phase I Phase II

Phase II

31February 2018

Fluid User Interface Structure – Cont.Tiles – Navigation Collection

NavBar

32February 2018

Fluid User Interface Structure – Cont.Tiles – Navigation Collection – Cont.

Phase II

33February 2018

Fluid Conversion- Sample 1Current Classic MenuCurrent Favorites List

Phase II

34February 2018

Fluid Conversion- Sample 1 – Cont.CFS 9.2 Homepage

Phase II

35February 2018

Fluid Conversion- Sample 1 – Cont.Month-End Reporting

Phase II

36February 2018

Fluid Conversion- Sample 2Homepages by Module

Phase II

37February 2018

Fluid Conversion- Sample 2 Cont.Homepage by Module – Cont.

Phase II

38February 2018

Fluid Conversion- Sample 3Homepage by Role / Module (Ex: Manager, Employee, and Administrator)

Phase II

39February 2018

Fluid Conversion- Sample 4Homepage by Business Process (Ex: Voucher Processing, Procurement Operations)

Phase II

40February 2018

MP3.0 Fluid User Interface

• Transition

Period between Phase I and Phase II Go-Lives

CMS to develop the security and implementation model for customizing and publishing Homepages and Tiles

Utilizing Oracle Guidance and Campus Feedback

Users to transition from using the Classic Menu to the NavBar

Transition

41February 2018

Documentation

Common Financial Systems (CFS) 9.2 – MP 3.0

• https://csyou.calstate.edu/Projects-Initiatives/CMS/AppDevelopment/CMSCFS92/Pages/CFS92Home.aspx

Documentation

42February 2018

• CFS Application Team- Carmen Arreguin [email protected] (562) 951-4279

- Steve Sharifi [email protected] (562) 951-4337

Contacts

Contacts

43February 2018

Questions