SAP continues to be at the forefront of digital transformation, providing mobile solutions tailored to today’s user & business needs. With the latest release of SAP Fiori for Android and iOS version 25.4, we’re introducing brand new components and patterns while enhancing our existing ones.
A Unified Creator Experience with SAP Design System Portal
Alongside our latest release, we’re excited to introduce the SAP Design System Portal – your one-stop-shop for all the resources and guidance you need to build your best with SAP. It covers all the SAP Fiori Design Guidelines across mobile, web, and digital design platforms, along with resources and support to help you get the most out of the system.
The previous URL (experience.sap.com/fiori-design) is already deprecated and redirects you to the new portal site (sap.com/design-system). Don’t forget to update your bookmarks!
SAP Design System Portal
New in SAP Fiori for Android 25.4
Check out our latest updates and enhancements in SAP Fiori for Android 25.4.
Attachment Form Cell
The attachment form cell, which is used to attach files to link them to a specific business object, now features a default confirmation dialog when an attachment is deleted.
For more information, check out the Attachment Form Cell article in the SAP Fiori for Android Design Guidelines.
Attachment form cell with confirmation dialog
Banner
The banner component, which comes as a notification that appears at the top of the screen to inform users about internet connectivity, errors, or synchronization statuses, is now available in Jetpack Compose.
Learn more about the Banner component.
Banner on compact screen (left) and expanded screen (right)
Barcode Scanner
The barcode scanner allows users to quickly locate an object by scanning a barcode via their device’s built-in camera. It now supports both manual and auto capture modes for processing multiple bar codes.
To find out more, refer to the Barcode Scanner guideline article.
Barcode scanner in auto mode (left) and manual mode (right)
Calendar
The calendar control has been enhanced to support range selection, allowing users to select a range by choosing a start day and an end day within month view.
See Calendar for more details.
Date range selection in calendar month view
Card Header
The card header, which provides information about the card, now supports slots for custom components.
For more information, refer to Card Header.
Circular Progress Indicator
The circular progress indicator now features an in-place loading state that can be applied to a button within an object cell.
Check out the Circular Progress Indicator to find out more.
In-place loading in an object cell
Horizon Theme Tonal Variant
The Horizon theme has been enhanced with a tonal variant that blends Google’s Material 3 tone-based surfaces with Horizon’s core colors. This update enhances the overall look by offering more balanced contrast and improved readability across all components while still preserving SAP Fiori’s distinct visual identity.
To learn how this tonal variant boosts the Android native experience, check out the SAP Fiori for Android Horizon theme guideline article.
Tonal variant of the Horizon theme
Inline Signature Capture
The inline signature capture component now supports mandatory field indicators and error states.
See Signature Capture Inline to find out more.
Inline signature capture in error state
Material Design 3 Standard Components
Several components will be discontinued for receiving updates as we transition to providing Horizon theme support for M3 standard components.
Check out the M3 standard components in our design guidelines by navigating to Components > M3 Standard Components.
Rating Control
The rating control, which is used to indicate an average rating for an object, has been enhanced with a leading label for the display-only variant and has a new interactive variant.
Refer to Rating Control to find out more.
New in SAP Fiori for iOS 25.4
Check out everything that’s new and updated in SAP Fiori for iOS 25.4.
Attachment Form Cell
The attachment form cell, which is used to upload files, now includes an optional confirmation dialog when the user taps the “Delete” icon in the previewer.
To learn more, refer to Attachment Form Cell.
Delete confirmation dialog in attachment form cell
Card Header
The card header, the uppermost part of the card that provides important information about the card, was enhanced with a right accessory in the main header that includes two slots for custom components. The right accessory in the extended header includes one custom component.
Check out the Card Header guideline article for more details.
Custom slots in main and extended header
Filter Feedback
The filter feedback now features the stepper, slider, and list picker as new form cells – giving you even more flexibility and control in your filtering experience.
Stepper form cell (left) and slider form cell in filter feedback pattern (right)
Feedback Patterns
The banner and multi-message handling feedback patterns have been visually enhanced. Apple’s material effects and relative position have been applied to the toast message.
Banner (left) and toast message (right)
Resources
Design Guidelines
SAP Fiori Mobile Design Guidelines for Android and iOS
A detailed documentation on component anatomy, behavior, and interactions allows you to use components that match your use case. Crosslinks to Google’s Material Design Guidelines for Android and Apple’s Human Interface Guidelines for iOS, as well as links to development documentation, help you navigate to these resources. Additionally, you can find a feedback function on each guideline article that allows you to provide feedback.
SAP Fiori for Android Design Guidelines | SAP Fiori for iOS Design Guidelines
UI Kits for Figma
SAP Fiori for Android and iOS UI Kit
With the updated SAP Fiori for Android and iOS UI Kits, it’s now easier than ever to use the latest components and patterns in your mobile design. By using the Design Kits, you can quickly create a consistent user experience that enables app implementations at scale.
SAP Fiori for Android 25.4 Design Kits | SAP Fiori for iOS 25.4 Design Kits
SAP continues to be at the forefront of digital transformation, providing mobile solutions tailored to today’s user & business needs. With the latest release of SAP Fiori for Android and iOS version 25.4, we’re introducing brand new components and patterns while enhancing our existing ones.A Unified Creator Experience with SAP Design System PortalAlongside our latest release, we’re excited to introduce the SAP Design System Portal – your one-stop-shop for all the resources and guidance you need to build your best with SAP. It covers all the SAP Fiori Design Guidelines across mobile, web, and digital design platforms, along with resources and support to help you get the most out of the system.The previous URL (experience.sap.com/fiori-design) is already deprecated and redirects you to the new portal site (sap.com/design-system). Don’t forget to update your bookmarks!SAP Design System Portal New in SAP Fiori for Android 25.4Check out our latest updates and enhancements in SAP Fiori for Android 25.4. Attachment Form CellThe attachment form cell, which is used to attach files to link them to a specific business object, now features a default confirmation dialog when an attachment is deleted.For more information, check out the Attachment Form Cell article in the SAP Fiori for Android Design Guidelines.Attachment form cell with confirmation dialogBannerThe banner component, which comes as a notification that appears at the top of the screen to inform users about internet connectivity, errors, or synchronization statuses, is now available in Jetpack Compose.Learn more about the Banner component.Banner on compact screen (left) and expanded screen (right)Barcode ScannerThe barcode scanner allows users to quickly locate an object by scanning a barcode via their device’s built-in camera. It now supports both manual and auto capture modes for processing multiple bar codes.To find out more, refer to the Barcode Scanner guideline article.Barcode scanner in auto mode (left) and manual mode (right)CalendarThe calendar control has been enhanced to support range selection, allowing users to select a range by choosing a start day and an end day within month view.See Calendar for more details.Date range selection in calendar month viewCard HeaderThe card header, which provides information about the card, now supports slots for custom components.For more information, refer to Card Header.Circular Progress IndicatorThe circular progress indicator now features an in-place loading state that can be applied to a button within an object cell. Check out the Circular Progress Indicator to find out more.In-place loading in an object cellHorizon Theme Tonal VariantThe Horizon theme has been enhanced with a tonal variant that blends Google’s Material 3 tone-based surfaces with Horizon’s core colors. This update enhances the overall look by offering more balanced contrast and improved readability across all components while still preserving SAP Fiori’s distinct visual identity.To learn how this tonal variant boosts the Android native experience, check out the SAP Fiori for Android Horizon theme guideline article.Tonal variant of the Horizon themeInline Signature CaptureThe inline signature capture component now supports mandatory field indicators and error states.See Signature Capture Inline to find out more.Inline signature capture in error stateMaterial Design 3 Standard ComponentsSeveral components will be discontinued for receiving updates as we transition to providing Horizon theme support for M3 standard components. Check out the M3 standard components in our design guidelines by navigating to Components > M3 Standard Components.Rating ControlThe rating control, which is used to indicate an average rating for an object, has been enhanced with a leading label for the display-only variant and has a new interactive variant.Refer to Rating Control to find out more. New in SAP Fiori for iOS 25.4Check out everything that’s new and updated in SAP Fiori for iOS 25.4.Attachment Form CellThe attachment form cell, which is used to upload files, now includes an optional confirmation dialog when the user taps the “Delete” icon in the previewer.To learn more, refer to Attachment Form Cell.Delete confirmation dialog in attachment form cellCard HeaderThe card header, the uppermost part of the card that provides important information about the card, was enhanced with a right accessory in the main header that includes two slots for custom components. The right accessory in the extended header includes one custom component.Check out the Card Header guideline article for more details. Custom slots in main and extended headerFilter FeedbackThe filter feedback now features the stepper, slider, and list picker as new form cells – giving you even more flexibility and control in your filtering experience.Stepper form cell (left) and slider form cell in filter feedback pattern (right)Feedback PatternsThe banner and multi-message handling feedback patterns have been visually enhanced. Apple’s material effects and relative position have been applied to the toast message. Banner (left) and toast message (right)ResourcesDesign GuidelinesSAP Fiori Mobile Design Guidelines for Android and iOSA detailed documentation on component anatomy, behavior, and interactions allows you to use components that match your use case. Crosslinks to Google’s Material Design Guidelines for Android and Apple’s Human Interface Guidelines for iOS, as well as links to development documentation, help you navigate to these resources. Additionally, you can find a feedback function on each guideline article that allows you to provide feedback.SAP Fiori for Android Design Guidelines | SAP Fiori for iOS Design GuidelinesUI Kits for FigmaSAP Fiori for Android and iOS UI KitWith the updated SAP Fiori for Android and iOS UI Kits, it’s now easier than ever to use the latest components and patterns in your mobile design. By using the Design Kits, you can quickly create a consistent user experience that enables app implementations at scale.SAP Fiori for Android 25.4 Design Kits | SAP Fiori for iOS 25.4 Design Kits Read More Technology Blog Posts by SAP articles
#SAP
#SAPTechnologyblog
