@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

TEACHING UX DESIGN

Internalizing UX@cwodtke | cwodtke.com

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

INTRODUCTIONS

Introductions can take up too much timeYou still need to know who people areShare:• Name (name cards ROCK!)• One sentence (Or five words) What you want from today)

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EXERCISE: DEFINING WHAT WE’LL TEACH

1. List things you want to cover POST ITS (One item per)10 minutes free

listing 2. Affinity sortTeams10 minutes sortingName groupings

Soft skills?Software?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EXERCISE: PLANNING A ONE DAY “FUNDAMENTALS” CLASS

What time does day start/stop?When is lunch?When are breaks?Fill in time slots (30 min increments)Leave an hour at the start and finish unscheduled.Fill in agenda with topicsFind a project that can be done across the topics25 min

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

TEMPLATE

9-10 HOLD10-10:3010:30- 1111-11:3011:30-1212-1 LUNCH1-1:301:30-22-2:302:30-3 BREAK3-3:304-5 HOLD

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

DISCUSS

Is UX too big?How did you know what to cut? What to include?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EXAMPLE

9-10 Hellos, Late ppl, Intro to UX10-11 Make it Be Good Exercise11-11:30 Introduce day’s project (Grocery store app), User research11:30-12 Practice User Research12-1 LUNCH & Research1-1:30 Card sort findings, Share1:30-2:15 IxD (with personas) 2:15-3 IA (with Candy!)3-3:15 Break3:15 -4 UI (sketching)4-5 Presentations, discussion, wrap-upPresentations take longer than you think

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

FRACTAL DESIGN

Start by writing a 20 minute talkThen expand with exercises, discussion, examples

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

TEACH LESS BETTER

More repetitionExplaining things multiple waysRedoing same exercise in different contextPractice key skills

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

HOW CAN STUDENTS INTERNALIZE LEARNING?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

WHAT ARE MY TEACHING TOOLS?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

34:28-37:25 http://www.criticalcommons.org/Members/fearv/clips/indie-game-the-movie-edmund-mcmillen-discusses

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

Scaffold Learning• Introduce• Safe practice (exercise)• Applied practice (project)• Practice in new context (new

project)

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EXERCISE

Pick a topic from your day How will you introduce it– without a lecture!Design your first exercise 15 minutes

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

WALK AROUNDAll learning happens here

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

REFLECTION

DiscussionDiaryPapersPresentationsDrawings??

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

DRAW YOUR WEEK

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EXERCISE: REFLECTION

How will students internalize?Diary?Discussion?Drawing?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EXERCISE: HOW WILL YOU INTRODUCE THE KNOWLEDGE?

What supporting information is needed to complete exercise?Decide how you’ll deliver it.Lecture?Reading?Video?A Play?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

STORYTELLING

Three examples• Pragmatic• Compassionate• Cool

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

WHAT I TEACHPOV

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

ESTABLISHING RULES

What was a good learning experience? Why?What was a bad one? Why?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

Interaction Design

Information

Architecture

Interface Design

User Research

I tried to teach Jesse James Garret's Planes

I had to Simplify

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

OPENING THE CLASS

Make it Be Good Exercise1. Students are asked to come with a great user experience and a bad user experience. 2. Students share why great are great. As students share, instructor pulls out heuristics (error prevention, error recovery, set expectations meet expectations)3. Students then share bad user experiences.

4. Student redesign bad into good

What it AccomplishesDiscuss what is good?Teaches some heuristics in contextCreates a sense of competencyCreates confidenceEnables passion

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

UER

Start talking to users as soon as you canScaffolding again: • safe (with students) • daring (with ppl in building)• really scary (strangers)http://www.slideshare.net/cwodtke/user-research-101

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

IA

ClassificationNatural organization failsTask basedSynonyms Thesauri (relational-upsell)Tagshttp://www.slideshare.net/cwodtke/information-architecture-fundamentals

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

IXD

Body stormingGoal directed designPersona/scenarios/task analysis/use caseshttp://www.slideshare.net/cwodtke/interaction-design-and-goal-driven-design-using-personas

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

INTERFACE

Understanding• Layout• Objects• Type• Color• Line• Hierarchy• Relationships

Use

• Affordances • HUD• Feedback• Modes• Input• Navigation

http://www.slideshare.net/cwodtke/designing-the-interface-for-use

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

UX Glue• Conceptual Models• Top tens• Competitive analysis

Discuss: what’s useful, but isn’t usually covered?

http://www.slideshare.net/cwodtke/conceptual-models-mental-models

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

CRITIQUE

Critiques can get out of controlTreat a critique like a secret santa; Everyone draws names they give feedback toEveryone gives 3 keeps and 3 changes to the person.

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

Scary & Hard Parts

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

TEACHING WHAT YOU DON’T KNOW

Seek first to understand, then to be understood

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

MAKING THE CURRICULUM YOURS

Discuss: Can you teach someone else’s slides?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

CONFLICT ON TEAMSDiscuss

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

HOPELESS STUDENTSDiscussion: Should we throw people out?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

HIDDEN BIASESSTEREOTYPE THREAT

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

Practicalities

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

SPACE

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

EQUIPMENT

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

MATERIALS

Postits?Pens? Sharpies bleed through: avoid!Whiteboards?Gator boards?

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

You

Showtime!

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

YOU ARE THE UI

Energy: WW poseThe gift poseSelf carePrepClothing-as-story

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

KEEP GROWING

Do 3 keeps and changes each time after you teachUpdate slides the next day with your changes

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

TREAT TEACHING LIKE A DAY IN PARADISE

Make your sense of fun infectious!Laugh at yourself!Love your students!

@cwodtke | cwodtke.com | eleganthack.com | boxesandarrows.com | Creative Commons Share Alike

QUESTIONS?@cwodtke | www.eleganthack.com | www.slideshare.net/cwodtke