SAP Build and Web IDE - Two Paths to Fiori

Fiori is first and foremost a user experience concept. Fiori apps are mainly implemented with SAP UI5 and are therefore not only of interest to S/4 Hana customers.

Many Fiori apps are available for the Business Suite or can be developed for it. This is very important for SAP customers who customize or develop applications or use other products.

To ensure that there is no break in the UX for the user when they switch to Fiori, new apps should follow the Fiori UX guidelines. This raises the question: How can the Fiori UX be introduced so that applications are already future-proof today?

The design-driven development process is used to implement Fiori projects. The tools provided by SAP are Build and Web IDE.

Creating prototypes with SAP Build

With the prototype, an initial evaluation of the information to be presented is achieved by inserting sketches. This maximizes the result, especially in workshops. In a detailed prototype, the pages are created with UI5 elements.

No special UI5 knowledge is required, as the elements are managed via drag & drop. The prototype can use test data created in Excel. Studies can be created for validation and tested by selected users.

Instead of discarding the prototype created in the design phase, the complete prototype can be imported into the Web IDE and serves directly as a sound basis for further development. This also automatically ensures that the app can be implemented in UI5.

SAP Build is designed for Fiori apps and therefore UI5. Consequently, the design is not offered with other technologies. Unfortunately, the apps listed in the Fiori App Library are not available as templates.

Developing UI5 apps with the SAP Web IDE

The Web IDE is used for the continuation of the prototype to the app. After the import, important adjustments such as the connection of the back-end still need to be made.

For Fiori development in S/4 Hana, it is possible to use Fiori Elements. The Web IDE offers the functionality to extend standard Fiori apps via extension points.

Many recommendations for UI5 development are integrated: Validating syntax, simulating back-end services, Git or preparing for productive use.

For new developers, the Web IDE also provides a UI editor that can be used to create a page with drag & drop of UI elements. Experienced developers are more likely to work directly with the source code. The design-driven development process does not end with the deployment in the productive environment.

The version provided is the starting point for the next prototype. Here, the specialist department in particular is asked not to see the application as a one-off project.

Conclusion

Fiori helps to avoid many of the problems that arise when using classic SAP transactions. At the same time, this raises questions for customers when it comes to their own applications.

With Build and Web IDE, SAP provides two tools that help with development. By dovetailing with the design-driven development process, both open up new possibilities for creating Fiori apps effectively and efficiently.

They offer added value, but you also need the right people to be able to use them. A designer will be able to create Fiori apps with Build, but an experienced UI5 developer is also needed to implement them.

As the focus is on Fiori, the use of several tools is foreseeable. SAP Screen Personas can be used to customize transactions according to Fiori concepts. An integration of SAP Build and Web IDE for flavor creation would be desirable.