UX106 - SAP Fiori Launchpad Overview.pdf

Public

UX106 – SAP Fiori Launchpad:

Overview and Recommendations

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

Speakers

Las Vegas, Oct 19 - 23

Stefan Loetterle

Barcelona, Nov 10 - 12

Carola Steinmaier


Disclaimer

This presentation outlines our general product direction and should not be relied on in making a

purchase decision. This presentation is not subject to your license agreement or any other agreement

with SAP. SAP has no obligation to pursue any course of business outlined in this presentation or to

develop or release any functionality mentioned in this presentation. This presentation and SAP's

strategy and possible future developments are subject to change and may be changed by SAP at any

time for any reason without notice. This document 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. SAP assumes no responsibility for errors or omissions in this

document, except if such damages were caused by SAP intentionally or grossly negligent.


Agenda

SAP Fiori launchpad – motivation

Features and key capabilities

End-to-end configuration

Positioning within SAP’s UI client strategy

Deployment options

Roadmap & Outlook

Summary and key takeaways

Public

SAP Fiori Launchpad –

Motivation


SAP HANA Platform

Applications* Analytics*

SAP Fiori User Experience

This is the current state of planning and may be changed by SAP at any time.

Unified UX Direction for all SAP SoftwareAll applications & UI technologies to converge to the SAP Fiori UX


SAP Fiori Principles

SAP Fiori Design Interaction PatternsInformation

Architecture

Visual Design

/

User Interface

Business Logic

SAP Fiori Technologies

OpenUI5

Other

Technologies*

* SAP’s preferred way to build SAP Fiori apps is using SAPUI5

What is SAP Fiori User Experience?

https://experience.sap.com/fiori-guidelines/

Executing the UX Strategy

TEC200

i

https://experience.sap.com/fiori-guidelines


http://sap.github.io/openui5/



SAP Fiori Principles

SAP Fiori Design Interaction PatternsInformation

Architecture

Visual Design

User Interface

Business Logic

SAP Fiori Technologies

OpenUI5

Other

Technologies*

* SAP’s preferred way to build SAP Fiori apps is using SAPUI5

What is SAP Fiori User Experience?




http://sap.github.io/openui5/



Role-based SimplificationDeliver task-based user interfaces

Functional-based applications


Coherence Single point of access across functional areas and across technologies

Functional-based applicationsFinance Human Resources CRM SCM

…


Single Point of Access Across functional areas and across technologies

Functional-based applicationsFinance Human Resources CRM SCM

…

Public

Features & Key Capabilities


Introducing SAP Fiori LaunchpadWeb-based Entry Point for SAP Business Applications Across Platforms and Devices

SAP Fiori launchpad is a role-based,

personalized, real-time and contextual

aggregation point for business applications

and analytics.

It runs on multiple devices, using the

responsive design paradigm, and is

deployable on multiple platforms.

It is designed according to the simple and

intuitive SAP Fiori user experience, while

supporting established UI technologies.

https://fiori.sapdemocloud.com/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?sap-language=en

https://fiori.sapdemocloud.com/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?sap-language=en

Public

Demo

SAP Fiori Launchpad (SAP Fiori Demo cloud edition)


Key Features and Capabilities

Role-based

• Apps assignment via role-specific business catalogs

• Predefined groups for FLP home page

Personalized

• Add apps from assigned catalogs to home page

• Delete apps from home page

• Reorder tiles and groups

• Change group and tile titles

• Select custom themes

Search – across apps and business objects

Navigation – fast, easy and contextual navigation

Responsive

• Adaptive design to run on multiple devices

• Configuration allows to start device specific apps

Theming and branding - via UI theme designer


Edit mode for instant

personalization of groups

and tiles

SAP Fiori Launchpad at a Glance

Search across and within

apps to get immediate

answers

Role-based content

definition

Group tiles for

personalized content

organization

News and feeds to

enhance collaboration

Color coding alerts user

for any overdue, new or

immediate actions

Dynamic charts to provide

high level, real-time

overview

Launch SAPUI5, Web

Dynpro ABAP*, SAP GUI for

HTML* and arbitrary URLs

*on selected devices


