Download - ASUG - Fiori 2.0 in S4HANA 1610 - SAP...ü Business Notifications in the Launchpad ü Frequently Used Apps in the Me Area ü Tab Bar: Displaying Apps One Group at a Time on the Home

INTERNAL

Fiori 2.0

S/4HANA RIG | Javier Baltazar May 2017

RIG

EGIONALMPLEMENTATIONROUP

© 2016 SAP SE or an SAP affiliate company. All rights reserved. 2

Disclaimers

The information in this presentation is confidential and proprietary to SAP and may not be disclosed without thepermission of SAP. Except for your obligation to protect confidential information, this presentation is not subject to yourlicense agreement or any other service or subscription agreement with SAP. SAP has no obligation to pursue anycourse of business outlined in this presentation or any related document, or to develop or release any functionalitymentioned therein.

This presentation, or any related document and SAP's strategy and possible future developments, products and orplatforms directions and functionality are all subject to change and may be changed by SAP at any time for any reasonwithout notice. The information in this presentation is not a commitment, promise or legal obligation to deliver anymaterial, code or functionality. This presentation is provided without a warranty of any kind, either express or implied,including but not limited to, the implied warranties of merchantability, fitness for a particular purpose, or non-infringement. This presentation is for informational purposes and may not be incorporated into a contract. SAP assumesno responsibility for errors or omissions in this presentation, except if such damages were caused by SAP’s intentional orgross negligence.

All forward-looking statements are subject to various risks and uncertainties that could cause actual results to differmaterially from expectations. Readers are cautioned not to place undue reliance on these forward-looking statements,which speak only as of their dates, and they should not be relied upon in making purchasing decisions.


Agenda

• SAP Fiori – Concept Review

• SAP Fiori 2.0• What’s new?• What is Visual Harmonization?• Take Advantage of Visual Harmonization in S/4HANA 1610 projects• Deployment Options

• References

• Q&A

SAP FioriConcept Review


SAP Fiori Concept Review

Role-based simplification of business processes.

Shift from monolithic solutions to activity-based apps

Empowers you and the way you work


SAP Fiori Concept Review


From Launchpad to Apps

Fiori App PagesDetailed Views

DOMAIN-SPECIFIC INFORMATION AND ACTIONSOverview Pages (optional)

SINGLE ENTRY POINT �SAP Fiori Launchpad is the single entry point to access all apps

ENTER DETAILS & EXPLORE IN DEPTHFiori Apps, Classic Apps

SAP Fiori 2.0Enable Access to Complete Functionality

Introducing the Fiori Overview Page


TechnologyDesign

Information ArchitectureVisual Design Interaction

PatternsUser Interface

Business Logic

SAP Fiori 2.0 – from Principles to Design to TechnologyFiori is a comprehensive design vision & toolset for Enterprise Apps

Principles

Fiori Style Guide (Web, iOS)Fiori QualitiesPrototyping Resources and SAP BUILD

SAPUI5 SDK (Open Source OPENUI5, Fiori for iOS SDK)ABAP Programming Model for SAP FioriSAP HANA Core Data Services Reference

Fiori for S/4HANA CommunityFiori on S/4HANA wiki


SAP Fiori 2.0 – More than 100 Sample Business Roles in S/4HANA 1610500+ Fiori Apps (& related Classic Apps) assigned to sample roles


SAP Fiori 2.0 – Supported App Types in S/4HANA Fiori Apps Library holds all delivered Fiori Launchpad Reference Content

Delivered with S/4HANAü Fiori Apps

• SAPUI5ü Classic Apps

• Webdynpro / Floorplan Manager

• SAP GUI for HTML

Link to Fiori Apps Library

More information: Leading S/4HANA UX – Role-based for App Discovery and Activation

SAP Fiori 2.0What’s new?


1. Navigate to SAP Help Portal2. Search for keywords: User Interface Technology

7.513. Select required SP level4. Navigate through the desired sections:

What's New in Web Dynpro ABAPWhat's New in SAP Screen Personas for WDAWhat's New in Floorplan Manager for Web Dynpro ABAPWhat’s New in SAP Fiori LaunchpadWhat's New in SAPUI5What's New in UI Theme Designer

Fiori 2.0 – What’s new?How to find detailed information


