Designing Beautiful Android Apps

Android UX/UI

Basic Steps

  1. Basic ERD
  2. Screen List
  3. Screen Relationship Diagram
  4. Group Screens in Screen Relationship Diagram
  5. Choose Navigation Patterns -> refine Screen Relationship Diagram
  6. Sketch Wireframes
  7. Digital Wireframes

Descendant Navigation

There is a clear hierarchy when navigating between screens.

Lateral Navigation

Is when you need to navigate between sibling screens. There are two types:

Collection Related Screens

Screens represent individual items in the collection represented by the parent

Vertically scrolling lists: Use for small amount of items; For collection-related screens, and especially for textual information,  are often the most straightforward and familiar kind of interface.

Gid Lists, horizontally scrolling lists (Carousels), Stacks (Cards): Used for more Visual or media-rich content items such as photos or videos. These UI elements are generally best used for presenting item collections or large sets of child screens (for example, a list of stories or a list of 10 or more news topics), rather than a small set of unrelated, sibling child screens.

Section Related Screens

Represent different sections of information about the parent. One section may show textual information about an object while another may provide a map of the object’s geographic location

Navigation patterns
Dashboard: is a grid of large, iconic buttons that constitutes the entirety, or most of, the parent screen.

Tabs: are most appropriate for small sets (4 or fewer) of section-related screens.

Horizontal paging: also referred to as swipe views list of categories (world, business, technology, and health stories). Like tabs, this pattern also allows grouping screens in that the parent presents the contents of child screens embedded within its own layout. Appropriate where there is some similarity in content type and when the number of siblings is relatively small

Published by

Parampal

Mobile App and Web Dev.

Leave a comment