SAP design system is powering the next generation of AI-led product design
default
{}
default
{}
primary
default
{}
secondary
At this year’s TechEd conference in Berlin, we shared all the ways in which the SAP Design System is powering the next generation of AI-led product design, including new AI tools and resources available to designers and developers. Watch the recorded session here:
The SAP Design System is a set of building blocks that help designers and developers build, scale, and customize SAP products. Check out the video below for an introduction to the key values that the SAP Design System delivers.
The overall mission of the SAP Design System is to unify and advance the SAP user experience. What do we mean by unify and advance?
- Unify: The SAP Design System serves as the central hub of ready-to-use assets, guidance and standards for building experiences that are consistent across the SAP portfolio. This is how we directly contribute to SAP’s Suite-First strategy.
- Advance: The SAP Design System provides the essential patterns and tools to embed transformative AI experiences across all products and touchpoints. This is how we directly contribute to the AI-First strategy.
AI components & patterns now available to our customers and partners
Furthermore in achieving that AI-First strategy, we’re thrilled to announce that SAP's guidelines for AI patterns and components are now available to our customers and partners for web and mobile. We’re investing in making it easy to design and build great AI experiences that are responsible, flexible, and work across ecosystems. Our AI experience principles are built on the following six pillars: design for clarity, earn trust, give control, design fairly, boost flow, fail-safe.
AI UI elements can now be found in:
- SAP Design System portal
- SAP Web UI Kit
- SAP Fiori for iOS UI Kit
- SAP Fiori for Android UI Kit
- UI5 Web Components
AI Tools for product design and development
We’ve also introduced the following AI tools to help you build faster across all our UI technologies. SAP Joule for Developers is a collection of embedded AI capabilities for SAP Build and ABAP, delivered through Joule, that accelerates development of apps and extensions, reduces costs, and improves developer proficiency.
The SAP Fiori tools project accelerator lets you build SAP Fiori elements applications directly from an image of the intended outcome. These images can be high fidelity Figma models, lower fidelity screenshots or even a sketch on paper. Simply upload the image and use AI to generate the data models, services and the UI. Find out how to get started with this blog: From idea to app: using AI-powered Project Accelerator to develop SAP Fiori apps.
Recently, we have gone even further and introduced MCP servers for building with SAPUI5 and SAP Fiori elements. These open-source Model Context Protocol (MCP) provides AI agents with comprehensive SAPUI5 and SAP Fiori elements knowledge, including best practices and project-aware context information. Find out more about the new MCP servers in these blog posts: UI5 MCP Server and MCP Server for SAP Fiori.
SAP is committed to helping you bring out your best, which means not just building for today, but empowering you to build for an AI-ready future. We’re excited to provide a foundation of guidance and resources to help you get there:
Check out the SAP Design System portal, SAP’s UI Kits, and SAP’s UI technologies to get started building your AI-powered product experience today.