Fiori 2.0 – What’s new?Fiori Launchpadü Belize Deep, a Darker Flavor of the Belize Themeü Business Notifications in the Launchpadü Frequently Used Apps in the Me Areaü Tab Bar: Displaying Apps One Group at a Time on the Home Pageü Admin Configuration for Reducing Animation Effects in the Launchpadü Passing User Settings to URL Applicationsü Role-based, Modification-Free Launchpad Configuration in Target Mappingsü Loading SAPUI5 Libraries from a Content Delivery Networkü Assigning SAP Cloud Platform Catalogs to PFCG Rolesü Keyboard Shortcutsü App Finderü Configuring the Header Bar for Apps that Run Externallyü Longer App Titles in Shell Headerü Support Tools ü Mass Maintenance Toolü Adding a Footer to the Launchpad


Fiori 2.0 - What’s new?Fiori LaunchpadSAP Fiori 2.0 is the next significant step in our evolution of user experience for business applications: an award-winning new design concept along with a delightful new visual theme, called Belize.

Key capabilities• New delightful visual theme: Belize • SAP Fiori Launchpad extended with Viewport concept • Notifications – with connection to SAP Business Workflow and My Inbox • Me Area: direct navigation to recent apps and business objects, to

settings, personalization, app finder. • Improved navigation – via Me Area and via navigation to previously

opened apps via drop down in new merged header.• Merged header: only one header bar, giving more space for each app • New SAP Fiori elements: Overview Page, List Report and Object Page.


Fiori 2.0 – What’s new?Concept – Viewport

Watch the Demo Video – Launchpad BasicsWatch the Demo Video – Advanced Features


Fiori 2.0 – What’s new?Business Notifications in the LaunchpadSAP Fiori Launchpad now consumes notifications from the SAP Gateway Notification Channel and displays them in various UI modules throughout the Launchpad.

Configure Notification Center: Part 1 – Part 2


Fiori 2.0 – What’s new?Tab Bar: Displaying Apps One Group at a Time on the Home Page

All home page apps were displayed on a single page, clustered in groups.

When a user chooses a group in the tab bar, the home page displays only the content of the selected group.

OLD

NEW


Fiori 2.0 – What’s new?Tab Bar: Displaying Apps One Group at a Time on the Home Page


Fiori 2.0 – What’s new?Role-based, Modification-Free Launchpad Configuration in Target MappingsDepending on the user role definition you will need additional or restricted Launchpad functionality. Thefollowing functionality can be activated/deactivated in Fiori Launchpad:

§ SAP Fiori Launchpad End User Feedback*

§ SAP Fiori Launchpad Support Ticket*§ SAP Fiori Launchpad Notifications§ SAP Fiori Launchpad Contextual Help (XRAY)*

The overall process to activate/deactivate functionality is the following:§ Determine required parameters from the available documentation

§ Determine best approach to modify parameter values. Target Mappings are recommended when using UI5libraries 1.40 or higher, Launchpad Configuration Files are recommended when using UI5 libraries lower than1.40, and modifying FioriLaunchpad.html file is always the last recommended option.

§ Configure URL parameters (when using configuration files) or assign User roles (when using Target Mappings),modifying FioriLaunchpad.html file will make the modifications available to all users of Fiori Launchpad.

§ Perform additional technical/functional configurations (if required):§ SAP Fiori Launchpad End User Feedback§ SAP Fiori Launchpad Support Ticket§ SAP Fiori Launchpad Contextual Help

Setting Parameters in a Launchpad Configuration

File

Setting Parameters via Target Mappings

Setting Parameters in the FioriLaunchpad.html file


Fiori 2.0 – What’s new?Role-based, Modification-Free Launchpad Configuration in Target Mappings

XRAY, Notification Center, Embedded

Search can be assigned or removed

depending on user role


Fiori 2.0 – What’s new? SAP Fiori Launchpad – End User FeedbackEnable SAP customers with a scalable tool to gather end user feedback and optimize the planning of customer UX improvements. The feedback information is collected centrally and anonymously on the SAP Cloud Platform, providing SAP with the opportunity to use this information for continuous improvements of its applications.

The following data can be gathered and will be sent to SAP:• Date and time• Rating• Feedback text• Fiori app version and intend• Device type (desktop/tablet/phone) (Fiori feedback function)• Transaction code (SAP NWBC feedback chip)• Installation number• Versions of installed software• Optional for Fiori feedback: User ID / e-mail (if the user

actively chooses the non-anonymous option)

More Information: The Rising Power of End User Feedback


Fiori 2.0 – What’s new? SAP Fiori Launchpad – Support TicketIf an error occurs when using the SAP Fiori Launchpad, you can provide end users with the option to report the error from inside SAP Fiori Launchpad using the Contact Support option

Prerequisites:To receive support, SAP Solution Manager must be part of the system landscape.

Procedure:1. In the options bar in the Me Area, select Contact Support; or in

an error message, choose the Contact Support button.2. Enter a description of the problem. Choose Show Technical

Data to view some of the technical data that will be appended to the ticket.

3. Choose Send to create the support ticket.

More Information: Configuring the Option to Contact Support


Lets users get started quickly and stay up-to-date easily User assistance is part of the attractive, simple, and enjoyable user experience� Instant: exactly when the user needs it

� Context-sensitive: exactly what is

needed

� Seamless: within the target application

� Productivity: interactive user guidance

More Information: Web Assistant Guide

Fiori 2.0 – What’s new? SAP Fiori Launchpad – Contextual Help


Fiori 2.0 – What’s new?Loading SAPUI5 Libraries from a Content Delivery Network

Fiori Launchpad Performance is generally an issue forend-users.

Main reason for this is the fact that the SAP UI5 librariesare located in the ABAP Front-end Server (FES), when theFiori web page is rendered it needs to make a call to theABAP FES to load the JavaScript libraries.

In high-latency networks this results in high renderingtime lapses which affect end-user performance.

One way to overcome this situation is to load UI5 librariesfrom a Content Delivery Network (CDN, Akamai) whichenables users to load the UI5 libraries from a networkserver closest to their current location.

More Information: Configure CDN


Fiori 2.0 – What’s new?Loading SAPUI5 Libraries from a Content Delivery NetworkEnabling and combining CDN and Tab bar features will help Fiori Launchpad render faster!


72 requests

2.2 MB transferred

Finish 22.59 s


Fiori 2.0 – What’s new?Loading SAPUI5 Libraries from a Content Delivery NetworkEnabling and combining CDN and Tab bar features will help Fiori Launchpad render faster!


66 requests

2.0 MB transferred

Finish 10.08 s

~ 40% improvement

SAP Fiori 2.0What is Visual Harmonization?


© 2015 SAP SE. All rights reserved.

S/4HANA FIORI PYRAMID APPROACH - 2016

Full role scope should be accessible via launchpad

OBJECT PAGE

SEARCH

WORK LISTS

QUICK ACTIVITIES

VISUALLY HARMONIZED UIs(for legacy UIs where Fiori apps not yet available)

No Fiori apps Some Fiori apps, no role coverage along pyramid

All key activities can be done in Fiori, legacy UIs only for special task

Role fully covered in Fiori

Roles not following pyramid approach in 2016:

Level 6

Level 5

Level 4

Level 3

Level 2

Level 1

Level 0

ANALYTICAL APPS

LAUNCHPAD

Most important key activities can be done in Fiori from Fiori enabled business objects

All important business objects with searchable Object pages and Worklists

Full role scope accessible via FLP, but mainly

integration of legacy UIs

Selected scenarios fully covered by Fiori

Internal

OVERVIEW PAGE

Can also trigger quick activities


Example screen from transaction CO03 („Display Production Order“) in SAP GUI for HTML

SAP Fiori 2.0S/4 HANA FIORI Visual Harmonization

VH-enabled (implementation in SAP GUI for HTML progressing)

Goal: Ensure consistent Fiori Visual Design in affected legacy UIs along the pyramid. Visual Harmonization will provide a Fiori-based User experience for Dynpro-based UIs starting with SAPGUI for HTML, ABAP Webdynpro and SAPGUI for Windows in plan


SAP Fiori 2.0Elements of the SAP Fiori Visual Theme for Classic Applications

Text toolbar insteadof Icons

Right-aligned labels

New footer with processing andclosing actions,

e.g.„Save“

Tab strips with SAP Fiori visualization

New icons

Merged Fiori header

One visual design “Belize” for all Fiori applications: same colors, control design and form factor

Condensedtable rows


SAP Fiori 2.0 – App Finder with Easy Access Menu and User MenuEnable access to full functionality of S/4HANA 1610

The App Finderenables a generic access to all GUI transactions and Web-Dynpro applications contained in

