SAP Fiori for SAP S/4HANA – App Variants are the EASY way to control App Features

As a UX specialist in the SAP S/4HANA Regional Implementation Group, I’m privileged to work with many of our SAP S/4HANA customers.  Many of these customers have been working with SAP S/4HANA for many years and have successfully used the App Variants feature to adapt the user interface for SAP Fiori apps for other users.

Have you ever come across an SAP Fiori app with loads of great functionality, however it does more that you want for certain users? Wouldn’t it be great if, for example you could just remove one or more of these features? You could ask a developer to copy the SAP Fiori App in question, however, there is a MUCH easier, quicker, and cheaper way to achieve the same objective – App Variants.

Good news! There is now new and improved tooling so you can learn how as a business expert to adapt the UI of an app for other users.

You can refer to the following for more information:

• SAPUI5 Flexibility – All You Need to Know
• Working with App Variants
• SAPUI5 Flexibility: Adapting UIs for Specific User Roles

In this blog post we will cover the following topics:

• What are App Variants
• Who creates App Variants
• What can I change with an App Variant
• Example Use Case for an App Variant
• Impact of App Variants on your business users
• How to create an App Variant
• How to assign an App Variant to your Business User
• Test your App Variant
• App Variants – Prerequisites
• App Variants – Where to create them
• App Variants – Transport options
• App Variants – FAQ

What are App Variants

App Variants are apps that you create based on UI changes that you as a key user made via Adapt UI adaptation. Instead of saving your changes in your original app, you save them in a new app.

The new app is called an “app variant”, literally a variation of the original app. You can assign your new app variant to nominated business users via their business role(s). So you can assign the original app to some users, and your app variant to a different set of users.

Think of it as getting 2 (or more) apps for the price of one!

Who creates App Variants

Key users create App Variants using Adapt UI (aka UI Adaptation). Key users are users who are authorized to make changes on behalf of other users. Refer to SAP Fiori for SAP S/4HANA – What is Key User Extensibility and Who are your Key Users

What can I change with an App Variant

Almost anything you can do with Adapt UI you can save as an App Variant. For example, you can remove buttons, relabel fields, expose hidden fields, hide sections, etc.

IMPORTANT: What you can do with Adapt UI depends on your SAP S/4HANA release and the floorplan of the app. For example: in an Overview Page app you can make changes to cards; in a Manage app (i.e. List Report floorplan) you can make changes to the filter and table areas; in an Monitor app (i.e. Analytical List Page floorplan) you can make changes to filters, tables, and charts; and so on.

You optimize the UI of an app and then make the adapted app available to other users. One of the most common uses of App Variants is to remove features you do not want certain users to have.

In this blog post, you will see how to use Adapt UI to create an App Variant as a Key user and then assign this variant to the relevant business roles using the tool – Launchpad App Manager. For more information on the Launchpad App Manager, refer to Adapting Launchpad App Descriptor Items.

Example Use Case for an App Variant

Using SAP Fiori App F1060A Supplier Invoices List (Version 2) as an example, we are going to enhance this using the Adapt UI as a Key User. As a Key User, you don’t want all users to be able to delete invoices.  There are some users who you only want to be able to view the invoices. You can use Adapt UI to remove the ‘Delete’ button to avoid users accidentally deleting invoices:

Example User Case for an App Variant

Impact of App Variants on your business users

After creating an App Variant, the app variant appears like a new app – similar to the original app and with your changes applied. For the example use case you can see that the ‘Delete’ button is not shown as expected.

Impact of an App Variant

How to create an App Variant

Adapt UI is a special feature users can use to make changes. Refer to Adapting SAP Fiori UIs at Runtime – Key User Adaptation.

Key users use Adapt UI to make common changes to SAP Fiori apps, such as exposing standard (optional, by default hidden) SAP fields or custom fields. This allows a key user to coordinate one or more teams of end users. In this role, you also want to make sure that they can work efficiently. This approach also allows you to make changes in a no-code and upgrade-safe way without the need for a developer thereby saving time.

