R you know more than you think you do IA

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. Everybody’s talking RIA. So what’s this about?

Two people speaking face-to-face Narrative Archive Reproduction Speed Distance Quantity Immediacy A History of Communication (Highly Abridged Version)

Archived graphic narrative Narrative Archive Reproduction Speed Distance Quantity Immediacy A History of Communication (Highly Abridged Version)

Archived written narrative Narrative Archive Reproduction Speed Distance Quantity Immediacy A History of Communication (Highly Abridged Version)

Archived graphic & written narrative Narrative Archive Reproduction Speed Distance Quantity Immediacy A History of Communication (Highly Abridged Version)

Narrative Archive Reproduction Speed Distance Quantity Immediacy Reproduction of archived written & graphic narrative A History of Communication (Highly Abridged Version)

Narrative Archive Reproduction Speed Distance Quantity Immediacy Faster reproduction of archived written & graphic narrative A History of Communication (Highly Abridged Version)

Narrative Archive Reproduction Speed Distance 1-way Quantity Immediacy Reaching across distances A History of Communication (Highly Abridged Version)

Narrative Archive Reproduction Speed Distance 1-way Quantity Immediacy Increased sharing and access to larger amounts of information A History of Communication (Highly Abridged Version)

Narrative Archive Reproduction Speed Distance 1-way Quantity Personal Real time, mobile, human interaction both intimate and public A History of Communication (Highly Abridged Version)

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

Narrative Archive Reproduction Speed Distance Quantity Immediacy The experience of two people speaking face-to-face

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 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

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 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

6 things I think I thought going in… 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 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

Urgency: Everybody wants it NOW! -CEO, CMO, Suppliers, Partner Marketing, Customers and the Press 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

Navigation: Proposed list of initial destinations included different types of paths that had not been distinguished from each other 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

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” Usability Testing of Existing Prototype What to do first?: Review the Foundation

Qualified features and functions against three criteria Mapped back-log sequencing to user need Feature Analysis Usability Testing of Existing Prototype What to do first?: Review the Foundation

What to do first?: Review the Foundation Ratings from 1 to 5 5 being highest

What to do first?: Review the Foundation Least Flexibility x3 x2 x1 Most Flexibility

What to do first?: Review the Foundation x2 x1 x3 Multiply the values in each column by their weight from the matrix Sort on the weighted scores

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 ID For Content Areas Yet To Be Characterized Feature Analysis Usability Testing of Existing Prototype What to do first?: Review the Foundation

Visual Vocabulary Simple notation to take in transitions within static artifacts What to do first?: Review the Foundation

Identified Different Context For Navigation Used To See Inventory ID For Content Areas Yet To Be Characterized Feature Analysis Usability Testing of Existing Prototype I want to go to... Las Vegas, New York, The Caribbean I want to… Ski, Surf, Save Money What to do first?: Review the Foundation

Hype: Higher “Giddiness” factor that comes from stakeholders’ seeing cool, shiny moving prototype 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 Rev Cycles: Lead-times between functional and visual design can be longer ID Context: Interaction design often driven at a component vs. a page level 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

Collaboration: Discipline in validating feasibility of features with technical development 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

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

Q & A