SAP Fiori User Experience for SAP

Business Suite & S/4HANA

Common UX Pain Points in SAP software and their impact

Business Impact
Inefficiency
Inaccuracy
Higher training cost
Lack of adoption
Project failure
SAP UX Strategy

Fiori Fiori Personas

SAP Fiori Apps
Product Qualities

Completely Fiori Cloud Ready HANA Optimized

UX Qualities Cloud Qualities Real-Time Qualities

Modern, internet-educated UX Simple Extensibility for Offer power of HANA

with state-of-the-art performance Business Experts: to the End-User
+++ Custom fields and business logic +++

Multi-device support without backend development Real-time for all apps with search,
+++
+++ analytics and transactional capabilities
Simple task-oriented apps Scalable apps w/ large number of users +++

+++
+++ Integration of OLAP and OLTP
Consistent look and feel Low TCO in cloud-like operation
across all apps
SAP Fiori Apps
Product Qualities - Design
Role-based
Deliver the right information at the right time via multi- faceted Coherent
user interfaces Deliver a consistent UX across the enterprise whether you need
to fulfill a sales order, review your latest KPIs, or manage leave
requests

Delightful
Enrich your work experience with intuitive, easy-to-use
SAP Fiori apps

Visual design
SAP Fiori 2.0 offers a refined visual language. Clean and
consistent layouts throughout the user interface convey the content
with clarity. Experience modern, visually pleasing aesthetics with a
strong focus on ease of use

Information architecture
Adaptive Give business users ready access to the information they need
Get instant, relevant insight whether using mobile to complete their tasks
apps or a desktop computer
Interaction patterns
Simple Harness simple and intuitive interactive patterns to boost
Zero in on your most important tasks, functions, and activities productivity company-wide
SAP Fiori Apps
Technical Capabilities
access
Secure provisioning and consumption of data
Provide access to business logic (SAP back-end system) data via
OData services
Corporate identity theming
Simply and effectively implement themes for SAP Fiori apps and
SAP Fiori launchpad
UX app extensions
Enhance your SAP Fiori apps using templates in the SAP Web
IDE
Custom development
Rapidly design, build, and deploy SAP Fiori apps for browsers and
mobile devices
Ready for mobile enablement
Seamless, secure mobile access to SAPs Fiori apps via the
Support for multiple devices and form factors Internet

Maximize usability using a desktop PC, tablet, or smartphone Based on SAPUI5

SAP Fiori launchpad Enterprise-ready UI development toolkit based on HTML5 and

JavaScript
Access your SAP Fiori apps from a central launchpad (navigation,
personalization, support, and configuration) Powered by SAP HANA

Role-based authentication and authorization Run analytical SAP Fiori apps and object pages on SAPs powerful
in-memory database platform
Harness role-based single sign-on (SSO) mechanisms for secure
SAP Fiori Architecture
SAP Fiori launchpad Single point access to all standard and custom Fiori apps

Search across and

Role-based content
within apps to get
definition
immediate answers

Launch SAPUI5, Web Color coding alerts

Dynpro ABAP*, SAP user for any overdue,
GUI for HTML* and new or immediate
arbitrary URLs action

News and feeds Dynamic charts

enhance collaboration provide high level,
real-time overview

Group tiles for Edit mode for instant

personalized personalization of
content organization groups and tiles

*on selected devices

SAP Fiori Architecture
SAP S/4HANA Principle of one archetype

SAP Fiori Architecture for SAP S/4HANA consists of only one

archetype for all (transactional, analytical and search)

One User / Authorization Management via ABAP Server

One Business Model
One Gateway / OData protocol implementation
One Lifecycle
SAP Fiori Architecture
SAP Fiori launchpad - User Assignment and Authorizations of Content (on premise)
sees is granted
User
refers to UI

Menu
Launchpad PFCG Role OData
(Front-End)
uses shows refers to Auth.
contains Authorization
Catalog Profile

contains Tile Target

Group (App Launcher) Mapping
Front-End

resolves
Server

starts

UI2 Launchpad Fiori App

OData Service
uses
uses has
Model Provider App-specific
uses OData Service
has refers to
Data Provider Authorization Defaults
calls Model Provider requires Authorization Objects

