Version 1.30 is out!

Version 1.30 of the SAP Fiori Design Guidelines is now available! These guidelines are a practical manual for all UX designers interested in creating SAP Fiori apps. They are also a great starting point for those looking to learn more about the design principles of SAP Fiori.

The SAP Fiori Design Guidelines explain SAP’s design philosophy and provide a detailed overview of the templates, patterns, and controls used to bring SAP Fiori applications to life.

If you are interested in rolling up your sleeves and getting your hands dirty, you can create state-of-the-art mockups of SAP Fiori floorplans and UI elements using our downloadable design stencils. What are you waiting for? Find out more below!

So what’s new?

Version 1.30 of the SAP Fiori Design Guidelines is based on version 1.30 of the SAP UI Development Toolkit for HTML5 (SAPUI5). SAPUI5 is our HTML5 and JavaScript-based rendering library and programming model for UI.  This means that you will need to download SAPUI5 version 1.30 or higher to develop the apps as described in this version.

 

Key updates with this version include:

Additional floorplans
Arrange objects in SAP Fiori in new and interactive ways using our newest floorplans such as the object page, wizard, or dynamic side content. These additional patterns and layout controls allow you to shape your UI according to the needs of the end user.

Comprehensive information about tables and the view settings dialog
Learn how to make large amounts of data more accessible to the user by choosing the correct table type and by using the view settings dialog.

Enhanced visualization options
Take advantage of the new chart and map types to visualize data in an attractive and intuitive way.

End-to-end interactions for draft handling
Keep unsaved changes, prevent data loss, and more with draft handling.

New global search features
New and improved features such as filters, suggestions, and result lists save the user time when locating specific data across apps and business objects.

Form field validation
Learn how to implement form validation to let users know if they are filling out fields correctly in real time.

Data formatting for an international audience
Ensure that dates, times, numbers, and units of measure are consistent and easy to consume for users across the world.

New design stencils
Create high-fidelity mockups using the SAP Fiori design tool Axure and its extended stencils set. Alternatively, product owners and non-designers can take advantage of our Microsoft PowerPoint® stencils to create basic visualizations of initial design ideas.

For a complete overview of all new articles and updates, check out: What’s New in Guideline Version 1.30. Want to search through the guidelines by individual elements? Why not try using the Explore page? We hope you enjoy discovering the SAP Fiori Guidelines!

Not logged in
  • Anonym  3 years ago

    How can I download the SAP Fiori Design Guidelines as one document?

  • Andrea Waisgluss   3 years ago

    Hello Sylvain, thanks for your question. The guidelines are available in online format only and cannot be downloaded.

  • Enrique Carrero   3 years ago

    Hi,

    When could i use Initial Floorplan Smart Template in SAP Web IDE?

    Actually i don’t have the way to select any Template.

    • Annette Stotz   3 years ago

      Hello Enrique,

      Unfortunately, the initial page floorplan is not available as a smart template. The focus for smart templates in on often used floorplans such as objecct page and list report.

      Best, Annette