2D vs. 3D
Adam Phillippy
Michael Schatz
CMSC 838S
April 4th, 2005
2.1D Successes


Modest use of 3D to add
highlights to 2D interfaces:

Raised/Depressed Buttons

Overlapping Windows &
Shadows

Icons that resemble real-world
objects
Now a standard component of
desktop metaphor
3D Success Stories

Natural 3D Visualizations



Medical Imagery, Architectural
Drawing, Computer Assisted
Design, Scientific Simulations
Continuous variables, volumes,
surfaces, inside and outside, left
and right, below and above are
intrinsically meaningful.
Game Environments


First person shooters, role playing
fantasy, virtual 3D environments
Increasingly rich social contexts
based on social cognition
Interface Issues
3D Issues
3D Failures






Air-Traffic Control Systems (ambiguity)
Hierarchical Browsing (occlusion, navigation)
Line & Bar Charts (distortion, ambiguity)
Digital Library (poor search, linking)
Desktops & Workspaces (orientation)
Web Browsing (screen space)
3D Ambiguity

Projective ambiguity


3D on a 2D display creates
ambiguity in all 3
dimensions
2D shadows help
disambiguate x,y position

Orientation ambiguity


3D models provide limited
information
Other icons may be
necessary to resolve
Information Availability
Smallman, H. S., St. John, M., Oonk, H. M., and Cowen, M. B. 2001. Information
Availability in 2D and 3D Displays. IEEE Comput. Graph. Appl. 21, 5 (Sep. 2001), 51-57.
Empirical Results

Controlled experiment with 32
users performing search tasks
across interfaces

Confirmed results of a prior
study (orange), but that study
compared across information
visibility styles in addition to 2D3D differences.

2D is clear winner when
comparing with consistent
information visibility (green).
Hierarchical Data
•
Rooted, Directed relationships
•
•
File Systems, Organization Trees, …
Traditional Node-link diagrams require space proportional to
number of children at different levels
•
Overall aspect ratio grows exponentially with depth
Cone Tree & Cam Tree
“The clearest win in this technology is interactive animation. It is
easy to demonstrate that animation shifts cognitive load to the
human perceptual system.”
Robertson, G. G., Card, S. K., and Mackinlay, J. D. 1993. Information visualization
using 3D interactive animation. Commun. ACM 36, 4 (Apr. 1993), 57-71.
Cone Tree

Issues




Occlusion
Navigation
Orientation
Contrast with

SpaceTree


Same animation
benefits
TreeMap

1,000,000 node
displays
Perspective Wall

Details are
presented with
overview via
fisheye-like zoom
for linear data

Sharp distortion at
wall boundaries.
Robertson, G. G., Card, S. K., and Mackinlay, J. D. 1993. Information visualization
using 3D interactive animation. Commun. ACM 36, 4 (Apr. 1993), 57-71.
XML3D

Visualize the link structure
for web sites using
hyperbolic zoom.

Support web content
creators placing new
content into existing
hierarchy
Risden, K., Czerwinski, M., Munzner, T., Cook, D. An initial examination of ease of use for 2D and 3D
information visualizations of Web content, International Journal of Human-Computer Studies, v.53 n.5,
p.695-714, Nov. 2000
XML3D Empirical Study

Controlled Experiment
with 16 users and 4
tasks.

Measure performance
relative to 2D
hierarchical displays
(Windows Explorer).

Statistically significant
performance
improvement for
search tasks when
category is present.
3D or not 3D

Input


Output


Screens are planar
User cognition



Mice offer only 2 degrees of freedom
Naturally operate in 3D world
Awareness, perception, reasoning, and judgment
Costs and benefits?
2D Navigation

3 degrees of freedom
1.
2.
3.

Up / Down
Left / Right
Rotate XY
Input controls


Mouse (2)
Arrow keys (2)
3D Navigation

6 degrees of freedom
1.
2.
3.
4.
5.
6.

