Native Mobile / Components

Now Assist context menu

Also referred to as: NACM, Formerly Write with Now Assist

Overview

  • Release version
    Yokohama
  • Available sinceYokohama
  • A11YWCAG 2.2 AA
Figma link
Now Assist context menu Figma component

Figma library with components for designing Native Mobile.

ServiceNow Docs link
Now Assist Context Menu documentation

Implementation and administration guides

Figma link
Now Assist Context Menu Figma component

Figma library with components for Native mobile

Motion guidance

Component library for Now Assist animations

When to use

For mobile environments, the Now Assist context menu supports input form screens for Now Assist skills such as Task Summarization and Closure/Resolution Notes Generation.

When not to use

For mobile, the Now Assist context menu does not support any other skills and currently can’t be used for individual text input fields.

Anatomy

iOS

iOS

Android

Android

1. Sheet: Slides in from bottom of screen when Now Assist Context Menu is triggered 2. Refine menu: Refine options that are presented to the user when “Refine” button is tapped (BUs can configure their own refinement options - please reach out to our team if you have any questions on what is available or possible for your team). 3. Feedback: Feedback mechanism that is fired as soon as the user taps an option 4. Close: User can close the sheet but their generated responses will be lost 5. “Replace”: Selecting this option will replace the highlighted text in the text input area with the generated response and close the sheet (all previously generated content will be lost once the sheet closes) 6. Delete: This will delete the original or originally generated text in the main input area (user will see a confirmation message).

Variants

The Now Assist Context Menu has 2 variants: the Generating state and the Static state.

Generating

Use the Generating state when you’ve just executed a refine option.

Generating

Static (ready for further refinement)

The Static state appears after refined text has been generated.

Static

Configurations

Additional refine menu options

If you have several refine options (subcategories), you can use a nested menu. (Note - this example is not indicative of the refinement options available today)

Configuration - Refine

Alignment and positioning

Left align all content except for the initial “refine” UI action for the Android experience.

Alignment and Positioning

Initial “refine” UI action is left aligned for iOS and center aligned for Android.

Interactions

Inline and Skeleton Loader

Use the skeleton loader when content is being generated by Now Assist.

Inline and Skeleton

1. Inline Loader: The inline loader shows the sparkle icons in a rotating animation as the text maintains a loading status. 2. Skeleton Loader: The animated skeleton loader has a subtle pulse animation and serves as a placeholder to indicate inbound text being generated.

Text Streaming Animations

Use the skeleton loader when content is being generated by Now Assist.

1. Streaming Animation: As the newly generated text is loading into the view, it will appear in a progressive display pattern where text appears simulating natural typing or response generation.