Differences between revisions 53 and 54
Revision 53 as of 2011-01-12 03:33:40
Size: 5554
Editor: eberkman
Comment:
Revision 54 as of 2011-01-12 03:35:40
Size: 5622
Editor: eberkman
Comment:
Deletions are marked like this. Additions are marked like this.
Line 28: Line 28:
||[[Film Strip]]||Present a set of information, which is either a series of screen-sized items or can be grouped into screens, for viewing and selection.||A series of screens are displayed as a continuous strip, with small spaces or markers between them. When a screen is centered, it fills the entire viewport. When scrolled, part of two screens and the divider can be seen at the same time.|| ||[[Film Strip]]||Present a set of information, which is either a series of screen-sized items or can be grouped into screens, for viewing and selection.||A series of screens are displayed as a continuous strip, with small spaces or markers between them. When a screen is centered, it fills the entire viewport. When scrolled, part of two screens and the divider can be seen at the same time.||Carousel, Fixed Menu, Revealable Menu, Pagination, Location Within||

Wrap Up

As we’ve just seen, components are sections of page that may take up the entire viewport, a smaller section, or even appear modally in front of other displayed elements. In this section, you have became familiar with specific component patterns and how these patterns can be appropriately used to display and organize information. When used effectively, these patterns will allow mobile users to have an interactive experience that is enriching and satisfying. When incorporating these component patterns into your design, consider:

  • The user’s needs and their task specific goals.
  • How a user’s mental model and cognitive processing abilities will influence the design of the mobile interface.
  • The design must be visible, provide appropriate feedback, and use constraints to prevent and/or minimize human error.
  • Context of use will dictate how, why and what information is going to be accessed and interacted with.

Chapter 3: Display of Information

This chapter described the importance of displaying information based on the user’s mental model and how we organize this information cognitively. Failure to abide by these principles will most likely cause the user to become lost, confused, frustrated, and unwilling. To prevent this, this chapter explained research based frameworks, tactical examples, and descriptive mobile patterns to use.

Chapter 4: Control & Confirmation

This chapter described appropriate Control & Confirmation patterns that can be used on mobile devices to prevent costly human error resulting in loss of inputted data. When human error may occur, you can incorporate modal constraints and decision points as preventative measures. When considering confirmation controls, consider the user’s context of use. Because an overuse of these constraints and decision points during low risk situations will cause user frustration by increasing their processing time and mental load, and delaying or stopping their task.

Chapter 5: Revealing More Information

This chapter described how to appropriately design for revealing more information. As a designer, you need to become aware that our users, devices, and networks all have limits. Screen size will limit the amount of information that can be displayed at a time. A device’s OS will limit processing and loading times. Our memory limits cause us to filter, store, and process only relevant information over a limited period of time. If we disregard these important principles, then we can expect the mobile user to encounter will encounter performance errors, dissatisfaction, and frustration.

Pattern Reference Chart

Chapter 3: Display of Information

Pattern

Design Problem

Solution

Other Patterns to Reference

Vertical List

Display a set of information, usually text or a text-representation, that uses horizontal space inefficiently.

Rather than using horizontal space inefficiently, displays a set of information vertically using an entire allocated space.

Infinite List, Thumbnail List, Select List, Location Jump, Search Within, Sort & Filter, Titles

Infinite List

A Vertical List is called for, but the information set is very large, and not locally stored, so retrieval time is inconveniently long.

Reveals small amounts of vertical information at a time because the information set is very large, and not locally stored.

Vertical List, Thumbnail List, Select List, Location Jump, Search Within, Sort & Filter, Wait Indicator

Thumbnail List

A Vertical List is called for, but additional graphical information will assist in the user's understanding of items within the data set.

Uses a Vertical List with additional graphical information to assist in the user's understanding of items within the data set.

Vertical List, Select List, Infinite List, Carousel, Grid, Titles

Fisheye List

A scroll-and-select device is targeted, and a Vertical List is called for, but small amounts of additional information can be displayed that would assist the user's task.

When a scroll-and-select device is targeted, and a Vertical List is called for, this can be used to reveal small amounts of additional information that can assist the user's task.

Vertical List,Windowshade, Pop-Up, Pagination, Location Within, Titles

Carousel

Present a set of information, most or all of which are unique images, for selection.

Displays a set of selectable images, not all of which can fit in the available space, but which can be scrolled through using many methods.

Pagination, Location Jump, Grid

Grid

Present a set of information, most or all of which are unique images, for selection.

Displays a continuous array of selectable images, only some of which can be seen at once due to the limited size of the device viewport.

Simulated 3D Effects, Pop-Up, Slideshow, Location Jump, Pagination, Location Within, Carousel, Stack of Items

Film Strip

Present a set of information, which is either a series of screen-sized items or can be grouped into screens, for viewing and selection.

A series of screens are displayed as a continuous strip, with small spaces or markers between them. When a screen is centered, it fills the entire viewport. When scrolled, part of two screens and the divider can be seen at the same time.

Carousel, Fixed Menu, Revealable Menu, Pagination, Location Within

Component Wrapup (last edited 2011-12-13 16:57:45 by shoobe01)