Forward / Back
Left / Right
Up / Down
Pitch (transverse axis)
Yaw (normal axis)
Roll (longitudinal axis)
Input controls




Mouse + arrow keys (4)
Flight stick (5)
3D Mouse (6)
Body Reference
Output Devices

Flat monitor

Stereoscopic


Relative motion






“3D” glasses
Kinetic depth
Motion parallax
Eye tracking
Head mounted
Retinal displays
Holographic
Coupled Input/Output

Ware and Franck

Find path of length 2
between 2 nodes

2D projection


3D stereo with tracking



~26% error
~8% error
Timings roughly similar
Limited interaction


Head/hand coupled
Motion was effective, but
timing suffered
Summary

Positives




Missing features


3D information visualization has promise
Eye tracking for parallax effect
Stereo for depth
3D input device for rotation
Negatives


Uncomfortable for user
Hardware not widely accessible
C. Ware and G. Franck, “Evaluating Stereo and Motion Cues for Visualizing Information
Nets in Three Dimensions,” ACM Trans. Graphics, vol. 15, no. 2, 1996, pp. 121-139.
Spatial Memory

Robertson’s Data Mountain


Leverage spatial abilities while keeping interaction simple
Faster and more accurate than IE4 Favorites
Summary

Positives

Leverages spatial and image memory







Users remembered their layout after several months!
Simple navigation (point and click)
Keeps user orientated at all times
Limits occlusion and clutter
Keeps text readable via pop-ups
3D audio enhances sense of depth
Missing features



Auto alignment
X-ray vision
Dynamic filters
G. Robertson et al., “Data Mountain: Using Spatial Memory for Document
Management,” Proceedings of UIST’98, 1998, ACM Press. 153-162.
2D vs. 3D Spatial Memory

Where did I…

Leave Firefox?


Park my car?


2D (2½D) parking lot
Park my spaceship?


2D window manager
3D space
Which is the most effective for memory?
2D vs. 3D Spatial Memory

Cockburn and McKenzie

Compare 2D vs. 2½D vs. 3D Data Mountain

Both virtual and physical interfaces
2D vs. 3D Spatial Memory


Users surprised by their spatial memory
Subjective ratings




Preferred physical over virtual
Physically least cluttered: 2D > 2½D ≈ 3D
Physically quickly found pages: 2D > 2½D > 3D
3D felt “cluttered” and “inefficient”
Summary

Skeptical of 3D document retrieval

As dimensionality increased



Speed decreased
User preference decreased
Spatial memory clearly effective

But...

3D hindered retrieval, even in the physical world
A. Cockburn, B. McKenzie, “Evaluating the Effectiveness of Spatial Memory in 2D and 3D Physical
and Virtual Environments,” Proc. ACM Computer-Human Interaction Conf. Human Factors in
Computing Systems, ACM Press, 2002, pp.203-210
Representation Matters
W. Ark, et al., “Representation Matters: The Effect of 3D Objects and a Spatial Metaphor in a
Graphical User Interface,” Proc. Human-Computer Interaction Conf. People and Computers XIII,
Springer-Verlag, 1998, pp.209-219.
Information Visualization Success


Success is often due to design features that make the interfaces
even better than reality

Interface controls are as important as the graphics display

Metrics help guide design

Usability testing is essential
“… it might be more important to fight for two versus three clicks
than to debate 2D versus 3D.”
Shneiderman, B. 2003. Why Not Make Interfaces Better than 3D Reality?. IEEE
Comput. Graph. Appl. 23, 6 (Nov. 2003), 12-15.
3D Guidelines

Use occlusion, shadows, perspective carefully

Minimize the number of navigation steps for users to accomplish their tasks

Keep text readable

Avoid unnecessary visual clutter, distractions, contrast-shifts and reflections

Simplify user and object movements

Organize groups of items in aligned structures to allow rapid visual search

Enable users to construct visual groups to support spatial recall

Allow teleportation, x-ray vision