� SAP Easy Access Menu and

� Role based User Menu (inclusive customer transactions)

of the SAP S/4HANA back-end(on-premise only)

Adding to homepage possible

Enables quick start for customers based on existing user roles

SAP Fiori 2.0Take Advantage of Visual Harmonization in S/4HANA 1610 projects



SAP Fiori Launchpad for S/4HANA is capable of integrating various UX applicationtechnologies. Amongst these technologies we can find:

§ SAP UI5§ SAP Web Dynpro/FPM ABAP§ SAP GUI for HTML

In the current S/4HANA releases not all SAP GUI standard transactions are available as astandard SAP Fiori App using any of the technologies listed above, the same will occur forCustom Transactions, hence you will find some cases where you will need to define your ownapproach to expose backend functionality in Fiori Launchpad.

There are two main options to expose standard or custom transactions in Fiori Launchpad.

Prerequisites:� Required transaction exists as Web Dynpro/FPM or SAP GUI for HTML� You have analyzed and identified the required subset of transactions required for a specific

user role

Options:� Expose Transactions through SAP Fiori Application Descriptors and Technical Backend

Business Catalogs� Expose Transactions through SAP Fiori App Finder - Backend SAP or User Menus

Link

Link


General Recommendations:

� Technical Backend Business Catalogs must not contain more than 200 ApplicationDescriptors

� The app finder displays the following tabs where you can find all the apps available for yourrole:– Catalog - A repository of all the Fiori UI5 apps that are assigned by your administrator to

your role– User Menu - A customized menu that includes folders of those SAP GUI transactions and

Web Dynpro ABAP apps assigned to your role in a specific backend system.– SAP Menu - A standard menu delivered by SAP that includes folders of all SAP GUI

transactions and Web Dynpro ABAP apps offered by a particular SAP system. This menu isnot role-dependent and therefore displays the same content for all users.

� You are aware of the Restrictions in SAP Fiori visual theme for classic applications SAP Note2348661

� You are aware of the Restrictions for using SAP GUI for HTML – SAP Note 314568� You are aware of the display adjustments that may be needed to render an application using

Belize Theme described in the Configuration Guidelines

Link

Link



Add a new tile clicking on the “+” symbol and selecting the group where you wish to add the tile.

SAP Fiori 2.0 Take Advantage of Visual Harmonization in S/4HANA 1610 projects

Once the tile has been added go back to the Fiori Launchpad main screen and navigate to the group where you added the tile.

Click on the tile to display the application.


The transaction is displayed using Belize Theme!

SAP Fiori 2.0 Take Advantage of Visual Harmonization in S/4HANA 1610 projects

SAP Fiori 2.0Deployment Options


SAP Fiori 2.0Client Options


SAP Fiori 2.0 Multiple back-ends

SAP Fiori 2.0 is mandatory for SAP Fiori apps in SAP S/4HANA 1610** Already existing SAP Fiori apps will run with Belize theme Classic applications depend on the back-end version

SAP Business Suite on SAP HANA or Any DB

SAP Simple Finance, on-premise edition 1503 or SAP

S/4HANA Finance 1605 SAP S/4HANA 1610

SAP Fiori apps (Belize theme)

SAP Fiori visual theme (Belize) for classic applications

Classic theme (e.g. Corbu) for classic applications

SAP Fiori front-end server 3.0* with SAP Fiori Launchpad with

SAP Fiori apps on FES

* Contains SAP_UI 7.51 with SAPUI5 1.40 or higher. Custom controls/applications may need adaptation to work with SAP Fiori 2.0 Belize theme. Not all features of SAP Fiori 2.0 are available with older apps or non SAP S/4HANA systems. SAP Fiori apps for SAP S/4HANA 1610 require SAP Database.

** SAP Fiori 2.0 is mandatory with SAP Fiori front-end server 3.0 – you cannot use the Blue Crystal theme


SAP Fiori 2.0 Aspects to plan before upgrading

• Custom themes based on Blue Crystal need to be redone for Belize, with the UI Theme.

• Designer Custom Fiori apps: Check that they work with the auto-adapter for the merged header.

• Custom SAPUI5 controls: Check that they work with the Belize theme. May they need adaptation for Fiori 2.0 theme. Not all features of SAP Fiori 2.0 are available with older apps or non SAP S/4HANA 1610 systems.

