Fiori Elements : A Start to uniformed UIs
What is Fiori Elements?
SAP Fiori elements is a framework for generating uniform patterns of UI screens. The framework consumes metadata and annotations to provide the predefined templates and could be used for most of the application. The motive is to maintain design consistency and to reduce the amount of frontend code for building SAP Fiori apps.
Note: Fiori Elements was earlier referred as Smart Template.
Fiori Elements are classified into four broad categories;
- List Report
- Object Page
- Analytical List Page
- Overview Pages
List Report (LR):
List Report enables user to list the object details in a tabular fashion and has a refined filtering provisioning, which could enable variety way of displaying desired results.
Picture#1: List Report and features
Object Page (OP):
Objects Page in Fiori Elements provides options to detail/ create/ delete objects. The Object Page consists of object header, facets(sections), toolbar, footer toolbar, personalization settings – to enable columns to be shown / hidden.
Object page supports image, micro charts, progress bar and rating indicators
Picture#2: Object Page
The object pages could contain sub-object pages / child pages as per business requirements. The object pages also offer draft functionality, wherein a edited / unsaved data could be revisited at later point in time for respective actions.
Analytical List Page (ALP):
As the name suggests Analytical List Page provides option to display analytical data in combination with charts and transnational data. ALP has extended features from List Report, which makes it more dynamic and hybrid in nature.
Picture#3: Analytical List Page
Overview page are responsive page and provides an option to user to see all the details in a single page. OVP is represented in cards like pattern and covers various information in a single screen.
Fiori Elements is a precise way of enabling users to maintain consistency and uniformity in UI screens across applications and provides all major features as an out-of-box solution, reducing in development efforts, ROI and TCO.
The objective / goal is to achieve simplified UI with better performance with very little efforts to achieve desire format of representation.
For further information and details regarding Fiori Elements refer,