Tobias Gollwitzer– Program Manager of Design and Co-Innovation Center October, 2013 SAP UI5 and SAP Fiori
Tobias Gollwitzer– Program Manager of Design and Co-Innovation Center October, 2013
SAP UI5 and SAP Fiori
2 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Consumer user experience is the new standard for enterprise applications …
3 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Top use
scenarios
Core use scenarios Specific customer value
use scenarios
The SAP User Experience Strategy
Existing Applications
RENEW ENABLE
SAP Fiori
Renovation Enablement Tools (e.g. SAP Screen Personas)
NEW
New Applications
Usa
ge
/R
ea
ch
4 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
ENABLE NEW RENEW
UX DESIGN SERVICES
SAP USER EXPERIENCE STRATEGY
5 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
RENEW the most widely-used top scenarios
6 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Our Goal: Provide immediate impact by renewing
the user experience of the most broadly
and frequently used SAP software functions
that can be accessed from mobile and desktop devices
7 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
8 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
9 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
10 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Responsive Simple Impactful Coherent Instant Value
11 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
All Sizes | Devices | Versions | Channels
12 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Responsive Designed and developed for a consistent
experience on many devices.
13 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
My Leave Requests
My Timesheet
My Travel Requests
My Shopping Cart
Track Shopping Cart
Approvals
Insight
Approve Requests
Approve Leave Requests
Approve Timesheets
Approve Travel Requests
Approve Travel Expenses
Approve Shopping Carts
Approve Purchase Orders
Approve Requisitions
Approve Purchase Contracts
Purchasing
My Spend
Track Purchase Orders
Order from Requisitions
Requests
Insights
My Paystub
My Benefits
Purchasing Agent Manager Employee
Sales Transactions
Sales Insight
SAP Fiori
Sales Rep
Create Sales Orders
Change Sales Orders
Check Price and Availability
Track Sales Orders
Track Shipments
Track Invoices
25 SAP Fiori Apps available now They touch 87% of the users at an SAP Customer
© 2013 SAP AG or an SAP affiliate company. All rights reserved.
14 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Fiori: Role-based Experience for Top Tasks
Today Functional-based applications
Fiori Role-based applications
To: One entry point for the user and UX following common design directions
From: Multiple entry points for the user and inconsistent user experience
From: One transaction for multiple roles exposing all data & functions to all users
To: Decomposed apps for each role exposing only relevant data & functions
15 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
SAP Fiori Development Approach
Engaged with 250+ customers to
understand the most common business
functions and how people want to work …
16 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Implementation Projects
17 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
We have deployed SAP Fiori at Colgate and the
feedback from our first group of business users
has been very positive. They are excited about
the ease of use and simplicity of the app. We
worked very closely with SAP on the vision and
mission of SAP Fiori and we think the first
release of our collaboration looks great. We
believe SAP Fiori will help to provide consumer-
grade user experiences to our employees.
Tom Greene, Chief Information and Business Services
Officer, Colgate
“I am very excited to see such positive results
from SAP’s UX Strategy in such a short time
frame. The SAP Fiori apps are as easy to use as
Facebook, Google or Amazon. This is exactly
what end users are looking for.”
Benjamin Salter, Enterprise Architecture and
Application Development, Valero
“
”
“
”
18 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Relay Server
Architecture
Gateway 2.0 SP6
ECC 6.0 SP15
SMP3.0 *^
Reverse
Proxy
Kapsel^ Kapsel^
SAP Web
Dispatcher Connectivity
solutions
Web App
(HTML5)
IdP
VPN
X.509
certificate
SAML 2.0
Authentication
Mechanisms
SAP SSO2
Desktop
Browser
(HTML5)
*Optional component; ^ Available H2/2013
19 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Out of Box
Extensibility
Configuration
Branding
Business Content
and Templates
Personalization
Theming,
Branding & UI
Adaptation
Provides Flexible Framework
Tailorable Pre-built content
– Match Corp Branding
– User Personalization
– Templates for additional workflow use cases
Many apps work out of the box
Configurable to your business process
Easily Extendible to include custom fields and functions
20 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Implementation Flow
Check Prerequisites
SAP NW ABAP 7.0
SAPERP Business Suite
6.0
SAP NW Gateway 2.0
SAP UI5 1.10
Install
Gateway SRA Add-On
Components
Install UI SRA Add-On
Components
Configure
Gateway & SICF
Services
Register Alias and
Gateway Services
Application Specific
Configuration
(if needed)
21 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Technical Pre-Requisites
SAP NW Gateway
Version 2.0
Support Package 6
SAP Backend
ERP – ECC 6.0 SPS15
SRM – 7.0
HCM – ECC 6.0 SPS15
Browser Support
Internet Explorer 9 & 10
Chrome on Windows
Safari iOS 6x
SAP NetWeaver AS ABAP 7.00(Enh 1 or 2) or
7.31, SAP Netweaver Gateway 2.0 SP6
(IWFND,GW_CORE,IWBEP)
SAP UI5
ECC 6.0 SPS 15+
Business Suite
• 6.0 SPS 15 and above
6.0 EnhP2 SPS 06 and above
• 6.0 EnhP3 SPS 05 and above
• 6.0 EnhP4 SPS 05 and above
• 6.0 EnhP5 SPS 03 and above
• 6.0 EnhP6 SPS 01 and above
22 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Demo
23 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Fiori Outlook
24 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Role Application
Sales Representative
- SD
• My Customers (View, Create)
• My Contacts (View, Change, Create)
• Create Quote
• Change Quote
• My Quotation Pipeline
• Win / Loss Analysis
Production
Supervisor
• Release Production Order
Production Worker • Confirm Production Order
• Confirm Production Operations
Project Manager/
Project Employee
• Change WBS Element Status
• Confirm Milestone
• Confirm Activity
Quality engineer • Report Quality Issue
• Track and confirm Task
Employee
(EHP 2)
• Report Travel Expenses
25 New Fior Apps planned for Wave 2 (15 ECC 6.0 SPx and 10 CRM 7.0)
Role Application
Sales Representative
(CRM 7)
• My Customers: Search, View, Edit, Create contacts
• My Contacts: Search, View, Edit, Create contacts
• My Calendar / My Activities: View, Edit, Create
• Notes: Capture unstructured information on a tablet
and create follow-ups based on CRM Activities
• Sales Documents: Look-up of required documents,
presentations, product brochures, whitepapers,
contract templates etc.
• Customer presentation right from the tablet / laptop
• Collaborate: Annotate documents and collaborate with
your sales back office, tagging
• Attach documents to CRM system (e.g. Opportunity,
Activity) to ensure good data quality
• Opportunity: Create/Edit/Display opportunities
• Leads (View, Edit): Receive leads and follow-up with
potential customers
Confidential!
25 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Fiori App Types
runs on any DB
and HANA runs on HANA
Transactional
Insight to Action
Visual overview over a complex topic for monitoring or tracking purposes
Search and Explore
View on essential information about an object and contextual navigation between related objects
Analytical Factsheet & Contextual
Navigation
Task-based Access
Access to tasks like change, create, or entire processes with guided navigation
Confidential!
26 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
New Fiori Launchpad Single Entry Point – Contextual, Role-based, Personalization and Search
27 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Fiori Apps Planned for Suite on HANA Wave 2 delivery
runs on any DB
and HANA runs on HANA
Transactional Analytical Factsheet & Contextual
Navigation
Insight to Action
Visual overview over a complex topic for monitoring or tracking purposes
Search and Explore
View on essential information about an object and contextual navigation between related objects
Task-based Access
Access to tasks like change, create, or entire processes with guided navigation
Scenarios Scenarios Scenarios
~50 ~50 ~85
Confidential!
28 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
SAP Cloud Solutions, …
All applications & UI technologies to converge to the Fiori concept
The roadmap beyond the initial Suite applications is yet to be defined
Business Suite
Wave 1
Wave 2
Fiori Concept
Where We Want to Be: Unified UX Direction for all Apps
…
Roadmap TBD
Wave 3: TBD
Confidential!
29 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Fiori Launchpad as the first
implementation of the
Unified Shell
Unified Shell
Unified Shell Concept Web-based entry point for SAP Business Applications across platforms and devices
SAP NetWeaver
Business Client
SAP Enterprise Portal
Client
WebDynpro
ABAP / FPM SAP GUI Web UIF … SAP UI5
Confidential!
30 © 2013 SAP AG or an SAP affiliate company. All rights reserved.
Learn more at experience.sap.com
© 2013 SAP AG or an SAP affiliate company. All rights reserved.
THANK YOU FOR YOUR ATTENTION
© 2013 SAP AG or an SAP affiliate company. All rights reserved.
Need help? [email protected]