art center interactive design 4 - #1 intro to ux

52
Intro to UX Art Center Interactive Design 4 | Week 1 | Joy Liu

Upload: joy-liu

Post on 28-Nov-2014

197 views

Category:

Design


0 download

DESCRIPTION

Art Center Interactive Design 4 Lecture Slides #1 (week 1) Intro to User Experience

TRANSCRIPT

Page 1: Art Center Interactive Design 4 - #1 Intro to UX

Intro to UX

Art Center Interactive Design 4 | Week 1 | Joy Liu

Page 2: Art Center Interactive Design 4 - #1 Intro to UX

User Experience at a glance

Page 3: Art Center Interactive Design 4 - #1 Intro to UX

The Disciplines of User Experience Design by envis-precisely.com, based on Dan Saffer (2008)

Page 4: Art Center Interactive Design 4 - #1 Intro to UX

The Disciplines of User Experience Design by envis-precisely.com, based on Dan Saffer (2008)

Page 5: Art Center Interactive Design 4 - #1 Intro to UX

The Spectrum of User Experience Oliver Reichenstein

Page 6: Art Center Interactive Design 4 - #1 Intro to UX

Design for the end-user what does it mean?

Page 7: Art Center Interactive Design 4 - #1 Intro to UX

Clients

Stakeholders

Marketing Team

!

Developers

Quality Assurance

Fellow Designers

!

!

!

Customers

Page 8: Art Center Interactive Design 4 - #1 Intro to UX

Clients

Stakeholders

Marketing Team

!

Developers

Quality Assurance

Fellow Designers

!

!

!

Customers

Page 9: Art Center Interactive Design 4 - #1 Intro to UX

UX ≠ UI pretty design is not the solution

Page 10: Art Center Interactive Design 4 - #1 Intro to UX

Roles of UX Information Architect Interaction Designer Visual Designer UX Designer Usability Analyst User Researcher Experience Strategist Persona Writer Content Strategist

Page 11: Art Center Interactive Design 4 - #1 Intro to UX

UX is not UI by Erik Flowers

Page 12: Art Center Interactive Design 4 - #1 Intro to UX

Form follows function Physically & digitally

Page 13: Art Center Interactive Design 4 - #1 Intro to UX

What is useful?

Page 14: Art Center Interactive Design 4 - #1 Intro to UX

Usability Quality of a user's experience when interacting with products or systems

Page 15: Art Center Interactive Design 4 - #1 Intro to UX

http://www.amazon.com/AutoExec-Wheelmate-Steering-Attachable-Surface/dp/B00E1D1GY6#

AutoExec Wheelmate Steering Wheel Attachable Work Surface Tray

Page 16: Art Center Interactive Design 4 - #1 Intro to UX

http://www.amazon.com/AutoExec-Wheelmate-Steering-Attachable-Surface/dp/B00E1D1GY6#

AutoExec Wheelmate Steering Wheel Attachable Work Surface Tray

Page 17: Art Center Interactive Design 4 - #1 Intro to UX

http://www.amazon.com/AutoExec-Wheelmate-Steering-Attachable-Surface/dp/B00E1D1GY6#

AutoExec Wheelmate Steering Wheel Attachable Work Surface Tray

Page 18: Art Center Interactive Design 4 - #1 Intro to UX
Page 19: Art Center Interactive Design 4 - #1 Intro to UX
Page 20: Art Center Interactive Design 4 - #1 Intro to UX

“Affordances Matters” by Geoff Teehan, 04/16/2014 https://medium.com/@gt/affordances-matter-cab064b40b4b

NOW HOW IT SHOULD BE

Page 21: Art Center Interactive Design 4 - #1 Intro to UX

“Affordances Matters” by Geoff Teehan, 04/16/2014 https://medium.com/@gt/affordances-matter-cab064b40b4b

NOW HOW IT SHOULD BE

Page 22: Art Center Interactive Design 4 - #1 Intro to UX

“Affordances Matters” by Geoff Teehan, 04/16/2014 https://medium.com/@gt/affordances-matter-cab064b40b4b

