Design and Develop for Success with User Experience DesignPresenters:

• Todd Remer• Joe Suarez

Design and Develop for Success with User Experience Design

Todd’s background

Academic Experience• Visual Design• Multimedia since 1995• Usability since 2000• Elearning since 2005• Instructional Design• Presented:

Usability – Wright StateMultimedia – Ohio State

Gamification – ATD, SITE

Personal• Wife/kids• Son at Philmont• Daughter at BGSU• Sci-Fi movie fan and

addicted to Marvel comics

Design and Develop for Success with User Experience Design

Joe’s background

Academic Experience• eLearning Developer

since 2007• Instructional

Designer since ~2012

• Passionate about UX applied to the creation of learning solution

• Speaks at various conferences

Personal• Wife/kids• Likes to garden• Bikes to work when

possible• Recovering Star

Wars fanatic

Design and Develop for Success with User Experience Design

Usability

• Physical• Digital

Design and Develop for Success with User Experience Design

User Experience Design

Design and Develop for Success with User Experience Design

UX DesignInstructional Design

A – AnalysisD – Design D – DevelopI – ImplementE – Evaluate

Design and Develop for Success with User Experience Design

UX DesignInstructional Design

Elearning: Product training material...

Break up into teams...

Sporting Goods Website

UX Design ID – A N A L Y S I S

UX Design ID – A N A L Y S I S

Objectives for ID• Establish learning

objectives, project requirements, constraints, evaluation criteria, etc.

Objectives for UX• Understand the end

user as well as reasonably possible through user research

UX Design ID – A N A L Y S I SUser Research• Reference secondary user research

• Conduct primary user research

• Synthesize findings and insights gained

UX Design ID – A N A L Y S I SPrimary User Research Methods• Surveys

• Interviews / Focus groups

• Observation / Job shadowing

UX Design ID – A N A L Y S I SDocumenting User Research • Personas

• Workflow diagrams / User Journey Map

• More detailed reports

UX DesignID – A N A L Y S I S

Sporting Goods Store Personas• User profiles

• Customer demographics

UX Design ID – D E S I G N

UX DesignID – D E S I G N

Organizational structure

Card Sort• Each person

gets a stack

• Cluster cards into piles that make sense

• Most popular structure

UX DesignID – D E S I G N

NTemplates

UX DesignID – D E S I G N

Page Types• Purpose

• Function

• Look

Templates

UX DesignID – D E S I G N

Page Type Navigation – 3 min. Assignment1. Review organization structure

2. Decide how many page types

3. Write navigation link names for each

Templates

UX DesignID – D E S I G N

Page Types

UX Design ID – D E V E L O P

Templates

UX DesignID – D E V E L O P

Page Design• Layout / Grid• Color• Typography• Buttons• Navigation• Accessibility

UX DesignID – D E V E L O P

Heuristics• Labeling and

Terminology• Consistency

and Branding• Affordances• Orientation

UX DesignID – D E V E L O P

Activity: 3 min.1.Review page

2.Write down what’s good or bad based on Heuristics

UX Design ID – I M P L E M E N T

Templates

UX DesignID – I M P L E M E N T

Think Aloud Testing• 5-6 Sessions: 1 participant each

• Participant, Facilitator, Note-taker

• Describe what you are thinking!

UX Design ID – E V A L U A T E

Templates

UX DesignID – E V A L U A T E

Recommendations• Usability test data

• Levels of what should be fixed

UX Design

User interaction

Good looking

Q & ADesign and Develop for

Success with User Experience Design