Flexibility is key - Demo Booth at UI5Con Rot 2018

1. Demo Booth, SAP CP UI Core Services
June 22, 2018
UI5 Flexibility Services
Flexibility is Key

2. Flexibility Services - Flexibility is Key
SAPUI5 flexibility services enable functions for different user groups to personalize SAP
Fiori apps, adapt their user interface at runtime, and develop new apps.
Benefits:
 Simplified, cost-effective, and easy to use UI
change process
 Increased end user acceptance through
optimized UI layouts
 Adapted UI changes safe for future system
updates
 Easy and intuitive way to adapt the UI

3. Flexibility Services - Personas
End User
I want to
 Personalize tables and filters
 Save and manage own variants
My changes should not
affect other people
Developer
I want to
 Add/change complex business
logic*
 Add new business objects / apps*
 De-couple software lifecycle of
standard and extensions*
My changes should affect
people in my company
Business Expert,
Key User
I want to
 Add custom fields
 Change field descriptions
 Change order of fields
 Create new app variants*
 Add/manage control variants
(views)*
My changes should affect
people in my LOB
* recent innovations

4. Flexibility Services – Layering Approach
SAP Layer
Flexibility
Customer
Layer
Developer changes
Key User adaptation
End User personalization

5. Flexibility Services – Modification-free Changes
View with a formA new field is added into the view using
UI adaptation at runtime/design-time*
…
… and creates a SAPUI5 flexibility
change
The change is applied to the
view

6. New in UI5 1.56
Flexibility Services – Adapting Control Variants (Views)
 Create new variants
 Adapt controls in variants
 Change default variant
 Manage variants for end-users
Key user adaptation capabilities:
Creating new variant
in UI Adaptation
Adapting content of Object page
for the variant
End users can switch between
variants to see different content

7. New in UI5 1.54
S/4HANA 1805
Flexibility Services – App Variants
 Adapt UI of app variant without
modification of the base applications
 Configure separate tile for app
variants on Fiori Launchpad
Create app variants as key user
Switching to adaptation mode
Adapting UI
Creating app variant
with adapted UI
Configuring FLP tile
for app variant
Managing app
variants
Restarting FLP to see the
newly created variant

8. Flexibility Services – Adaptation Project in SAP Web IDE
Lab preview
New type of project
in SAP web IDE
…which allows to create
variants of existing apps
…and then configure and
deploy them separately.

9. Flexibility Services – Adaptation Project in SAP Web IDE
Lab preview
Adaptation project
reference original
application…
…but has an own
application id
…and contain separate set of changes.
In this way you can adapt
application variant without
touching original artefacts!

10. Flexibility Services – Adaptation Project in SAP Web IDE
Lab preview
Extensibility possibilities
of adaptation project
include all options
available for key users
…but developers are
also able to change
control properties
…add XML fragments
…or even extend
controller code!

11. Flexibility Services – Platform Support
On premise
(ABAP) S/4HANA Cloud
SAP Cloud
Platform (NEO) Cloud Foundry
personalization
Object Pages
experimental experimental
personalization
smart controls &
views*
Beta
pers. and adaptation
(sap.ui.fl.variant)
Adaptation at Runtime
(RTA)
App Variants
Adaptation at Design
Time (DTA)
as part of
grunt best practise builds
Adaptation Project In 2018
* views previously known as “control variants”

12. Flexibility Services – Learn More
SAPUI5 Flexibility Services
• https://sapui5.hana.ondemand.com/#/topic/a8e55
aa2f8bc4127923b20685a6d1621.html
App Variants for Key Users
• https://blogs.sap.com/2018/06/05/easily-create-
app-variants-in-sap-s4hana-cloud/
Configuring views (control variants)
• coming soon (in 1.56)
Adaptation Project in SAP Web IDE
• coming in 2018
UI Adaptation at Runtime & Personalization
• https://sapui5.hana.ondemand.com/#/topic/f1430c03
37534d469da3a56307ff76af.html
UI Adaptation on CP Neo
• https://help.sap.com/viewer/3ca6847da92847d79b27
753d690ac5d5/Cloud/en-
US/f7f671f6c26348d7a662c2c3d120202d.html
Enabled controls and dev guide
• https://help.sap.com/viewer/4fc8d03390c342da8a60f
8ee387bca1a/1805.500/en-
US/e144c749695545eba5d5479a40357fa6.html

13. Thank you.
Contact information:
Alexander Rauh
APO SAPUI5 Flexibility Services
alexander.rauh@sap.com