Updated June 3rd, 2022: added a subsection on mobile applications supporting Horizon, including SAP Mobile Start, which is now also available for Android as well as iOS, with more images of Evening Horizon.
Our fresh new visual theme for SAP Fiori, Horizon, is well on its way to our portfolio of products. The first step is to enable the underlying technologies: today, Horizon is generally available for productive use by customer and partner development teams using SAP’s UI technologies for developing web-apps as well as native mobile apps. Also, Horizon is now starting to make its appearance in selected SAP products.
Before getting into the details, I would like to address one concern which we occasionally hear from customers: “Should I put my current SAP UI development and/or implementation project on hold until Horizon becomes available?”
The answer is a clear “no”: if you are developing SAP Fiori apps on SAP S/4HANA or on SAP Business Technology Platform, using one of the current themes such as Quartz, there is no need to put anything on hold. Horizon will be provided as an additional option, and you can choose when you want to actually start using the Horizon theme; until then, your system will continue with the theme you currently use. SAPUI5 is backward compatible, so that apps you build now will continue to work fine with Horizon once it becomes available. Similarly, mobile apps you develop now will work fine with Horizon when you move to the newer versions of the development kits. As usual with new themes: if you have built your own controls, or you have your own CSS (which we advise against), you will need to check whether they still look OK with the new Horizon theme.
What is Horizon?
The new Horizon theme introduces signature design elements which focus on helping people get their job done faster, more intuitively and with better outcomes. The next two figures show and explain what is new with Horizon, using some design examples for a home page and for a web and mobile application:
Figure 1: Some benefits of Horizon, shown on a design example for a home page.
Figure 2: Further benefits of Horizon, shown on a web app and a mobile app.
The examples shown above use the light version of the Horizon theme, called Morning Horizon. We also provide a dark version, called Evening Horizon, as well as high contrast white and black versions of the theme for accessibility, to help people with visual impairments.
Horizon Available Now in SAP’s UI Technologies for Mobile and Web Low-Code and Pro-Code Development
Native Mobile Apps
For developing native mobile apps with the SAP Business Technology Platform (SAP BTP), Horizon is now generally available in the SAP BTP SDK for iOS and the SAP BTP SDK for Android. The figure shows some examples of available mobile components with the Horizon theme:
Figure 3: Examples of mobile apps with Morning Horizon and Evening Horizon.
To find out more about the Horizon design for mobile devices and the new features of the iOS and Android SDKs, have a look at this blog post:
For low-code development, SAP provides the mobile development kit with SAP Mobile Services.
It allows you to build your application once, in an integrated development environment (SAP Business Application Studio as well as Visual Studio Code) and run it natively on mobile devices (Android and iOS) and as a web application (online) in the browser. The mobile development kit now also supports the Horizon theme. The new components are on the road map to be supported in Q3/2022. To find out more, have a look at this blog post:
Web Apps
For developing web apps with SAP Business Technology Platform, Horizon is now generally available for productive use with SAPUI5 version 1.102: Morning Horizon, Evening Horizon as well as the high contrast light and dark versions. Here is a preview of what it looks like for an SAP S/4HANA application, in this case the
Monitor Purchase Requisition Items app:
Figure 4: A preview of Morning Horizon in SAPUI5 in SAP S/4HANA Cloud 2202, for the Monitor Purchase Requisition Items app.
For low-code development, you can also use the integrated development environments (IDEs) SAP Business Application Studio as well as Visual Studio Code to leverage SAP Fiori tools and SAP Fiori elements. They allow you to very efficiently build powerful web apps using a pattern-based approach. You can also use these IDEs along with SAP Fiori tools for your pro-code / freestyle development with SAPUI5.
To find out more about developing web apps with Horizon using SAP supported UI technology as well as using open source UI technologies, have a look at this blog post:
Horizon Available Now in Selected SAP Products
SAP S/4HANA
As already announced in November, SAP S/4HANA Cloud currently offers a preview of Morning Horizon:
Our current road map envisages this becoming generally available for SAP S/4HANA Cloud in Q3/2022.
For SAP S/4HANA on-premise customers, we plan to provide a preview in Q4/2022, and we plan to make it generally available in Q1/2023. This means that you should be able to start trying it out in on-premise development projects if you upgrade to the new release planned for Q4/2022, and use your custom applications together with standard apps productively early next year. As mentioned at the beginning: apps which you have already developed or which you start developing now will also work fine with Horizon once you switch from your current theme to the Horizon theme [with the usual caveat: if you have built your own controls, or you have your own CSS (which we advise against), you will need to check whether they still look OK with the new Horizon theme].
SAP Service Cloud
Horizon is being applied in a stepwise approach, starting with applying the colors, icons, typography, shell, and navigation. This is now available for Morning Horizon in SAP Service Cloud, here is an example showing the Service Agent Desktop:
Figure 5: Morning Horizon for the Service Agent Desktop in SAP Service Cloud.
Going forward, we plan to support the additional Horizon variants (Evening Horizon and both high contrast versions) as well as applying the new styling into the major components.
SAP Business Technology Platform Services
The profile page showing a user’s profile now has the Horizon theme. If you have this service up and running, you can access it via the URL
https://accounts.sap.com/.
Figure 6: Morning Horizon for the Profile Page provided by SAP Business Technology Platform.
SAP Mobile Start and Further Mobile Apps
SAP Mobile Start
SAP Mobile Start is the mobile entry point to the intelligent enterprise, giving users access to native mobile as well as web applications, web content, data and SAP S/4HANA notifications to quickly address business issues. It provides a consumer-grade user experience and superior performance, designed for an intuitive and personalized native OS experience, with enterprise-grade capabilities. Users get a consolidated view on all tasks and workflows to trigger direct actions. As a result, users benefit from improved productivity, agility and work flexibility.
SAP Mobile Start is now available for Android as well as iOS – supporting Horizon, both Morning Horizon and Evening Horizon, as you can see here:
Figure 7: SAP Mobile Start for iOS with Morning Horizon (the two examples on the left) and Evening Horizon (the two examples on the right).
Figure 8: SAP Mobile Start for Android with Morning Horizon (on the left) and Evening Horizon (on the right).
To find out more about SAP Mobile Start, in particular for Android, have a look at this blog post:
Here are links to download it from the respective app stores:
Further Mobile Apps
SAP Service and Asset Manager, which enables easy and timely execution of end-to-end service and asset management on the go, is also available for iOS and Android, with support for Horizon – here is an example showing Morning Horizon:
Figure 9: SAP Service and Asset Manager for iOS, with Morning Horizon.
SAP Warehouse Operator, available for iOS, allows users to scan barcodes efficiently and accurately, gives them real-time insights, guides them with optimized routes, and suggests the next best activity. Here are examples with both Morning and Evening Horizon:
Figure 10: SAP Warehouse Operator for iOS, with Morning Horizon (on the left) and Evening Horizon (on the right).
SAP Direct Distribution, available for iOS, enables delivery drivers to efficiently transport consumer goods from a high-capacity freight station or port to their final destination. It digitalizes the delivery driver workflow in the field, reducing human error, and decreases order-to-cash time by enabling intermediate settlement of single customer stops throughout the day. By using it, drivers can provide a prompt, reliable and friendly service to their customers. Here are examples with both Morning and Evening Horizon:
Figure 11: SAP Direct Distribution for iOS, with Morning Horizon (on the left) and Evening Horizon (on the right).
SAP Ariba Shopping, currently available as a Beta version for iOS and for Android, saves users time by providing a personalized experience, enabling flexible time and working models as well as a sustainable shopping experience. It supports latest technology such as AR (Augmented Reality) and provides extensive search functionality. It also supports both Morning and Evening Horizon:
Figure 12: SAP Ariba Shopping (beta) for iOS, with Morning Horizon (on the left) and Evening Horizon (on the right).
Summary
As you can see, Horizon is approaching! We have it generally available in our UI technologies for developers, and already selected products support it. During the course of this year, further products are planning to adopt Horizon, often starting with a preview before making it generally available.
If you are developing SAP Fiori apps on SAP S/4HANA or on SAP Business Technology Platform, using one of the current themes such as Quartz, then do continue! There is absolutely no need to put anything on hold.