Your Search Results

    Entry sheet

    Important: This information is out of date; for up-to-date information on using these design patterns, as implemented in Firefox OS building blocks, go to our Firefox OS building blocks page.

    An entry sheet is used to edit a single setting or option in your app that either contains a large number of possible values (such as a text entry form or a long list of choices) or requires multiple inputs or selections, such as configuring and connecting to a WiFi network.


    • Occupies the entire screen.
    • The user should be given the impression that they're on the same page as whatever user interface element that caused the entry sheet to open; the entry sheet should be perceived as a temporary modal overlay. The user hasn't navigated deeper into a hierarchy of interface pages. To reinforce this impression:
      • Valid animations when opening an entry sheet include things like sliding in from the top or bottom, a cross-fade, scaling in, and the like.
      • "Cancel" buttons should be used instead of "Back" buttons.
    • Every element in the entry sheet must be related to adjusting a single setting, and there should not be links to other pages, lists, or dialog boxes.
    • The user will typically have two options to close an entry sheet: a Cancel button, and a button that accepts the user's data (this may be labeled "Done", "Send", "Join", or the like—it should be a verb describing what action will occur when the sheet is closed).


    These mockups give a basic representation of what an entry sheet might look like.

    need screen shots


    See also

    Document Tags and Contributors

    Contributors to this page: Sheppy, murali24, chrisdavidmills, kscarfone
    Last updated by: chrisdavidmills,