Stay organized with collections
Save and categorize content based on your preferences.
This section describes how content browsing works in media apps, including how users navigate to lower-level views with more detail.
The process of browsing content in a media app involves:
Viewing grids or lists of content
Selecting browsable content items (that is, items that represent a collection of items, as opposed to being playable) to navigate to more detailed views of those items
The detailed view of a content item exists on a lower level of the content space, also formatted as a grid or list. Users can navigate upward from lower levels using a Back affordance in the app header.
Grid and list views of content
Media content can be presented in a grid view, a list view, or a combination of both in the same content space. Content can be organized into categories separated by subheaders. Users browse through the grids or lists by scrolling vertically.
Grid and list formats are shown here at the top level of the content space. Either format can be used at any level.
Navigation to levels with more detail
As users browse within the content space, they can select a browsable content item (such as an album or playlist) to navigate to a more detailed view of that item (songs on the album, or individual items on the playlist). When a user begins to move deeper into the content space in this way, an app header appears at the top of the screen, including an affordance that allows the user to return to the previous level.
Here, tapping the back arrow on the app header returns the user to the top level of the content space
As users scroll through a grid or list of content, an app bar (or app header) at the top of the screen remains fixed in place, with the content scrolling behind it.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-07-23 UTC."],[[["Media apps utilize grids, lists, or a combination of both to display browsable content, allowing users to navigate to detailed views."],["Selecting browsable items within these views leads users to lower-level content spaces, also structured as grids or lists, with an app header facilitating navigation back to higher levels."],["An in-app search functionality, discussed in a separate section, offers an alternative method for users to locate content."],["Content browsing involves vertical scrolling through grids or lists, often categorized using subheaders for better organization."],["The app bar or header remains fixed at the top during scrolling, ensuring consistent navigation and access to controls."]]],[]]