AI User Feedback

Intro

AI user feedback allows users to provide positive or negative feedback about their experience with embedded AI, applicable from component-level feedback to page-level feedback.

AI user feedback default view (left) and detail view (right)

Usage

Use AI user feedback to allow users to share their feedback on their embedded AI experience.

Don't

Don’t use AI user feedback to request feedback that is not related to AI.

Describe which AI experience is being evaluated.
Allow the user to exit the user flow at any time.
Provide a re-entry point in case the user needs to submit feedback later.
Avoid requesting feedback multiple times for the same AI experience.
Display a reasonable number of options for the filter form cells.

Anatomy

A. Header

The header includes a navigation bar that shows the title and a button to exit the user flow or navigate to a previous step in the user flow.

B. Title

The title describes the main purpose of the feedback and indicates what is being evaluated.

C. Description (Optional)

The description includes a detailed description or additional information.

D. Feedback Buttons

The feedback buttons allow users to provide positive or negative feedback. Both buttons are empty by default until the user taps on either of them.

E. Filter (Optional)

The filter form cell in the detail view can be used to collect one or more categories of reasons regarding the selected feedback type.

F. Additional Feedback (Optional)

The key value form cell in the detail view allows users to provide additional information.

G. “Submit” Button (Optional)

The “Submit” button in the detail view is used to submit feedback.

Anatomy of AI user feedback

Behavior and Interaction

Entry Point

AI user feedback can be accessed as follows:

Automatic pop-up: The default view pops up automatically when an AI experience is complete. This entry point is recommended for screen-level experiences.
In-line buttons: The thumbs-up and down buttons appear next to a component when a related AI experience is available for rating. There can be multiple in-line feedback entry points on one screen.
Other buttons or links: A flexible re-entry point is recommended in case the user needs to modify their feedback later. For example, use the overflow button or any navigation menu item that provides access to the AI user feedback flow.

Automatic pop-up (left), in-line buttons (middle), and overflow button (right) entry points

Interaction

Positive Feedback

In a positive feedback user flow, the user taps on the thumbs-up button to submit the feedback. A toast message is displayed to confirm the submission.

Positive feedback user flow

Negative Feedback

In a negative feedback user flow, the user taps on the thumbs-down button to submit the feedback, or to enter the detail view to provide more information as requested. Filter and additional feedback can be marked as mandatory or optional depending on the use case. The user needs to manually tap on the “Submit” button to submit feedback.

Negative feedback user flow

Change of Mind

In a negative feedback user flow, when the user taps on the thumbs-down button to enter the detail view, the user can change their mind by tapping on the thumbs-up button, and the positive feedback will be recorded.

Negative to positive feedback user flow

Interaction State

Success State

In either a positive or a negative feedback user flow, once the result is submitted, a toast message is displayed to confirm the submission.

Toast message in a success state

Error State

If an error occurs before the submission, which can be caused by a missing field or a wrong value, the in-line error message is displayed following the default nested component behavior. See filter form cell and key value form cell for more details.

If an error occurs during the submission, which can be caused by loss of connection or data transfer errors, the content of the bottom sheet is replaced by an illustrated message with the error message, and the user can exit the flow to submit later. See illustrated message for more details.

Illustrated message (left) and in-line error handling (right) in an error state

Variations

Modal view: When showing AI user feedback in a modal view, the main content lives in a bottom sheet with flexible modal height, including default height, mini, medium, and large sizes.

Activity view: When showing AI user feedback in an activity view, it is displayed in a bottom sheet with a fixed height.

Modal view (left) and activity view (right)

Intrusive vs. Non-intrusive Flow

Block user interaction: Showing an overlay behind the AI user feedback view blocks any user interaction. This is typically used in a modal view.

Allow user interaction: User interactions can be allowed when there is no overlay behind the AI user feedback view. The user can provide their feedback while scrolling the content behind the screen. This is typically used in an activity view.

Intrusive flow (left) and non-intrusive flow (right)

Adaptive Design

AI user feedback uses a bottom sheet as the container on a compact screen. On a regular screen, there are two container options: An inspector or a pop-over.