INTERNATIONAL CERTIFICATE IN PRODUCT MANAGEMENT & MARKETING
PM 101
PI-201
Developing Delighting User Interfaces
Prof. Kshitiz Anand
15 Jun 13
PROFILE
Presently
Dean & Director - India Operations at L'cole de Design Nantes Atlantique Founder of Happy Horizons Consulting
Previous
Design Head, Kuliza Technologies Founder & Director, Deskala Research and Design & Consulting MS in HCI Design , Indiana University Bloomington, USA BDes in Communication Design, IIT Guwahati, India
Education
Contact
[email protected] Twitter: @kshitiz LinkedIn: in.linkedin.com/in/kshitizanand/ Website: www.kshitizanand.com
2
SCENARIO 1
Redesign an existing product, with a high level of User Experience, that was initially designed primarily by developers and managers, and not by an interface or interaction designer or with consultation by a user experience design specialist who could point out workflow and related product issues, as well as design a product brand identity.
SCENARIO 2
Design an application that is high on innovation, leveraging the power of technology, social media, keeping a large base of users varied across geographies and democracies. Make the applications to be web 2.0, responsive, device independent, and integrate it with Facebook in particular
THE WHAT
6
DEVELOPING DELIGHTING
USER INTERFACES
7
DELIGHT
Think of an activity that delighted you?
(NON-WEB INTERACTION)
9
Delight = Features ?
10
Situation 1
PROBLEM ANXIETY RESOLUTION DELIGHT
Situation 2
SURPRISE PLEASURABLE EXPERIENCE DELIGHT
11
Think of an product that delighted you (or did not) ?
(THAT YOU USE REGULARLY)
12
13
Web 1.0
Web 2.0
Web 3.0
14
15
VISCERAL
Refers primarily to that initial impact, to its appearance Appearance is rooted in form, aesthetics
BEHAVIORAL
A more detailed look and feel and function that is got by interactions i.e. the total experience of using a product
REFLECTIVE
Ones thoughts afterwards, how it makes one feel, the image it portrays, the message it tells others about the owner's taste
16
Interaction
REFLECTIVE
BEHAVIORAL
VISCERAL
Time spent
17
Products were once designed for the functions they performed. But when all companies can make products that perform their functions equally well, the distinctive advantage goes to those who provide pleasure and enjoyment while maintaining the power. If functions are equated with cognition, pleasure is equated with emotion; today we want products that appeal to both cognition and emotion.
Don Norman
18
1993 2013
19
20
Delight is governed by
Subjectivity
21
Delight is governed by
Objectivity
22
If you dont take care of the customer, someone else will.
- Raffaele Ciarla
23
USER EXPERIENCE
DELIVERING
CUSTOMER
SINCE MID 90s
DELIGHT
24
TODAY WE ARE LIVING WITH COMPLEXITY
25
GOOD UX AS THE DIFFERENTIATOR
26
ROI ON UX AT RIGHT TIME
Increased productivity Reduced costs Customer retention Increased sales Savings on customer service calls Reduced effort and cost on redesign
27
Early focus on UX Design
28
29
HAVE YOU HEARD OF THE $300 MILLION BUTTON?
30
http://www.uie.com/articles/three_hund_million_button/
31
http://www.uie.com/articles/three_hund_million_button/
32
WHAT IS USER EXPERIENCE ?
(POPULARLY KNOWN AS UX)
33
34
35
36
http://www.stephenthomas.com/about/images/what_is_ux.jpg
Unclear boundaries
37
The T shaped (UX) professional
38
39
PETER MORVILLES HONEYCOMB MODEL Image Source: http://semanticstudios.com/publications/semantics/000029.php
40
THE LEAGUE OF USER EXPERIENCE ROLES & PROFESSIONAL?
(The people and work involved)
41
42
UX researchers
43
Information Architects
44
Interaction Designer
45
Visual Designer
The aesthetics person One who does the magic Last in First out !
46
Usability professionals
47
THE WHY
48
The UX role Shift
FROM AESTHETICS TO PROCESS TO PRODUCTS TO SERVICE TO STRATEGY
49
50
51
UX IN CONTEXT OF HCI (HUMAN COMPUTER INTERACTION)
52
USER EXPERIENCE TODAY : { U, B , T } ?
Users
UX Technology Business
53
54
WHAT IS THE SILICON VALLEYS NEW SECRET WEAPON ?
55
56
57
Whats common between all of these?
58
59
INTERFACE
60
INTERFACES ARE EVERYWHERE
Hand held devices Information Kiosks Interaction in public environment installations Television based interfaces Automotive interfaces Household and non household appliances Audible interfaces
61
Software (products) should behave like a considerate human being! What is a considerate human being?
62
TO BE CONSIDERATE .
Considerate Products (and humans)
Take an interest Are differential Are forthcoming Use common sense Anticipate peoples needs Are conscientious Dont burden you with their personal problems Keep you informed Are perceptive Are self confidents Dont ask you a lot of questions Take responsibility Know when to bend the rules
63
The Knowledge Funnel identifying the considerate
64
THE HOW
65
The UX Design Process
Research Ideate Prototype Evaluate & Feedback Release
66
UX Process
67
UX Wheel
68
UX Treasure Map
69
RESEARCH
THE WAYS OF KNOWING DISCOVERY
70
IDEATE
CONCEPTUALIZATIONS FEATURES & FUNCTIONALITIES
71
PROTOTYPE
GETTING HANDS DIRTY BRINGING THOUGHTS TO LIFE
72
FEEDBACK
EMBRACING CRITICISM ANALYTICS
73
THE ELEMENTS OF USER EXPERIENCE DESIGN
74
75
Just remember this
76
USER RESEARCH TECHNIQUES
Contextual Inquiry Ethnographic Study / Field Observations Interviews and Focus Groups Surveys / Questionnaires Journaled Sessions Self-reporting logs Screen Snapshots
77
USER RESEARCH TECHNIQUES
On Location User Research
Actual User Interviews Studying User environments Contextual Inquiries
Remote User Research
Questionnaire Surveys Telephonic Interviews Video recordings of users performing their tasks
78
IDENTIFYING THE USERS
The target group(s) The affected group(s)
79
IDENTIFYING THE USERS
The target group(s) The affected group(s)
IDENTIFYING THE STAKEHOLDERS
80
IDENTIFYING STAKEHOLDERS
Doing Stake Holders Interviews Business Technical Team Actual Users Try to understand the direct impact / indirect impact on the solution Different User Groups
Target Groups Affected Groups
81
WHAT IS A PERSONA?
WHY PERSONAS ARE IMPORTANT?
82
PERSONAS
A representation of the goals and behavior of a real user group. In most cases, personas are synthesized from data collected from interviews with users. They are captured in a range of formats (depending on the requirements of the client) that typically include behavior patterns, goals, skills, attitudes, and environment; with a few fictional personal details to bring the persona to life. For any site, more than one persona is usually created, but generally one persona should always be the primary focus for the design
83
WHY PERSONAS ARE IMPORTANT?
Giving a face to your users Helps in generating Use Cases Helpful for Scenario Generation Scenarios gives insights
84
85
86
INFORMATION ARCHITECTURE
Information architecture is the categorization of information into a coherent structure, preferably one that the most people can understand quickly, if not inherently.
It's usually hierarchical, but can have other structures, such as concentric or even chaotic.
87
AFFINITY WALL / CARD SORTING
http://wiki.fluidproject.org/display/fluid/Affinity+Diagrams
88
89
90
91
PROTOTYPING
Low Fidelity High Fidelity Horizontal Prototype Vertical Prototype
92
Low Fidelity
Paper Prototypes and Sketches Easy to discard
93
High Fidelity
Wireframes HTML Mockups
94
Horizontal Prototype
Cover major functionalities Superficial information on all
95
Vertical Prototype
Deep into one or two functionality
96
VISUAL DESIGN What most people think Design is !
97
The elements of design
Lines Shapes Mass Color Texture
98
99
10 0
10 1
Gestalts principles
Law of Similarity
Similarity occurs when objects look similar to one another. People often perceive them as a group or pattern.
10 2
Gestalts principles
Law of Proximity
Proximity occurs when elements are placed close together. They tend to be perceived as a group.
10 3
Gestalts principles
Law of Closure
Closure occurs when an object is incomplete or a space is not completely enclosed. If enough of the shape is indicated, people perceive the whole by filling in the missing information.
10 4
Gestalts principles
Law of Continuity
Continuation occurs when the eye is compelled to move through one object and continue to another object.
10 5
The Layout Anatomy
Containing Block Logo Navigation Content Footer White Space
10 6
GRIDS - soul and skeleton of good design
10 7
More about GRIDS
Optimum Designing with the 960 Grid System for the most commonly used 1024x768 screen resolution Grids divide the screen into areas All spacing becomes multiple of the smallest spacing between elements Enhances Consistency of screens Standardizations reduces design time
10 8
10 9
11 0
The value of typography
11 1
11 2
11 3
11 4
11 5
11 6
11 7
11 8
11 9
12 0
12 1
12 2
THE WHO
12 3
CO-CREATION
COLLABORATIVE USER EXPERIENCE
12 4
12 5
In CONCLUSION
12 6
USER EXPERIENCE MYTHS
http://www.slideshare.net/whitneyhess/10-most-common-misconceptions-about-user-experience-design?from=ss_embed
12 7
A GOOD USER EXPERIENCE LEADS TO DELIGHT
12 8
DELIGHT IS WHEN THE INTERFACE CONVEYS A STORY
12 9
STORIES DELIGHT US
13 0
WHATs YOUR STORY ?
13 1
THANK YOU
Email: [email protected] |Twitter: @kshitiz LinkedIn: in.linkedin.com/in/kshitizanand/
13 2
