Intro

The local AI notice pattern ensures users are informed when content is AI-generated, encouraging them to verify its accuracy prior to use.

For simplicity, this guideline shows illustrations of the object page floorplan as an example, but the fundamental rule of placement is applicable to all page types and layouts.

Object page floor plan showing the local AI notice label embedded below the sub-section header providing AI notice for AI results in the content area below.

Local AI notice label embedded below the subsection title

information

This guideline is mandatory according to Article 50 of the EU AI Act and in alignment with the SAP AI Ethics Policy for all user interfaces that involve AI-generated or AI-edited information. For more information on application scenarios, AI notice lifecycle, and AI impact assessment process, see the AI notice base concept.

Currently this pattern is not available in SAP Fiori Elements.

When to Use

false

Use the local AI notice pattern:

To explicitly mark content areas that contain information generated by AI.

dont

false

Don’t use the local AI notice pattern:

For any purpose other than disclosing AI content as defined in this guideline.
To mark non-AI-related content.

Components

This pattern is based on the following concept and components:

Foundational AI concepts

AI notice base concept

Components

Guidelines

The local AI notice is always paired with other patterns. Refer to the AI notice base concept to learn how it fits into the overall experience.

Standard text

For a consistent user experience, use the following standard text:
Created with AI. Verify before use.

Variants

Interactive AI notice label

This variant is recommended for all applications with high and very high impact decision scenarios. It enables progressive disclosure of further information through a popover. For more information, see the link component.

Link styling

The interactive AI notice uses the standard link styling as defined in the link component specification.

If necessary, you can use the subtle state of the link component to further reduce the visual impact when compared to other interactive elements in the environment.

Interactive local AI notice label embedded as a link below the sub-section header providing AI notice for AI results in the subsequent content area below the notice.

Interactive AI notice label embedded below the subsection title

Read-only AI notice label

Use this variant to fulfill basic labeling requirements when no further details on the validation of AI results can be provided. For more information, see the label component.

Read-only local AI notice label embedded as a label below the sub-section header providing AI notice for AI results in the subsequent content area below the notice.

Read-only AI notice label embedded below the subsection title

Placement

The placement of the AI notice label is crucial to support correct association of the AI notice label with the related AI results.

Limit the number of AI notice labels to one per screen. If you find it difficult to identify the correct placement of the AI notice label, apply the following rule of thumb:

Place the label next to the lowest possible hierarchical title element that contains all present AI results.

You have AI results distributed within one sub-section → AI notice is placed next to the sub-section title.

AI notice label placed below sub-section title, linked by dashed line to highlighted content area containing AI-generated information.

AI notice label placed on subsection level

You have AI results distributed across multiple sub-sections on your object page → AI notice is placed on the next higher section title.

AI notice label placed below section title, linked by dashed line to highlighted content area containing AI-generated information.

AI notice label placed on section level

AI has created content for multiple sections in your object page or generated the entire object itself → AI notice is placed next to the object title.

AI notice label placed below page title, linked by dashed line to highlighted content area containing AI-generated information.

AI notice label placed on page level

Information hierarchy

On top of the content area

For high–very high impact scenarios.

Place the embedded AI notice label between the section header and the content area where the AI result is displayed.

Object page floor plan showing the read only AI notice label embedded below the section header providing AI notice for highlighted AI results in the content area below the notice.

AI notice label embedded on top of the subsection title

At the end of the content area

For low–medium impact scenarios.

Place the embedded AI notice label in the footer of the AI results area. No additional AI content should appear below it, and it must remain within the boundaries of the associated section.

Object page floor plan showing the read only AI notice label embedded in the footer of the section content area providing AI notice for highlighted AI results above the notice in the content area.

AI notice label embedded below the content area

guideline

Product teams must apply correct accessibility annotations when placing the local AI notice label. As a rule, you must inform the user when an area contains AI-generated or AI-assembled information. You do this by placing the local AI notice label at the beginning of the area that contains the AI content.

As an exception, in low-impact scenarios, you can place the AI notice at the end of the area. To comply with the latest accessibility guidance, we advise using the following ARIA attribute to the accessibility region marker if the label is placed at the end of the content area:

invisible label: <region name>. Contains AI-generated content

Behavior and Interaction

The interactive AI notice variant uses progressive disclosure to indicate that the content was generated with AI and to advise users to review and fact-check results before use. For that purpose, the AI notice can include a link to open a long text description providing more details than the short text.

Progressive disclosure

The interactive AI notice allows progressive disclosure at 3 levels:

Link: AI notice short text
Popover: AI notice long text
External page: SAP Help Portal product documentation

1. Link: AI notice short text

Predefined AI notice text to mark AI content areas.
Can link to a long text in a popover, if provided.

Visual reference of the standard AI notice label text as an interactive link: “Created with AI. Verify before use”.

Interactive AI notice label

Provides a more contextualized explanation of what the notice means in the current context.
Can be adjusted to fit the context it is used in.

AI notice link with opened AI notice popover (title: Created with AI) providing space for customizable text and a optional link to provide access to further product documentation on SAP Help.

Interactive AI notice label with popover opened

guideline

Define the content required in the AI notice long text together with your local AI user experience and user assistance experts in your product area.

3. External page: SAP Help product documentation

Can contain a link to a dedicated page on SAP Help Portal.
Product teams must work with their local UA experts to define the appropriate destination and content in their product documentation.

AI notice link with opened AI notice popover (title: Created with AI) providing space for customizable text and a optional link to provide access to further product documentation on SAP Help.

AI notice popover with text and link

Responsive Behavior

The AI notice label must never be truncated. The notice must always be fully readable. Avoid wrapping to keep the notice in one line. To allow for limited space, use breakpoints to show longer or shorter variants of the AI notice text.

How these principles are applied in practice is defined within the related pattern and component guidelines. See the Related Links section below.