openSAP fiori3 Week 1 Transcript

openSAP
SAP Fiori Overview: Design, Develop and Deploy
Week 1 Unit 1
00:00:07
00:00:10
Hello, my name is Tom Reiss, product manager for Fiori,
and I would like to welcome you to the openSAP course SAP Fiori Overview: Design, Develop,
and Deploy.
00:00:17
This course will give you a basic understanding of all you need know about Fiori.
00:00:24
00:00:27
This first week introduces you to all the various aspects.
The next three weeks will give you more insights on design, development, and deployment,
00:00:31
in other words, getting Fiori up and running. The goal of this week is to give you a high-level
overview
00:00:37
00:00:40
of all the various aspects of Fiori, so that you get the big picture
of how everything fits together. In other words, after a brief introduction,
00:00:45
00:00:51
00:00:56
we'll have a look at the Fiori design. Next, we'll get a high-level architecture overview,
introducing the various technologies and tools available and how they fit together.
Unit four gives an overview of these tools, and the week ends with an overview
00:01:00
of how to get Fiori up and running. So, let's get started!
00:01:06
Good user experience is more than just nice looks, you can actually put a real business benefit
behind it,
00:01:13
00:01:20
calculate in dollars or euro, for example, gain in productivity and data quality.
Also you can, of course, save training costs and, especially if you're building your own apps,
00:01:25
00:01:28
00:01:31
00:01:35
you can decrease the number of change requests you're getting.
So if you're an IT department building apps for your business users,
by having a great experience users are going to want to change less,
they're also going to make fewer errors, and, of course, if you have better data quality,
00:01:40
you can really save a lot of money, because if you have to start changing the data
00:01:43
later in the process, it can be very expensive. And you can actually calculate, or estimate at
least,
00:01:49
the business benefits in dollars or euros for these kinds of aspects.
00:01:53
00:01:56
Of course, there's also the human value, that's of course what most people think of
when they think of user experience, so increasing user satisfaction,
00:02:00
of course, also increasing customer loyalty if customers are using them,
00:02:03
and of course also increasing solution adoption. So if you're an IT department providing
solutions
00:02:08
00:02:11
to your business users, of course you want the business users
to actually use the system, rather than having separate spreadsheets
00:02:14
00:02:19
00:02:24
00:02:26
and other solutions going on in parallel. And of course, if the system is really easy to use,
you're going to get more adoption. And that, of course, overall will help you,
as an IT department for example, strengthen your relationship
with the business units in your company. So of course, you have the increased user
satisfaction,
00:02:32
of course nowadays people expect great user experience from using mobile apps or Web
sites,
00:02:39
00:02:43
so it's the kind of expectation you have to provide a good experience, but you can also in fact
put a monetary value on the benefits of having a good user experience.
00:02:48
00:02:52
Now user experience actually, getting it right, is pretty difficult.
There are a lot of things you can do wrong and user experience can be painful in many
different ways.
00:02:56
I'm sure most of you have come across many of these over the years
00:03:01
00:03:04
00:03:08
using different applications. You can't find what you're looking for,
or information is somehow spread all over the place, or you need to scroll or find it,
go to different sub screens. Data entry's perhaps not so intuitive,
00:03:12
the relevant actions you need to do are somehow hidden, or you need too many clicks to get
stuff done.
00:03:18
You don't have very good value help, so what are the valid values you could enter there,
00:03:22
or of course, error messages are unhelpful. Of course, it's not just design aspects.
00:03:27
For example, if the system is simply slow or unresponsive, in other words has bad
performance,
00:03:32
00:03:35
that's going to be very frustrating. Of course, that's something for the technology,
the development teams to take care of. And another aspect is, of course,
00:03:40
00:03:44
00:03:48
00:03:51
unhelpful data visualization. We have, of course, today far more,
possibilities for visualizing data, let me just show you an example.
So those of you who were maybe using systems back in the '80s
might recognize this kind of a display of a table, looks very basic these days, very old,
00:03:55
00:03:59
00:04:02
and of course if someone's asking you which channel had most feedback,
you have to really scan through the table to find that kind of an answer,
in this case it's AIN in fact. So of course, these days we have far more opportunities.
00:04:06
With Fiori, for example, we've got semantic colors, so if you want to know how many units are
unplanned,
00:04:11
it's the two red ones, that's very easy to see. We've also introduced, for example,
00:04:14
00:04:19
navigation links as well, so a much richer experience. But you can go even beyond that
and what we called embedded analytics, you can, in fact, also embed charts, for example,
00:04:23
00:04:27
to help you visualize the data. So which carrier had the lowest revenue,
that's every easy to see, it's the top one with the shortest bar,
00:04:31
or which year had the highest cost, that's also easy to see,
00:04:34
or in which month did healthcare do better than the other. So with these charts, you can
actually visualize the data
00:04:39
00:04:42
for people doing their normal day-to-day work, so that's why we call it embedded analytics,
it's not for people who are kind of doing analytics all the time,
00:04:46
00:04:51
00:04:56
00:05:05
but really for people with their day-to-day work they can also interpret the data more easily
using these kind of advanced concepts of having embedded analytics for example.
So, data visualization is important. So, how to go about actually designing a good app.
Well, the approach that is absolutely essential is design thinking.
00:05:09
00:05:15
And you might have heard of design thinking but design thinking is basically very simple
from the idea, of course it can be quite demanding to do it right, but basically the main principle
is
00:05:21
that you use it to understand your end users' needs.
00:05:25
So often enough, people start looking at end users and come up immediately with a solution
proposal,
00:05:30
that's something that engineers often do, but you should start off by really listening
2
00:05:36
00:05:39
and observing and understanding what the end users want to do,
what they need to do, maybe they're even doing things
00:05:42
00:05:46
without talking about it. So understand your end users' needs.
Then of course, once you have an idea of what they need, you can start thinking about how to
solve it.
00:05:51
And here, of course, you say fail fast, fail early, so basically, rather than actually programming
out
00:05:55
00:06:00
a really sleek or good-looking prototype, just sketch it out on paper,
show it to the users, get the feedback very, very quickly,
00:06:03
is that something that could potentially fit or not, probably get feedback, some aspects might
be good,
00:06:08
00:06:11
some not so good. So sketch it out again, try again, keep iterating.
And then, as you converge gradually onto the right solutions, then of course you can start
investing more
00:06:17
in actual real, clickable prototypes, for example. And then, of course, actually go to the third
part,
00:06:22
00:06:25
start the development. But of course, only start the development
once you really are sure that user satisfaction has been confirmed.
00:06:29
So once you really know that the user is behind what you're doing, then you actually start
developing.
00:06:34
And of course, that's a great way of making sure the users are happy and, of course, you use
your time
00:06:39
00:06:44
00:06:50
00:06:55
and investment most effectively. So, that's how to design a good app.
But what if you have to do hundreds of apps? Well basically, of course, users will have
a whole load of expectations if they have to use tens, hundreds of apps.
So they want, of course, consistency, so both the visual consistency,
00:06:58
that it all looks the same kind of colors and font and so on,
00:07:01
00:07:06
but also interaction consistency, so when you're using a table, sorting a table,
it's always done the same way. Of course they want to be able to access the apps easily,
00:07:10
00:07:14
00:07:18
00:07:20
so you want to find the apps you want to use and access them very easily
and, of course, also have navigation between the apps. So if you're looking at a sales order
you want to maybe navigate to the products or the customers and so on,
so that's what users would expect if you've got many, many apps to use.
00:07:24
00:07:28
00:07:34
And of course, also users would expect to be able to access common functions everywhere,
so for example, search or notifications should always be accessible the same way.
And so that's why if you want to scale, to provide a good user experience for hundreds of
apps,
00:07:40
00:07:45
00:07:52
you need a design system. So basically, the design system allows the user experience
to scale across many apps and many products consistently, and also, of course, not just
the apps and products but also for various technologies, so desktop, for example, and also
mobile.
00:07:58
00:08:02
00:08:06
00:08:08
So the key or the cornerstone, of course, is having a design system.
Now of course, once you get to development, obviously you want to have some means also
of scaling your development if you're building hundreds of apps,
so you need software frameworks and libraries, of course. And if you want to show the users
hundreds of apps,
00:08:14
you need some kind of user experience integration run time, like a central entry point,
00:08:19
and also provide navigation services so that you can navigate between the apps.
3
00:08:24
00:08:27
And then finally of course, if you're actually implementing
these hundreds of apps for business, you've got maybe hundreds or thousands of users as
well,
00:08:32
00:08:39
00:08:43
so you have to look at authorizations, and who is allowed to see what.
So of course, we need also tooling to get SAP Fiori up and running efficiently.
And of course, SAP provides all of this, so with Fiori we have a design system,
00:08:46
00:08:50
we have, of course, development tools, frameworks, and libraries,
and, of course, also tools to help you get it up and running. So, SAP Fiori is the user
experience for SAP,
00:08:58
for all of our products. And it really is the sweet spot where we bring in
00:09:02
00:09:05
the business value, which of course has always been the focus and strength
of SAP supporting your business processes, with, of course, modern technology,
00:09:10
also something we've always been doing, but we've, with Fiori now, the last 10 years or so,
00:09:15
00:09:19
00:09:23
really been focusing on the people as well, the end user, user-centered design.
And bringing all three together really gives you this sweet spot of great user experience
that helps your business and helps people work effectively.
00:09:27
So we have the user-centered design approach, we have design-driven development, so first
of all
00:09:31
00:09:37
00:09:39
we have to make sure we've looked at or interviewed end users, done the design,
and then do the development. And we have the one user experience
across all of the SAP solutions. So, the Fiori design system,
00:09:45
basically, we're now actually evolved to Fiori 3, it's a new target designed for all of our
products,
00:09:51
so it's an evolution of the SAP Fiori design language to support the intelligent suite
consistently.
00:09:59
So it's user centric, so Fiori always is role based, so basically depending on the roles you have
in the company,
00:10:04
00:10:09
you see only the apps relevant for you. Personalized as well, so you can personalize
the layout and so on, and also simplified, so these are always simple apps
00:10:13
that are very easy to use. We've also, as part of the design system defined the look,
00:10:18
00:10:21
so the visual design, the theme, but also things like dimensions, break points,
so if a screen gets smaller, where do things start moving around?
00:10:26
Also the fields, so the motion design, if we have animations, interactivity, and so on,
00:10:30
00:10:34
is part of the design system, as are controls and floor plans.
So basically, if you have common things like tables or lists for example, or if you're looking at
an object,
00:10:39
what does that look like, or components, so date picker,
00:10:42
00:10:46
these kinds of things, buttons, these are also part of the design system,
and also the design system specifies that we have certain common functions
00:10:49
00:10:56
so it should be available everywhere, like for example search.
So I've already mentioned that we started a few years ago with Fiori,
00:10:59
00:11:04
00:11:09
so back in 2013 we actually came up with the very first Fiori apps,
for sort of casual users, self-service use cases, so not so much for desktop users,
maybe people wanting to post their leave request or managers doing approvals.
00:11:14
00:11:19
Then in 2016, we introduced the next major step with Fiori 2.0,
starting with more powerful patterns also for desktop users.
4
00:11:24
And since then we've extended with a partnership, we started with Apple three of four years
ago, with iOS,
00:11:31
00:11:36
and then also, now, last year started with Android to support native use cases,
so we don't just have Fiori as a Web UI with HTML5, but we can also have dedicated use
cases,
00:11:42
where people are on the road all the time and they need a tool to do their work,
00:11:46
00:11:50
00:11:55
all the time, maybe even offline, then, of course, you want to use native apps,
so we also have Fiori for iOS, Fiori for Android, and we've also started introducing
conversational user experiences with CoPilot, and I'm convinced, actually, this is going to be
00:12:00
one of the next big things in user experience, actually having a natural language interaction
00:12:04
00:12:09
with the system as well as, of course, the visual aspects. And so with Fiori 3 we've brought
all these innovations together into one design concept, and also extended that, so focusing
very much on consistency
00:12:17
00:12:21
also on integration, so integrating the various products that we have
and, of course, also intelligence, so has surfacing, machine intelligence, machine learning,
00:12:26
00:12:29
and helping the user, or basically having the machine guide the user,
help the user, get their work done more effectively. So that's basically, in a short nutshell if you
like,
00:12:35
00:12:42
00:12:45
an overview of the user experience with Fiori. In this unit, we've seen how important
a good user experience is, and how SAP Fiori is the design system
for providing a great user experience for the Intelligent Enterprise
00:12:49
In the next unit, my colleague Tillman Swinke will give you an overview of the SAP Fiori
design.
00:12:55
Thank you and goodbye.
5
Week 1 Unit 2
00:00:07
Hello and welcome to the openSAP course SAP Fiori Overview: Design, Develop, and Deploy.
00:00:13
Week one, unit two, Designing a Great User Experience. My name is Tillman Swinke
00:00:19
00:00:25
00:00:29
00:00:35
and I will be guiding you through the design part of this course as one of three presenters.
In this week I want you to get a brief overview of what's coming your way
when we talk about design, UX design, and design systems in regard to Fiori 3.
Let's get right to it. As you might know already,
00:00:41
SAP Fiori is the design language for all SAP products. SAP Fiori 3 is our new target design,
which evolves SAP Fiori,
00:00:50
00:00:55
to fully support the intelligent suite. It does this by holistically including
natural language interaction, machine intelligence, and analytical insights,
00:01:00
while also providing more flexible, personalizable home pages and page layouts, running on
any device.
00:01:08
You will see examples of this later in this presentation. Especially in the corporate
environment, you seldomly
00:01:17
00:01:21
00:01:28
00:01:33
have just one application. Normally you have a lot of business applications
for complex business scenarios, produced by several UX designers for multiple platforms.
In this enterprise environment, you want to make sure that all the applications look alike
and can be used the same way, so not every employee has to learn every application.
00:01:39
00:01:44
00:01:50
To ensure this, we use a design system that consists of values, principles,
and practices like design standards. This design system is then broken down
into several design languages that feature several platforms like Web, native, and
conversational.
00:01:57
We will look at them in a few moments. The SAP design system relies on five core design
principles.
00:02:06
00:02:11
Role-based. Every application is being designed for a specific role.
If two different roles need one in the same application, there will be two applications available,
00:02:17
each specifically for one role. Adaptive, this principle makes sure
00:02:22
00:02:27
that you can consume applications you need to fulfill your job, everywhere,
on any platform, and on any device. Just showing the amount of information that you need
00:02:33
00:02:39
in that moment. Simple, only what's needed for your immediate task
is being designed in the application that you will see. Everything else is being considered
clutter
00:02:45
and will not be on your screen. Coherent, whether you are requesting a day off
00:02:51
00:02:57
or change a price in the product catalog. Fiori ensures there is a consistent visual design
and interactions throughout your entire enterprise landscape.
00:03:01
Delightful, this one is particularly important for UX designers,
00:03:06
that the screens have to be delightful. Your goal is to get your job done, not work with UI
screens
00:03:12
00:03:21
or even get annoyed by them. The heart and soul of SAP Fiori are the design guidelines,
which are available publicly. They not only cover the Web design part of Fiori
00:03:26
but also offer mobile versions for iOS and Android, and a special version for conversational
UX.
00:03:35
Let's take a peek and see what the guidelines have to offer here.
6
00:03:44
We'll be looking at the Web part of the SAP guidelines. Make sure that you look at the Get
Started section,
00:03:54
00:03:59
00:04:05
00:04:10
just to make yourself familiar with all the general concepts here,
for instance the SAP Fiori launchpad. You can find a lot of information on all the components
of the launchpad in here. The Explore SAP Fiori section
will give you a more visual way and overview of the layouts, floor plans, frameworks, and the
UI elements of Fiori.
00:04:18
00:04:23
In the Services and Resources section, you can download all the design stencils,
the fonts, and the icons, for instance the SAP Fiori launchpad.
00:04:34
In Fiori 3 there are some things that have changed. There is now a common header bar for all
the SAP products.
00:04:43
The company logo now is also the home button. So you don't have two buttons anymore but
just one.
00:04:48
The home navigation offers quick access to all the apps on the home page or specific groups
00:04:55
00:05:00
00:05:06
The users action menu is now integrated with the users image on the right side.
And all the common functions like help, CoPilot, and the enterprise search are also located
in the upper-right corner. With spaces, Fiori 3 gives the ability
00:05:13
to create central or line-of-business-specific entry points, from where the user can gain first
insights
00:05:21
and then drill down fast through multiple levels of navigation
00:05:25
to exactly go to the point where he needs to go. Here you can see the four most common
00:05:33
00:05:37
floor plans used in SAP Fiori. Floor plans can be seen
as pre-configured screen distributions. They are used over and over again, so the users are
getting used to them
00:05:44
and recognize them immediately. Additionally, those four floor plans
00:05:49
00:05:53
00:05:58
00:06:06
that you will see on the left are available as SAP Fiori elements,
a template-based development tool that can generate apps from data services.
You will hear more about SAP Fiori elements in the development section of this class.
SAP Fiori 3 also holds the opportunity to include machine intelligence in your environment.
00:06:12
For example, a concept called "situations" can gather information in the background
00:06:17
00:06:23
and detect possibly critical situations. After the user has discovered that situation,
a human-readable summary explains why this situation is critical.
00:06:27
And concepts like "ranking" and "comparison" then help the user intelligently solve
00:06:32
00:06:41
00:06:47
the challenge before it happened. In the past you had either transactional scenarios
or analytical scenarios. Embedded analytics combines exactly those two.
With the SAP HANA platform, it is now possible to quickly go through
00:06:51
large amounts of data and access real-time data also in combined scenarios.
00:06:57
00:07:01
00:07:06
With this real-time data, the system can provide clever suggestions and key insights
right when the user needs it. Right when he needs to make a decision,
so he does not need to leave his context. Patterns like analytical cards on the overview page
00:07:12
00:07:18
or the analytical list page floor plan will help you to build scenarios
that rely on embedded analytics. Now you have seen a lot of pictures.
00:07:26
00:07:31
Let's have a look how all this looks alive and kicking in a demo.
I'm logged in here as a buying procurement. Let's first look at the overview page.
00:07:36
The powerful pattern provided by S/4HANA. This gives you an overview of what needs your
attention.
00:07:43
Here you see, for example, purchase contracts that are about to expire.
7
00:07:48
Or purchase order items in approval. Unsourced requisition items as well as further
information.
00:07:55
You can personalize the overview page yourself. You can choose filter parameters as you
need them
00:08:03
00:08:11
and you can also adapt the size and the layout of the cards.
Let's see how you can drill down to details. By clicking here on this contract in the card,
00:08:19
00:08:24
00:08:28
I go to the contract of Polaris Brakes and see how the object page looks.
As you see we have a header up here and below, the contract section.
This object page features, in addition to textual information, also graphical information where
appropriate.
00:08:34
If you scroll down, you notice that the header collapses and sticks to the top, so it's available at
any time.
00:08:41
If you click the links in the collapsed header section, you'll be taken to the corresponding
section
00:08:45
00:08:50
on the object page. Going back to the overview page,
the next pattern you will see is the analytical list page. If we click here on the header of the list
card,
00:08:57
we get to a list of purchase order items. This analytical list page is equipped
00:09:05
00:09:09
00:09:15
00:09:20
with filter parameters that you can also switch to an analytical filter mode.
Let's select overdue items here and this will filter down the entire page.
You can also navigate in the list down here or in the graph in the middle.
Let's choose the Continental Tyre, and you can see that the list below still shows eight items.
00:09:27
Up here you can change the visualization of the data to a table view, chart view, or choose the
joint view.
00:09:34
If you need more space, you can collapse the header and you can change the layout from the
column chart to a heat map,
00:09:40
00:09:46
00:09:55
00:10:00
where you can see what kind of material is involved in this case.
Here you can filter as well for Continental Tyre and get the same eight results as before.
You can see that the overview page, the object page, and the analytical list page
are very powerful patterns that are provided in S/4HANA to get your work done more easily.
00:10:10
00:10:15
00:10:23
As you have already seen in the last slide and in the demo, the three main pillars
of the SAP Fiori 3 target design are consistency, intelligence, and integration.
Consistent means that all applications look and feel the same way,
00:10:27
00:10:32
00:10:38
no matter in which product of SAP you are. Intelligent implies that there is the
right amount of content at the right time, combined with intelligent features
like user guidance, situation handling, and a digital assistant.
00:10:43
Integration is represented by a central entry point across all products,
00:10:48
00:10:52
00:11:03
00:11:07
featuring content from different systems, and of course central features
like the task list and notification, and so on. Let's take a first look at consistency.
The new theme, called Quartz, comes in a light and a dark flavor,
and is already prepared for all the changes that you have seen so far.
00:11:12
00:11:17
It provides a harmonized look and feel for all the products of SAP.
It already features the new common shell bar that holds common functions like settings and
CoPilot.
00:11:23
It is consistent regarding terminology and the placement of actions,
00:11:27
00:11:33
so it is easy for users to remember where to click. It is also designed to make SAP products
more accessible for everyone. To make absolutely sure that SAP Fiori 3 is consistent
00:11:42
in regards of fonts, throughout all devices and platforms, SAP created their own font.
8
00:11:48
72 is the default font for all SAP Fiori applications. Fun fact here - the font is named after the
founding year of SAP, 1972,
00:11:58
and was recognized with a red dot design award in 2018. The most important innovation
regarding the consistency
00:12:09
00:12:14
is the new unified shell header. On the left side, you can see various versions
of shell headers from SAP products. Some of those don't even look remotely similar
00:12:19
00:12:23
00:12:32
to each other. And on the right side, you can see the new SAP Fiori 3
shell header that will be used for every SAP product. Here you can see some examples
for the new SAP Fiori 3 screens. On the left side,
00:12:36
examples for applications within S/4HANA, and on the right side for some other SAP products.
00:12:44
00:12:48
As you can see clearly, it not only looks consistent
but via the common shell header, the general functions are aligned as well.
00:12:56
00:12:59
In the next unit, you will learn about the architecture overview
presented by Thomas Reiss. Thank you and goodbye.
9
Week 1 Unit 3
00:00:07
00:00:12
00:00:16
00:00:20
00:00:26
Hello, my name is Tom Reiss, product manager
for Fiori. In the third unit of week one, Architecture
Overview,
of the openSAP course SAP Fiori Overview: Design, Develop, and
Deploy,
I would like to give you a high-level overview of the Fiori architecture,
00:00:38
00:00:47
and introduce the various technologies and tools available to you and how they fit together.
To start with, I'll give you an overview of the
runtime, that is, how the Fiori UIs are connected
to the back-end systems. Next, we'll look at which tools are available to
help you
adapt the standard SAP UIs. And finally, we'll have a look at the development
tools
you can use to develop your own apps. I'm going to build this up step by step,
so let's start with Fiori running in a Web browser on a desktop, a tablet, or a smartphone.
00:00:52
The blue boxes represent UI clients, in this case, the Web browser.
00:00:56
The golden-colored boxes represent the
technologies used, in this case, we have the Fiori launchpad
00:01:01
as the single entry point for users, and our frameworks for efficiently building Fiori
apps,
SAPUI5 as the powerful HTML5 JavaScript
framework providing maximum flexibility,
and on top of that, the SAP Fiori elements for
very efficient, low-code development for typical business use
cases,
such as working on lists of objects, or on individual business objects.
00:00:30
00:00:34
00:01:06
00:01:12
00:01:21
00:01:26
00:01:33
00:01:42
00:01:48
00:01:55
00:02:01
00:02:09
These tools access application data from the
back-end system, using the standard internet protocols HTTP and
OData
for reading data as well as for making updates. We also offer Fiori for iOS and Fiori for
Android,
in other words, native versions of the Fiori design
language. These apps get integrated to the back-end
system
via SAP Cloud Platform Mobile Services, and also access the back-end system via
OData services.
This is what it looks like for Fiori apps. Let's now extend this to look at how the classic
UIs
such as SAP GUI and Web Dynpro fit into the
picture. If you have an SAP S/4HANA or SAP Business
Suite system
as your back end, then we advise that you give
your users access to the so-called classic UIs,
00:02:14
that is SAP GUI for HTML or Web Dynpro, via the Fiori launchpad running in a Web browser.
00:02:20
For S/4HANA, the classic UIs will run in a
browser on tablets as well as on the desktop,
connected to the back end using HTTP. These classic UIs have the Fiori theme applied
to them,
00:02:25
00:02:31
00:02:35
so that all the apps in the launchpad have the
same theme, providing a harmonized look
across Fiori apps and classic UIs. Returning to the Web-only view for Fiori apps,
10
00:02:44
most of you will have heard that you need some
kind of Web server to provide Web applications,
00:02:49
00:02:56
so where is the Web server in this picture? Let's zoom in and have a look.
The SAP Fiori front-end server acts as the Web
server for SAP Business Suite or SAP S/4HANA backends,
in fact for all ABAP-based on-premise systems. As you can see at the top,
the Fiori launchpad and Fiori apps are built with SAPUI5 and Fiori elements,
frameworks based on HTML5 and JavaScript. When a user starts the Fiori launchpad,
the browser loads the various UI components
and libraries from the front-end server.
These then read UI data from the front-end
server to understand which roles the user has,
and how the user has personalized their user
experience, that is launchpad personalization
but also personalization of each of their apps. Finally, the launchpad and the Fiori apps
access the back end using OData services provided by SAP Gateway,
a component included in the front-end server. The front-end server is depicted here
00:03:01
00:03:06
00:03:11
00:03:16
00:03:20
00:03:25
00:03:29
00:03:35
00:03:39
00:03:44
as an add-on to the back-end system, which is the recommended deployment option
for S/4HANA.
00:03:49
00:03:53
However, you can also run it as a stand-alone Web server for Fiori.
In both cases, the SAP back-end system has a
small enablement component for managing the communication with SAP
Gateway.
Finally, for security, we have the SAP Web Dispatcher
in front of the front-end server, as the entry point for access from the internet.
Extending this to include native mobile Fiori
apps, you see that the Cloud Connector manages the
secure
connection to the SAP Cloud Platform Mobile
Services. So far, we have looked at one Fiori launchpad
00:04:00
00:04:04
00:04:11
00:04:16
00:04:23
connected to one back-end system. What are we planning in cases where you need
00:04:27
to access more than one back-end system? The vision we have is to enable customers to
provide
00:04:35
their users with one central entry point in the
cloud, so that users can access all their apps
on all their systems from there. The goal is to provide this SAP Fiori launchpad
in the cloud with seamless integration to SAP
products, be they in the cloud or on-premise,
so that users can launch apps from any of these products from within the
launchpad,
and navigate between them as needed. Furthermore, this central launchpad will provide
central services such as SAP One Inbox,
notifications, single sign-on, so that they have only one logon
and only
one place to look for tasks, work items, and
notifications, rather than having to log on to many different
systems.
We expect first versions to be available later this
year. Let's now have a look at the tools
available to you to adapt the standard UIs from
SAP. First, let's return to the simplified overview
00:04:40
00:04:45
00:04:50
00:04:54
00:04:59
00:05:06
00:05:13
00:05:20
11
00:05:27
for Web and native mobile Fiori apps, and see which adaptation tools are available for
these.
00:05:35
00:05:41
Two adaptation tools are available, the UI theme designer and UI5 flexibility.
With the UI theme designer, you can quickly and easily change the colors
used by Fiori
and replace the SAP logo with your own
company logo. In other words, the UI theme designer allows
you
to apply your corporate branding to the Fiori
theme. UI5 flexibility allows you to adapt Fiori apps.
00:05:46
00:05:51
00:05:59
00:06:05
00:06:11
00:06:19
00:06:24
00:06:30
00:06:37
00:06:41
00:06:46
00:06:52
00:06:57
00:07:00
Admins and key users can centrally change
apps by, for example, hiding fields or rearranging
them.
End users can use UI5 flexibility to personalize
their apps, for example by storing selection variants,
or by defining which columns to show in tables. So, what about adaptation of classic UIs?
If we extend this to include classic UIs, we see that the UI theme designer can also be
used.
In other words, the UI theme designer enables
you to apply your corporate branding to the SAP
Fiori experience
for both Fiori apps and for the classic UIs. In addition, SAP Screen Personas is a powerful
tool
for simplifying classic UIs. If some of the classic UIs do not provide the
level
of usability demanded by your end users, you can go quite a long way to meeting their
needs
by using SAP Screen Personas to improve their
user experience. For example, you can provide one screen
combining
the typical SAP GUI selection screen and the resulting application screen.
In the application itself, you can hide fields that you don't need
and even combine fields from multiple tabs into one single, simple screen.
00:07:08
If you want to go beyond the standard SAP
applications, you'll need to develop your own Fiori apps.
00:07:13
For this, we also provide a collection of powerful
tools to make this easy for you.
Let's start again with the Web-only runtime
architecture, and look at the development tools
for Fiori apps running in a Web browser. Those of you already familiar with Fiori
will know that we provide an integrated development environment (IDE) in
the Web,
which we call the SAP Web IDE, for building
Fiori UIs. The SAP Business Application Studio is the
next generation
of Web-based IDE for building Fiori UIs, supporting the whole lifecycle, and making
development easy,
00:07:19
00:07:23
00:07:29
00:07:34
00:07:42
00:07:48
00:07:54
00:08:02
and also running on the SAP Cloud Platform. As a plug-in to that, we offer SAP Fiori tools,
which provide additional benefits for developers leveraging SAP Fiori elements.
For developing native mobile Fiori apps, the SAP Cloud Platform Mobile Services
00:08:06
provide a mobile development kit as a plug-in for the SAP Business Application Studio, with
which you can
00:08:11
code once and create native apps for both iOS
and Android. Alternatively, you can use our
12
00:08:16
00:08:26
Fiori SDKs for Android and for iOS in Android Developer Studio and XCode
respectively.
Anyone who has programmed apps will know
that the UI is only half the story,
you also need to be able to read and write data in the back-end system.
00:08:30
Here we also provide powerful tools to make your life as a developer easier,
00:08:35
00:08:41
RAP and CAP and CDS views. In a nutshell, CDS views allow you to model
your application data stored in HANA, and RAP
and CAP provide powerful programming models and
generated code
on top, to create OData services for Fiori apps. The ABAP RESTful Programming Model, RAP,
for S/4HANA,
00:08:23
00:08:48
00:08:55
00:09:06
00:09:11
00:09:17
00:09:24
00:09:29
00:09:35
00:09:43
00:09:50
00:09:56
00:10:03
00:10:10
00:10:17
00:10:23
00:10:26
00:10:33
00:10:37
00:10:43
00:10:48
and the Cloud Application Programming Model,
CAP, for apps using the SAP Cloud Platform as a
back-end system.
The next big thing in user experience will be
leveraging natural language interaction, in other words
chatbots,
and integrating these into the overall user
experience. SAP Conversational AI is our chatbot
technology,
which comes with a constantly evolving bot-building platform.
Let me wrap up with a summary of the types of
adaptation and development tools available to you.
Starting from the top, the SAP Business
Application Studio is our powerful and integrated development
environment.
For Web apps, SAPUI5 is our development
framework for enterprise grade apps using HTML5 and
JavaScript.
For rapid UI development, we provide SAP Fiori
elements on top of SAPUI5, and the SAP Fiori tools plugin
to the Business Application Studio. For rapid OData service development, we provide
the RAP
and CAP programming models on top of CDS
views. For native mobile apps, we provide the SAP
Cloud Platform
Mobile Services along with the various
development kits. SAP conversational AI enables a conversational
user
experience using natural language interaction. For adapting or extending SAP apps,
you can use UI5 flexibility for Fiori apps and SAP Screen Personas for classic UIs.
The UI theme designer can be used for all of these UIs to apply
a corporate branding to the Fiori user
experience. We started the unit by looking at the run-time
architecture,
and then looked at development and adaptation
tools for these two scenarios,
developing new Fiori apps and adapting or extending SAP UIs.
That now concludes this unit. The next unit will give you high level insights
into each of these development and adaptation
tools. Thank you and goodbye.
13
Week 1 Unit 4
00:00:03
00:00:10
Hello, and welcome to week one, unit four of our openSAP course, SAP Fiori Overview.
In the last unit, you saw high-level architecture, how all the pieces in our UX portfolio fit
together,
00:00:17
and how they combine to deliver a great user experience. This week, we're going to go
through
00:00:22
00:00:28
some of those components in detail, and I'll offer you some guidance on when to use which.
We'll come back to these topics again in week three. So far, we've talked about the SAP Fiori
experience
00:00:35
00:00:40
00:00:47
and why it matters. In other words, we've covered what and why.
In this unit, we're going to introduce the how. As with many situations in SAP,
there are several options. We'll talk about how to identify your situation
00:00:51
00:00:57
00:01:03
and choose the shortest and lowest-risk path to the SAP Fiori user experience.
We'll cover all the boxes on this grid, but mostly focus on the ones for developing new apps,
which comprise the right side of the diagram. Before you build an app, you should check to
see
00:01:11
00:01:17
if one already exists that does what you need. The SAP Fiori app reference library includes
all the Fiori apps that SAP provides out of the box. The nice thing is you can search for what
you need
00:01:23
based on industry, line of business, or individual role. You can also search based on whether
you're running ECC
00:01:32
00:01:38
00:01:42
or S/4HANA, as well as what your underlying database is, if you're on ECC.
Your answers determine how many Fiori apps are available to you.
The general range is hundreds for ECC systems and thousands for SAP S/4HANA systems.
00:01:50
We'll cover how to download and deploy these apps in the next unit on deploying SAP Fiori
apps.
00:01:57
00:02:02
If one of these apps that you download doesn't meet your needs, we have tools that allow you
to modify them to do exactly what you want. For simple changes, SAPUI5 for key users
00:02:11
provides a non-coding option, where a key user can hide fields or move information around on
the screen.
00:02:18
00:02:22
For more extensive changes to an app from the Fiori app reference library,
you can use our development tools to extend the functionality or fine tune the appearance.
00:02:28
As you move towards becoming an Intelligent Enterprise, it's very likely that you'll need to build
your own apps
00:02:34
00:02:43
to address your unique business needs. This will be the focus for the majority of this unit.
To build any app, you need a development environment, often referred to as an IDE,
00:02:48
or integrated development environment. SAP has its own IDE,
00:02:53
00:03:01
optimized for building SAP Fiori applications. This is SAP Business Application Studio,
the next generation of Web IDE. The app studio is a modular environment
00:03:08
tailored for efficient development to business applications for the Intelligent Enterprise.
00:03:13
It offers a growing set of turnkey solutions based on dev spaces, which are isolated virtual
machines
00:03:21
00:03:26
in the cloud where each solution comes prepackaged with runtimes and tools
that are suited for a specific application, such as the Fiori user experience,
00:03:32
S/4HANA extensions, and more. This saves you days of setting up tools
00:03:38
and handling dependencies, allowing you to focus on your business domain.
00:03:45
SAP Business Application Studio simplifies end-to-end development,
14
00:03:50
00:03:56
develop, test, build, run, and deploy. Its desktop-like experience
provides fast development cycles. You can install runtimes and tools, run scripts,
00:04:02
00:04:09
and access the shell through the command line. Its experience is familiar with leading IDEs,
which makes you feel right at home as soon as you start using it.
00:04:13
SAP Business Application Studio is available on SAP's multi-cloud environment.
00:04:18
00:04:22
00:04:29
All you need is a browser. There's no need to install any software
on your local machine to develop SAP Fiori apps. If you do prefer to use a local IDE,
SAP has tools that work in that environment too. When you're building apps, it's critically
important
00:04:37
that users have the same experience across all their devices.
00:04:42
SAPUI5 is a framework that includes libraries and controls, or UI elements, that developers
use to build
00:04:49
responsive Web applications. The prebuilt UI elements allow you to create
00:04:55
the SAP Fiori experience, including some controls that are automatically configured by
annotations
00:05:02
00:05:08
to data on the back end. This gives you complete flexibility to create apps
that can meet any of your business users' needs. A common set of controls helps deliver
00:05:13
a consistent user experience by sharing a common foundation. With SAPUI5, you can write an
application once
00:05:22
00:05:28
and have it adapt to the device, rendering perfectly, regardless of the screen size.
The UI built with SAPUI5 is independent of the platform you're using it with,
00:05:34
00:05:39
00:05:48
whether it's on premise or in the cloud. The UI connects via an OData service
to consume data from that respective platform. While SAPUI5 gives you ultimate flexibility
in building Web apps, sometimes you need to build many apps that look similar in a short
timeframe,
00:05:55
often with multiple, globally distributed development teams. This is where SAP Fiori elements
comes in.
00:06:02
00:06:10
In a nutshell, SAP Fiori elements is a library built on top of SAPUI5.
The main idea behind SAP Fiori elements is that the content of the screens is generated at
runtime
00:06:16
based on metadata coming from the back end. This means very little code, and sometimes no
code
00:06:23
that's required for standard apps. SAP Fiori elements is a collection of several common page
00:06:31
types that give you a head start on developing applications that connect data in SAP back-end
systems.
00:06:39
00:06:47
These five basic page types cover 80% of the scenarios typically found in SAP applications.
We use this approach internally to build apps for SAP S/4HANA.
00:06:52
The diagram illustrates the typical flow for a user, where you start at the launch pad, go to an
overview page,
00:06:59
00:07:06
see some sort of list of objects that eventually links to details on an object page
or a nested set of object pages. For some situations, you might go directly
00:07:11
from a tile on the launch pad to a list report or potentially even directly
00:07:18
00:07:26
to an object page. Using this set of basic page types ensures that the apps
you build are consistent in how they look and behave. Since the user experience is defined in
terms of
00:07:33
the page layout, navigation, and format of the controls, you can develop apps much more
quickly
15
00:07:40
than coding each of these UI5 elements manually. This means you can scale across your
organization
00:07:47
00:07:53
00:07:59
00:08:03
by building dozens or even hundreds of SAP Fiori apps that look similar, even if they're built
by different development teams. Like SAPUI5, on which Fiori elements is based,
you start with an OData service. We'll talk about what this is later,
and again in week three. With SAP Fiori elements, you generate a standard app
00:08:09
00:08:16
and then use metadata annotations to modify it to suit your needs.
While SAP Fiori elements reduces the amount of code developers need to write, SAP Fiori
tools
00:08:23
aims to simplify the app development process even further. SAP Fiori tools is a collection of
productivity tools
00:08:31
00:08:37
that make software developers more efficient when developing SAP Fiori apps.
SAP Fiori tools is an extension to Visual Studio Code or SAP Business Application Studio.
00:08:45
If you're creating software on one of these development environments, SAP Fiori tools
provides shortcuts
00:08:51
00:08:58
to common functions involved in writing or modifying SAP Fiori apps.
An integrated experience sets the foundation for a successful project.
00:09:04
00:09:09
SAP Fiori tools helps you define your project requirements at the beginning of the project,
gives developers an efficient and effective development experience, and enables continuous
improvement
00:09:15
via application monitoring. SAP Fiori tools provides developers with guided help,
00:09:21
00:09:27
00:09:32
code snippets, and integrated application generation in preview to make them more efficient
when developing SAP Fiori apps. Integrated modeling capabilities let you leverage
the advantages of a metadata-driven development process, which is how SAP Fiori elements
works.
00:09:41
00:09:47
Annotations are metadata that define properties or relationships in your data.
One quick example of an annotation might be a number and description that are related to
each other,
00:09:52
such as always displaying the value of a quarter associated with its associated currency.
00:09:58
00:10:05
00:10:14
00:10:20
So, the quantity 989 and the unit dollars would always appear together.
Annotations allow you to give your application the functionality and appearance you need.
We mentioned OData services is the starting point for SAPUI5 and SAP Fiori elements apps.
This is also the data source for native mobile apps. With SAP S/4HANA, there are many
OData services
00:10:27
00:10:32
available out of the box from SAP. If you need to build your own,
we have two main options, depending on whether you're planning to develop on SAP Cloud
Platform
00:10:38
or using ABAP. Regardless of whether you choose the Cloud Application Programming Model,
00:10:44
00:10:51
also known as CAP, or the ABAP RESTful programming model, known as RAP,
you can connect your back-end SAP data source and use the resulting OData service as the
foundation
00:10:57
00:11:03
00:11:08
for your SAP freestyle app, Fiori elements app, or native mobile app.
Each of these two frameworks consists of concepts, technologies, and tools,
providing support for developing enterprise-grade, OData-based services and applications,
00:11:14
either as extensions or new software. We'll go into more depth about CAP and RAP in week
three,
00:11:21
and show you how to create an OData service using these powerful tools.
16
00:11:28
00:11:33
While the ability to run your app on any device gives you lots of flexibility,
sometimes people who work remotely, such as sales, field service, or maintenance workers
00:11:40
need a user experience on their mobile device that can only be provided by a native mobile
app.
00:11:47
Some examples include if your users are mobile by nature, so your app is an integrated part of
their daily workflow.
00:11:54
00:12:00
00:12:05
Or people use their app as their main workplace, such as if they don't have a fixed office.
Mobile apps are great when the application needs to cover heavy offline scenarios.
Maybe you have some large data sets that need to be available for offline usage and
manipulation.
00:12:11
00:12:17
Or your employees work in areas with poor network or non-existent network coverage.
Another place where native mobile apps shine is when people need to use the app frequently.
00:12:21
And we're not talking about every week or every month, we're talking daily or several times a
day.
00:12:28
00:12:34
00:12:40
Finally, consider native mobile apps if your users need an app that covers key workflows
that need to be performed fast. That is, it would significantly slow down the users
if the app was slow or laggy. You don't want frustrated users.
00:12:49
00:12:53
Native mobile apps have a few distinct advantages over browser-based apps.
They provide a native look and feel that's sometimes difficult to replicate using a mobile
browser.
00:13:00
Also, they can access native device capabilities, such as the camera or GPS.
00:13:05
00:13:12
00:13:21
We often see these used in warehouse, plant maintenance, and field service applications.
These scenarios benefit from a dedicated mobile app. As always, SAP has options.
With the SAP Cloud Platform SDK for iOS, the SAP Cloud Platform SDK for Android,
00:13:28
00:13:34
and a mobile development kit that can develop code to run on either platform.
The NDK is built on top of the iOS and Android SDKs. Again, we'll go into more depth about
mobile development
00:13:43
in week three of this course. Earlier, we mentioned you don't always need to build an app
00:13:49
00:13:56
00:14:00
00:14:06
to provide the SAP Fiori experience to your employees. If there's not an app in the SAP Fiori
reference library to fill your requirements, perhaps the functionality of what you need
exists in the form of an SAP GUI transaction. But the transaction doesn't meet your needs
because it's hard to use, the screen is too cluttered, or the business process takes too many
clicks.
00:14:12
This could be the case in either SAP S/4HANA or ECC. If this is your situation, then SAP
Screen Personas
00:14:21
might be the right solution for your needs. Consider the example on the screen of a classic
00:14:26
list transaction, VAO5
to search sales orders. You start with a search transaction on one screen
00:14:33
00:14:38
and the results on another. If you need to search again, you have to toggle
back and forth across these two screens. The simplified screen on the right,
00:14:43
built in less than an hour, puts the search and results on a single screen using the Fiori
experience.
00:14:50
00:14:57
We've even added a chart that shows visually the results of your query.
Screen Personas allows you to simplify and modernize SAP GUI screens and convert them to
Fiori apps
00:15:04
00:15:10
that run on any device, all using a drag-and- drop, what-you-see-is-what-you-get editor
that runs in your browser. We'll demo this in week three to show you how easy it is
17
00:15:15
to create a simplified version of SAP GUI transactions. SAP Screen Personas delivers the
complete viewer
00:15:22
user experience, since you can build screens for each role, apply the built-in Fiori themes,
templates, and styles,
00:15:29
00:15:37
embed these simplified screens, which we call flavors, into your Fiori launchpad.
Bringing together all the ways to create the SAP Fiori experience in a browser, here's some
guidance.
00:15:44
00:15:48
If you need a mobile app, skip this decision tree and jump straight into one of the
mobile app development tools that we just discussed. First, start by understanding your users'
needs.
00:15:55
00:16:00
This is a key part of the design process that we covered in the earlier unit.
Then determine if they need an app for an existing business scenario or something new.
00:16:05
If there's an app available that meets their exact needs, download it.
00:16:09
If it's pretty close but needs a little bit of adjustment, you can do this with SAPUI5 flexibility,
00:16:17
00:16:24
00:16:30
SAP Business Application Studio, or SAP Web IDE. If you can reuse business logic
that already exists in an SAP GUI transaction, then SAP Screen Personas is your answer.
For new scenarios, determine if one of the standard floor plans in Fiori elements meets your
needs.
00:16:38
00:16:42
If it does, follow that approach. If you need to start from scratch
with a completely custom business process, building an app using SAPUI5 would be your best
answer.
00:16:52
Not all user experiences will involve a traditional screen-based GUI.
00:16:57
SAP also has tools to build conversational experiences. SAP Conversational AI offers two
products
00:17:05
00:17:10
to help you revolutionize your user experience. An end-to-end bot building platform
to build intelligent chat bots that streamline employee tasks and simplify customer service.
00:17:17
Also, we have a unified enterprise digital assistant, offering a conversational experience for
SAP users.
00:17:26
Both of these are outside the scope of this course as we will focus on the designing,
developing,
00:17:32
00:17:39
and deploying of traditional Web-based or native SAP Fiori apps.
Today, we talked about some of the tools that SAP, our customers, and partners use to build
Fiori apps.
00:17:47
You learned about several different approaches to delivering the SAP Fiori experience,
00:17:52
00:17:57
00:18:02
some with coding and some without, such as SAPUI5 flexibility.
You learned about building freestyle apps and accelerating the app development process
with Fiori elements. You learned when to use native mobile apps
00:18:06
00:18:11
for specialized use cases. You learned that there are two ways to create
the OData service that powers these apps. And you learned you can transform SAP GUI
transactions
00:18:17
into intuitive SAP Fiori apps with Screen Personas. In the next unit, we'll discuss
00:18:23
how to get SAP Fiori up and running.
18
Week 1 Unit 5
00:00:05
00:00:09
Hello, my name is Tom Reiss, product manager for Fiori. I've brought along Sibylle Brehm,
product manager for the Fiori launchpad, and responsible for week four of this course.
00:00:14
Hello, and also a warm welcome from me. In this last unit of week one,
00:00:19
00:00:23
How to Get SAP Fiori Up and Running, we would like to give you a high-level overview
of how to get SAP Fiori up and running, with a focus on SAP S/4HANA.
00:00:30
00:00:34
As you have already seen in the previous units, the SAP Fiori launchpad plays a central role
in the Fiori user experience. It enables scaling to hundreds of apps,
00:00:39
it provides the single entry point for users to access all their applications,
00:00:43
as well as providing access to central services. You can access all apps by clicking on the tiles
00:00:49
on the home page and role-specific pages. Alternatively, you can use the navigation menu
00:00:54
00:01:00
00:01:04
00:01:09
to access apps, or simply use search if you know part of the app's name.
The launchpad also provides the shell header bar, for access to integrated services,
and also the underlying navigation technology to navigate between apps.
Let's have a look at these more closely. The launchpad supports Fiori's role-based approach,
00:01:17
so that users only see apps that they are authorized to use according to the roles assigned to
them.
00:01:22
When roles are defined, they are mapped to the tiles, and these in turn are mapped to the
actual applications.
00:01:28
For each role, such as GL Accountant or Purchaser, SAP provides templates with some apps
assigned to pages,
00:01:35
00:01:41
and the remaining ones available to the user via the menu, the app finder, or via search.
The roles are mapped to back-end roles for authorization. The Fiori launchpad also provides
the shell header bar,
00:01:50
00:01:54
00:02:00
often just called the shell bar, which gives users access to integrated services
such as search, notifications, user assistance, and the user actions menu.
What you don't see on the slide is that, via the user actions menu,
00:02:03
00:02:07
the launchpad also provides powerful personalization capabilities,
so that you can rearrange the tiles on the screen, add or remove them from groups or pages
and sections,
00:02:13
and even create your own groups, pages, and sections. The Fiori launchpad also provides
00:02:20
so-called intent-based navigation, supporting flexible and personalizable navigation links
00:02:25
between objects and apps. Let's have a look at an example.
00:02:31
This slide explains the main aspects, but seeing it in action
00:02:33
is an even better way to understand this, so let's have a look at this in an S/4HANA system.
00:02:41
00:02:46
00:02:51
So, we see here a list of sales orders, and I'm just going to click here on the number
of this sales order, so you see it's a link, and we even have some classic UIs here,
so let me actually show you what it looks like if I click on Change Sales Order.
00:02:55
00:03:00
00:03:06
So we have a seamless navigation to this classic UI with a shell header bar up at the top.
I can go back, of course, and here we are in the list again. Let's go to the default navigation,
to the display of the sales order, the Fiori app here, and as you can see you can, of course,
00:03:11
continue with further navigation, so let's have a look at the sold-to party,
00:03:14
00:03:19
in other words the customer. You see here information about it and further links,
and what you can always do as a user is personalize this. So let's add here, for example, the
customer 360 degree view.
19
00:03:25
You see here we also have this now available and, of course, I can click on it and go directly to
that app.
00:03:31
So you have a lot of possibilities here with the navigation content that we provide out of the
box.
00:03:37
00:03:42
So, let me now hand over to Sibylle for some more information.
Let us take a look at configuring the SAP Fiori launchpad.
00:03:45
00:03:50
00:03:53
What is required to set it up? Basically, this depends on the type of product
you are using. If you are running SAP Fiori on an SAP Cloud product,
for example SAP S/4HANA Cloud, there is of course very little effort
00:03:58
as you will get the SAP Fiori launchpad out of the box with all the content in it.
00:04:03
00:04:06
You will most likely need to do some adjustments to the roles
so that they fit the requirements of your company, and then assign them to your users.
00:04:11
In contrast, if you have installed an on-premise product, like SAP S/4HANA,
00:04:16
00:04:20
you would of course have to do the technical configuration for things
that come out of the box in our cloud offering. For S/4HANA with its very rich SAP Fiori
content,
00:04:26
we created some rapid implementation tools that help you get your SAP S/4HANA system
00:04:31
00:04:37
00:04:40
and its Fiori content up and running faster. In addition to the Fiori launchpad content,
you will also need to configure the Fiori launchpad features,
like enterprise search, notifications, and user assistance. Finally, if you develop your own
custom Fiori apps
00:04:48
and deploy them either on premise or on SAP Cloud Platform, you would also have to
configure
00:04:53
00:04:58
all your content assignments, for example, which roles should contain which apps,
and should they be part of the Fiori launchpad homepage or just be available via the app
finder.
00:05:04
00:05:09
00:05:18
We will talk about these configuration steps and see the tools that you can use in more detail
in week four of this course. How is SAP Fiori used in the SAP Business Suite?
Basically, when we started developing SAP Fiori, the idea was just to provide this new user
experience
00:05:24
00:05:29
00:05:34
for only some apps, just the most used ones, for example, employee self services
like creating a leave request. Over time, the number of Fiori apps
available for the Business Suite has grown substantially, and often customers build some of
their own apps too.
00:05:40
00:05:45
But nevertheless, most users still mainly use classic UIs on Business Suite systems,
like the SAP GUI or Web Dynpro applications. We recommend installing the SAP Fiori
00:05:51
front-end server as a standalone server when you set up SAP Fiori for a Business Suite
system.
00:05:57
00:06:01
00:06:07
It is also possible to connect several SAP Business Suite systems
to the same SAP Fiori front-end server. This front-end server can then be used as a hub
to give users access to applications from several Business Suite systems
00:06:11
00:06:18
00:06:22
00:06:28
in one single Fiori launchpad. Whereas for the Business Suite
the Fiori launchpad is only used for a selected number of apps, as Sibylle explained,
the situation is completely different for S/4HANA. Here, all applications and transactions used
should be accessed via the Fiori launchpad. The innovations of S/4HANA come via Fiori apps,
00:06:34
so you will be losing out if you don't implement Fiori and just use SAP GUI.
00:06:39
Also, selectively implementing individual Fiori apps breaks the user experience
20
00:06:42
and results in high implementation costs. The good news is that by leveraging the SAP Fiori
launchpad,
00:06:49
00:06:53
all users can profit from Fiori, including those users who still end up doing
a lot of their work in the classic UIs, SAP GUI and Web Dynpro. For the transition to SAP Fiori,
00:07:01
we are not simply taking the old transactions and rebuilding them with new technology.
00:07:06
00:07:11
00:07:16
Instead, we are doing user research to understand how people work these days,
and leveraging the new possibilities of Fiori to build innovative new user interactions.
Fiori apps provide a new way of working, and are the only way to profit
00:07:20
from many innovations in S/4HANA. Of course, we cannot replace over 100,000 transactions
00:07:26
00:07:31
with Fiori apps in a year or two, so these new Fiori apps are supplemented with classic UIs.
Nevertheless, over time we are increasing the number of Fiori apps available to you.
00:07:37
As we have seen, the Fiori launchpad gives each user only those apps relevant to the roles
assigned to them.
00:07:44
Different roles will have a different set of apps assigned, with some apps being used my
multiple roles,
00:07:49
as you can see in this example. The Fiori launchpad provides the single entry point
00:07:55
00:07:58
00:08:06
00:08:09
for each user to access all their apps, as well as the shell services
such as search and personalization. Finally, the SAP Fiori launchpad content
defines the role-specific navigation networks. This is very powerful,
and something that SAP provides out of the box via the so-called Fiori launchpad content.
00:08:18
00:08:23
This slide summarizes what I've just explained. The Fiori launchpad is the single entry point,
allowing users to navigate to new and innovative Fiori apps, which in turn give them an
overview
00:08:28
of what needs their attention, and which allow them to drill down to details.
00:08:32
00:08:36
00:08:42
00:08:46
At the bottom left we see an example of a Fiori app showing an object page,
on the right an example of a classic UI, va02 for those who know the transaction code.
We have applied the Fiori theme to all UIs in S/4HANA, both Fiori apps and Classic UIs,
so we have one look for the whole product, providing a consistent user experience.
00:08:52
Let me hand over to Sibylle to explain how you can easily get the launchpad set up for
S/4HANA.
00:08:58
SAP Fiori is how business users access S/4HANA innovations. That means that customers
who want to make
00:09:05
00:09:10
the most of these innovations may need to activate hundreds, and in some cases thousands,
of SAP Fiori apps and other Fiori launchpad content. In your project, naturally, you want an
easy way to do this.
00:09:18
Here it is. The recommended way to approach SAP Fiori activation
00:09:22
of your SAP S/4HANA system is to identify the business roles that are relevant to your
business
00:09:28
00:09:32
in the SAP Fiori apps reference library. There you can find information
about all the standard SAP Fiori launchpad content delivered by SAP.
00:09:37
In a next step, you activate the relevant SAP business roles using the rapid SAP Fiori
activation task lists.
00:09:45
00:09:51
This is the quickest way to get started, as they allow you to enable all associated apps
and generate a role and a test user per role in just one step.
00:09:56
00:10:01
Explore the standard business roles by experiencing them as a business user
in your sandbox system. This will help you and your business experts
00:10:06
gain a good understanding of how these roles work, such as what insights are provided
21
00:10:11
00:10:16
and how a user navigates between apps and classic UIs to complete their day-to-day work.
Once you have a clear idea of which business roles, which apps, and which app-to-app
navigations
00:10:21
00:10:27
00:10:33
you want to run in your system, you can start adjusting the Fiori launchpad content.
For a fast way to copy and customize the SAP business roles, you can now take advantage
of the Fiori launchpad content manager tool. So far, we talked about accessing apps
00:10:41
00:10:45
00:10:50
from one S/4HANA system. In reality, most customers have more
than just one S/4 system, often they have a complex landscape of various S/4HANA
and Business Suite systems and cloud solutions. Wouldn't it be great to provide the business
users
00:10:55
00:11:00
access to apps from all those systems in one single entry point,
and allow them to easily navigate from app to app across the systems without noticing even
00:11:06
that they are entering a new system? We are currently working on establishing
00:11:10
such a central entry point scenario on SAP Cloud Platform. The central entry point is planned
00:11:17
00:11:22
to integrate with local launchpads, for example of your S/4HANA or Business Suite system,
and content from cloud solutions, for example SuccessFactors.
00:11:27
00:11:31
These systems are going to run independently from the central entry point,
but will provide their preconfigured content to be consumed and enhanced with additional
integrations
00:11:37
and navigation on SAP Cloud Platform. Besides the integration of apps
00:11:42
00:11:45
and other Fiori launchpad content, a tight service integration
is also very important for this use case. Obviously, single sign-on across all connected
systems
00:11:51
is absolutely key for seamless integration, so that users do not have to log in again and again.
00:11:57
00:12:01
00:12:07
But beyond this, you would of course expect to receive tasks or work items
from your connected systems in one common inbox, as well as expecting other services
to work across systems as well. Thank you, Sibylle.
00:12:11
So, to summarize, you've now seen what a central role the Fiori launchpad plays for the SAP
Fiori user experience,
00:12:17
00:12:21
and how important it is for S/4HANA customers to give all their users the Fiori launchpad
to access all their applications and transactions, be they Fiori apps or classic UIs.
00:12:27
Sibylle gave you a quick overview of how easy it is to get Fiori up and running for all S/4HANA
users,
00:12:32
as well as giving an outlook on our plans for a cross-product central entry point in the cloud.
00:12:37
For now, we wish you good luck with the weekly assignment. Have fun with the next units and
take care.
00:12:43
Goodbye.
22
www.sap.com/contactsap
© 2020 SAP SE or an SAP affiliate company. All rights reserved.
No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP SE or an SAP affiliate company.
The information contained herein may be changed without prior notice. Some software products marketed by SAP SE and its distributors contain proprietary softwar e components of other software vendors.
National product specifications may vary.
These materials are provided by SAP SE or an SAP affiliate company for informational purposes only, without representation or warranty of any kind, and SAP or its affiliated companies shall not be liable
for errors or omissions with respect to the materials. The only warranties for SAP or SAP affiliate company products and services are those that are set forth in the express warranty statements
accompanying such products and services, if any. Nothing herein should be construed as constituting an additional warranty.
In particular SAP SE or its affiliated companies have no obligation to pursue any course of business outlined in this document or any related presentatio n, or to develop or release any functionality
mentioned therein. This document, or any related presentation, and SAP SE’s or its affiliated companies’ strategy and possible future developments, products, and/or platform directions and functionality are
all subject to change and may be changed by SAP SE or its affiliated companies at any time for any reason without notice. The information in this document is not a commitment, promise, or legal obligation
to deliver any material, code, or functionality. All forward-looking statements are subject to various risks and uncertainties that could cause actual results to differ materially from expectations. Readers are
cautioned not to place undue reliance on these forward-looking statements, and they should not be relied upon in making purchasing decisions.
SAP and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP SE (or an SAP affiliate company) in Germany and other
countries. All other product and service names mentioned are the trademarks of their respective companies. See www.sap.com/copyright for additional trademark information and notices.