Launchpad Logic resolves Start Authorization

determines

Trusted RFC
refers to refers to PFCG Role
Back-End

Authorization Defaults
System

Data Provider requires

(Back-End)
calls
Authorization Objects Authorization
Start Authorization Profile
determines
Business Logic requires Business
Authorizations determines
Deployment options
SAP Business Suite SAP S/4HANA
SAP Fiori SAP Fiori 2.0 for SAP Fiori apps SAP Fiori SAP Fiori 2.0

SAP Fiori SAP Fiori FES 2.0 SAP Fiori SAP Fiori
Front-End Server SAP FES 3.0* SAP FES 3.0*
front-end Upgrade front-end UI Add-On 1.0/2.0 front-end Upgrade front-end
(FES) 2.0 or SAP UI 7.51 SAP UI 7.51
UI Add-On 1.0/2.0 server server SAP_ UI 7.40/7.50 server server
or NW 7.40/7.50

Existing themes SAP SAP Belize theme for

for classic SAP Business Suite S/4HA NA Upgrade S/ 4HANA classic
applications**, on SAP HANA or AnyDB 1511*** 1610 applications**
e.g. Corbu
Back-end Back-end Back-end

SAP Fiori 2 . 0 is an option via SAP Fiori Front-end SAP Fiori 2 . 0 is available via frontend-end and
Server upgrade to version 3 . 0 . backend upgrade of SAP S / 4 H A N A .
Older and custom SAP Fiori apps will run with the Belize The Belize theme is available with SAP S/4HANA 1610
theme*. for SAP Fiori apps and classic applications**.
Classic applications continue to run with the Corbu theme. SAP Fiori 2.0 is not available for SAP S/4HANA 1511.

* Custom controls/apps may need adaptation for Fiori 2.0 theme. Not all features of SAP Fiori 2.0 ** Classic applications are SAP GUI and ABAP W eb Dynpro.
are available with older apps or non SAP S/4HANA 1610 systems Belize theme available via SAP GUI for HTML
 SAP Fiori 2.0 with 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 Fiori apps

(Belize theme)

Classic theme SAP Fiori visual theme

(e.g. Corbu) for (Belize) for classic
classic applications Belize
applications
SAP Fiori front-end server 3.0*
with SAP Fiori Launchpad
with SAP Fiori apps on FES

SAP Simple Finance, Belize

SAP Business Suite on-premise edition 1503
SAP S/4HAN A 1610
on SAP HANA or AnyDB or
SAP S/4HANA Finance 1605

* 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. * * SAP Fiori 2.0 is mandatory with SAP Fiori front-end
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. server 3.0 you cannot use the Blue Crystal theme
 SAP Fiori Architecture
Deployment of SAP Fiori Front-end server (FES) - as central hub
General Recommendation
Deploy SAP Fiori applications and UI content on separate systems
Example:
Deploy the GW components as described in landscape use case of the
GW landscape deployment recommendations
Enable OData access for multiple SAP Backend systems

Benefits
Fiori UI Software Update cycles decoupled from backend system
Better handling of innovations for Fiori UIs and UI content
FES deployed as one instance incl. central Fiori Launchpad
Routing mechanism in several backend systems
Scaling-Up is manageable independent from backend system
FES can be implemented in segmented networks (e.g. DMZ) to serve security needs
Input validation functions and business logic on two different systems (security requirement)
Central management of connections, central access for devices
Backend development placed in the system where the data is stored

Considerations
Additional NW ABAP System
Web Dispatcher (Reverse Proxy) is mandatory when using analytical SAP Fiori applications
 SAP Fiori Architecture
SAP Fiori Runtimes

ONE ACCESS

SAP Fiori Client Fiori Mobile with KapselSDK

Fiori in browser
Browser based apps
Runs on all devices
No installation required
Coherent UX across devices
Downloadable native app
Pre-packaged with commonly used plug-ins
for native device integration
Full screen operation
Attachment viewing
Native device integration
Notification App
Selected Mobile Platform Services can be
used
(packaged apps)
Custom packaged & branded app
Can be delivered on company store
Native device integration
Offers App Administration & Reporting
Push Notifications*
Offline application data*
Use additional SAP Mobile Platform
services