SAP Fiori Launchpad Branding

SAP Fiori launchpad can be customized via

the UI theme designer across all

deployment options

The UI theme designer provides a browser

based WYSIWYG editor with built-in preview

capabilities for applications and UI controls

The UI theme designer provides 3 skill levels

of theming

• Quick - basic cross-technology theme settings

• Expert - technology-specific theme settings

• CSS - Manual theming based on LESS

Applying UI Theme Designer

UX113)

i

Public

End-to-End Configuration


Configuration Stepsin ABAP Front-End Server

Copy / Create Tiles / Target Mappings

2

Create Catalog

1

Assign Catalog / Group to Role

5

Assign User to Role

6

Create PFCG Role

4

Lau

nch

pad

Desig

ner

Ro

le M

ain

ten

an

ce

Optional: Create Group,

assign Tile

7

3

Launchpad Designer: FLP Admin

Role Maintenance: PFCG Admin

Result in SAP Fiori launchpad

Effectively Configure & Manage SAP

FLP

UX162

i

Public

Positioning within SAP’s UI

Client Strategy


Decision Support for Access Points

*: This is the current state of planning and may be changed by SAP at any time.

What Where

Web Dynpro

Self Services

SAP Fiori

Fiori

…

Fiori

Web DynproSAP GUI

Web Dynpro

SAP GUI

…*

D

e

s

k

t

o

p

M

o

b

i

l

e

Native ClientsBrowsers

SAP Fiori launchpad

Services

Consumption

User Interface

How

SAP Enterprise Portal

SAP NWBC

SAP Fiori launchpad


Decision Support for Access Points


SAP NWBC


What HowWhere

Web Dynpro

Self Services

SAP Fiori

Fiori

…

Fiori

Web DynproSAP GUI

Web Dynpro

SAP GUI

…*

SAP Fiori launchpad

D

e

s

k

t

o

p

M

o

b

i

l

e


Transition Paths to SAP Fiori Launchpad



SAP NWBC

SAP Fiori launchpad


SAP Fiori launchpad

Services

Consumption

User Interface


Steps to SAP Fiori User Experience on the Desktop

SAP NWBC


SAP Fiori apps

in NWBC 5.0


SAP Fiori User Experience in SAP NWBC 5.0


Fiori FrontEnd Server

SAP Fiori Apps

Business Roles

Navigation

FLP Designer

SAP GUI native

Hierarchical menu structure

PFCG

Backend Server

PFCGBusiness Roles

Navigation

Authorizations

SAP Fiori Apps in NWBC 5.0Architecture


Steps to SAP Fiori User Experience on the Desktop

SAP NWBC


SAP Fiori launchpad in

SAP Business Client 6.0SAP Fiori apps

in NWBC 5.0

* Final naming not done

*


SAP Business Client 6.0

SAP easy access menu SAP Fiori launchpadSAP NWBC index pageSAP Business Client 6.06.0SAP Business Client 6.0 SAP Business Client 6.0

SAP NWBC

UX108

i



SAP easy access menu SAP Fiori launchpadSAP NWBC index pageSAP Business Client 6.0

SAP NWBC

UX108

i


Fiori FrontEnd Server

Backend Server 1

SAP Fiori Apps

Business Roles

Navigation

FLP Designer

SAP GUI native

Backend Server 2 Backend Server 3

PFCG: Auth PFCG: Auth PFCG: Auth

Hierarchical menu structure Simple menu structure (2-level)

PFCG

Backend Server

PFCGBusiness Roles

Navigation

Authorizations

SAP NWBC 5.0 / Business Client 6.0Architecture

SAP Fiori

apps in

NWBC 5.0

SAP Business

Client 6.0






SAP Fiori launchpad

Services

Consumption

User Interface


SAP NWBC

SAP Fiori launchpad


Two Portal Flavors. One Platform

Fiori Framework Page

Common use cases:

– Mobile access

– BI Portal, self-service Portal

– Expert workplace

– Kiosks

Cross devices & optimized for SAP Fiori

Ajax Framework Page

Common use cases:

– Corporate Portal

– External facing

– Administration

Desktop only


SAP Fiori Experience for SAP Enterprise PortalWeb-based Entry Point to SAP Business Applications

SAP Fiori experience gives users an intuitive

and easy access to portal content and services

from desktop and mobile devices

Scenarios

Integration of SAP Fiori apps into the standard

portal (via SAP Fiori iView)

Activation of SAP Fiori launchpad as new user

experience (Fiori Framework Page)

Remote catalog consumption from ABAP server

Availability

SAP Enterprise Portal 7.4 SP8 und 7.31 SP13

Details about SAP Fiori and SAP Fiori launchpad: https://experience.sap.com/fiori-guidelines and http://scn.sap.com/docs/DOC-53178 as well as note 2031108

FLP & Portal

UX202

i


http://scn.sap.com/docs/DOC-53178


Portal Java Server Fiori Frontend Server

Backend

Server

1

Backend

Server

2

Backend

Server

3

Catalogs/Groups

NavigationFLPD

PFCG: PFCG: PFCG:Auth Auth Auth

PCD

Roles

Navigation

AuthorizationsIntegration via

Fiori iView or Remote Content

SAP Fiori Experience for SAP Enterprise PortalWeb-based Entry Point to SAP Business Applications

Fiori Framework Page





SAP Fiori launchpad

Services

Consumption

User Interface

Application entry point

SAP Fiori apps

WDA applications

SAP GUI for HTML

URL

SuccessFactors

All devices

Focus on SIMPLE


SAP NWBC

SAP Fiori launchpad

Public

Deployment Options

ABAP Server, SAP Portal, SAP Hana Cloud Platform


SAP Fiori Launchpad Deployment Options

SAP Fiori launchpadSimple | Role-based | Responsive | Coherent | Delightful

Content creation

App development

ADAPTERS

Branding

Managed Cloud

On-Premise Public Cloud

Managed Cloud

On-Premise

ABAP Front End

Server

SAP Enterprise

Portal

SAP HANA

Cloud Platform


FLP Deployment Options

UX201

i

Public

Roadmap & Outlook



Today Future DirectionPlanned Innovations

SAP Fiori launchpadProduct road map overview – key themes and capabilities

( ABAP: SAP NW 7.50 SP0 / UI ADD-ON 2.0 SP0,

SAP Portal: 7.40 SP11 / 7.31 SP16 )

Entry point for business applications and

analytics

• Integration of additional content types as

SuccessFactors, URLs, SAP Mobile Docs3

SAP UI Clients alignment

• SAP Portal: Fiori framework page, remote catalog

consumption, consumption of SAP Fiori apps2,

• SAP NWBC: Integration of SAP Fiori apps

Setup and Configuration

• SAP Fiori launchpad designer: Where-used

analysis, table view for tiles

• Derive user authorizations from Fiori catalogs

• Best practices for role and catalog management

End User Experience

• Handling of multiple tiles on home page

• Central maintenance of user default values

• Push notifications

Enhanced shell extensibility

Simplified setup, configuration and

administration processes

Usage analysis

SAP UI Clients alignment

• SAP NetWeaver Business Client for SAP Fiori UX

• SAP Portal: Integration of search, factsheets &

analytical SAP Fiori apps

The SAP entry point across devices

and platforms

• Support of additional content types and SAP UI

technologies

• Integration with new/additional application

providers

• Integration with SAP cloud solutions such as Ariba,

Design Studio

• Integration with document management solutions

• SAP HANA Cloud Platform: Support for non-Fiori

apps (e.g. SAP GUI and Web Dynpro ABAP).

Enhanced launchpad user experience with

Fiori 2.0 UX concepts

Enhanced integration with SAP Fiori Client

to provide offline capabilities

1 Relevant for ABAP deployment; differences may apply for other depls.2 Refer to SAP note 2103156 for details 3 For SAP Fiori launchpad on SAP HANA Cloud Platform and SAP Portal

http://service.sap.com/sap/support/notes/2103156


SAP Fiori 2.0 Wins Red Dot Award: Design Concept 2015

• One of the most prestigious design

awards worldwide

• A recognized international seal for

excellence in design innovation

• 4,680 submissions from 61 countries

in 2015 (5.7% of entries were awarded

the Red Dot, selected by a highly

qualified jury panel)

