Skip to content

Platform app navigation UI #171

Open
@jace

Description

@jace

There are two crucial factors that influence the design of UI on a platform app or website:

  1. A platform's UI must cater to three parties: the current user, who is a consumer of whatever the platform is currently offering, the producer of that content on offer, and the platform itself, which provides some standard functionality. This distinguishes platforms from regular apps, where the producer and the platform are the same. Some navigation elements will be provided by the platform and some by the producer. Since the producer's navigation will vary from producer to producer, the difference between this and the platform's navigation must be readily apparent to the consumer. For example in GitHub repositories, the folder structure within a repo is by the producer, while the tab bar above it is from the platform.

  2. Mobile native apps do not use URLs for navigation, and do not have tabbed interfaces to let users bookmark content for later perusal. Android devices have a back button to let the user move one step back from anywhere, but iOS lacks even this. On native apps, having unambiguous navigation to let a user traverse between pieces of content is extremely critical. This may manifest as a platform constraint preventing producers from organising content in a tree structure.

Sidebars on mobile have an established pattern of representing the consumer's content, with things like account pages, bookmarks and settings, all typically less used than platform or producer content. This pattern now overrides the web convention of putting the producer's navigation in the sidebar. Baseframe should provide a UI layout in the MUI theme that reflects this: consumer navigation in the sidebar, platform navigation in the header, and producer navigation plus content in the main content area.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions