The document discusses SAP Screen Personas, which is a tool for delivering the SAP Fiori user experience (UX) to classic SAP transactions and screens. It can be used to simplify screens, apply the Fiori design, and render screens on any device. The presentation demonstrates how to build adaptive flavors for mobile with Screen Personas and provides an overview of resources and guidance for transforming the UX using Screen Personas on both SAP S/4HANA and ECC systems. It emphasizes simplifying screens first before moving to mobile and that Screen Personas is the fastest way to deliver mobile access to classic transactions.

1. SAP Screen Personas as Part of the
SAP Fiori User Experience
Sebastian Steinhauer, Klaus Keller, Peter Spielvogel
SAP
SESSION CODE: ASUG 11652

4. PUBLIC
Sebastian Steinhauer, Klaus Keller, Peter Spielvogel, SAP
ASUG Annual Conference, June 2018
ASUG 11652
SAP Screen Personas
as Part of the
SAP Fiori User Experience

5. 5PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
1. Build Fiori-inspired screens that run
desktops, tablets, or phones
2. Use the latest features in
SAP Screen Personas
3. Expand Fiori coverage in
SAP S/4HANA and ECC systems
In the next hour we will show you how to:

6. 6PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
2. Simplify first,
then move to mobile.
1. SAP Screen Personas is the
fastest way to deliver mobile
access to classic transactions.
2 things to remember after SAPPHIRE

7. 7PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
The Fiori user experience has five defining characteristics
Simple Role-based Adaptive Coherent Delightful

8. 8PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
The SAP Fiori User Experience
• What is the Fiori UX?
• Demo: SAP Screen Personas on mobile device
• Paths to the Fiori UX
Creating the Fiori UX with SAP Screen Personas
• Demo: Simplifying the screens, adding the Fiori UX
• Demo: Rendering on any device
Your UX transformation plan
• Already on SAP S/4HANA
• Still running ECC
Agenda

9. 9PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP user experience
Top-down initiative
Design language
Collection of apps
What is Fiori UX?

10. 10PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Demo
Running flavors
on mobile devices
Simplified classic screens work best on mobile devices

11. 11PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP Kernel
SAP S/4HANA or SAP NetWeaver
SAP Application
(SD, MM, PM, Fl,...)
Screen Processor
Static SAP
Screen Personas
Files
SAP Screen
Personas
Resource Handler
Kernel Resource
Handler
SAP Screen
Personas
Processor
Static SAP GUI
for HTML Files
HTTP Interface
SAP Screen
Personas Screen
Adapter
SAP Screen
Personas Screen
Adapter
SAPUI5 Renderer
SAP GUI for HTML
Screen Renderer
Slipstream EngineSAP GUI for HTML
Desktop/Mobile BrowserDesktop Browser
Slipstream EngineSAP GUI for HTML
JSON/
HTTPS
HTML/
HTTPS

12. 12PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP Kernel
SAP S/4HANA or SAP NetWeaver
SAP Application
(SD, MM, PM, Fl,...)
Screen Processor
Static SAP
Screen Personas
Files
SAP Screen
Personas
Resource Handler
SAP Screen
Personas
Processor
HTTP Interface
SAP Screen
Personas Screen
Adapter
SAPUI5 Renderer
Slipstream Engine
Desktop/Mobile Browser
Slipstream Engine
JSON/
HTTPS

13. 13PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Slipstream Engine allows for greater flexibility
Desktop Browser
SAP GUI
for HTML
Fiori Launchpad
NWBC
SAP GUI
SAP GUI
SAP S/4HANA
SAP NetWeaver

14. 14PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Slipstream Engine allows for greater flexibility
Desktop Browser
SAP GUI
for HTML
Slipstream
Engine
Fiori Launchpad
Slipstream
Engine
SAP Fiori Client
Slipstream
Engine
Mobile Browser
Slipstream
Engine
NWBC
SAP GUI
SAP GUI
Slipstream
Engine
SAP Cloud
Platform
SAP Cloud
Connector
Slipstream
Engine
SAP Web
Dispatcher
SAP S/4HANA
SAP NetWeaver

15. 15PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Leverage
out-of-the-box
SAP Fiori apps
Buy custom app
from partner
Design custom
apps with Build,
Web IDE, Mobile
Services
Create Flavor
with SAP Screen
Personas
There are several paths to the Fiori UX

16. 16PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Rules:
1. I show the screen
2. You yell out the answer
(or raise your hand)
Let’s play a game: “SAP Fiori UX or not”

17. 17PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Downloaded from the Fiori app library
Is this the SAP Fiori UX?

18. 18PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Downloaded from the Fiori app library
Is this the SAP Fiori UX?
Yes, this is the SAP Fiori UX.

19. 19PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Custom app built with SAP Web IDE and SAP Build
Is this the SAP Fiori UX?

20. 20PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Custom app built with SAP Web IDE and SAP Build
Yes, this is the SAP Fiori UX.
Is this the SAP Fiori UX?

21. 21PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Custom app built with SAP Cloud Platform and Apple iOS SDK
Is this the SAP Fiori UX?

22. 22PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Custom app built with SAP Cloud Platform and Apple iOS SDK
Yes, this is the SAP Fiori UX.
Is this the SAP Fiori UX?

23. 23PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP Screen Personas flavor built using the SAP Fiori design guidelines
Is this the SAP Fiori UX?

24. 24PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP Screen Personas flavor built using the SAP Fiori design guidelines
Yes, this is the SAP Fiori UX.
Is this the SAP Fiori UX?

25. 25PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Classic transaction with the Belize theme
Is this the SAP Fiori UX?

26. 26PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Classic transaction with the Belize theme
No, this is not the SAP Fiori UX.
Is this the SAP Fiori UX?

27. 27PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Simple guidance for improving or mobilizing SAP user experience
Modify
existing
Fiori app?
Yes Yes
No No
Download
out-of-the-box
SAP Fiori apps
Build custom app
(Build + Web IDE +
Fiori Elements +
Mobile Services)
SAP Screen
Personas flavors
No
Enhance using
SAP Web IDE
Reuse existing
business logic?
Yes
Start:
Design Thinking
1 2 3
App available to
meet exact
needs?

28. 28PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP Screen Personas is a proven UX transformation tool
customers industriescountries
1400 70 25

29. 29PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
What is a Fiori-inspired flavor?

30. 30PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Getting started with the SAP Screen Personas flavor gallery
• Function modules
• Flavors
• Templates
• Themes
• Icons
• Scripts

31. 31PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
What’s new in SAP Screen Personas 3.0 SP7 (among the 150+ updates)?
Flavor editor works in
Slipstream Engine
(on desktop only)
Mobile preview for
different device sizes
Viewport API
simplifies complex
screens

32. 32PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Simplified classic screens work best on mobile devices
Demo
Building adaptive
flavors for mobile
devices

33. 33PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP Screen Personas makes SAP S/4HANA even better
Use SAP Screen Personas to:
• Simplify complex GUI screens
• Apply Fiori design to custom
transactions
• Launch flavors from your Fiori
Launchpad and support intent-
based navigation

34. 34PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
• Provide business users a more intuitive UX
• Simplify the UX now, upgrade to S/4HANA later
• Minimize disruption: upgrades not required
• No additional servers required
• Forward compatible for investment protection
SAP Screen Personas brings the SAP Fiori UX to ECC
SAP
Basis
Minimum
Service Pack
Supported
Kernel
700 SP25 7.22
701 SP10 7.22
702 SP09 7.22
731 SP07 7.22
740 SP03 7.45, 7.49
750 all 7.45, 7.49
S/4HANA all 7.49+

35. 35PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
SAP provides several resources to accelerate your UX journey
Links to SAP Screen Personas resources on the product page:
http://www.sapscreenpersonas.com
Practitioner Forum
Flavor Gallery Knowledge Base
Productivity Power Play
openSAP courses SAP Press E-Book

36. 36PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
More information about SAP Screen Personas
Product Page www.sapscreenpersonas.com
SAP Screen Personas Practitioner
Forum (monthly best practices call)
http://link.personas.help/PractitionersForum/Signup
Productivity Power Play
(video series)
http://videos.personas.help
SAP Screen Personas Flavor Gallery http://link.personas.help/SAPScreenPersonasFlavorGallery
Knowledge Base
https://wiki.scn.sap.com/wiki/display/Img/Personas+Knowle
dge+Base
OpenSAP courses
(free online training)
https://open.sap.com/courses/sps2 (Introduction)
https://open.sap.com/courses/sps3 (Advanced scenarios)
Building mobile flavors (coming in Fall 2018)
SAP Press e-book
https://www.sap-press.com/using-sap-screen-
personas_3975/

37. 37PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
2. Simplify first,
then move to mobile.
1. SAP Screen Personas is the
fastest way to deliver mobile
access to classic transactions.
Recap: 2 things to remember after SAPPHIRE

38. 38PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
 Identify SAP Screen Personas champion
 Have SAP Screen Personas champion
take the openSAP course
 Complete a pilot project
 Go live into production
Beginning your SAP Screen Personas journey

39. 39PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Receive notifications on:
• Product updates
• Tutorials
• Tips & tricks to drive your UX transformation
• Support announcements
• Pointers to new content on SAP blogs
Follow SAP Screen Personas on Twitter: @SAPImagineering
Follow us on Twitter:
https://twitter.com/SAPImagineering

40. Maricel Cabahug
Chief Design Officer, SAP
Design for a Better Future with Digital Ethics in Mind
Wednesday 1:30 pm in the Best Run Theatre

43. Thank you for attending our session!
For questions, contact me at:
peter.spielvogel at sap dot com
Don’t forget to fill out the Session Evaluation on the Mobile App!
SAP Screen Personas as Part of the
SAP Fiori User Experience
Session ID# ASUG 11652
Sebastian Steinhauer, Klaus Keller, Peter Spielvogel
SAP

44. 44PUBLIC© 2018 SAP SE or an SAP affiliate company. All rights reserved. ǀ
Follow Us
Thank you for your time
Follow us on at @ASUG365