SAP Fiori launchpad SAP Fiori launchpad Mobile Platform required

Browser (Desktop or Mobile) Mobile only

*requires adoption of SAP Fiori application
SAP Fiori Consumption Options
Fiori in browser SAP Fiori Client Fiori Mobile
or custom Fiori Client with KapselSDK
Fiori front- Fiori front- Fiori front-
end server end server end server

App App SAP Fiori Cloud premium, mobile

SAP Fiori Cloud premium, mobile
service for development and
service for development and operations
operations or
SAP Fiori launchpad or
SAP Fiori launchpad SMP 3.0 SP03 PL02+
and applications SMP 3.0 SP03 PL02+
and applications
SAP Mobile SAP Mobile
Platform Platform
OData OData OData

URL
URL Kapsel AppUpdate
App (optional)

SAP Fiori Fiori Mobile

Client app

* * in future release
SAP Fiori Architecture
SAP Fiori Client - Available on all major App Stores

Apple App Store for iOS Google Play Store for Android Microsoft App Store for WP & Windows

Support: iOS 8.x 10.x Support: Android 4.3 6.x Support: Windows Phone 10 & Windows 10
SAP Fiori Architecture
SAP Fiori Security - Authentication Use Cases

Use Case 0: Form-based Initial Authentication

Use Case 1: SSO via SAML 2.0 (recommended - please refer to illustration below)
Use Case 2: SSO via SPNego / Kerberos
Use Case 3: SSO via Logon Ticket
Use Case 4: SSO via X.509 certificate

SAML 2.0 IdP

SAP
Reverse SAP SAP HANA
S/4HANA
Proxy Gateway DB
Core

Atypical use case is for customers to access one or more SAP Fiori apps from the public internet. In this case, single sign-on can be implemented using SAML 2.0
based authentication in conjunction with IdP (Identity Provider) software such as Ping Federate or Microsofts Active Directory Federation Service (AD FS).
SAP Fiori Architecture
Extensibility - Roles

Business User Key User, Business Expert Developer

I want to I want to I want to

Change order of columns in a table Add/change business rules/logic Add/change complex business logic
Hide/Unhide tabs Add custom fields, tables, reports, forms De-couple software lifecycle of standard
Change format of dates/numbers Use my company theme/logo and extensions
Hide/Unhide a few apps on Launchpad Change layout

My changes should My changes should My changes should

not affect other people. affect people in my LOB/company affect people in my company
SAP Fiori Architecture
Extensibility - Overview on Capabilities
SAP S/4HANA - In-app extensibility:
Context-aware extensions, focus on tight integration
On-premise
Key User Extensibility
Custom fields and tables, analytics and forms extensibility
Change or add business rules and business logic (cloud Web
editor)
Classic Extensibility
Full access to ABAP (for example, Eclipse)
Side-by-side extensibility w. SAP HANA Cloud Platform
Weave external content into your solutions
+
Cloud
Extensibility based on SAP Cloud Platform
Enable an SAP Fiori and mobile user experience
Integrate with other cloud solutions (for example SuccessFactors and
Ariba, both SAP companies) and third-party solutions
Take advantage of application services of SAP Cloud Platform (cloud
portal, mobile documents, output management, et al.)
Provides a full-fledged development platform to build extension
applications (Java, SAP HANA native development)
 SAP Fiori Architecture
Extensibility Cloud and On Premise

SAP Business Suite

Cloud
Classic customer and partner development
Key user extensibility User interface

UI

Side-by-side extensibility on
SAP HANA Cloud Platform
User Interface Application

Application Database (SAP HANA)

APP
Database User interface
On-Premise

Key user extensibility Application

Extensions Modifications

DB
Database (SAP HANA)
Classic extensibility
In-App Extensibility

PublicAPIs SAP Customer, Partner

SAP Fiori Architecture
SAPUI5 Flexibility Services

SAPUI5 flexibility services provide capabilities to flexibly adapt an app and store the changes context-based in a layered
repository. This allows, for example, customers to create their own SAPUI5 entities based on the delivery of SAP without having
to modify existing entities in a lower layer. At runtime all changes made to an app are interpreted to define the final UI.

