Updated: September 8, 2017

Overview – Layouts, Floorplans, and Frameworks

Intro

SAP Fiori has a simple user interface hierarchy, designed to make the user interaction easy and intuitive. In general, the SAP Fiori launchpad is the main entry point. All the apps available to a user are presented as tiles in the app finder, while the home page shows a personalized view of tiles the user has selected. The shell bar offers an enterprise search and other services, which are available across all apps.

Most app designs are based on one of two basic page layouts:

The layout for a full screen page contains only one floorplan. The flexible column layout can also show two or even three floorplans next to each other. The term “floorplan” represents different layout types for whole pages. The floorplan defines the structure of the controls used, and how to handle different use cases.

Layouts and floorplans can be built with SAP Fiori elements, or built from scratch (freestyle apps).

Overview of layouts and floorplans
Overview of layouts and floorplans

Overview of Layouts

Layout Use Case SAP Fiori Elements
Dynamic Page Layout The dynamic page is a layout control designed to support various floorplans and use cases. The design of the dynamic page header helps users to focus on the actual page content, but still ensures that important header information and actions are readily available.  Available
Flexible Column Layout The flexible column layout is a layout control that displays multiple floorplans on a single page. This allows faster and more fluid navigation between multiple floorplans than the usual page-by-page navigation. The flexible column layout offers different layouts with up to three columns. Users can expand the column they want to focus on, switch between different layouts, and view the right-hand column in full screen mode.  Available

Note: The full screen layout and split screen layout were deprecated with version 1.48.

Overview of Floorplans

Floorplan Use Case SAP Fiori Elements
Analytical List Page The analytical list page offers dynamic data visualization and business intelligence capabilities that enable users to analyze data step by step from different perspectives. Users can drill down to investigate a root cause, and act on transactional content.  Available
List Report The list report floorplan enables users to view and work with a large set of items. It offers powerful features for finding and acting on relevant items.  Available
Worklist A worklist displays a collection of items that a user needs to process. Working through the list usually involves reviewing details of the items and taking action. In most cases, the user has to either complete a work item or delegate it.
Overview Page The overview page (OVP) is a data-driven SAP Fiori app type and floorplan that provides all the information a user needs in a single page, based on the user’s specific domain or role. It allows the user to focus on the most important tasks, and view, filter, and react to information quickly.  Available
Object Page The object page floorplan allows the user to display, create, or edit an object. This is now the recommended floorplan for representing both simple and complex objects in SAP Fiori. The object page offers also a snapping header feature, but the underlying technology differs from the dynamic page.  Available
Initial Page The initial page floorplan allows the user to navigate to a single object to view or edit it. The interaction point on the screen is a single input field that relies on assisted input to direct the user to the object in as few steps as possible (using features such as value help and live search).
Object View The object view is a floorplan for displaying objects in SAP Fiori. From guideline version 1.42, the object view floorplan is only allowed in combination with the icon tab bar. As soon as the icon tab bar is available for the object page, this floorplan will be deprecated.
Wizard The wizard floorplan allows users to complete a long or unfamiliar task by dividing it into sections and guiding the user through it.

Additional Layout Options

Layout Use Case
Multi Instance The multi-instance layout allows users to open multiple documents in a tabular view. After selecting items from a list, the user opens them in a tab container.
Dynamic Side Content Dynamic side content is a layout control that displays additional content to help the user better understand the data being displayed on the screen. The display of the side content adapts flexibly to different screen sizes.
Additional layout options
Additional layout options

Overview of Frameworks

Framework Use Case
Analysis Path  Analysis Path Framework (APF) is a framework for creating interactive, chart-oriented analytical drilldown apps by configuration.
SAP Smart Business SAP Smart Business drilldown is an analytical app. It enables the user to view and analyze the data for one key performance indicator (KPI).