Iconography is essential in creating a cohesive and enjoyable app experience. Icons play a crucial role in communicating actions, information, feedback, and navigation. By providing a comprehensive icon library, the goal is to enhance accessibility and overall ease of use for our customers’ apps.

Usage

Do’s

• Use Fiori for iOS icons as a set
• Use icons to efficiently communicate important actions
• Use to navigate to another screen
• Use icons to effectively use screen real estate

Dont’s

• Do not use icons from other sources
• Do not place icons too close together
• Do not place icons with half pixel increments
• Do not use light color against a light background

Design Language

Fiori for iOS icon library combines our Fiori design language and visual patterns from iOS icon library. This allows us to have a robust library offering the familiarity, accessibility, and cohesiveness that SAP customers expect from native iOS apps. These are the principles that define our icons:

• Simple
• Coherent
• Modern
• Delightful

This approach allows us to follow a framework to ensure our icons communicate efficiently, are cohesive, and look beautiful.

Fiori for iOS Icons

Fiori for iOS icons are organized as icon sets based on their function, size, and placement within the app. The following sets are currently in our icon library.

Launch Icons

The launch icon is essential in making our SAP customer apps beautiful and to clearly communicate to the user the apps’ main purpose. Launch icons may use our Fiori for iOS branding guidelines or can be themed using the customers own branding. Launch icons are found in the app store, home screen, system settings, and search results.

KPI Icons

KPI icons are 32px icons that represent a measurable value and function as a visual identifier when placed next to KPI numeric value.

System Icons

System icons are 28px icons that cover a majority of tasks needed by our customers. System icons are used in the navigation bar, toolbar, and tab bar, as well as in individual components.

App Icons

App icons are 28px icons that represent app-specific tasks covering SAP customers’ unique use cases. Like system icons, app icons are used in the navigation bar, tab bar, and toolbar, as well as within individual components.

Doctype Icons

Doctype icons are 28px icons that represent a type of file when a preview or image is unavailable. Doctype icons are found within the attachment item.

Map Icons

Map icons are 20px icons (40px when selected) that represent a business object’s location on a map. These icons are placed within the map marker.

Indicators

Indicators are 16px icons that denote the priority, attribute or status of a business object. Indicators are found within object cell and header.

Icon Requests

As part of the new Fiori for iOS icon library, we want to better organize the process of requesting Icons. To propose icon concept, please provide the following information:

• app name
• icon name
• size
• image of placement
• description of use case

Once we go over the use case we may validate the use of an icon or may offer other recommendations. You can request icons at SAP_Fiori_for_iOS_icons@exchange.sap.corp.

Resources

Download SAP Fiori for iOS Icon Stencil