Profile and Settings
Intro
The profile and settings are arranged in a list-detail layout, offering a range of user and application-specific options that allow users to personalize their app experience.
Profile and settings in a list-detail layout on expanded window size (left) and on compact (right)
Anatomy
A. Profile Header (Optional)
The profile header can include a profile image, name, job title, and user actions such as changing the profile image or managing work shifts. If no image is available, initials can be used.
B. Body
The body includes different navigation targets showing personal information and app specific preferences.
C. “Sign Out” Button
The “Sign Out” button allows users to log out from the app.
Profile and settings anatomy
Behavior and Interaction
Navigating to the Profile and Settings Page
To maintain consistency across all SAP products, the entry point for the profile and settings is located on the right side in the top app bar. It’s recommended to place the user profile on the home screen only.
Profile placement in compact and expanded window size classes
Adaptive Design
In expanded window sizes, the list pane includes the profile header, with navigation options for settings and app information below it.
The detail pane displays details corresponding to the navigation target selected in the left pane. For example, units of measurement, permissions, and notification preferences can be maintained under the navigation target “App Preferences”.
Profile and settings interaction in a compact window size
Profile and settings interaction in an expanded window size
Resources
SAP Fiori for iOS: Profile and Settings