Direkt zum Inhalt wechseln

Fiori Introduction

TL;DR: The Fiori cosmos has a lot of expressions. There are standard Fiori apps as well Fiori lighthouse apps available. Also, there are several options to develop our own Fiori app. In this blog we clarify some of the terms to get everybody on the same page for the upcoming blogs.

Introduction

When someone mentions Fiori he/she often refers to a Fiori standard app. Even though there is a huge Fiori world with a lot of terms. In this blog series we are digging a bit deeper into the Fiori world. We will show the differences between Fiori apps as well as how you can extend them. Either by customizing your Fiori apps or by extending them. To get things started we focus on the question what types of standard Fiori apps exist and how do they differentiate.

Since we see our blogs as an exchange of ideas, feel free to add comments as well as get in contact with us.

Fiori Introduction

To get things started I want to get all of us on the same page. Hence, we will start very basic and discuss about what Fiori is.

Fiori is/are basically design guidelines which describe how apps should look and feel. Thus, all Fiori apps should follow those design guidelines.

Beside the Fiori apps there are also the Fiori-like apps and the UI5 freestyle apps:

Fiori-like apps

Those are apps which follow the design guidelines most of the time but they have little twists which are not in the Fiori design guidelines. For example a button could have a different design or is placed on a different part of the UI where the design guidelines doesn’t intend it. Such changes occur often during development.

UI5 freestyle app

The other option is to create a ‘UI5 freestyle app’. Those apps are not bound to the Fiori design guidelines. Hence, it is possible to create the app any way you want it. In those kind of apps we have the possibility to create our own button or a line in a table with our own design. A sample for such custom controls would be the following two pictures. This custom control is part of a todo-list. The list item will cross out the text and the due date as well as provide a green border once the task is marked as solved.

Fiori lighthouse app vs Fiori standard app

Since this blog series focuses on the Fiori standard apps, we will now take a look at the two different Fiori app types which are provided by SAP. There are the Fiori standard apps and the Fiori lighthouse apps. The lighthouse apps are also standard apps, because they are provided by SAP as well. They serve more or less as an entry point to the Fiori standard apps. Both types of apps are found in the Fiori Apps Library. The SAP lighthouse apps will be displayed with a lighthouse in front of the name.

When we compare the Fiori standard apps and developed apps, we can quickly realize that apps which are developed by SAP are cheaper and provide customization and extension options. Whereas on the other hand a developed Fiori-like or freestyle UI5 app provides more flexibility as well as more options during the complete development process. In the upcoming blogs we will display some useful features as well as some tips and tricks to enhance a standard app. The first topic we discuss will be modifications as well as enhancements of the UI.

Read also part II: Fiori Customization

part III: Extensibility Scenario With Key User Tools

part IV: SAP UI5 Adaption Project