Download Web Design: What`s Next?

Web Design: What’s Next?
Mary Czerwinski
Microsoft Research
PSHFES, May '98
Microsoft Research
Overview
• A Framework for Evaluating Future Web
Designs
– 1. Human Capabilities
– 2. Technological Trends
– 3. Social Use Dynamics
• Examples of Web HCI Trends
• Web Visualization Studies
PSHFES, May '98
Microsoft Research
1. Current Web UI Designs
Weak Support for Human Capabilities
Limited
Vision
(Flat, 2D)
Limited Audio
One Hand
Tied Behind
Back
No Speech
No Gestures
Limited Tactile
1 Person
PSHFES, May '98
Microsoft Research
1. Strong Web UI Design Can
Leverage...
• Perception
– Spatial relationships
• Cognitive
– Pattern recognition
– Spatial, temporal
memory
– Object constancy
– Cognitive chunking
– Auditory
– Attention
– Tactile
– Categorization
• Communication
PSHFES, May '98
– Language
– Gesture
Microsoft Research
– Emotion
2. Exploiting Future
Technologies
• Look for & Exploit Multiple Discontinuities
– Higher bandwidth affords multi-channel use
– 3D: hardware ubiquitous, advanced displays
– Speech + NLP: 30 year research payoff
– Passive tracking: cameras ubiquitous
– USB: multiple input devices
– Audio: rich rendering engines
PSHFES, May '98
Microsoft Research
3. WWW Social Use Trends
• Email is the killer app
• 34.4 M US adults currently use email (up
44% from last year)*
• AOL users say they spend 1/3 of their time
in email, another 8% in chat*
• More powerful communication software
ubiquitous soon
PSHFES, May '98
Microsoft Research
*American Internet User Survey, Cyber Dialogue, Inc., Feb.,
Web Research Framework
• Identify and engage human cognitive abilities
• Exploit technology discontinuities
• Leverage natural social web usage patterns
• Result: easier access to more web information
• Result: dramatic increase in web user base
PSHFES, May '98
Microsoft Research
Example Web Trends: Info Vis
• Users need global and local info when
searching large spaces of WWW
– Global---used to guide lower-level, detailed
tracking of information during a query
• Both levels of detail cropping up in new
browsers
• Lack of empirical evidence of benefits
PSHFES, May '98
Microsoft Research
New Browsers:
The Claims
• Techniques attempt to exploit pattern
perception to enable preattentive
interaction (e.g.,Eick, 1997)
• Cognitive capacity freed up so user can
attend to relevant info related to the
search task
PSHFES, May '98
Microsoft Research
More Claims
• A formula for the next generation UI (Card,
1997) :
– Perceptually-loaded,
– Use human, time-layered interaction (use
human interaction times + object constancy),
– Rely on focus + periphery, animated
transitions, enlarged, 3D spaces and moving
points of view
PSHFES, May '98
Microsoft Research
Revealing Things--Smithsonian
without Walls
• http://www.si.edu/rev
ealingthings/loadindex.html
• Uses everyday objects
to tell stories about
people, their cultures,
... their possessions.
PSHFES, May '98
Microsoft Research
PerspectaView: http://www.perspectaview.com
PSHFES, May '98
Microsoft Research
3D Hyperbolic Space
•Tamara Munzner
(1997)
•Hyperbolic
navigation affords a
Focus+Context view
•Hierarchies of over
20,000 nodes
•User studies badly
needed
PSHFES, May '98
Microsoft Research
Semantic VRML Layouts
Chen & Czerwinski, 1998
PSHFES, May '98
Microsoft Research
Natrifical’s “The Brain”
http://www.natrificial.com
•Custom design your
web sites and docs
•See related
“thoughts”
•Shifting animation
disorienting, lose
sense of place
PSHFES, May '98
Microsoft Research
Speech Trends:
MSR’s WebGuide
Gene Ball--MSR UI Group
PSHFES, May '98
Microsoft Research
Personal Adaptation Trends
•Recommender
Systems
•Preferences
•Profile Info
•Privacy and
Security Issues
PSHFES, May '98
Microsoft Research
Case Study Applying Framework
• UI Research group studies human spatial
abilities to design better electronic worlds
• Research ways of chunking multi-modal
interaction to reduce cognitive load
• Examines 3D text perception at varying
perspectives
• Researches reading to support novel displays
• Explores use of group psychology principles in
support of virtual collaboration
PSHFES, May '98
Microsoft Research
Studies of Browsers:
Goals
• Initial attempt to track user performance
across info vis techniques during queries
• Hyperbolic browser versus hierarchical tree
• PerspectaView’s “flythrough” user interface
• Performance and preference data collected
• “Lostness” measures and spatial abilities
tracked
PSHFES, May '98
Microsoft Research
Experiment 1--Method
•
•
•
•
16 Ss, all pc and web-savvy, ages 18-60
Tree hierarchy and hyperbolic browser
Within Ss design, 512 potential targets
12 searches per browser, browser order
counterbalanced
• RTs, subjective measures, lostness and
spatial ability pretest DVs
PSHFES, May '98
Microsoft Research
Materials
• 512 lower-level entries from Encarta placed
onto the web
• Hierarchical structure built using same
category headers as exist in Encarta today
• 3 levels of eight items in hierarchy
PSHFES, May '98
Microsoft Research
PSHFES, May '98
Microsoft Research
PSHFES, May '98
Microsoft Research
PSHFES, May '98
Microsoft Research
Experiment 1--Results
• Lostness:
– No difference in lostness
– Both hyper and tree browsers scored .38
• Spatial ability
– More predictive of fast hyperbolic searching
(r=-.47 for hyper, -.39 for tree)
PSHFES, May '98
Microsoft Research
Experiment 1--Results
Avg. Search Times by Trial
120.00
Avg. Search Time (in Seconds)
100.00
80.00
Tree
60.00
Hyper
40.00
20.00
0.00
1
2
3
4
5
6
Trial Number
PSHFES, May '98
Microsoft Research
7
8
9
10
Experiment 1--Results
• Subjective Measures
Hyper Tree
Which browser did you like better?
9
7
I liked the browser. (Disagree=1, Agree=5)
3.5
3.62
Right when I started, I knew what I could do with the browser.
3.38
4.44**
It was easy to get where I wanted to go with the browser.
3.8
4.1
The browser uses new technology.
3.06
1.5**
The browser has appealing graphics.
3.94
2**
The browser is easy to use.
3.94
4.19
PSHFES, May '98
Microsoft Research
Experiment 1 Discussion
• No significant advantage for either browser
• Tree hierarchy good for tracking traversal
path if used systematically; overviews
• Hyperbolic browser best for keeping
global/local info in focus; category
relatedness and size
PSHFES, May '98
Microsoft Research
Experiment 2--Perspecta®
• Hyperkinetic text and “fly-throughs”
• Clients include CineMap, AllTheNews and
others
• Global and local information maintained, as
well as “related topics” and cross-references
• Previews of categories before committing
PSHFES, May '98
Microsoft Research
Experiment 3---Perspecta®
PSHFES, May '98
Microsoft Research
Experiment 2--Method
•
•
•
•
•
9 Ss, all PC and web-savvy
18-60 years old, mode=25-35
Access web 4 or more times/week, on avg.
14 movie title searches in CineMap
1st search unassisted, tutorial before
searches 2-14
• Same DVs as Exp. 1 (no lostness)
PSHFES, May '98
Microsoft Research
Experiment 2--Results
Subjective Questionnaire
Rating
Avg.
I liked this software (1=disagree, 5=agree)
When I started using the software, I knew what info was available.
It was easy to get where I wanted to go using this software.
This software is easy to use.
This software feels familiar.
3.7
3.11
2.9
3.33
2.9
•Spatial pretest mildly related to search speed: r=-.28
PSHFES, May '98
Microsoft Research
Experiment 2--Usability Issues
• 1 or 2 clicks?
• Lack of control in time
and space
• Category header issues
• Too many cross-refs
• Related topics trap
• Confusion: headers v.
titles and links
• Small text difficult to
read
• RSI
PSHFES, May '98
Microsoft Research
Experiment 2--Good Features
• User can “sniff” around
without committing
• Use size of category to
guide search
• Use related topics
• Use popup titles and info
without flying in
• Cool!
PSHFES, May '98
Microsoft Research
Experiments 1 & 2: Discussion
• Better than Boolean! Users like visual UIs
• Can see local/global focus, size and
relatedness (hyperbolic browser)
• Can keep track of where you’ve looked
(hierarchical tree)
• Search hints with little user effort
(PerspectaView, hyperbolic browser)
PSHFES, May '98
Microsoft Research
Discussion Continued
• But problems remain:
– Users not as overwhelmed with large sets but
screen real estate challenges
– User/system terminology mismatches & trust
– Anchoring
– Initial training investment is high
– Issues with spatial reasoning abilities &/or age
– Need multiple options for searching
PSHFES, May '98
Microsoft Research
Web Design: What’s Next?
• Look at the trends
– Social aspects of web usage (groupware, email,
chat)
– Technological (hw and sw)
– Interaction styles--speech, adaptation,
portability
• Study human capabilities
• Find the “sweet spot” in the design space
PSHFES, May '98
Microsoft Research