NOW HOW IT SHOULD BE

Page 23: Art Center Interactive Design 4 - #1 Intro to UX

No such thing as reading the manual. Period.

Page 24: Art Center Interactive Design 4 - #1 Intro to UX

!by Nielsen Norman Group, 2012.

Utility does it provide the features you need?

Usability how easy & pleasant these features are to use?

Useful = Utility + Usability

Page 25: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

Page 26: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?

Page 27: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?

Page 28: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?

Page 29: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?

Page 30: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?By a beat-up Corolla?

Page 31: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?By a beat-up Corolla?By a Porsche 911?

Page 32: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?By a beat-up Corolla?By a Porsche 911?By American Airline economy seat?

Page 33: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?By a beat-up Corolla?By a Porsche 911?By American Airline economy seat?By private 6-person jet?

Page 34: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?By a beat-up Corolla?By a Porsche 911?By American Airline economy seat?By private 6-person jet?By Virgin Galactic?

Page 35: Art Center Interactive Design 4 - #1 Intro to UX

How do you get from LA to NY?

By foot?By skateboard?By bicycle?By bus?By a beat-up Corolla?By a Porsche 911?By American Airline economy seat?By private 6-person jet?By Virgin Galactic?By transporter via USS Enterprise?

Page 36: Art Center Interactive Design 4 - #1 Intro to UX

Elements of UX the underlying relationships

Page 37: Art Center Interactive Design 4 - #1 Intro to UX

!by Michael Cummings uxdesign.com

Page 38: Art Center Interactive Design 4 - #1 Intro to UX

!by Jesse James Garrett, 2000.

Page 39: Art Center Interactive Design 4 - #1 Intro to UX

!by Jeffery Callender and Peter Morville

Page 40: Art Center Interactive Design 4 - #1 Intro to UX

Why documentation? http://theoatmeal.com/comics/design_hell

Page 41: Art Center Interactive Design 4 - #1 Intro to UX

Mobile UX battle of screens

Page 42: Art Center Interactive Design 4 - #1 Intro to UX
Page 43: Art Center Interactive Design 4 - #1 Intro to UX
Page 44: Art Center Interactive Design 4 - #1 Intro to UX
Page 45: Art Center Interactive Design 4 - #1 Intro to UX

How is mobile different? where and when? dimensions? bandwidth and connectivity? behavior and emotion? human factors? circumstances of usage?

Page 46: Art Center Interactive Design 4 - #1 Intro to UX

SAT Study Tool for 10th Grader where and when? dimensions? bandwidth and connectivity? behavior and emotion? human factors? circumstances of usage?

Page 47: Art Center Interactive Design 4 - #1 Intro to UX

Carma Sutra Tutorial for Golden-Agers where and when? dimensions? bandwidth and connectivity? behavior and emotion? human factors? circumstances of usage?

Page 48: Art Center Interactive Design 4 - #1 Intro to UX

User Engagement

Source: Google/Ipsos/Sterling, 2012

Page 49: Art Center Interactive Design 4 - #1 Intro to UX

Native vs. Web Native / Web / Hybrid

Page 50: Art Center Interactive Design 4 - #1 Intro to UX

Final Project Native iOS app redesign

Page 51: Art Center Interactive Design 4 - #1 Intro to UX

Imagine, this is your start-up. !

This is something you are passionate about, you think about it everyday, you are proud of the idea. !

You’ve borrowed and saved up $20,000 to kickstart your product. For the next 14 weeks, you will design and create a clickable prototype. !

On week 14, you will pitch your idea to a group of venture capitalists and compete for $500,000 in cash to help you launch the idea to market.

Page 52: Art Center Interactive Design 4 - #1 Intro to UX

1. Select 3 iOS apps in the App Store (less than 5 stars, no games) !

2. Take screenshots of all the sections in each app !

3. Annotate areas in need of improvement !

4. Write an elevator pitch for each app What is your product? Who is your market? Why do they care? What’s in it for them? Why is your product different from your competitors?