Last Update: Sept. 22, 2022
Platform: Web
Designer: Clarisse Cornet
Intro
The Home Page, available to use since the H2 2020 release, can be used via the web and in our mobile apps for a more consistent experience across all devices. Outlined in this KBA is an overview of the New Features as part of the Home Page, as well as a FAQ section.
Usage
Homepage usually refers to the first page that is displayed when a web address is accessed and from which you can access the other content of the website. The homepage is therefore also referred to as an index page, home page, home page, main page or home page.
Types
The home page is highly configurable. Additional section titles can be added. Existing section titles can be changed. The home page can also be configured without a banner. See under: Application-specific examples
Structure & Components
The Latest Home Page includes:
- A Welcome Banner reflecting your organization's brand. The Welcome Banner can be managed from Manage Home Page > Edit Banner Image. There are two separate image uploaders: one for Landscape and one for portrait. There is only one check box for Use default banner image which applies to both landscape and portrait images.
- A Quick Actions section where you can complete your most frequent or important actions. Quick actions allow users to perform a quick task without navigating away from the Home Page. Quick Actions are driven by company features in Provisioning and Upgrade Center. For more details on Managing Quick Actions, see SAP Help Guide Choosing Which Quick Actions to Use on the Latest Home Page
- An Approval section where you can approve To-do tasks. You can approve or decline the request, or view more information more details on SAP Help To-Do Tasks on the Latest Home PageNote: Non-approval To-Do's will display in the For you Today section.
A For You Today section with content that's dynamically generated just for you. The For You Today section contains Engagement Cards which provide the information necessary to perform a task. You can navigate to an application page from Home Page. To navigate to a module page, users can click on a specific page link. Engagement Cards are dynamic and no two users will see the same cards. More details on Engagement cards can be found in KBA 2979181. - An Organizational Updates section with custom content for your organization. Organizational Updates contains custom cards very similar to the Legacy Home Page tile experience. You can create custom content and employee engagement surveys with Qualtrics from Manage Home Page for the Latest Home Page. Unlike Legacy Home Page custom tiles, you can't select the type of custom cards. There aren't any static cards that display icons. All custom cards require an image instead. Custom Tiles from the Legacy Home Page can be imported to the Latest Home Page. More details on Organizational Updates can be found in Creating Custom Cards for the Latest Home Page.
Behavior & Interaction
Cards on Homepage can have one of three interaction patterns:
- Bite-to-Snack: The Card doesn't have a destination page. Instead, the only additional context provided to the user is through the Snack layer.
- Bite-to-Snack-to-Meal: The Card has a destination page, and the user can progressively gain more context through the Snack, and then Meal, layers.
- Bite-to-Meal: The Card has a destination page, and the user must navigate to it in order to complete the task.
Approval Bite on Homepage, Approval Snack on Homepage, Meal Page
Engagement Card on Homepage, Engagement Snack on Homepage
Responsiveness & Adaptiveness
The home page is fully responsive
Application-specific examples
Based on various requirements, the home page can also be delivered without banner
Accessibility
Screen reading on the page: https://www.figma.com/file/Jqa7MXnPThiRy6gyVs2zvd/Homepage_Web?type=design&node-id=15270-349853&mode=design&t=ziwimrnuhhGj48yH-4
Screen reading on the approval cards: https://www.figma.com/file/Jqa7MXnPThiRy6gyVs2zvd/Homepage_Web?type=design&node-id=18252-427120&mode=design&t=ziwimrnuhhGj48yH-4
Resources
Link to Figma file: https://www.figma.com/file/3KAtKYe4H70H24BQ1ctYbK/b2205-Homepage?type=design&node-id=1918-282316&mode=design&t=8S9RRKDql41kqg2T-0
Bite, Snack, Meal Pattern: https://www.figma.com/file/Jqa7MXnPThiRy6gyVs2zvd/Homepage_Web?type=design&node-id=12332-283564&mode=design&t=20zk6WEG07nCvztn-4