Key capabilities
Provide flexibility infrastructure used by several flexibility tools
Allow separation of content delivered by SAP, industries,
partners*, customers and end-users
Store UI changes in a layered repository
Retrieve UI changes at runtime and generate the final UI
Enable context-based UI adaptation*
Provide for different user groups tools to adapt the UI in a
convenient way, e.g. WYSIWYG tools for key users at runtime

Benefits
Simplified, cost-effective, and easy to use UI change process
Increased end user acceptance through optimized UI layouts
Upgrade safe when adapting the UI
Easy and intuitive way for business users to change the UI
SAP Fiori Architecture
SAPUI5 Flexibility Services: UI Adaptation at Runtime (RTA) for Key Users
1. Switch your SAP Fiori application to Adaptation Mode 2. Intuitively Manage your UI Elements

Hide or add fields to the UI

Hide or add groups of fields to the UI
Move UI elements per drag and drop
Rename labels and titles
Group/split several fields
 SAP Fiori Architecture
Key User Extensibility - Custom Fields & Logic
3. Manage the Usage

2. Define Custom Fields & Logic

(Note: here we extend the OData service)

1. In Adaptation Mode > Create custom field(s)

 SAP Mobile Service Offering from CIC India
Covers Fiori & other SAP mobile solutions

Application
Mobility Strategy & Application Infrastructure
Development & Testing & Deployment
Governance Management Management
Integration

Discovery Packaged SAP Mobile Application Maintenance Installation of SAP

Workshop Mobile Solution Testing SIT & UAT through bug fix/ Mobile Platform,
Implementation using enhancements SAP Gateway
Business / Use including Fiori simulators/emulators,
Case devices Upgrade of existing Upgrade of SMP
Development Custom Mobile Web SAP mobile
and Hybrid Application solutions Remote device
Mobile Strategy Application Deployment into management
Development Development with or SMP, SAP Cloud Managing through SAP Afaria
without SAP Mobile Platform, SAP application
Mobile CoE setup administrative tasks Configuring of SAP
Platform (on Gateway Mobile Services on
UX design premise) SAP Mobile SAP Cloud Platform
Services (on Cloud)
Wireframe design
Quick Prototyping
Integrated Capability (Factory/TAC enabled)
SAP SAP Mobile Competency at IBM CIC India
Capacity
Pool of 100+ (experienced+trained) SAP mobile practitioners including Architects, Developers, Adminstrators etc.
Skill - Design, Development and Support for custom web, mobile hybrid apps development using SAPUI5, SAP Mobile Platform and HANA Cloud Platform Mobile
Services (HCPMs), Implementation and support for Fiori and Syclo (SAP) Agentry based packaged mobile apps
Mobile apps testing (in collaboration with testing TAC/factory)

Client Examples
Methodology
Consistent process, methods, tools, accelerators, best practice,
standards followed across the globe

Training, Sandbox & Demo Center

Internal training program with dedicated training environment
Dedicated sandbox available for practicing, improving skill &
research
Dedicated client demo centers across the globe

Thought Leadership
Well connected to the IBM mobile community, Apple Garage, IBM
Research Lab and IBM Software Group
Experience in developing award winning applications for
customers
Regular contributor in SAP community
Thank you

Further reading:
All Things on SAP Fiori at SAP Community Network
http://scn.sap.com/docs/DOC-41598
SAP Fiori Apps Library the online Fiori app from SAP with the list of all Fiori apps
https://fioriappslibrary.hana.ondemand.com/sap/fix/externalViewer/#
SAP Fiori apps rapid-deployment solution
https://fioriapps-rds.dispatcher.hana.ondemand.com/
Explore SAP Fiori apps via the SAP Cloud on tablet and even smartphones
https://www.sapfioritrial.com/sites?helpset=trial&sap-client=001
Open SAP Training courses
https://open.sap.com/courses?topic=User%20Experience
Also look at Fiori related courses at SAP Learning Hub
https://performancemanager.successfactors.eu/login?company=learninghub&loginMethod=PWD&_s.crb=M5CBO04fS9j
rvjqS1dTtjNv%252boeU%253d