SAP Fiori 2.0: Featuring the next-generation

business software experience with

contextual and multi-modal interaction

“This recognition is a great testament

to how we have managed to change

the perception of SAP UX and is

evidence that our continuous focus on

user experience and our design vision

have reached a new level of

distinction in the market.”

~Sam Yen, Chief Design Officer, SAP

Watch Video

https://www.youtube.com/watch?v=jn787YijXBw


SAP Fiori Launchpad & Viewport

Me-area NotificationsWorkspace

The Viewport is the entry point to the users’ daily business. It allows users to focus on their

daily work and still keep track of what’s going on in other areas. The Viewport provides

possibilities to integrate different areas: Me-area (Help, Settings, Quick Creates),

Workspace and Notifications.


Home Page – Link List Area & Anchor Navigation

Link List Area

Intend for apps without valuable

tile content (e.g. legacy apps)

Positioned at the bottom of each

group

Anchor Navigation

Provide easy access to navigate

on the home page, containing a

lot of tiles and groups


Overview Page, Copilot & AppFinder

Overview Page

Provide a 360° domain view

Enable insight-to-action

Copilot

Contextual assistant for quick

creates or other tasks

Possibility for approval, integration

and extension scenarios

AppFinder

Discovery of new apps

Public

Summary and Key Takeaways


Summary and Key Takeaways

SAP Fiori launchpad is…

… the strategic single point of access for a user

… role-based, responsive and personalized

… integrating existing UI technologies

… deployable on multiple platforms

… in alignment with established UI clients

… further evolving from an functional perspective

and with award-winning designs


SAP TechEd OnlineContinue your SAP TechEd education after the event!

http://sapteched.com/online

Access replays of keynotes, Demo Jam, SAP TechEd live interviews, select lecture sessions, and more!

Hands-on replays

http://sapteched.com/online


Further Information

Related SAP TechEd sessions:

UX162 – Effectively Configure and Manage SAP Fiori Launchpad (2h Hands-On Session)

UX108 – SAP NetWeaver Business Client, Release 5.0: Strategy and Outlook

UX113 – Applying UI Theme Designer to SAP Fiori and SAP NetWeaver Business Client

UX201 – SAP Fiori Launchpad: Deployment Options and Common Recommendations

UX202 – SAP Fiori Launchpad and SAP Enterprise Portal: Integration Options

UX207 – SAP UI Technologies and Clients: Overview, Strategy, and Best Practices

TEC200 – Executing the User Experience Strategy

SAP Public Web

SCN: Entry Page / Fiori Launchpad – Prerequisites / Fiori Launchpad – Configuration

Documentation: FLP@ABAP / FLP@Portal / FLP@Cloud

SAP Fiori Launchpad - Deployment Options Common Recommendations: http://scn.sap.com/docs/DOC-59469

Watch SAP TechEd Online

www.sapteched.com/online



https://scn.sap.com/docs/DOC-55166


https://scn.sap.com/docs/DOC-55166

http://help.sap.com/saphelp_uiaddon10/helpdata/en/f9/51b50a07ce41deb08ced62711fe8b5/frameset.htm

http://help.sap.com/saphelp_nw74/helpdata/en/4d/fc657c6af64172bee7a140d616902b/content.htm?frameset=/en/36/e069facded4977b277834c8914de79/frameset.htm&current_toc=/en/4a/ded71e279f4fa5870eb80b36019044/plain.htm&node_id=481&show_children=false

https://help.hana.ondemand.com/cloud_portal/frameset.htm?0c0ba11a10494e8eb1ef5f776a58b4cf.html


http://www.sapteched.com/online


Thank you

Contact information:

Carola Steinmaier Stefan Loetterle

Product Manager Product Manager

Dietmar-Hopp-Allee 16 Dietmar-Hopp-Allee 16

68190 Walldorf, Germany 68190 Walldorf, Germany

[email protected] [email protected]

mailto:[email protected]

mailto:[email protected]


© 2015 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.

http://global12.sap.com/corporate-en/legal/copyright/index.epx

Documents

UX106 - SAP Fiori Launchpad Overview.pdf