Upload
blackvard
View
1.726
Download
4
Embed Size (px)
Citation preview
Blackvard Management ConsultingIntroduction Into SAP Fiori
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Agenda
What Will Be Covered:
1. SAP Fiori Overview
2. Fiori Design Principles
1. Application Responsiveness
2. Launchpad Design & Components
3. Grid Layout/Form Factors/Navigation/Page Layouts/Floorplans/System Requirements
3. Fiori Applications
1. Current Applications & Products
4. About Us
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
What is SAP Fiori?
SAP Fiori is the new user experience (UX) for SAP software that utilizes modern design principles to provide a personalized, role-based, responsive & user-friendly experience across all lines of business, tasks & devices.
SAP Fiori is a collection of applications w/ a simple & easy-to-use experience for broadly & frequently used SAP software functions.
Specify which data & apps users can access using previously designed authorizations & roles. Work seamlessly across devices (desktop, tablet or smartphone). Boosts user productivity, satisfaction & performance.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Established in 1972, SAP has been evolving at a rapid pace. Below is a timeline of SAP’s evolution of user interfaces to Fiori in recent years.
1999 – R/32005 – ALV Grid
2010 – Web Dynpro 2014 – Fiori
What is SAP Fiori?
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
What is SAP Fiori? Fiori UX speaks a consistent design language & uses common technical infrastructure to provide a holistic & consistent end-to-end user experience.
Uses attractive & interactive UI elements. Blurs traditional computing boundaries.
Allows companies to leverage existing SAP investments by providing instant value for employees & customers.
SAP Fiori offers services for search (business objects & apps), navigation, personalization & single sign-on.
UX Design Services
NEW RENEW ENABLE
SAP Fiori UX
New Applications
Existing Applications
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
https://en.wikipedia.org/wiki/Representational_state_transfer
What is SAP Fiori?
Fiori OData (Open Data) services allow users to keep up-to-date versions of backend data.
Fiori UX is created w/ state-of-the-art HTML5 (SAPUI5) technology. Uses RESTful (OData) runtime services to process business data through open standards. A single application instance supports end-users in any device setting.
http://scn.sap.com/docs/DOC-61828
Unified UX direction for all SAP software. All UI technologies & applications to eventually converge to SAP Fiori.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Client
Fiori Client helps users overcome mobile browser limitations by providing a built-in reliable asset-caching tool, which enables device Application Programming Interfaces (API).
E.g. for geo-location, camera & barcode scanner, etc. Fiori Client also uses SAP Mobile Platform SDK that allows for custom functionality enhancements to be made.
http://help.sap.com/fiori-client
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
WEB IDE
Fiori WEB IDE allows users to build or extend existing Fiori apps in a browser. No additional installation steps are required – “In-Browser-Development”
Holistic web-based development environment. Addresses app development process from prototype to deployment. Encourages various
decision makers to engage in app creation to increaseend-user value.
Provides user-friendly visual editors (templates, drag-and-drop, wizards, etc.).
https://uxexplorer.hana.ondemand.com/_item.html?id=10667#!/overview
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Design Principles
Focused applications are designed based on how people work & the most common/critical activities.
SAP Fiori’s 5 Main Design Principles.
Role-based• Designed for specific
business roles, needs & work requirements.
• Provides pertinent information at the correct times.
Responsive• On-demand user support.• Allows for instant insight,
regardless of devices being used.
Simple• Focuses on importance.• Personalize your
experience to your specific tasks & activities.
Coherent• Fluid & seamless user
experience.• Adheres to consistent
interaction & visual design language.
Delightful• Secures emotional
connection.• Allows you to do your
job.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Multi-Device Support: Responsive vs Adaptive Responsiveness allows for apps to run on desktops, smartphones, tablets, etc. In order to do this, applications apply two different methods. Responsive:
Responsive controls & patterns: SAPUI5 provides various controls & patterns. Adjusts to various form factors & different devices w/out being recoded or manipulated.
Adaptive: Applications manually define different
designs across different form factors. Applications adhere to adaptive design. Mobile first design approach.
Responsive & adaptive methods can be mixed.
Responsive Mobile
CSSFluid
Cross-platform
Desktop Framework
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Application Responsiveness Mobile access is continuing to make desktop access irrelevant. Mobile-based SAPUI5 controls allow for touch control & mouse/keyboard.
Configure apps to fit touch devices & mouse/keyboard devices. Desktop controls must be replaced w/ responsive controls when running mobile.
Allows for proper manipulation of responsive configurations within patterns. Enhance core functionality from mobile devices to larger ones.
Adjust layout options to fit various platform sizes. Allows for worklist application letterboxing.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Application Responsiveness ALV Analytical Tables must be replaced w/ responsive tables or other
case-specific solutions such as KPIs, texts, or charts. Filter bar will become responsive in future SAPUI5 version upgrades. If desktop app is too complex, some functionality must be turned off in order
to access via mobile devices. If app functionality is available for all devices, responsive methods should
be used to auto adjust the application. If not, manual adjustment is required.
https://experience.sap.com/fiori-design/ui-components/analytical-table-alv/
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Launchpad Components
The Fiori Launchpad homepage allows for personal app collection accessibility; main entry point to both mobile & desktop apps.
Launchpad homepage is fully responsive & can be personalized. Groups & displays various app entry point tiles, which can be added/removed as desired. Manages user identification, navigation & global searches (Shell Bar). Select from ready-to-use, pre-defined, role-based tiles & groups. Tiles display app-specific data as well as icon/title/numbers/charts/informative text. Tiles can be personalized and provide direct access to apps & content. Displays a selection of group clustered
tiles & a collapsible group panel. Group panel allows for navigation between
different tile groups & tile catalog navigation.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Launchpad Behavior & Interaction
Launchpad personalization can be done directly or via personalization mode. Personalization mode allows for group rearrangement & tile customization.
Activated via action sheet or floating homepage icon. Changes tile behavior & makes additional group personalization functions available.
Tile Actions Generic Actions – Settings/Move/Remove, etc. Add a tile/Move a tile/Open a tile.
Group Actions Add group/Move group/Rename group/Delete group/Reset group/Hide group.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Grid Layout
SAP Fiori utilizes the new “rem” (root em) measuring system unit. 1 rem unit = Base size of 16 pixels. Allows for predictable & consistent sizing & zoom in web browsers. UI elements based on 1 x 1 rem (16 x 16 pixels) layout grid system (3 x 3 touch area). Responsive system works across all touch-operated devices.
Fiori Responsive Grid – UI elements positioned in 12-column flow layout. Configured to display a variable number of columns, based on available screen size. Allows for flexible layouts & line breaks for small, medium, and large-sized platform screens.
1 2 3 4 5 6 7 8 9 10 11 12
Large ScreenMedium
Small
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Form Factors
Applications adhere to two different form factors to adapt to various interaction styles.
Cozy Form Factor – used for touch devices. App controls displayed w/ dimensions large enough for fingertips.
For more information visit: http://help.sap.com/saphelp_uiaddon10/helpdata/en/13/e6f3bfc54c4bd7952403e20ff447e7/content.htm
Compact Form Factor – used for mouse & keyboard-enabled devices. Screen information can be increased by reducing control dimensions. 3 rem default control area reduced to 2 rem.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Navigation
SAP Fiori follows standard web application navigation paradigms. When navigating to new screens, the user’s system default
navigation is implemented. Depending on browser settings & functionality, new screens can be accessed in
a new browser tab or new window w/ a long tap/right mouse click. Hub & spoke navigation model are combined w/ an application network model.
For more information visit: http://experience.sap.com/fiori-design/concept/navigation/
SAP Fiori’s launchpad homepage is the center for all navigation paths. Users navigate from launchpad into apps via multiple screens. Multiple apps form a process. Users can backout of apps using the back navigation function. A home icon allows for instant homepage access.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Page Layouts: Full Screen vs. Split Screen
Full screen layout allows for full width use of the device screen. Used for apps that require the full width of the screen.
Display large amounts of data, wide tables & large visualizations.
For more information visit: http://experience.sap.com/fiori-design/floorplans/split-screen/
Split screen layout is best suited when displaying & processing item lists. Best used when reviewing & processing different items quickly w/ minimal navigation. Left side of screen – quickly scan & navigate lists. Right side of screen – view selected item’s details, edit data & trigger actions.
Avoid switching back-and-forth between full screen & split screen w/ apps.
For more information visit: http://experience.sap.com/fiori-design/floorplans/full-screen/
Full Screen Split Screen
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Floorplans
SAP Fiori has several floorplans available to users: Initial Page – Used to navigate to a single object in order to view or edit it.
Single input field interaction point; relies on assisted input to quickly direct users to objects. Used when displaying one object only- use list report floorplan for 1+ objects.
Edit Page – Offers several different options for editing existing objects & pages. Used for standalone apps, full screen apps, or as part of a split screen layout format.
List Report – Allows users to utilize & take action within large item lists. Combines powerful list filtering functions w/ various item list display options. Only available in full screen layout.
Edit PageInitial Page List Report
LUKAS THIS NEEDS NEW SCREENSHOT
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Floorplans
Three additional SAP Fiori floorplans are: Object View – Either embedded in master detail app or displayed as full screen page.
Offers optimal multiple device support (simple objects or complex multi-faceted objects). Tab container allows information to be presented in different categories. Recommended floorplan display option; when editing switch to Flat Object View.
Flat Object View – Displays object information in one long scrollable page, instead of tabs. Layout remains the same in both display & edit modes. Prevents user input & validation errors from existing across multiple tabs.
Worklist – Displays collection of items that are to be processed by the user. User either has to complete a work item or delegate it to another user.
Object View Flat Object View Worklist
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori System Requirements
Application Reference Library – Library of current Fiori applications. Locate individual or group application installation & configuration technical data. View previous application data & filter by Line of Business (LoB) & roles. Navigate to related resources; Product Availability Matrix, documentation, etc.
Help Portal – Instant access to up-to-date SAP product documentation. Provides software information; installation/security upgrades/availability/integration.
Implementation Overview – Complete installation overview. Front-end installation components & Gateway services for back-end configuration & connection.
Database Requirements – Database requirements for all applications. Includes various databases including SAP HANA.
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Application Types SAP Fiori UX has three main application types:
Transactional Analytical Factsheet
Task-based AccessAccess to tasks such as create, change, or approve requests.
InsightsVisual overview of specific topic for KPI analyses (Operations insight).
Search & ExploreView important information regarding
objects & contextual navigation between related objects.
Runs on Any Database & SAP HANA(Exceptions for Financials & MRP)
Runs on SAP HANA Runs on SAP HANA
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Fiori Application Types
Approval Application – Scan through work item lists & take action. Based on split screen layout & make use of master list capabilities.
Master-Detail Application – Scan through work item lists & take action. Main tasks are creating & editing list items. Based on split screen layout & also use the master list.
Shopping Application (Collect App) – Used to browse & collect objects. Allow for more complex actions or processing. Browse objects, collect them into online shopping cart, submit orders. Comprised of three general parts: Product List/ Shopping Cart/ Checkout Steps.
Approval Application Master-Detail Application Shopping Application (Collect App)
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
All Applications+
Line of Business Industry
Roles Application Component
Back-end Product
Product Version (Front-
end)
SAP Fiori applications are being created daily & can be sorted in SAP’s Fiori Applications Reference Library by the following selections:
SAP Fiori Applications
http://sap.com/fiori-apps-library
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
http://help.sap.com/fiori_products
SAP Fiori for Request
Approvals
SAP Fiori for SAP ERP
SAP Fiori for SAP CRM
SAP Fiori for SAP SRM
SAP Fiori for SAP SCM
SAP Supply Network Collaboration, User Interface Add-On for
Purchase Order Collaboration
SAP Fiori for SAP Portfolio and Project
Management
SAP Fiori for SAP GRC
SAP Fiori for SAP Information Lifecycle
Management
SAP Fiori for SAP Master Data Governance
SAP Fiori for SAP EHS
Management
SAP Fiori for SAP Event
Management
SAP Fiori for SAP HCM
SAP Fiori 1.0 for SAP Business Suite
Foundation Component
SAP Fiori for SAP Simple Finance Add-On for SAP Business Suite powered by SAP HANA
SAP Fiori 1.0 for SAP Fashion Management
SAP Fiori 1.0 for SAP Commercial
Project Management
SAP Fiori’s newest apps & new support package stacks for existing Fiori products were released in July 2015. Current products include:
SAP Fiori Products
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Have Additional Questions?
Want to get FIORI for your own SAP applications?
Please Set Up A Consultation.
Email: [email protected]
Require A Consultation?
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
Technical project lead and ABAP architect responsible for quality in technical scope and budget in a global roll-out of SAP Logistics applications (SAP LE / LO)
Conducting multiple SAP ABAP and SAP HANA® trainings for various US companies
Implementation of a standard SAP software solution for Spend Management within SAP AG & ARIBA (annual spend volume 3 Bill. EUR) which can be used in all SAP systems
Improved claims management using SAP FS-CM which is generating annual savings of 15 Mio € for a huge German public healthcare organization
Implemented a global solution for procurement processes at BMW AG using SAP SRM / B2B
Blueprinting and implementation of SAP software for banking credit cancelations for VOLKSWAGEN
Key Achievements of Blackvard Management Consulting in Previous Projects
What We’ve Accomplished
Blackvard Management Consultants
www.blackvard.comCopyright © Blackvard Management Consulting – All rights reserved
Short Bio:
Lukas M. Dietzsch is managing director at Blackvard Management Consulting, LLC. He is holding a Master’s degree in Information Technology and is an experienced IT solution architect and project lead.
His strong background in adapting to requirements and standards in different industries and on various platforms are valuable assets for Blackvard customers.
He is repeatedly commended by customers for driving efficient solutions for complex problems in globally distributed team environments and meeting tough deadlines.
For further information please visit:
www.blackvard.com
Lukas M. Dietzsch
Copyright © Blackvard Management Consulting- All rights reserved www.blackvard.com
Managing Director
Copyright © Blackvard Management Consulting – All rights reserved www.blackvard.com
An overview of current and previous customers:
Customers That Recommend Blackvard