AI-generated Key Takeaways
-
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.
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.
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.
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.
