introduction to user experience
Post on 17-Oct-2014
7.414 views
DESCRIPTION
From a Class given at General Assembly. It was closed with a talk by Andrei Herasimchuk.TRANSCRIPT
![Page 1: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/1.jpg)
class 1 Welcome!
About the Instructor – Syllabus – Final Project
![Page 2: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/2.jpg)
YOU
•Five words on you•Five words on why you are here
•Or a haiku
NOT YET! Think about it….
2
![Page 3: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/3.jpg)
3
Why do we know what we know?•Wrote Information Architecture: Blueprints for the Web•Founded IAI•Founded Boxes and Arrows•Ran design teams, product teams in companies such as Yahoo, Linkedin, Myspace, Zynga•Currently advising a number of startups on UX
About Christina Wodtke
![Page 4: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/4.jpg)
4
Why do we know what we know?• Information Science at University of Washington• IA for Microsoft, Zaaz, Concent• Concent is located in Japan, where he worked at projects from air conditioner interfaces to corporate governance website•YOUR TA!
About Eric Bell
![Page 5: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/5.jpg)
YOU
•Five words on you•Five words on why you are here
•Or a haiku
5
![Page 6: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/6.jpg)
6
week 1 STRATEGY
•Introduction to UX, research, business requirements, Personas
week 3 SCOPE
•Requirements, Content and Feature Strategy
week 4 STRUCTURE
•Information Architecture, Interaction Design, Communicating Design
week 6 UNIQUE CONTEXTS
•Social, Games, Network Design, Offline and on, Mobile
week 10 SKELETON & SKIN
•Brand, Visual Design
syllabus
![Page 7: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/7.jpg)
7
Grading
Homework 25%
Get the most out of class by doing all your homework.
Participation 25%
Get to know your classmates and share your ideas with them.
Final Project 50%
Show off what you’ve learned.
7
![Page 8: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/8.jpg)
8
PRESENTATIONS DEC 19 & 20
Select from one of several start-ups
•Real World! Delivers lunch, matchmaking local restaurants with desk-bound office workers
•Social! Collecting materials from a variety of other services, from Flickr to Facebook ,to create memory sites
•Entertainment! Fashion site that lets women post items they want to find, and other women find them
•Gift! parents and grandparents subscribe their kids to monthly cooking delivery box
•Kids! online directory of out of school programs for children
Notes: if user research, brainstorming, etc you discover pivots, changes, or new opportunities you are empowered to do them!
final project
![Page 9: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/9.jpg)
Software and Books
• you can get omnigraffle• or Balsalmiq, or whatever…. Paper perhaps• you’ll probably need Photoshop or something sexy when it comes to the sexy part
•Recommended: Elements of User Experience, Don’t Make Me Me Think, Designing Interactions, Designing the Social Web and MY BOOK!
9
![Page 10: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/10.jpg)
What is UX? – What makes up User Experience – Requirements – Strategy – Principles
class 1 UX introduction
![Page 11: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/11.jpg)
What is user experience?
![Page 12: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/12.jpg)
What experience do you love?What is it?Why do you love it?What’s your favorite part?
![Page 13: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/13.jpg)
13
Don Norman
"User experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products. The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother. Next comes simplicity and elegance that produce products that are a joy to own, a joy to use. True user experience goes far beyond giving customers what they say they want, or providing checklist features. In order to achieve high-quality user experience in a company's offerings there must be a seamless merging of the services of multiple disciplines, including engineering, marketing, graphical and industrial design, and interface design.
![Page 14: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/14.jpg)
14
jesse james garrett
the design of anythingindependent of medium
or across [device]with human experience as an explicit outcome
and human engagement as an explicit goal
-Jesse James Garrett
![Page 15: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/15.jpg)
15
jesse james garrett
-Jesse James Garrett
![Page 16: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/16.jpg)
Historically, online we’ve cared about:
![Page 17: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/17.jpg)
TEAM of DESIGNERS
![Page 18: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/18.jpg)
GRAPHIC DESIGN
![Page 19: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/19.jpg)
INFORMATION ARCHITECT
![Page 20: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/20.jpg)
INTERACTION DESIGNER
![Page 21: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/21.jpg)
21
dan saffer
![Page 22: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/22.jpg)
22
Startups are seeking
![Page 23: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/23.jpg)
![Page 24: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/24.jpg)
This Course
•You’ll do the entire plane•You will suck. That is AWESOME•Not trying=failing•Find your love. Follow it.
24
![Page 25: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/25.jpg)
A SHORT HISTORY OF ARCHITECTURE
Design Principles
![Page 26: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/26.jpg)
Cave
![Page 27: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/27.jpg)
![Page 28: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/28.jpg)
Hut
![Page 29: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/29.jpg)
![Page 30: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/30.jpg)
Stone Age City
![Page 31: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/31.jpg)
![Page 32: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/32.jpg)
VITRUVIUS
firmitas, utilitas, venustas : : durability, convenience, beauty
![Page 33: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/33.jpg)
Durability
“Durability will be assured when foundations are carried down to the solid ground and materials wisely and liberally selected”
Vitruvius
![Page 34: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/34.jpg)
Frank Lloyd Wright’s Imperial Hotel, Japan, survived an
earthquakeThe reflecting pool provided a source of
water for fire-fighting;Cantilevered floors and balconies provided
extra support for the floors;A copper roof, cannot fall on people below
the way a tile roof can;Seismic separation joints, located about
every 20 m along the building;Tapered walls, thicker on lower floors,
increasing their strength;Suspended piping and wiring, instead of
being encased in concrete, smooth curves, making them more resistant to fracture.
![Page 35: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/35.jpg)
Technical EarthquakesSlow loading javascript fails on low bandwidth, and can cause users to accidently search for the label inside your search box. Is your site designed to be robust when things break (for
example, filter out the label from the query. Or don’t place labels in fields; it reduces usage anyhow.)
I’m searching for “my architect, not “movies, directors,
actors”
![Page 36: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/36.jpg)
Social Earthquakes
If people post jobs in discussion areas, any user
can move them to job board
If people use
connection invites
to spam/market, they can be
reported.
![Page 37: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/37.jpg)
Prepare forTechnical TremorsExecutionMaintenanceScale Bandwidth
Social FaultlinesInnocents/IdiotsTrollsSpammersCriminals
![Page 38: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/38.jpg)
Convenience“When the arrangement of the apartments is faultless and presents no hindrance to use, and when each class of building is assigned to its suitable and appropriate exposure” Vitruvius
Sound familiar?
We’re talking usability!
![Page 39: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/39.jpg)
“Early in life I had to choose between honest arrogance and hypocritical humility. I chose honest arrogance and have seen no
occasion to change.” Frank Lloyd Wright
Usonian houses were beautiful, human scaled.. And didn’t have closet space. Should we choose beauty over usability sometimes?
![Page 40: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/40.jpg)
Human
Human
The Facebook Inbox is chock full of annoying
non-human mails, despite the fact they know who is
human and who I am connected
to. Not convenient.
![Page 41: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/41.jpg)
Bilbao did not leak. I was so proud.
![Page 42: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/42.jpg)
I call it the "Then What?" Okay, you
solved all the problems, you did all the stuff, you
made nice, you loved your clients, you loved
the materials, you loved the city, you're a good
guy, you're a good person... and then what? What do you
bring to it?
See his great TED talk http://www.ted.com/talks/frank_gehry_asks_then_what.html
![Page 43: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/43.jpg)
Beauty (delight)
“when the appearance of the work is pleasing and in good taste, and when its members are in due proportion according to correct
principles of symmetry.” Vitrvius
![Page 44: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/44.jpg)
“Less is more.” ~ Mies
![Page 45: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/45.jpg)
SEAGRAM BUILDING (Philip Johnson did interiors, 1957)
This logical and elegant 38-story skyscraper (525' H) has alternating horizontal bands of bronze plating and bronze-tinted glass and decorative bronze I-beams which emphasize its verticality. Placed to the rear of its site and set back from Park Avenue, it incorporates a large plaza in the front as part of the design--thus avoiding the need for set-backs. It uses granite pillars at the base and has a two-story glass-enclosed lobby.
Seagram Building
New York City
1957Is this
Beautiful?
![Page 46: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/46.jpg)
“Less is a bore.” ~ Venturi
![Page 47: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/47.jpg)
Is this Beautiful?
![Page 48: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/48.jpg)
Do we dictate what is beautiful by
constraining user choice?
![Page 49: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/49.jpg)
Or support passionate use that may not
meet our aesthetic
standards?
![Page 50: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/50.jpg)
Beautiful
Convenient
Durable
![Page 51: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/51.jpg)
WHY SO USER CENTERED?
51
![Page 52: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/52.jpg)
B=f(P+E)- Lewin’s Equation
Behavior is a function of a Person and his Environment
You can’t control the person, but you can design the environment to change behavior
![Page 53: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/53.jpg)
53
measure ux: usability
![Page 54: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/54.jpg)
54
julian missig
![Page 55: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/55.jpg)
![Page 56: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/56.jpg)
Andrei
Andrei Michael Herasimchuk has been designing world class software across web browsers, desktop clients, mobile smartphones and tablet computers for more than two decades. He was the lead designer behind the Adobe Creative Suite and the product lead for Adobe Lightroom. He was Chief Design Officer for Involution Studios, a digital product design company based in the United States and led the 2010 redesign of Yahoo! Mail. In 2011, Andrei joined Twitter and is currently the Director of Design. His writing and thoughts on design can be found at Design by Fire (http://www.designbyfire.com).56
![Page 57: Introduction to User Experience](https://reader034.vdocument.in/reader034/viewer/2022052306/544134ebafaf9f62208b4629/html5/thumbnails/57.jpg)
57
homework
Watch Steve Krug’s Do it yourself Usability Test http://www.sensible.com/rsme.html
Read the package
Select a particularly satisfying user experience. Describe why, noting at least three touch points.
*without using search