Implementing business requirements with little budget and hardly any time for application design is what IT departments are expected to do. SAP shows that app development does not always have to be complicated and costly with SAP Fiori Elements. What makes SAP Fiori Elements so special and why we think they are worth using, you can read in the following blog post.

 


 

Develop individual apps in SAP
Click here to learn more

 


 

What are SAP Fiori Elements?

SAP Fiori Elements, formerly also called “Smart Templates”, form a framework for mapping the most common application scenarios in SAP. They are part of a UI5-based toolset focused on delivering a consistent user experience (UX) in SAP. Connecting to a backend system that supports the OData (Open Data) protocol, for example SAP S/4HANA and SAP Business Suite powered by SAP HANA, is enough to start creating end-to-end apps with minimal programming effort.

 

SAP Fiori Elements: App development made easy

Apps can be created with SAP Fiori Elements in just a few steps. The prerequisite is the existence of corresponding OData services with metadata. These can be created by the IT department together with the business department or in conjunction with corresponding consultants. Once they are available, all that remains is to select a floor plan and/or a standard layout. The application interface is then generated automatically on the basis of this information. In this way, SAP Fiori Elements ensure compliance with SAP Fiori design guidelines while reducing the amount of front-end code required to create a Fiori app. SAP Fiori Elements natively support a dynamic page layout for all available floorplans. Except at the overview page level, flexible column layouts can also be used.

 

The following floor plans and layouts are supported:

 

Analytical list page


analytical-list-page-v1.68-1.74_ SAP Fiori Elements_testList report


List-Report_List-Report-XL_1.68-1 SAP Fiori Elements

Object page


ObjectPage_SizeL_1.74 SAP Fiori Elements

Overview page


Overview-page-Resizable-card-layout SAP Fiori Elements

Work list


worklist-floorplan_Size-XL_1.68-1 SAP fiori elements

 

Advantages of app development with SAP Fiori Elements

 

1. Speed: Fiori apps in hours, not days or weeks

As mentioned at the beginning, rapid deployment of Fiori apps is currently one of the biggest challenges for IT departments. Every day, they have to compete with quickly available cloud or SaaS solutions. If the freely available software from the cloud wins the race, it becomes difficult to maintain a consistent IT strategy with a uniform UX over the long term. This is exactly where SAP Fiori Elements plays to its strengths.

 

Developing an app freely does not only pose technical challenges for those involved. Adhering to design guidelines for a consistent user experience also involves a lot of effort in the preliminary work and realization of the app. For example, imagine you need to develop a controlling dashboard, similar to the analytical list page shown earlier. Not only the application architecture, but also the application logic would have to be redeveloped, as well as derivations and rules that avoid input errors and are important for a good user experience. If you stay in the SAP world, the technical specifications for development in UI5 must also be taken into account when developing Fiori apps – and so must the SAP Fiori design guidelines.

 

In a nutshell: Many guidelines, technical challenges and usability issues make the free development of Fiori apps complex and time-consuming.

 

1:0 for SaaS solutions?

No – SAP Fiori Elements allows their developers to quickly and easily develop Fiori apps for the business department without failing due to the aforementioned hurdles. Fiori apps thus become fundamentally available in hours, not days. The SAP Fiori Elements toolset connects predefined page types to your backend system via OData services and builds a UI from them according to SAP Fiori design guidelines. Only business and metadata still need to be provided by development.

 

2. Maintenance: Maintain improvements centrally with minimal effort

Imagine that your app does not meet the requirements of the business department in the long run. If it is freely developed, every smallest change within the Fiori app can degenerate into a major project. People quickly discuss whether the benefit of the perhaps only small visual change justifies the huge effort in development. But in the end, isn’t it also about achieving a high level of acceptance of the Fiori app with a simplified user experience and reducing user errors to a minimum with simple interfaces? The problem is that it is easy to quantify development expenses, but experience has shown that it is difficult to determine the financial added value of a small “visual” change.

 

With SAP Fiori Elements, these discussions are a thing of the past, and changes to apps such as a different column layout can be implemented easily and centrally in just a few minutes. OData entities that are used in several apps only have to be adjusted once at a central location. All apps adapt automatically. Changes to the UI code are now a thing of the past. In this way, the user experience is always in the foreground of consideration and is not pushed into second place by supposed development costs.

 

3. User experience: Uniform design and ease of use

The decisive factor for a good user experience is that the user is in a familiar environment across all applications. Which button in which place in which color with which function – these are all issues that must be subordinated to higher-level design concepts. If apps are developed completely freely, there is a high risk that personal feelings will be considered more important than proven design concepts for UI development.

 

In order to provide users with the best possible UX, the latest design and coding standards must be adhered to. SAP Fiori Elements provides standardized page types for this purpose, which have been developed and tested for usability by experienced UX and UI designers. All Fiori apps created with SAP Fiori Elements thus offer exactly the same user experience. A user who can operate one app will quickly find his way around the operation of another app. SAP Fiori Elements ensures a uniform screen layout and provides a consistent user experience by consistently defining locations, forms, and functions for controls.

 

To keep it that way, even if design standards change, Fiori apps created with SAP Fiori Elements are automatically adapted to current design guidelines. SAP customers do not have to worry about this. This significantly reduces the maintenance effort for Fiori apps.

 

Conclusion

For those who do not want to admit defeat in competition with freely available SaaS solutions, Fiori apps created with SAP Fiori Elements are a real alternative. Business requirements can be quickly implemented in compliance with all design and usability guidelines.

 

When developing Fiori apps, the focus is only on backend integration, not on the realization of individual UIs. SAP Fiori Elements ensure that the latest standards are always applied. There are now also solutions available on the market for simplifying backend integration, for example INCEMENDO.data_access, which cover up to 90% of integration scenarios out of the box.

However, there are two things we would still like you to consider when deciding on SAP Fiori Elements as a tool set for Fiori app development.

Consider familiarization phase: App development with SAP Fiori Elements is not ABAP programming. It requires a rethinking of the way apps are developed. Familiarization is greatly simplified by an SAP Web IDE wizard for app creation, which is also used by SAP Fiori Elements.

 

Develop customizations and extensions: Fiori apps developed with SAP Fiori Elements can of course be easily customized and extended to meet your individual needs. This does mean more effort in development, but all in all it still ensures that all design and usability guidelines are adhered to.

 

Develop individual apps in SAP

Click here to learn more

 

Further articles of interest: