About SAPUI5 and SAP Fiori
SAP Fiori is a concept with uniform design principles on how a user interface should be presented across all SAP applications in terms of graphical and functional elements. The SAP Fiori Design Guidelines define all the basic elements, such as how SAPUI5 elements and Fiori Launchpad should be used in the development framework.
What is the Difference between SAPUI5 and SAP Fiori?
SAPUI5 provides the basis for various products and solutions in the SAP environment. Essentially, SAPUI5 is a programming framework and a collection of elements and tools that are required for the development of SAPUI5 applications. SAP Fiori, on the other hand, is a user experience guideline for all SAPUI5 applications. The aim is to create a modern, uniform and user-friendly interface through the SAP Fiori Guidelines in order to enable users to operate business processes more easily and quickly.
SAPUI5 Framework
Within the SAPUI5 framework there are various tools and techniques to develop SAP Fiori applications with little effort.
SAPUI5 offers a wide range of controls. For example, the following:
- User inputs, e.g. for inputs, drop-down elements and forms
- Visualisations, e.g. for texts, labels, tables, lists and images
- Actions, e.g. for buttons, menus, file uploaders and links
SAPUI5 offers the ability to carry out data binding on different models. The simplest and best integrated variant are the oData Models. These can be applied to aggregations within various controls (e.g. table) and thus automatically display the corresponding contents within the table based on the oData Service.
The concepts of routing and navigation within a SAPUI5 app can be used to build SinglePage applications in which navigation can be mapped without having to reload the entire page. Specific route patterns as well as parameters can be included in the URL.
For automated testing of SAPUI5 applications, the two test frameworks QUnit and OPA5 are integrated. QUnit makes it easy to write unit tests, while OPA5 is best suited for component tests.
User Experience with SAP Fiori
The SAP Fiori Launchpad
The central entry point for SAP applications takes place via the SAP Fiori Launchpad. Here, each individual tile represents an independent application for a specific use case. Within the SAP Marketplace, numerous applications are already available, which can be integrated into the company’s own SAP Fiori Launchpad.
User Experience Guidelines
The SAP Fiori Design Guidelines give all applications a similar look and feel and help users find their way around new applications more quickly. The individual design principles determine, among other things, how an application should behave on a mobile or desktop device.
Design Principles of SAP Fiori
The concept of SAP Fiori is based on 5 fixed design principles: simple, role-based, appealing, responsive and uniform.
This means that every app can be operated intuitively on every end device and looks consistent at the same time. In addition, applications tailored to a specific use case with a uniform look and feel lead to tasks being completed more quickly.
Develop Your Own SAPUI5 Application Now
Are you already Benefiting from the Advantages of SAP Fiori?
Get In Touch With Us Now
Only 5 Steps to your New SAPUI5 Application
Step 1
Analysis of the Use Case
Together we answer the important questions at the beginning: What is the basic customer requirement? Are there already interfaces defined by SAP? Can the use case be integrated into an existing application? Does a completely new application have to be implemented?
Step 2
Creation of a Prototype
Based on the requirements analysis, we create a prototype in the case of a new application using SAP Build. This serves to define the requirements in more detail and shows in the early project stage whether one is on the right track.
Step 3
Concept of the Application
The agreed prototype is transferred into a concept, potential interfaces are identified and tested by mini-PoCs, and new interfaces are defined and formulated.
Step 4
Implementation of the Application
If the concept meets the customer’s requirements, the actual application including its interfaces is implemented and then deployed.
Step 5
Testing and Fine Tuning
After successful implementation, the application is now tested by the customer and fine-tuned if necessary. Once this phase is completed, the new application can go live.
The constant progress of digitalisation demands a rapid adaptation of internal processes and conditions. The implementation of SAP Fiori applications is perfect for this, as they lead to a quickly achieved added value with little effort and can be integrated into any system landscape.
Our Successful SAPUI5 Developments
Get to know a small selection of our successful SAPUI5 application developments at our clients.
Fiori app developments are often based on individual requirements. We support you both in setting up the standard Fiori apps and in individual requirements related to specific business needs. For example, when it comes to extensions within the existing SAP environment with the same look & feel or small projects in the existing SAP system landscape. In the following sections we present a small selection of individual client services.
The aim of the project was to display all replication jobs per remote source. The functions Start/Cancel Replication Loads should be inserted. The preview screen shows the view of the SDI settings.
© 2021. BIG.Cube GmbH. All rights reserved
In another project, the goal was to create a release dashboard according to customer needs. The focus was on uploading the contents of a release sheet, in which several teams had to make releases for a specific data set, to the dashboard. The release and the associated job execution take place automatically when all teams have released. In addition, the personalisation of the dashboard per user was implemented.
© 2021. BIG.Cube GmbH. All rights reserved
In this project, the requirement was to display the upload status of each file in an overview table. If errors occur, for example wrong number of columns, wrong data type or too many characters in a column, these should be displayed accordingly. In addition, the partitioning of large files into small packages for uploading the data was implemented.
© 2021. BIG.Cube GmbH. All rights reserved
Benefit from our SAPUI5 & Fiori Expertise
We offer you comprehensive expertise and are happy to complete the whole journey with you, from conception and development to implementation and operation. We also offer the following 3 services:
SAPUI5 Hackathon
Learn the concepts and approaches for developing a SAPUI5 application in intensive workshops. Bring a concrete use case from your company. This will be implemented independently by you at the end of the hackathon.
Development of Custom Controls
If the large selection of SAPUI5 controls is not sufficient for a use case, we offer to implement reusable custom controls. It is possible to extend existing controls as well as to create completely new controls.
Further Assistance & Advisory Services
We offer services such as the assessment of use cases, assistance on how best to implement a use case in a SAPUI5 app and conduct reviews of existing SAPUI5 applications.
FAQ's about SAPUI5 and SAP Fiori
It depends entirely on the infrastructure in your company. The easiest way is to be able to develop an application in an existing SAP cloud infrastructure. The SAP Business Technology Platform offers all the tools and instruments needed to deploy an application quickly.
The possibilities here are almost unlimited. Interfaces provided by SAP can be connected, as well as custom-built interfaces within SAP systems. However, third party interfaces can also be connected.
In order to be able to familiarise oneself with the topic of SAPUI5 and SAP Fiori, it primarily requires a basic understanding of programming. Knowledge of JavaScript, HTML and CSS makes it easier to get started.
The fastest and easiest way to develop a new SAPUI5 application is the SAP Business Technology Platform with its Business Application Studio, the predefined app templates and the direct possibility to connect interfaces provided by SAP.