for a good user experience: ux design goals, methods, tools & tales

7/27/2019 For a Good User Experience: UX Design Goals, Methods, Tools & Tales

1/27

For a Good User Experience

UX Design Goals, Methods, Tools & Tales

William Washington | Washington

Kevin Makice| Indiana

Kuali Student UX


2/27

Next-generation

People-centric

Rich user experience

Kuali Student Vision


3/27

Getting from here to there

DevelopmentEvaluation &

AdoptionUse

Here

Functional

Needs UserNeeds

Experience


4/27

Experience

Development Adoption Use

Design

(iterations)

PrototypeEvaluate

Analysis

Requirements emergeas users begin to see the

evolving design...when

they see what you're

building, they'll say whatthey meant.

- Alan Cooper

User Centered Design is a solution


5/27

Useful

UsableDesirable

The Goals of UCD

Design is not just what it

looks like and feels like -

Design is how it works.

Steve Jobs


6/27

A design discipline that is implementedthrough UCD

Concerns itself with all aspects ofa persons experience with a product:behavior, form, and content.

User Experience Design (UX)


7/27

Simplicity

User Control &Freedom

Orientation &Exploration

Good metaphors

The UX Perspective

Consistency & Standards

Error prevention &recovery

Good feedback

Efficiency of use

Good help, when needed


8/27

Core Team:UX Strategy, Design Patterns, Navigation

Architecture, etc.

UXA & Sr. UX Designer on Core team

Parallel Delivery Teams:Delivery of functional areasUX Designer on each Parallel Delivery Team

UX team & methodology are in place


9/27

Kuali Studentis moving toward

Agile development.

The system functions

evolve from simple to

complex through

iterativedevelopment.

UX and UCD must fit into an Agile process

Iterate

Backlog & prioritizeusability and functionalenhancementsBacklog

Design &Develop

simplest solution

Evaluate

throughimplementation


10/27

The user interface of KS is built

on an evolving Rice foundation KRAD.

Gaps existbetween what KRAD can do and what KS needs.between what KRAD can do and what developers can do.

Gaps must be tracked and managed.

UX must work within technical constraints


11/27

Design patterns& style guide

UI templates

& stencilsfor rapid prototyping

Well-managed

UI framework gaps

Successful UX in an Agile context

UIM

Axure Library


12/27

Design patterns are

time-tested solutions

to recurringdesign problems.

User Interface Model (UIM)


13/27

Development

Quality

Assurance

Collaborative

Design

UX Dev PO

Backlog UIM

The UIM is a key

resource for PDT

collaboration.

Helps UX make UIdecisions

Provides sample code toDevelopers

Reveals known gaps tohelp PO prioritize

Vision for the UIM


14/27

UIM

UI Patterns

Early Analysis

UX Principles

UX Dev PM

UX Dev PO

Patterns are defined

and validated

User research identifiesnew design needs

Core analysis expressesdesired user interfaces

PDT Development revealsreal-world interaction

solutions

Building the UIM

UI Patterns

PDT Development

Collaborative Design

& Development

Core


15/27

UIM

UI PatternsKS Kitchen SinkKRAD

Dev UI Dev UX

Building the UIM

SMEUsers

Validate UIM

through

user testing

ORMock Code

Our collective

knowledge is stored

in the UIM.

UX research informsthe rationale for

what we need to build

Kitchen Sink validateswhat can be built

PDT iteration reveals newpatterns to validate


16/27

Axure is software

for wireframing

and rapid prototypingof web and desktop

applications.

Applying the UIM to Axure widgets


17/27

Axure Library

UX

The Axure widget

libraries help UX build

wireframes quickly.

Encapsulates KSknowledge of the UI

Matches current visualdesign

Provides higher fidelityinteractivity for rapid

prototyping

Vision for the Axure Widget Library

Development

Quality

Assurance

CollaborativeDesign

Backlog


18/27

Axure Library

Widgets are built in

response to design

decisions in UIM.

Reflects currentsupported function

and visual design

Includes desired (butunsupported) UI behavior

Requires periodic updatesby a UX designer

Building the Axure widget libraries

UX

UIM

UX

Dev


19/27

UX in Action: An example

What do I do withthis information?

Where do I go?


20/27

Brainstorming with the UIM


21/27

Mockups with Axure


22/27

The State of the UIM

New

Platform

Rice Platform (KRAD)Google Web Kit

June

2012

KD12 Finished

Initial

UIM

Future

Desired

Validated#P

atterns&Compo

nents

Gap

2009

U

IDevelopers


23/27

The State of Axure widget libraries

New

Platform

Rice PlatformGoogle Web Kit

June

2012

KD12 Finished

Initial

UIM

Desired

Validated#P

atterns&Compo

nents

Future

Gap


24/27

UCD methods must fit into Agiledevelopment process

UIM and Axure widgets encapsulateknowledge for quick design &prototyping

Functional gaps in the UI frameworkmust be well managed

For a good user experience in KS


25/27

Finish the UIMDocument what we want/know

Dedicated UI Developer resources

More user input as part of the processIncorporate user research into methodology

Evaluate UIM patterns with real users

Next Steps


26/27

Done!

Photo: http://www.flickr.com/photos/bahaius/5108145883

Questions?


27/27

No shortcuts today.

Im in a hurry.Swiss proverb

Photo: http://www.flickr.com/photos/jason_coleman/16103399

Bonus!

for a good user experience: ux design goals, methods, tools & tales

Documents