2. Everybody’s talking RIA.
So what’s this about?
While not entirely a case study, it’s about the
observations I made when I was thrust into the
development of a high-profile RIA.
3. First, what does an Information Architect do?
The structural design of an information
space to facilitate task completion and
intuitive access to content.
>
Organizing info so
people can find stuff
…I’m one
Information Architecture for the World-Wide Web Louis Rosenfeld & Peter Morville
4. A History of Communication
(Highly Abridged Version)
Two people speaking face-to-face
Narrative Archive Reproduction Speed Distance Quantity Immediacy
5. A History of Communication
(Highly Abridged Version)
Archived graphic narrative
Narrative Archive Reproduction Speed Distance Quantity Immediacy
6. A History of Communication
(Highly Abridged Version)
Archived written narrative
Narrative Archive Reproduction Speed Distance Quantity Immediacy
7. A History of Communication
(Highly Abridged Version)
Archived graphic & written narrative
Narrative Archive Reproduction Speed Distance Quantity Immediacy
8. A History of Communication
(Highly Abridged Version)
Reproduction of archived
written & graphic narrative
Narrative Archive Reproduction Speed Distance Quantity Immediacy
9. A History of Communication
(Highly Abridged Version)
Faster reproduction of archived
written & graphic narrative
Narrative Archive Reproduction Speed Distance Quantity Immediacy
10. A History of Communication
(Highly Abridged Version)
Reaching across distances
Narrative Archive Reproduction Speed Distance 1-way Quantity Immediacy
11. A History of Communication
(Highly Abridged Version)
Increased sharing and access to
larger amounts of information
Narrative Archive Reproduction Speed Distance 1-way Quantity Immediacy
12. A History of Communication
(Highly Abridged Version)
Real time, mobile, human interaction
both intimate and public
Narrative Archive Reproduction Speed Distance 1-way Quantity Personal
13. Make Communication Methods…
More Relevant: Timely or Informed
Available to More People: n-to-n
Cover Greater Distances: Space & Time
All this in order to replicate as closely
as possible…
Narrative Archive Reproduction Speed Distance Quantity Immediacy
14. The experience of two people
speaking face-to-face
Narrative Archive Reproduction Speed Distance Quantity Immediacy
15. Defined
Rich Internet Application: (RIA) are web applications that have the features and
functionality of traditional desktop applications. RIAs typically transfer the
processing necessary for the user interface to the web client but keep the bulk of the
data (i.e. maintaining the state of the program, the data etc) back on the application
server.
Some of the most recognizable attributes of RIAs are:
…fluidity in their behavior
…speed in their responses
…engaging in their appearance - more than typical HTML web sites
16. What’s the buzz?
• Customer Experience is in the driver’s seat
• Design-Centric vs. System –Driven
• Improved Performance
• The Design is the Code so no need for copious mounts of IA artifacts
17.
18. 6 things I think I thought going in…
High-profile: The design team had done an
excellent job of marketing the application internally
creating intense pressure to deliver based largely
on a static presentation
Design looks real and finished in the minds of
stakeholders
Work from predecessor – Specialist in social web
and its implications. Not an area that I’d focused
on much
How is the effort different from HTML design?
Lack of familiarity with the implementation needs
The Hammer problem: “When the only tool you
have is a hammer every problem looks like a nail.”
I didn’t want limitations on my part to drive the
process into my personal safe-zone simply
because it’s what I know
19. Strategic View
Limited Prototype: Developed around the particular needs of a single context –
Las Vegas, and several issues around scalability had not been addressed – Islands
Regions, Destination vs. Activity driven paths
Existing IA Effort: Very little in terms of IA work to consume. Predecessor was
split between two engagements one of which would become a new business unit
under his supervision
Maintenance: No CMS or digital asset management systems in place to enable a
reliable roll-out or maintenance plan
Urgency: Everybody wants it NOW! -CEO, CMO, Suppliers, Partner Marketing,
Customers and the Press
20. Tactical View
Scope: A detailed and long-term feature/user story list had not been qualified
Usability: The design that had been so aggressively marketed had not undergone
any scrutiny from a usability standpoint
Content: Several content areas had not been fleshed out and the need for
interaction design prior to committing to code still existed
Navigation: Proposed list of initial destinations included different types of paths
that had not been distinguished from each other
21. What to do first?: Review the Foundation
Usability Testing of Existing Prototype
Observed how a new, richer interface did or did not
influence entrenched expectations for the outcome of a
task.
Transference
Emphasis on Quantitative vs. Qualitative info
Saw (again) the impact of big pictures
Collected pragmatic ammunition to battle “giddiness”
22. What to do first?: Review the Foundation
Usability Testing of Existing Prototype
Feature Analysis
Qualified features and functions against three criteria
Mapped back-log sequencing to user need
23. What to do first?: Review the Foundation
Ratings from
1 to 5
5 being highe
st
24. What to do first?: Review the Foundation
y
bi l it
Leas
t Fl exi
Fl e x
ib il i t
y M ost
x3 x2 x1
25. What to do first?: Review the Foundation
So rt o
weightn the
ed scor
Multiply the values in es
each column by their x1 x2 x3
weight from the matrix
26. What to do first?: Review the Foundation
Usability Testing of Existing Prototype
Feature Analysis
ID For Content Areas Yet To Be Characterized
Agreed with design team on Key-frames as reference
points for wireframes (YES wireframes!)
Developed additional visual vocabulary to communicate
rudimentary transitions without being too prescriptive
27. What to do first?: Review the Foundation
Visual Vocabulary
Simple notation to
take in transitions
within static
artifacts
28. What to do first?: Review the Foundation
Usability Testing of Existing Prototype
Feature Analysis
ID For Content Areas Yet To Be Characterized
Identified Different Context For Navigation Used To See
Inventory
I want to go to...Las Vegas, New York, The Caribbean
I want to… Ski, Surf, Save Money
29. What’s Different?
Vocabulary: There is some language that
comes with RIA development that is an
outgrowth of its visual fluidity. This affects
traditional artifacts
Business Logic in the UI: There is more
going on in the UI than there used to be vs. the
back-end. This informs the efficacy of certain
interactions
ID Context: Interaction design often driven at a
component vs. a page level
Rev Cycles: Lead-times between functional
and visual design can be longer
Hype: Higher “Giddiness” factor that comes
from stakeholders’ seeing cool, shiny moving
prototype
30. What’s The Same?
The process: Idea, Plan & Build
Planning: The need to do low-risk, functional
prototypes devoid of design elements
Tactics: The need to assess your surroundings and
choose tactics appropriately
Balance: IA bringing balance between the System
and the UI. However, the desire to forge ahead
without planning that used to come from technology
is coming from design
Vision: Discipline in keeping the big picture in front
of individual features
Collaboration: Discipline in validating feasibility of
features with technical development
31. Pitfalls To Avoid
Revision Cycles: Don’t assume that
visual edits are as easy in Flash as in
HTML
Tone-Setting: Not killing the
excitement with pragmatism
Interaction Design: Not getting
caught up in the interaction at the
expense of content or “The Rube
Goldberg”* school of interaction for its
own sake.
*Rube Goldberg (rōōb gōld’berg), n. a
comically involved, complicated
invention, laboriously contrived to
perform a simple operation – Webster’s New
World Dictionary
