Understanding the SAP User Interface (UI)

Objectives

After completing this lesson, you will be able to:
  • Work with SAP Fiori apps.
  • Work with SAP Business Client.
  • Work with SAP GUI.

SAP Fiori User Experience

As your enterprise plans to implement SAP S/4HANA, you want to learn more about the SAP user experience strategy, and, particularly, the SAP Fiori UI.

Concepts and Influencing Factors

A central circle titled SAP Fiori shows related concepts. Surrounding images depict user interfaces like WinGUI, S4 HANA, WebGUI, and Fiori launchpad, illustrating UI technology integration in SAP.

IT and the use of electronic devices is no longer reserved for a group of experts. It has spread throughout all social groups. In this context, high performing hardware stands against a wide variety of software products with differing scope and potential. This puts stress on ease of use from the perspective of the end user. The main drivers of this development are smartphones and tablets, with their easy-to-use and flexible user interfaces. The focus of these user interfaces is no longer on maximum functionality. It is on a positive user experience that places the focus on the consumer. The focus is no longer on the expert user with many years of experience. Due to these circumstances, business software must adapt and transform the impact of this trend into an advantage for the roles of an enterprise. In this evolution, user interfaces (UIs) play an important role.

With regard to SAP software products, the challenge is to keep a clear view and to understand the overall SAP strategy in the area of user experience. Furthermore, it is important to have a clear understanding of the goals and the target groups of each UI technology. This helps to avoid incorrect decisions and situations where users are frustrated.

At the outset, it is helpful to clarify and help understand the terminology. It is useful to start with the terms 'user interface (UI)' and 'user experience (UX)'.

UI versus UX

UI and UX refer to two different ways of thinking:

UI
From a software perspective, UI is the interface between a human being and a device. Its goal is to support maximum efficiency during use.
UX
UX involves the perspective of the end user, and aims at motivation and emotion before, during, and after use. UX tries to achieve a sustainable, positive attitude in the user and create a motivating experience.

User Types

Depending on the industry and company involved, various user types can be found. There are many different user types, depending on the structure of the specialized area and the IT department, as well as the degree of digitization. However, in almost every company, there are three basic types as follows:

Occasional User

The occasional user only occasionally uses the system and needs simple, easy-to-use applications. In many cases, single-step transactions are executed.

Expert User
Also known as a key user, the expert user is a fully-trained SAP user, who knows the processes and the available applications in detail. The expert user often uses multiple systems and different UIs.
Developer
The developer (or programmer) has detailed process and system knowledge, and deals with the adaptation and extension of the existing applications. The developer has to look after several applications with different UIs.

Deployment Types

The deployment type defines the license model and operational environment. The deployment types are as follows:

  • On-Premise:

    The customer buys both software and hardware and operates the combination of these. Therefore, the customer is solely responsible for implementation, updates extension, and adaptation, as well as for replacements and new investments.

  • Cloud:

    The cloud company provides infrastructure (hardware and software) and business software, and rents this combination to the customer. The cloud company is responsible for operation, updates, extension, and new investments. At SAP, different operational models (for example, Public Cloud, Private Cloud, and Private Managed Cloud) with different software and service provisioning are available.

  • Hybrid:

    The customer runs certain parts of the business software on their own servers, and uses additional solutions of a cloud provider. This deployment type requires an intensive integration of the on-premise parts and the cloud parts.

Type of Access

Based on the type of access, applications can be categorized as follows:

  • Multi-step transactional

  • Single-step transactional

  • Single-step analytical

One size fits all?

Diagram with a central circle labeled UI...? surrounded by four options: User Types, Types of Access, Deployment Types, and Application Types, connected by gray lines.

When summarizing the different factors, it is clear that a "one size fits all" approach does not work.

Target — Unified UX Direction for all SAP Software

Infographic of featuring icons for applications, analytics, and SAP Fiori user experience with various devices, charts, and binary code in a digital cloud environment.

The long-term goal of the SAP UX strategy is to offer all business and all analytic applications on SAP HANA, with SAP Fiori as the unified UI.

SAP User Experience Strategy

The SAP user strategy has the following three components:

  • NEW:

    New applications are delivered with the latest UI technology, which in most cases is SAP Fiori.

  • RENEW:

    The most important and widely used applications will have their UIs renovated by SAP.

  • ENABLE:

    The less used applications can be improved by the customer using various technologies.

NEW, RENEW, and ENABLE — Examples

Examples of the NEW component include the following:

  • SAP Fiori for new applications

  • SAP Visual Business (supports certain new applications)

  • SAP Visual Enterprise (supports certain new applications)

SAP Fieldglass and SAP Ariba are examples of the RENEW component.

Examples of the RENEW component include the following:

  • SAP Fiori as common UI for all devices (desktop, laptop, tablet, and smartphone)

  • SAP Fiori for existing applications (for example, cloud applications including SAP Fieldglass, SAP Ariba, and SAP SuccessFactors)

  • SAP Fiori for existing SAP graphical user interface (GUI) or Web Dynpro applications

  • Single entry point via NWBC

Diagram shows transformation of SAP GUI to a customized version using Screen Personas and SAP Fiori App to a customer extended app using Web IDE with added field, hidden area, and function.

Examples of the ENABLE component include the following:

  • Improving and simplifying SAP GUI or Dynpro-based views using view Personas

  • Adapting and extending standard SAP Fiori apps using Web IDE

  • Customizing different UIs using color schemes, fonts, icons, and so on, and customizing company logos using UI Theme Designer

