LogoLogo
  • Introduction
  • Design Philosophy
    • What Design Is Not
    • Concision
    • Accessible Configuration
    • Minimal Documentation
  • User Workflow
    • First Launch Experience
    • Normal Launch
    • Always Provide an Undo
    • Always Saved
    • Closing
    • Background Tasks
  • App Launcher
  • Widgets
    • Creating Layouts
    • Providing Feedback
    • Selection Controls
    • Avoid Widgets That Do Nothing
    • Interactive Widgets
      • Welcome Screen
      • Button
      • Search Entry
      • Notebook
    • Containers
  • Reference
    • Iconography
    • Text
  • HIG Style Guide
Powered by GitBook

Links

  • Homepage
  • Support
  • Developer
  • Blog

Other Docs

  • Developer Guide
  • Contributor Guide

Made with ❤️ by contributors from all over the world

On this page
  • Usage
  • Labeling
  • Iconography

Was this helpful?

Edit on GitHub
Export as PDF
  1. Widgets
  2. Interactive Widgets

Welcome Screen

PreviousInteractive WidgetsNextButton

Last updated 4 years ago

Was this helpful?

Welcome Screen

The Welcome Screen is a friendly way to help users get started with your app.

Usage

Typically a Welcome Screen is used for apps like Music or Code where you have to import or create objects in a library before you can interact with them. This provides your users with a clear path to getting started and points out any immediate steps they must take before your app becomes useful.

If your app lets users clear its library, make sure that it returns to the Welcome Screen instead of an empty list.

Labeling

The Welcome Screen consists of two sets of labels:

  • The first set explains the situation and what the Welcome Screen will help you accomplish. As an example, Music's Welcome Screen explains that your music library is empty and that in order for the library view to become useful, we must import songs into our library.

  • The second set of labels consists of the actions that will assist a user in getting started with your app. To use Music as an example again, one possible action is setting your music folder to an alternate location. First we name the action, "Change Music Folder". Then, we describe what the action does, "Load music from a folder, a network or an external disk."

Iconography

Grouped with each action is an icon that helps to quickly visualize it. Most of the time these will be Action icons, but you can use Places icons when importing or setting a location and even Apps icons if you must open a configuration utility.