• Logon as a key user and select the app you want to change – in this case select the tile Supplier Invoices List
• When you are in the app, as a Key User, you have the ‘Adapt UI’ feature available (only accessible to Key Users) in the User Actions menu. You can also confirm the original SAP Fiori App ID in the ‘About’ option. Click on ‘Adapt UI’ to enter the UI adaption mode:
• You are now in the UI Adaption tab. Ensure you can see what you want to change. For this use case you need to see the Delete button clearly. Important: If you need to, you can use the Navigation tab to move to the area of the app that you want to change, then swap back to the UI Adaptation tab to make your changes.
• Using the UI Adaptation tab, adapt the UI by removing the Delete button. Select the button and press the “-“remove option.
• Check the button is no longer displayed. Now you can save your changes as a new app variant.From the shell bar, at the top of the launchpad, you ‘Activate’ a new version.
  
• From the shell bar, click on ‘Save As’ to create a new App Variant
  
• Give your App Variant a title. If you wish, you can choose an appropriate Icon
• Now you are presented with the app ID of the newly created App Variant. Click ‘Copy ID and Close’ to copy the app ID to the clipboard. IMPORTANT: You will need this app ID in the next steps so keep a note of it:And that’s it! Now you need to assign your app variant to your users.

How to assign an App Variant to your Business User

This step is typically done by your launchpad content administrator. You will need to understand the basics of SAP Fiori catalogs. That is:

– Technical catalogs hold original entries for launchpad app descriptor items (i.e. tile/target mapping combinations that control what the tile looks like and where selecting the tile takes you). Technical catalogs are client-independent

– Business catalogs hold references to the original entries in technical catalogs. Business catalogs are used to collect and assign tile/target mappings to business roles. Business catalogs are client-specific.

You will need a custom technical catalog to hold your app variant details.  You can either use an existing catalog OR create a new catalog.

– Create an entry in your custom technical catalog for your App Variant

– Reference your App Variant entry in a business catalog. Use a business catalog that is assigned to  the business role of your user.

You can see how this works for our example use case:

• Using the Launchpad App Manager, you create a new technical catalog Z_TC_SUPPLIER_INVOICE_APPS. You use the ‘Copy from other catalog’ option to copy the tile/target mapping combination for the original Supplier Invoices List app to your custom technical catalog.  For the example use case you would copy SupplierInvoices-list1 tile and target mapping from SAP_TC_PRC_COMMON.
• Hint: How do you know what to copy? Remember the About option in the section ‘How to  create an App Variant’. You can search for the original entry using the SAP Fiori App ID.
• Your results should look as follows. Click on ‘Duplicate’

• At this point, you now have 2 identical launchpad app descriptor items in your custom technical catalog. There are 2 entries with:
  – Semantic Object = SupplierInvoice
  – Action = list1
• VERY IMPORTANT: You will need to adjust the action of your duplicated entry so that you can tell the original app and the app variant apart. Change the Action so you have a unique action for your new app variant. For example, list1DisplayOnly.                              
• You need to adjust the tile and target mapping details of your duplicated entry to point to the app variant id. In the duplicate launchpad app descriptor item, replace the SAPUI5 component id with your app variant id, i.e. the app variant id that you copied during Adapt UI.

 Adjust the SAP Fiori ID and Transaction Code so you can tell it is a custom app variant.

– Hint: For ease of monitoring please keep the values of the SAP Fiori id and Transaction Code fields identical. Using transaction code to hold the SAP Fiori ID was introduced with SAP S/4HANA 2021. In SAP S/4HANA 2020 you will only maintain the SAP Fiori ID.

– Hint: For ease of support, it helps to have some similarity between the original app id and  the app variant. E.g. Original app = F1060A, App Variant = F1060A_V_ReadOnly. Consider having a naming convention.

Fill the Target Application Title with a suitable title so you can tell the duplicate from the original. For example, Supplier Invoices List – Display Only. IMPORTANT: Remember your users will see this title in navigation links.

• So you can tell the tile for the original app and the tile for the app variant apart, you need to change the tile details as well. Adjust the Tile definition to add a subtitle, e.g. “Display Only”. Save your technical catalog.
• Now that you have maintained the original tile/target mapping entries for your app variant in the technical catalog, you need to reference these new entries into your custom business catalog. You need to do this so that the app variant can be assigned via the business catalog to the business role. You do this step in the Launchpad Content Manager. For example, you could create an empty Business Catalog Z_BC_AP_OVERVIEW.  You then use the “Add Tile/Target Mapping” option to reference the entries from your technical catalog Z_TC_SUPPLIER_INVOICE_APPS into your custom business catalog Z_BC_AP_OVERVIEW.

