Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
Showing results for 
Search instead for 
Did you mean: 

Before the year comes to a close, we’re excited to bring you the latest version of the SAP Fiori Design Guidelines.

Version 1.42 offers a continuation of the design concepts rolled out with SAP Fiori 2.0, as well as information on new and existing concepts, controls, and floorplans. What’s more, this version also includes the latest design stencils and icon font so that you can spend the winter holidays creating realistic and interactive prototypes of your own SAP Fiori layouts, patterns and controls.

Check out a summary of what’s new below, or visit the What’s New page of the SAP Fiori Design Guidelines to get the complete details.

New Concepts

Notification Center
Part of the new SAP Fiori launchpad viewport, the notification center provides a real-time overview of all notifications from various sources (including the workflow inbox or SAP CoPilot). Users can rearrange their notifications, take action, or navigate to the source. The 5 latest notifications appear as a preview on the launchpad. To find out more, check out the notification center.

Plus don’t miss the latest improvements to the Handling Busy States and Mass Editing articles. For more information, check out What’s New.

New Layouts

Dynamic Page Layout
The dynamic page is a new, generic layout control that has been designed to support various floorplans and use cases. It is the successor of the full-screen layout and is fully responsive. With a consistent snapping header concept and a footer bar for finalizing or closing actions, the dynamic page layout has become the standard layout for SAP Fiori elements. Read more about the dynamic page layout.

Plus updates to the following floorplans: list report, object page, and worklist. Check out What’s New for more information.

New Controls

Header Toolbar
Use it for global actions that are relevant for the entire page. The toolbar is always visible and doesn’t scroll away. Learn more about the header toolbar.

The lightbox lets you display an image in its original size by using a popup and dimming the rest of the screen. Check out lightbox for more details.

The basic tree control can be used in to display basic data in master lists, dialogs, popovers, and more. It supports both single selection and multi-selection. Navigation indicators can also be added optionally. For more information, see tree.

To see what other updates, improvements, and new features are available for existing controls, check out What’s New.

New Resources

Design Stencils
Visualize your design ideas with our design stencils. The design stencils for Axure RP have been updated to the latest SAPUI5 version 1.42. This downloadable package also includes the SAPUI5 icon font.

Want to get some background information on our newest design concepts? Check out the latest blogs on SAP Fiori 2.0.

Are you brand new to the SAP Fiori Design Guidelines? Whether you’re a UX designer, a developer, or just plain browsing, why not check out the Get Started and Explore pages to get familiar with our award-winning design concepts.