View Personas is available for SAP GUI or Dynpro-based views (Web Dynpro support is planned), and Web IDE is available for SAP UI5 applications. The UI Theme Designer is available for the following:

  • SAPUI5 (including SAP Fiori applications and SAP Fiori Launchpad)

  • Web Dynpro ABAP, Web Dynpro Java

  • SAP GUI for HTML

  • Business Server Pages, HTMLB

  • SAP Business Client for Desktop

  • SAP Enterprise Portal

Types of SAP Fiori Apps

Transactional SAP Fiori apps need an ABAP environment and are often used for single-step transactions. Analytical apps and Fact Sheets are SAP HANA-based, and often contain new functionality.

SAP Fiori Architecture

The SAP Fiori architecture consists of the following levels:

  • HTML5 client (SAP Fiori launchpad)

  • ABAP front-end server, with a central UI component and SAP Fiori roles implemented

  • ABAP back-end system

  • Database (SAP HANA or AnyDB)

The SAP Fiori launchpad is a role-based, personalized UI client that enables users to access SAP Fiori apps alongside established UIs. The SAP Fiori launchpad is based on SAPUI5 and can be used on multiple devices (leveraging the responsive design paradigm) and deployed on multiple platforms (SAP NetWeaver Application Server [ABAP Stack], SAP Enterprise Portal, and SAP HANA Cloud Platform). The SAP Fiori launchpad comes with predefined content to streamline implementation processes.

The SAP Fiori launchpad is aligned with the two main UI clients: SAP Enterprise Portal (available) and SAP Business Client (planned). This alignment is achieved as follows:

  • Alignment with the SAP Enterprise Portal is achieved by running the SAP Fiori launchpad user experience within the SAP Enterprise Portal (also known as SAP Fiori framework page) while leveraging the established portal infrastructure and best practices.

  • Alignment of SAP Business Client (BC) for Desktop with SAP Fiori launchpad design is planned for future releases.

SAP Fiori Launchpad

Screenshot of SAP Fiori Launchpad.

You can also use the existing SAP GUI transactions in the SAP Fiori launchpad, together with the SAP Business Client or via your web browser. Most SAP GUI transaction exist in S/4HANA as well.

Start and Configure the SAP Fiori Launchpad

User experience: SAP Business Client

Formerly, users could choose between a wide range of UIs. These included SAP Portal, Business Server Page solutions, HTML5 Apps, SAP Web Dynpro, and SAP GUI. The standard SAP GUI menu offers a wide range of access points for different objects, such as project, network, or documents. Each individual object has its own search template. It is not possible to search across all objects. If you want to define your own search, you do this on the SAP GUI using an SAP Query. SAP Business Client, called Netweaver Business Client in older releases, attempts to solve these problems. It does so by providing a new interface and serving as an alternative to the applications used formerly.

Two overlapping SAP Business Client windows display a project builder interface with configurations and a navigation bar showcasing portfolio and project management options.

With SAP Business Client, SAP provides users with a new interface that they can use alongside the SAP GUI, SAP GUI for HTML, NetWeaver Portal, SAP Web Dynpro, or Business Server Page solutions. It can be used locally, installed on a PC, or as an internet scenario.

SAP Business Client can be used for the SAP GUI as a SAP Fiori launchpad or for Web Dynpro scenarios, such as the ones used in SAP Portfolio and Project Management.

Control Center

The user interface of the SAP Business Client offers:

  • A central point of access for all users

  • An overview of:

    • Transactions

    • Object searches

    • Favorites

    • Personal Worklists

SAP Business Client is comprised of the following areas:

  • Navigation pane:

    This area shows the transactions, which can be found in the assigned role.

  • Work area:

    In this area, you can use the individual search templates, favorites, or object lists for individual navigation objects such as projects, networks, or material components. The work area also contains the transactions for creating, changing, and displaying the objects.

After logging on to the system, the first thing you see is the Control Center. In both the local and internet-based SAP Business Client, the Control Center has a navigation pane containing the role assigned to the user. Each entry contains the individual work areas for project activities related to logistics or controlling.

Control Center vs. SAP FIori Launchpad

Screenshots of the Control Center and SAP Fiori Launchpad.

Alternatively, you can access the SAP Fiori launchpad in the SAP Business Client and start the HTML5 transactions there.

Use the SAP Business Client in SAP Portfolio and Project Management (PPM)

User Experience: SAP GUI

The SAP graphical user interface (GUI) is the front-end program used to access SAP systems. Several variants of the SAP GUI are available and are adapted for use in different environments. The SAP GUI program connects the front-end computer to a specific SAP system. To start the SAP GUI, SAP provides another program, SAP Logon. When the user launches SAP Logon, a screen displays a list of available SAP systems. This list is derived from a file on the front-end computer, and is preconfigured and made available to users.

SAP Easy Access

When you work with your SAP S/4 HANA system, you can start the SAP Easy Access menu. Here, you can select transactions via a menu path or through executing the transaction code. If you migrated your "old" SAP ECC system to SAP S/4 HANA, you could opt to work with the classic SAP GUI transactions.

Screenshot of SAP Easy Access.
The image shows two screenshots from SAP GUI Options. Both highlight the setting Activate SAP Fiori features under Theme Settings and Visual Design, demonstrating how to activate SAP Fiori features.

The Choice is Yours

The system access is your choice. Most SAP S/4HANA scenarios can be reached via the SAP Fiori launchpad. Alternatively, you can use SAP Business Client with standard Web Dynpro or the SAP GUI for HTML transactions. If users don’t want to work with SAP Fiori or SAP Business Client, they are still able to open the classic SAP transactions.

SAP GUI with Belize Theme

Even in the SAP GUI, you can set the options in such a way that the appearance is similar to the design the Fiori apps are using. In this case, you must choose the SAP Quartz theme in the SAP GUI options and make sure, that the flag Activate SAP Fiori features is activated. This only works on a S/4HANA system.

Use the SAP GUI in PPM