Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick
-
date post
18-Sep-2014 -
Category
Education
-
view
350 -
download
0
description
Transcript of Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick
![Page 1: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/1.jpg)
eBOOK UXBringing User Experience Knowledge Into the Picture
ebookcraft
Toronto—March 5, 2014
Foxpath IND :: Anne Kostick
![Page 2: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/2.jpg)
![Page 3: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/3.jpg)
What Is UX?
Research and design aimed at making the user’s experience of a product, process or service better.
UXK= UX Knowledge
![Page 4: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/4.jpg)
A Fast UX History
UX: User experience
UXD: User experience design
Experience design
User research
Usability
UI: User Interface design
Interaction design
Human factors
Ergonomics
HCI: Human computer interaction
![Page 5: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/5.jpg)
The Machine Age
![Page 6: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/6.jpg)
Human Factors
Complexity can be dangerous People come first.
![Page 7: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/7.jpg)
Don Norman
![Page 8: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/8.jpg)
Uxers from Everywhere
Social SciencePsychology, Anthropology, Sociology
DesignIndustrial, Interactive, Graphic
EngineeringSoftware dev, Mechanical
DevelopmentProduct dev, Editorial dev
ProductionProduct management, Project management
UX in Publishing
Discoverybuying, browsing
Device using, managing
Reading start to finish; searching, finding, saving, marking
![Page 9: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/9.jpg)
A Fast History of the Book
Codex established between 100 – 300 CE
Movable type 1455 (Germany)
1377 (Korea)
Illustrations 1461 (Germany)
![Page 10: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/10.jpg)
InnovationsTable of contents [c 100]
Spaces between words [c 700]
Margins [1400s]
Bookmarks [c 1590]
Pagination [c 1590]
Indexes [1600s]
Footnotes [1600s]
Color ink
Table of illustrations
Card page
Appendix
Thumb tabs
Edge color
Spine printing
![Page 11: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/11.jpg)
Book = Object
1870 2013
![Page 12: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/12.jpg)
Enter Digital• Digital removes the object
so well developed over 1500 years of use.
• There’s no “there” there
• Digital undermines the behaviors and processes readers know.
![Page 13: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/13.jpg)
DIGRESSION: Rename the Book!
… the codex, the format, the object
… the intellectual property; the meaning of the text, behind the letters on the
page
Then there’s … … the experience
![Page 14: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/14.jpg)
Book Design / UX Design
• Book design takes existing graphic elements to create the known page/volume, visually. Use is understood.
• UX design uses graphic elements, among other elements, to create the reading experience.
![Page 15: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/15.jpg)
The UX Cycle
ITERATE
OBSERVE
IDEATEPROTOTYPE
TEST
![Page 16: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/16.jpg)
UX Tool Kit (partial)• Observation
• Survey/Questionnaire• Comparative Assessment• Bug List/Wish List
• Ideation• Mental Models• Drawing/Sketching• Workshop/Brainstorm sessions
• Prototyping• Paper• Files• Templates
![Page 17: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/17.jpg)
Special E-book Kit
Research and testing
Not You
Not your work colleagues, either
Design and Ideating
Use your customers’ strengths, i.e., verbal skew
Use your product’s strengths, i.e., each book is unique.
Protyping and Iterating
Paper is perfect!
Files are flexible!
![Page 18: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/18.jpg)
RULE OF 5
Five research subjects in a study will yield 85% of the information you need for UX design.
![Page 19: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/19.jpg)
GOGGLES
![Page 20: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/20.jpg)
User Research
Ask Questions
“He just got tired of his Kindle.”
“After a day at the office, staring
at a screen seemed too much like work.”
“I kept losing my place. If I wanted
to remind myself about a character,
I couldn’t go back.”
“I missed the feel of a book.”
![Page 21: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/21.jpg)
Observation• Set up a task and a goal
• Ask subject for feedback afterward
SubjectObservers
![Page 22: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/22.jpg)
Gather Information
Comparative Assessment
examine features of other products
Bug List
what things do users dislike?
Wish List
what do they wish the
product could do for them?
Observer’s notes
![Page 23: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/23.jpg)
Ideate
![Page 24: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/24.jpg)
Prototype and Test
![Page 25: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/25.jpg)
Parts of a Book
![Page 26: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/26.jpg)
Ideas from Everywhere
![Page 27: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/27.jpg)
![Page 28: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/28.jpg)
Dimensional Navigation?
![Page 29: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/29.jpg)
My Library
![Page 30: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/30.jpg)
Dimensional Location?
![Page 31: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/31.jpg)
Findings: What Do Readers Want?
• Flow• Serendipity• Transparency• Simplicity• Orientation in space
![Page 32: Ebook UX: Bringing User Experience Design into the Picture - ebookcraft 2014 - Anne Kostick](https://reader037.fdocuments.in/reader037/viewer/2022102710/5419d0187bef0a65128b4e29/html5/thumbnails/32.jpg)
Betterment!Use UXK
Change goggles
Iterate often
Use e-books’ advantages
Join the evolution of digital reading
For recommended reading and online resources, email me: [email protected]