• Finally, you need check your business catalog is assigned to a business role. For example, in transaction PFCG, set up a business role called Z_BR_AP_PROC. Assign your custom business catalog Z_BC_AP_OVERVIEW to this role. You can do this in transaction PFCG menu tab or, if you are using an existing business role, you can add the catalog in the Roles tab of the Launchpad Content Manager.

• Assign your business role Z_BR_AP_PROC to your key user and business user. Hint: You assign the role to your key user so that they can make further adjustments to the app variant, if needed, and so that, after testing, they can Publish the app variant to a transport request.

Test your app variant

• Logon to the SAP Fiori Launchpad as your key user and use the App finder to find your new App Variant tile:

• Click on the tile to start the app, you will see the ‘Delete’ button is missing (#1), ‘Adapt UI’ is still available as expected (#2):

• Via the User Actions->About menu option, check the SAP Fiori ID is as expected – ZF1060A_DISPLAY_ONLY

• Logon to the SAP Fiori Launchpad as your business user and use the App finder to find your new App Variant tile. You will see the ‘Delete’ button is missing (#1), ‘Adapt UI’ is NOT available as expected (#2)

App Variants – Prerequisites:

For App Variant Pre-requisites – refer to App Variants – Pre-requisites

• From SAP S/4HANA 2020, all the main launchpad content (including Launchpad App Manager) and layout tools can be found in the Fiori Launchpad of the Fiori Administrator role. This role (Z_FIORI_FOUNDATION_ADMIN) is generated by task list SAP_FIORI_FOUNDATION_S4, refer to Overview of tools for maintaining custom launchpad content and layout for more information.
• Your key user must have role SAP_UI_FLEX_KEY_USER (or an equivalent custom role) assigned in your development system, so that they can use Adapt UI. IMPORTANT: Your key user does not need to have this authorization in your production environment.
• Your key user must be assigned a transport request so that they can publish the app variant ready for transport.

Your technical team need to decide up-front whether Adapt UI transport requests will be client-independent (workbench request) or client-specific (customizing request). Once they have decided, all Adapt UI requests must use the same approach – otherwise you will receive errors on transport (e.g. “Sorry a technical error occurred”)

App Variants – Where to Create them

You make your UI changes in a development system and publish them to transport them to the production system. They can be transported via ABAP Change and Transport Management, similar to configuration.

App Variants – Transport options

You can publish the App Variant from Adapt UI using the Publish feature.  You will be asked to assign the change to a transport. Your administrator will then transport the target mapping and the tile through to the other systems in your landscape, as usual. Refer to Publishing App Variants.

Frequently Asked Questions

Can I create more than one App Variant per app?

Yes, you can create as many app variants as you need

Something’s not working. How can I get help from SAP?

Check the SAP Fiori launchpad user guide in the SAP Help Portal for section: Something Isn’t Working like It Should?

If you still can’t resolve it, raise a SAP Incident as usual. You can assign the application component CA-UI5-FL-RTA.

Can I use App Variants for SAP GUI transactions?

No, however for SAP GUI transactions you can use SAP Screen Personas for a similar result to Adapt UI. Find out more in OpenSAP course Adapting the UI in SAP S/4HANA Cloud Using SAP Screen Personas Adapting the UI in SAP S/4HANA Cloud Using SAP Screen Personas

Becoming an SAP Fiori for SAP S/4HANA guru

You’ll find much more on the community topic page for SAP Fiori for SAP S/4HANA

Other helpful links in the SAP Community:

• Follow our tag SAP S/4HANA RIG for more from the SAP S/4HANA Customer Care and RIG
• See all questions and answers about SAP Fiori for SAP S/4HANA
• Follow SAP Fiori for SAP S/4HANA for more blogs and updates
• Ask a Question about SAP Fiori for SAP S/4HANA

Brought to you by the SAP S/4HANA Customer Care and RIG.