Native Mobile

Structure

An explanation of how ServiceNow’s native mobile apps are structured.

Overview

ServiceNow's mobile apps share a consistent structure to help users learn the mobile experience more quickly. The task-based navigation and information architecture prioritizes easy navigation and quick access to important info and actions.  

Users engage with screens made up of elements for navigation, information gathering, and actions. These screens come pre-configured by enabled plugins and Mobile App Builder setups.

Diagram of Native Mobile app anatomy

Native Mobile app anatomy

Common screen elements in a mobile app include:

  1. Navigation  
  2. Body content  
  3. Cards
  4. Actions

The first thing a user encounters when opening mobile apps is the launcher screen. From there, users can navigate to other screens in several ways: with the navigation bars at the top and bottom of the screen, by interacting with the body content of the launcher, or through search.

Diagram of Native Mobile app primary navigation

Native Mobile app primary navigation

  1. Navigation bar: Native Mobile apps support primary navigation through a familiar navigation bar at the bottom of the screen. You can define what shows in your nav based on user permissions when you configure your instance.
  2. Search: Search is present throughout the experience to easily find content.
Diagram of native mobile app Stacked navigation pattern

Stacked navigation pattern

Stacked navigation

Screens use a stacked navigation pattern, where each new screen is placed on top of the previous one. This pattern reveals information progressively as users search for what they need, which reduces cognitive overload and guides the user toward what’s next.  

Body content

Body content within screens can be configured within the platform and is different for each screen type. In general, it includes various components to provide information, direct users to other screens, and support search or object creation. The content is ordered in the direction users will read it, automatically supporting both Left to Right and Right to Left Languages.

To learn more about the different screen types and what they support, see Screens.  

  1. Body content: layouts within screens can be different depending on screen type

Cards

Cards are one of the primary body content UIs used throughout the mobile experience to present data to users. Cards display important visuals, text, and data that drive users to key actions. Managing card templates provides an easy way to reuse card layouts. The Mobile Card Builder provides a visual tool to edit the templates and cards used throughout apps.  

Actions

Buttons, links, and other interactive elements on a screen allow a user to change data, navigate to new screens, open mail, make phone calls, send SMS, or open URLs outside of the app.