interaction design (ixd) in the context of user experience (ux)

October 9, 2006

Interaction Design (IxD) in the Context of User Experience (UX)

IA SummitMontreal, QB

March 6, 2005

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Overview

● Defining User Experience (UX)● Breaking down UX● Placing IxD into UX● Defining IxD● Connecting IxD and IA

Designing AJAX & Other Rich Internet Applications

October 9, 2006

What is UX and Where did it come from?

● Well … look no further than the World Wide Web.– Did he just say that UX only applies to the Web?

● Web brought together disconnected and diverse industries in a new catalyzing way.– Software Engineering

● Human Computer Interaction (HCI) – Cog. Psych + CS● Usability Engineering

– Graphic Design/Advertising/Media (publishing & broadcast)

– Library Science– Game Industry

Designing AJAX & Other Rich Internet Applications

October 9, 2006

We need some limits

● Digital Product Design● NOT Experience Design

– That would be our umbrella– Informs the strategy – Includes important issues beyond the

product

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Understanding UXExperts who helped found UX have been

trying to place it in context for a while.

Here are some examples …

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Nathan Shedroff

All the Skills

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Peter Morville

All the Goals

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Jesse James Garrett

Tasks for a Project

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Challis Hodge

All the Disciplines

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Dirk Knemeyer

3 - way layering

Designing AJAX & Other Rich Internet Applications

October 9, 2006

My turn

● Goals of my attempt– Eliminate jargon– Clarify big vs. little

Designing AJAX & Other Rich Internet Applications

October 9, 2006

First there is a solution:

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Predominantly the concept comes from the business side

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Every solution has a form

Designing AJAX & Other Rich Internet Applications

October 9, 2006

And the form is derived by practice that informs it …

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Form is made up of 3 elements:

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Most information is derived from 2 parts

Designing AJAX & Other Rich Internet Applications

October 9, 2006

And they all have disciplines (usually what we argue about)

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Inform/Impact● Strategy

– Foundation that all other processes are reflected against

– Focus that guides and binds– Driven around user need and business requirements

● Research (2 types)– Academic Research creates trends, informs strategy

and other elements.– User Research based on the strategy, and validates it,

informs the formation most directly.

● Validation – takes existing models and evaluates their current strengths and weaknesses.

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Form

We create languages and stories: Syntax, semantics, semiotics, narrative (plot, climax, characters)

I use a model taken from programming to define the elements of form.

A form therefore is a cascading set of objects, which itself is an object:

● Structure – definition and relationship● Behavior – listeners and responders● Presentation – appearance, aesthetic,

tone, personality, context

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Lets map this to disciplines …

● Strategy – business strategy, design strategy, experience design, branding, marketing.

● Research– Academic Research – HCI– User Research – behavioral research (field

research/ethnography, participatory design)

● Validation – some research validates, but mostly this is Usability Engineering

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Mapping con’t.● Structure = Information

Architecture● Behavior = Interaction Design● Presentation = Graphic Design,

Communication Design, Writing, Industrial Design, Information Design, et. al.

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Questions? …

We’re not quite done yet, but thought before getting deeper people might like to ask some questions.

Designing AJAX & Other Rich Internet Applications

October 9, 2006

A Definition of Interaction Design

interaction design defines● the structure and behaviors of

interactive products and services ● user interactions with those products

and services

More @ http://define.ixdg.org/

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Digging Deeper● What are the components of behavior?

– Listeners– Responders

● Impact of designing behavior (or not designing it)– Affordances, conventions, intuitiveness– Managing complexity

Designing AJAX & Other Rich Internet Applications

October 9, 2006

IxD’s focus in a product● Tasks● Flow● User Relationship to Task & Flow● Use over TIME● Interactivity in the presentation layer

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Overlap?There is a continuum here.

Designing AJAX & Other Rich Internet Applications

October 9, 2006

IA & IxD: Couple Made in Heaven

● IA prepares content/information– Findability,Consumption,Creation

– Using metadata, taxonomies, facets, relationships

● IxD presents interaction models for that information to be reached.– Search/Browse

– Wayfinding

– Conent Management Systems - workflow

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Marrying metadata & a rich GUI:

Ford Trucks● Ford Trucks @ Ford Trucks Interactive Towing Guide http://www.fordvehicles.com/towing/popup.asp?type=TRUCK&uid=

● Using a Flash GUI, utilizing Sliders, mouseovers, to manipulate metadata

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Make the Semantic Web BehavemSpace● mSpace @ http://mspace.fn/

● Takes the existing data of the networked space:– Organize search data– Use predictable facets of organization– They call it iTunes + Google

Designing AJAX & Other Rich Internet Applications

October 9, 2006

Thanx!● Questions● UXnet: http://uxnet.org/

David Hellerdave (at) syapticburn (dot) com http://synapticburn.com/

Interaction Design Group (IxDG)http://ixdg.org/