V2.731
SAP Fiori Design rapid-deployment solution
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 2
Contents
Overview of SAP Rapid Deployment Solutions
SAP Fiori Design rapid-deployment solution – Overview and Details
SAP Fiori Design rapid-deployment solution – Reference Scope Items
SAP Fiori Design rapid-deployment solution – Service Delivery
SAP Fiori Design rapid-deployment solution – Technical Details
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 3
Ready to run, a solution with fixed scope, predefined services at a predictable price with the flexibility for future extension.
At-a-Glance: SAP Fiori Design rapid-deployment solution
Design and creation of custom Fiori transactional apps
Business Requirement
Solution
What is my pain?
Maintaining a consistent user experience across different transactional scenarios?
Increasing employee satisfaction and productivity at the same time?
Supporting your employees in adopting new business processes?
Minimizing work completion time for key transactional scenarios?
Providing training to your employees on powerful but complicated systems?
Solution description
Provide design guidelines for delightful Fiori-designed user experiences
Enable you to define and execute your user experience renovation plan through a quick and affordable proof-of-concept Fiori-designed app
Enable you to create your own Fiori-designed applications
What are my needs?
Identify user experience needs, create a UX renovation plan, and implement UX renovation affordably and with a predictable outcome
Design and develop a proof-of-concept app based on your UX renovation needs
Execute quickly on delivering a delightful user experience for your custom scenarios
In scope
Increased employee satisfaction with required transactional processes
Lowered training costs associated with new business processes
Increased employee flexibility and productivity via intuitive and consistent approach independent of device type (i.e., same experience on mobile, tablet, or desktop)
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 5
SAP rapid-deployment solutions for User Experience
Packaged Best Practices for Faster Adoption of Innovation from SAP
SOFTWARE
Cloud, On-Premise & Hybrid
BEST PRACTICES
with Proven Business Value
SERVICES
Predefined from Partners or SAP
End-to-end business needs
covered
Flexible new solutions or
expansion of IT landscapes
Content including tested configuration and
implementation guides
Tools & methods supporting flexible pick &
choose scenarios
Proven methodology developed for
fast time to value
6 © 2014 SAP AG or an SAP affiliate company. All rights reserved.
GENERATION Y
GARTNER REPORT
65%
of the Expert Users rated the SAP UI as
good or very good
69%
of Business Leaders and
80%
of Casual Users rated the SAP UI as poor
or not good
In four years, Generation Y will account for nearly
half the employees in the world.
They exhibit a different work mode.
End user demands are shaping the IT strategy.
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 7
Why
focus on User Experience?
$
UX impacts Business Value
Gain productivity
Increase user adoption
Decrease user errors
Save training costs
Enabling the creation of
SAP
Fiori-designed transactional
apps
for SAP Business Suite
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 10
Solution Scope
Key Benefits
Best practices for Fiori design, architecture, and
theme patterns
Create your own Fiori-designed app via design
thinking working and proof-of-concept training
Fiori transactional app samples included:
•
Approval
•
Self Service
•
Tracking
•
Monitoring
Fiori design knowledge transfer to explore,
identify, and validate UX drivers, requirements,
and realization effort
Determine your own User Experience (UX)
renovation plan
Modular solution, mix and match with other user
experience packages
SAP Fiori Design rapid-deployment solution enables customers
and partners to create their own Fiori-designed transactional
applications by leveraging SAPUI5, Fiori design guidelines, and
best practices. It includes a design thinking workshop and an
SAPUI5 workshop to deliver a proof-of-concept Fiori-designed
app in a predictable time and at a predictable cost.
SAP Fiori Design rapid-deployment solution
<Solution/Marketing
graphic>
Highlights
• Fast – no need for lengthy
blueprinting process
• Predictable – predictable
scope, timeline, and outcome
• Seamless – integrate with
existing SAP on-premise,
cloud, or hybrid solutions
• Simple – easily expand
functionality as needs change
More Information
service.sap.com/rds-ui-sapui5
Related Solutions
SAP Fiori Apps RDS
SAP Fiori Infrastructure RDS
SAP Screen Personas RDS
SAP Side Panel Content for
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 11
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 12
SAP Fiori Design RDS Focus Areas
“Fiori Design”
Best Practices
• Fiori design principles
• Reference architecture
• SAPUI5 code samples
• “Blue Crystal” theme patterns
• Templates & step-by-step
design guides for top Fiori app
scenarios
• Design time tools and best
practices for the creation of
Fiori apps
Design Thinking
Workshop
Based on Fiori Playbook
• Discovery workshop
• User research plan
• Use case identification
• Top scenarios derived
• Wireframe storyboarding
• POC app presentation
• Project scoping
• Backend data mapping
• Architecture overview
• Knowledge gap analysis
Proof-of-Concept
Fiori-designed App
• A realization service for the
creation of Fiori-designed
proof-of-concept application
• Based on documented stages
and templates to facilitate a
predictable approach to
custom app creation
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 13
SAP Fiori Design RDS Focus Areas Continued
Proof-of-Concept Workshop
SAPUI5 technical training
Hands-on exercises with
incremental app templates
Proof-of-concept app based on
one Fiori Design app type
Fiori Design Best Practices
Fiori Design principles for
transactional app types
Blue Crystal UI theme patterns: the
look & feel Fiori is based on
The SAP Fiori Design RDS is
designed for ECC 606 / NW 7.31
Fiori Design Samples
Approval App Self Service App
Tracking App Monitoring App Change App Shopping App Process App Samples with offline data Samples with offline or connected data Examples via Best Practices only
Sample Apps & Development
Best Practices
Integrated Development
Environment (IDE) deployment
Fiori architecture best practices
Fiori app samples
NetWeaver Gateway
Installation
Landscape check & preparation
Installation and configuration
UI add-on installation
Design Thinking Workshop
Discovery workshop
SAP Fiori Design RDS
Primary Deliverables:
Fiori Design Principles and
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 15
What’s included
Business benefits
This business process demonstrates
example user interfaces with SAP Fiori
templates for selected use cases and shows
how standard functionality can be delivered
as an attractive and intuitive Fiori-designed
user interface.
Provides examples of four SAP Fiori app
types for selected use cases
Provides examples of connection to
back-end data for two of these use cases
SAP Fiori Example User Interface:
SAP Fiori Design RDS
Reference Scope Item 1:
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 17
What’s included
Business benefits
This business process demonstrates an
example user interface that shows how
standard functionality from a standard Sales
and Distribution backend system can be
incorporated into an attractive and intuitive
SAPUI5 user interface.
Provides an example of how a user interface
layout can be implemented with SAPUI5
Provides examples of how various elements
interact with each other on an SAPUI5 user
interface
SAPUI5 Business Process for Sales and Distribution:
SAP Fiori Design RDS
Reference Scope Item 2:
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 19
What’s included
Business benefits
This business process demonstrates an
example user interface that shows how
standard functionality from a standard
Project Services backend system can be
incorporated into an attractive and intuitive
SAPUI5 user interface.
Provides an example of how a user interface
layout can be implemented with SAPUI5
Provides examples of how various elements
interact with each other on an SAPUI5 user
interface
SAPUI5 Business Process for Project Services:
SAP Fiori Design
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 21
What does SAP deliver?
What do you have to do?
Obtain necessary licenses and landscape
Install all required prerequisites for NetWeaver Gateway
and UI add-on
Provide the IT infrastructure (server)
Provide fixed contact people in the business and IT
departments
Complete action list from landscape check
Attend enablement workshop
Delegate end users for interview
Review interview findings
Validate prototype creation process
SAP Fiori Design RDS Service Scope
Key deliverables
Landscape check – including Prerequisite
documentation
Installation of NetWeaver Gateway and SAP UI add-on
Configuration of NetWeaver Gateway and SAPUI5
Enablement workshop
End user interviews
Analysis and visualization of interview findings
Hands-on technical training for app creation
Implementation of prototype app
Presentation of project results
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 22
SAP Fiori Design RDS Service Details
Scope A – 6 Days
Software Installation
U57 Installation and set-up of NetWeaver Gateway 2.0 Components
Installation and set-up of NetWeaver UI add-on
Scope B – 2 Days
Design Thinking Workshop
U57 Discovery Workshop, Wireframe Storyboard, User Scoping Exercises and Fiori Design Principles
Standard: 10 attendees or less
Large: 11 to 25 attendees
Note: U57 is the best-practice scenario number
Scope B2 or C2 – 1 Days
Fiori Story Workshop
U57 Further detailed review of Fiori design principles including Fiori-specific role-based philosophy, walkthrough of examples, and review of best practices
Included as part of Scope B or Scope C
Scope D – 2 Days
Proof-of-Concept Creation
U57 Choose a prebuilt SAP Fiori-designed SAPUI5 application to be developed jointly through hands-on exercises by leveraging best practices covered in technical workshop Four applications to choose from: Approval, Self-Service, Monitoring and Tracking
Scope C is a pre-requisite for Scope D
Scope C – 4 Days
Technical Workshop
U57 SAPUI5 Foundational Training and best practices on Performance and Security
Step by Step and with Configuration Guides
Project Kick Off & Follow Up – 3 Days
End-to-End Service
U57 Onboarding, scoping, project management, logistics, follow up, and review
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 23
User Experience Design Thinking Workshop Overview
The User Experience (UX) Design
Thinking workshop process:
Explore UX drivers
Identify UX requirements
Validate UX realization efforts
Plan UX roadmap
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 24
SAP Fiori Design RDS Deliverables – Complementing Elements
Fiori
Design
Guidelines
Ideation
Workshop
Guided
PoC Project
New
SAP Fiori
App
Fiori transactional app types:
Approval App
Self Service App
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 26
Which software is used?
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 27
SAP Fiori Architecture / Example Landscape
SAP Netweaver
Gateway 2.0
DMZ Entry Point
Carrier
- DMZ -
Internal Firewall
External Firewall
© 2014 SAP SE or an SAP affiliate company. All rights reserved. Customer 29
