Info (information)

information

We will continue to evolve this pattern and the usage guidelines based on insights from product teams and other experts across SAP. Please submit feedback for improvements through the Design System Jira (select “Business AI” in the Stakeholder field), and check our quick prompts Jira ticket and AI patterns roadmap for the latest updates.

Current version 1 has been reviewed by the SAP design system team and the following activities are in progress: accessibility review of specifications and SAPUI5 and SAP Fiori technical planning.

Intro

In generative AI, prompts guide the AI’s output to meet users needs that require high-quality instructions.

Quick prompts are integrated into workflows for easy access which allow users to execute pre-defined actions effortlessly. These types of prompts are crafted by experts known as prompt engineers, who focus on the efficiency of AI.

This article discusses the usage of quick prompts.

For more information on all types of prompt patterns, see Designing Effective AI Prompts.

Image shows a dialog containing a text area and a footer bar with two buttons being on primary button and one secondary button. At the top right of the text area there's a ”Generate” secondary AI button.

Image shows a dialog containing a text area where content is being generated. The text area is highlighted in blue. At the top right of the text area the button that once was ”Generate” changed to a ”Stop Generating” secondary button. At the footer bar of the dialog the two buttons are disabled.

Image shows a dialog containing a text area with AI generated text within. The text has a blue highlight and a blue marker at the left side of the paragraph. At the top right of the text area the once ”Stop generating” button changed to a ”Revise” secondary AI Menu button. At the footer bar of the dialog the two buttons are now enabled again.

Usage

Use when tasks are repetitive or common actions within a workflow.
Use when input options may be limited in mobile scenarios.
Use when the system can only assist with specific actions.
Use when users lack expertise in the subject matter.
Use when it’s crucial to minimize any bias introduced by users’ writing prompts.
Use when maintaining consistent and predictable outcomes is essential.

Don't

Don’t use when a user’s intent is unpredictable.
Don’t use when users need more flexibility in directing the output of the AI model.
Don’t use when providing non-AI-related actions is necessary, utilize a dedicated menu button solely for such items.

Anatomy

Quick prompts pattern extends the following components to enable new AI-specific interactions:

AI Button

Container: Different background colors visualize the type and state of the AI button.
Text: Describes the action that is triggered by the AI button.
Icon: Indicates that the action is an AI-powered feature.

Anatomy of an AI button

Anatomy of an AI button

Container: Different background colors visualize the type and state of the AI Menu button.
Text: Describes the group of actions that can be triggered by the AI Menu button.
AI Icon: Identifies AI actions embedded in the AI menu button.
Arrow: Indicates that clicking this button opens a menu with a group of options.

Anatomy of an AI menu button

Anatomy of an AI menu button

AI menu is using menu button and menu components in variants without icons.

AI menu button container: Different background colors visualize the type and state of the AI menu button.
AI Icon: Identifies AI actions embedded in the menu button.
Text: Describes the group of actions that can be triggered by the menu button.
Arrow: Indicates that clicking this button opens a menu with a group of options.
AI menu: Container that is shown as an overlay.
Menu item: List item inside the menu that represents an action.
Separator: Horizontal line that groups the menu items visually.
Menu item with submenu: Describes related menu items grouped in one submenu.

For more information see, AI icon, menu button and menu.

Anatomy of an AI menu

Anatomy of an AI menu

Behavior and Interaction

Content Generation

Clicking the AI button initiates content generation with AI. As the generation process begins, the AI button transforms into the “Stop Generating” button, giving users the power to stop generation at any time. Primary actions are disabled until generation is complete, preventing users from accessing partially generated content.

Content generation with quick prompts

Content generation with quick prompts

1. AI button triggers the generation process
2. Button changes its appearance and function
3. Primary actions are disabled

Fine-Tuning

Once the generation process is completed or stopped by the user, the “Stop Generating” button transitions into an AI menu button. This menu provides a variety of appropriate AI actions as quick prompts that users can apply to the entire or a portion of the generated content.

Fine-tuning with quick prompt menu

Fine-tuning with quick prompt menu

Handling Errors

If errors arise during or as a result of the prompt application, see Machine Handling – Overview.

For consistent user experiences, we suggest utilizing the following error message:

“It looks like an error occurred during the generation process. Please try again.”

Error-handling for content generation using quick prompts

Error-handling for content generation using quick prompts

Grouping

If necessary, organize prompts into submenus for easier navigation and to minimize visual clutter. Group quick prompts based on their purpose or the task they build upon.

Prioritize the most essential actions by placing them at the top of each group. Keep group sizes manageable by breaking them down into smaller subgroups to prevent users from feeling overwhelmed by too many options within a single group.

Example sub-menus

<div> <div> <h3 id="submenu">Submenu</h3> </div> <div> <h3 id="quick-prompts">Quick Prompts</h3> </div> </div> <div> <div>Rewrite Text</div> <div> <ul> <li>Simplify</li> <li>Expand</li> <li>Rephrase</li> <li>Summarize</li> </ul> </div> </div> <div> <div>Change Tone</div> <div> <ul> <li>Make More Casual</li> <li>Make More Professional</li> </ul> </div> </div> <div> <div>Adjust Length</div> <div> <ul> <li>Shorten Text</li> <li>Lengthen Text</li> </ul> </div> </div> <div> <div>Translate</div> <div> <ul> <li>Language 1</li> <li>Language 2</li> <li>Etc.</li> </ul> </div> </div>

