Differences between revisions 8 and 9
Revision 8 as of 2010-12-07 03:39:18
Size: 3689
Editor: shoobe01
Comment:
Revision 9 as of 2010-12-07 04:12:00
Size: 3948
Editor: shoobe01
Comment:
Deletions are marked like this. Additions are marked like this.
Line 25: Line 25:
When items are selected and directly manipulated, they may be When items are selected and directly manipulated, they may be rotated
Line 29: Line 29:
Only one of these types of movement may be allowed.
Line 30: Line 32:
Line 46: Line 47:
Avoid use of multiple types of interaction methods. Movement via on-screen gestures will tend to change the user's frame of reference enough they may tilt the device, and rapidly loose control.

Suggest device flipping also (especially multi-screen multi-side devices), but mostly rotating the virtual space to see the other side of an object. On-screen gesture, kinesthetic gestures, etc. ALSO all other 3D effects, like cube displays, etc. Find mobile equivalent of Fast User Switching on mac, and other weird 3D ways of getting to more data. Moving things out of the way, looking around or to the side of an object, etc.

Problem

Display a small amount of directly related information, provide access to related controls or settings, or provide an alternative view of the same information, in an organic manner.

Solution

Use Simulated 3D Effects to pretend components on the page, or even the whole page, merely presents one side of a physical object. Rotating the object, moving it aside, or looking past it, can then be used

Note that this is labeled as "Simulated" as it does not require actual 3D display technology. Some display methods can even be simulated without particularly involved graphics processors. If the pattern seems useful for your design, investigate ways to accommodate it with the technology available.

This pattern works best when direct manipulation of the screen or the device is used. It will rarely work well on scroll-and-select devices without accelerometers.

Variations

To use Simulated 3D Effects, one of three methods of interaction, and the associated methods, will be used:

  1. Screen gesture... flip items or the whole screen to a side or move items to see those behind.
  2. Device gesture... accelerometer, maybe using machine vision (camera) as a backup... rotate slightly to peek around items, move them with simulated gravity (items slide away)
  3. Viewing point, using Machine vision of some sort, or actual 3D when available... move head, screen can see and react to simulate 3D... look around items by moving the head relative to the screen... parallax effects...

In the event the device has two screens, one on each side, a device gesture that rotates from one side to the other may display related information on each screen, without using simulated 3D effects...

Interaction Details

When items are selected and directly manipulated, they may be rotated - rotated - slid away

Only one of these types of movement may be allowed.

When device gestures or viewer movements are used, any items effected will follow imposed physics, and react to the movement instead.

OFTEN NEED TO BLOCK INTERACTION WITH THE OBJECTS OR USE CAREFUL GESUTRES TO KEEP INTERFERING...

Presentation Details

Details of the presentation are almost unlimited, offering even more scope than most other interactive patterns. From geometric shapes to natural scenes with leaves and grass, anything is possible. Make sure the style used matches the OS, or the brand of the product or service, and that it is still understandable and usable.

The shapes must look 3D, so the user expects to find additional information with an interaction, even when closed. This may be as subtle as providing a shadow to indicate the item has height. Try to add additional details, such as movement, or build imperfections into any machine-vision or accelerometer-based systems so minor actions will cause the other faces or items behind to peek out.

Items on the screen which are not directly related to the interaction reveal method should generally exist within the simulated 3D environment. Lighting changes will fall on them, items which move must pass over or under them, or bump into or bounce off them, and so forth.

Antipatterns

Avoid using secondary interactive methods to change the on-page elements.

Avoid use of multiple types of interaction methods. Movement via on-screen gestures will tend to change the user's frame of reference enough they may tilt the device, and rapidly loose control.

Examples

Simulated 3D Effects (last edited 2012-03-02 21:25:16 by shoobe01)