References


SAP Fiori 2.0References

Documentations LinksWikiSAP Fiori for S/4HANA

SAP Fiori for S/4HANA Wiki

SAP HELPSAP Fiori Launchpad

Fiori Launchpad on SAP HELP

BlogFiori for S/4HANA – Adding Transactions to Fiori Launchpad

Fiori for S/4HANA – Adding Transactions to Fiori Launchpad

DocumentStep-by-step guide to enable Transactions in Fiori Launchpad using Application Descriptors in S/4HANA 1610 On-Premise

Step-by-step guide to enable Transactions in Fiori Launchpad using Application Descriptors in S/4HANA 1610 On-Premise

DocumentStep-by-step guide to enable Easy Access Menu in S/4HANA 1610 On-Premise

Step-by-step guide to enable Easy Access Menu in S/4HANA 1610 On-Premise


SAP S/4HANA – Reference MaterialsLinks to Reference Materials

Documentations LinksUITECH OP1610 FPS01UI Technology Guide for SAP S/4HANA, on-premise edition 1611

UITECH OP1610 FPS01

Administration Guide for the Implementation of SAP S/4HANA on-premise editionSAP S/4HANA OP 1610 edition

Administration Guide for the Implementation of SAP S/4HANA on-premise edition

Building Block Configuration GuideSAP S/4HANA Fiori Foundation Configuration (MAA)

SAP S/4HANA Fiori Foundation Configuration (MAA)

Building Block Configuration GuideSAP S/4HANA Fiori Basic Network and Security Configuration (MAB)

SAP S/4HANA Fiori Basic Network and Security Configuration (MAB)

Building Block Configuration GuideSAP S/4HANA Fiori App Deployment (MAD)

SAP S/4HANA Fiori App Deployment (MAD)

Building Block Configuration GuideSAP S/4HANA Fiori Launchpad Operation (MAG)

SAP S/4HANA Fiori Launchpad Operation (MAG)

Building Block Configuration GuideSAP S/4HANA Other App Types Deployment (MAL)

SAP S/4HANA Other App Types Deployment (MAL)


SAP S/4HANA – Reference MaterialsLinks to Reference Materials

Documentations LinksBlogFiori in S/4HANA 1511 - Overview

Fiori in S/4HANA 1511 - Overview

BlogSAP Fiori for S/4HANA – Basic Configuration with help of Task Lists

SAP Fiori for S/4HANA – Basic Configuration with help of Task Lists

BlogHow to Configure Fiori with Multi-Clients

How to Configure Fiori with Multi-Clients

BlogSAP Fiori for S/4HANA – 10 Lessons Learned in S/4HANA 1511 projects

SAP Fiori for S/4HANA – 10 Lessons Learned in S/4HANA 1511 projects

RIG

EGIONALMPLEMENTATION

ROUP

Thank you

Jorge “Javier” [email protected]


© 2016 SAP SE or an SAP affiliate company. All rights reserved.

No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP SE or an SAP affiliate company.

SAP and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP SE (or an SAP affiliate company) in Germany and other countries. Please see http://global12.sap.com/corporate-en/legal/copyright/index.epx for additional trademark information and notices.

Some software products marketed by SAP SE and its distributors contain proprietary software components of other software vendors.

National product specifications may vary.

These materials are provided by SAP SE or an SAP affiliate company for informational purposes only, without representation or warranty of any kind, and SAP SE or its affiliated companies shall not be liable for errors or omissions with respect to the materials. The only warranties for SAP SE or SAP affiliate company products and services are those that are set forth in the express warranty statements accompanying such products and services, if any. Nothing herein should be construed as constituting an additional warranty.

In particular, SAP SE or its affiliated companies have no obligation to pursue any course of business outlined in this document or any related presentation, or to develop or release any functionality mentioned therein. This document, or any related presentation, and SAP SE’s or its affiliated companies’ strategy and possible future developments, products, and/or platform directions and functionality are all subject to change and may be changed by SAP SE or its affiliated companies at any time for any reason without notice. The information in this document is not a commitment, promise, or legal obligation to deliver any material, code, or functionality. All forward-looking statements are subject to various risks and uncertainties that could cause actual results to differ materially from expectations. Readers are cautioned not to place undue reliance on these forward-looking statements, which speak only as of their dates, and they should not be relied upon in making purchasing decisions.