I discussed options how UI5 web apps can be used as a basis for apps beyond your typical office requirements. While SAP Fiori apps and Fiori LaunchPad are the basis for SAPs Digital Workplace of the future, there exist much more possibilities how the web can be the basis for your digitalization efforts. We are looking into WebAPIs, standards such as WebRTC and 3rd party extensions and how this can be applied in enterprise settings. Adding Cloud APIs into the mix, lots of demand for feature-rich apps can already be fulfilled leveraging the web.

1. Denny Schreber, cbs Corporate Business Solutions GmbH
June 30, 2017
UI5 Apps
beyond the Office

2. “Netscape will soon reduce Windows to a
poorly debugged set of device drivers”
Marc Andreessen, 1995

3. Agenda
• Personal View on UI5 apps
• Taking the apps beyond the office
• Examples
• Wrap-up

4. Personal View on UI5 Apps

5. 5
Subjective view on the state of the art:
 Design work got more fine-grained
– Leveraging floorplans from Fiori Design
Guidelines
– More Fiori apps available inspire end users
 Less custom controls
– Lots of standard controls available
– Direct 3rd party libs integration
 Still main use cases are:
– Data Overview
– Data Visualization
– Data Entry
Personal View on UI5 Apps
Project Trends
SAP offerings
 SAP guidance available
 More controls available
 Apps are looking better
 more user friendly
 Not really innovative


?

6. 6
Different main driver for setting up a UX project:
 Innovation as project driver is important
 Project drivers are not always innovation-related, e.g.
– UI technologies no longer supported by software vendor / security concerns
– Consolidation of UI technologies
Differences in project types:
 UI5 projects on customer site (consulting perspective)
– Often replacing existing UIs
– Project size has to be limited as the apps are customer-specific
 UI5 apps for standard software (leogistics perspective)
– Development effort can be higher due to having multiple paying customers
– Great UX provides a unique selling proposition
Personal View on UI5 Apps
Project differences

7. Taking the Apps beyond the Office

8. 8
How the web can be the basis for your
digitalization efforts?
 New trends emerge such as serverless
computing, progressive web apps, Cloud
APIs, better distributed computing
 Lots of possibilities and innovation
potential in the UI layer to connect the
dots
Taking the Apps beyond the Office
User Interface Layer
Simplified Solution Stack
Service Layer
UI5
3rd
Party
Libs
Web
APIs
Web
Standards
Cloud
Services
… Further Layer(s) …

9. 9
WebAPI:
 There are hundreds of Web APIs available
– Camera, Geolocation, Ambient light sensor
– Bluetooth, WiFi, Network
– Device Storage, File Systems
 Payment Request API
Web Standards:
 WebRTC
 WebVR
Taking the Apps beyond the Office
Standards and Web APIs
WebAPI is a term used to refer to a suite of
device compatibility and access APIs that
allow Web apps and content to access device
hardware (such as battery status or the device
vibration hardware), as well as access to data
stored on the device (such as the calendar or
contacts list).
Source: Mozilla Developer Network
 Standards for Interoperability
 What we already use: Mobile Web, Voice
Browsing, Multimodal Browsing

10. 10
Libraries
 Apache Cordova in Web IDE provides PlugIns for web development
 Frameworks such as QuaggaJS for barcode scanning
 D3.js for data visualization
3rd party extensions
 Complete drawing extension based on vanilla JS and canvas
 Digital Signature Handling
 Viewers or parsers for (nearly) all file formats available
– To be used carefully, e.g. PDF vs. Flash
Integration
 sap.ui.core.HTML as starting point
 UI5 Custom Control for proper handling inside UI5
Taking the Apps beyond the Office
Libraries and 3rd party extensions

11. 11
Cloud Services / FaaS
SAP Offerings:
 Gateway-based OData-services (API) based on s-
Innovations (On-Premise and Cloud)
 API Business Hub for SAPs Cloud offerings
 SAP Cloud Platform as extension platform
API Economy
 Combining APIs from several cloud offerings
 Micro-Service approach beneficial
Taking the Apps beyond the Office
Services
Source: diginomica

12. 12
Drawbacks of complex Apps:
 The UI layer gets more complex
– More development needs to be maintained and supported
– Separation of concern design principle not always applicable
 Complex Apps are not working well together with the Fiori elements app style
 Solution stacks get distributed
Taking the Apps beyond the Office

13. Examples of such Apps

14. 14
Combining the presented approaches in UI5 apps and integrate with/into cloud solutions to close
gaps helps to solve business problems
Scenario 1: leogistics Yard Suite Rail Solution – Planning Scenario
Scenario 2: Fault clearance situation – Web App supported
Examples
What business problem can be tackled?

15. 15

16. 16
Examples – Fault Clearance Situation
Take Picture
Recognize serial
number from barcode
in video stream
Compare with
reference material
Annotate / Paint
picture
Chat with Expert
Geolocation
Use device API to call
technician
Phase 1:
Symptom
Recognition
Phase 2:
Diagnosis
Phase 3:
Resolution

17. Wrap-up

18. 18
UI5 apps should better leverage the possibilities the Web already provides
SAP is moving into the right direction, but a request to SAP:
Provide cool Apps to inspire users and organizations
Distributed computing is not going away (API Economy)
UI5 apps have the potential to impress the user
More information
 DSAG AG UI-Technologien
 HackerNews: Show HN
Wrap-up

20. Thank you.
Contact information:
Denny Schreber
denny.schreber@cbs-consulting.de
LinkedIn | XING
You are welcome to give feedback for this session
in the UI5con Event App