AI menu grouping prompts within sub-menu

AI menu grouping prompts within sub-menu

style

column-section-1-1, no-footprint

style

column-section-1-1, no-footprint

Terminology

Adhere to the default labels provided below for text generation scenarios. We strongly recommend maintaining consistency and user familiarity by following the suggested wording. Only make changes to the default text if absolutely necessary for your specific use case.

If you find yourself in this situation, please reach out to the AI Experience team for further guidance.

Standard AI actions labels for AI text generation and transformation

<div> <div> <h3 id="ai-button-labels">AI Button Labels</h3> </div> <div> <h3 id="description">Description</h3> </div> </div> <div> <div>Generate</div> <div>Create or produce something, such as text using AI.</div> </div> <div> <div>Revise</div> <div>Change or alter existing content or data using AI.</div> </div> <div> <div> <h3 id="submenu-labels">Submenu Labels</h3> </div> <div> <h3 id="description-1">Description</h3> </div> </div> <div> <div>Rewrite Text</div> <div>Changes the structure of the text.</div> </div> <div> <div>Change Tone</div> <div>Adjusts the style or emotional quality of text.</div> </div> <div> <div>Adjust Length</div> <div>Changes the length of text.</div> </div> <div> <div>Translate</div> <div>Convert content or data from one language to another using AI.</div> </div> <div> <div> <h3 id="ai-actions-labels-for-menu">AI actions labels for menu</h3> </div> <div> <h3 id="description-2">Description</h3> </div> </div> <div> <div>Fix Spelling and Grammar</div> <div>Corrects errors in spelling and grammar using AI.</div> </div> <div> <div>Simplify Text</div> <div>Makes text easier to understand with AI.</div> </div> <div> <div>Expand</div> <div>Elaborates on the content, providing more detail or depth.</div> </div> <div> <div>Rephrase</div> <div>Rewrites text to convey the same meaning.</div> </div> <div> <div>Summarize</div> <div>Condenses information while retaining the key points.</div> </div> <div> <div>Make More Casual</div> <div>Makes writing less formal.</div> </div> <div> <div>Make More Professional</div> <div>Makes writing more formal.</div> </div> <div> <div>Shorten Text</div> <div>Reduce the length of the text or data using AI.</div> </div> <div> <div>Lengthen Text</div> <div>Increase the length of the text or data using AI.</div> </div> <div> <div>Make Bulleted List</div> <div>Organizes information into a list format.</div> </div> <div> <div>Explain Content</div> <div>Clarify the meaning of content or data using AI.</div> </div>

Best practices

For actions not covered above, apply the following guidelines:

Use a verb in the imperative.
Keep AI action labels as short as possible while prioritizing clarity for users.
Use the same AI action labels consistently.

Responsible AI

Appropriate use of Quick Prompts
Quick prompts are designed to make interactions easier by providing clear, predefined options. This helps users get things done faster and reduces confusion. However, it’s essential to use them in the right situations. They should align with the user’s needs. Quick prompts might be insufficient in complex scenarios where more context or detail is needed. Instead, guided or custom prompts may lead to more accurate and comprehensive responses.

Additionally, ensure that using quick prompts aligns with SAP’s commitment to responsible AI practices and adheres to our SAP Global AI Ethics Policy by completing the AI Ethics Assessment Process. For use cases classified as standard, we recommend completing the AI Ethics Policy Self-Assessment.

User Autonomy
Empower users by giving them the choice to disable quick prompts and AI features in their workflow. Ensure alternative methods are available for users to complete their tasks without relying on AI.

AI Transparency
Ensure clarity in the deployment of quick prompts, making their use and purpose transparent to users. Use clear indicators, like AI icons or buttons, to ensure users know when they’re interacting with AI. Follow our design guidelines to maintain consistency in how these features are presented.

Prevent Bias in Prompt Design
Ensure the prompt design process actively involves measures to prevent bias. Like biased training data, poorly designed prompts can produce skewed or harmful results.

Advocate for a diverse group of users and technical experts to focus on thoughtful, prompt design, conduct comprehensive evaluations of user needs and outcomes, and iterate to guarantee that AI-generated content remains bias-free. Their feedback can influence design decisions or the evaluation process.

Prompt Engineering

Prompt engineering is the process of designing and refining instructions to guide the behavior and output of generative AI models.

Your product team is responsible for engineering top-notch prompts tailored to the foundation models or large language models (LLMs), guaranteeing that users achieve the desired results when utilizing your AI feature with quick prompts.

Follow the best practices and, where necessary, employ advanced LLM techniques like embeddings and fine-tuning to get the best outcomes.

Helpful Terms

Foundation models
Deep learning models trained on large volumes of unlabelled data using self-supervised learning. Applicable to a wide range of tasks.

Large language models (LLMs)
Deep learning models trained on massive amounts of unlabeled data using self-supervised learning. They excel at understanding and generating natural language for a wide range of tasks.

Prompt engineering
The process of designing and refining instructions to guide the behavior and output of generative AI models.

Embeddings
Embeddings enhance prompts by searching a knowledge base for context, providing a semantic representation of relevant documents, and improving the LLM’s ability to find semantically similar information.

Fine-tuning
Fine-tuning LLMs is the resource-intensive process of customizing a pre-trained language model on specific tasks or datasets to make it more proficient and accurate in generating relevant text.