design theory - ankur sharma - presentation
DESCRIPTION
Mr. Ankur Sharma was one of the trainers who talked about what the design should be, how to start with one and how to get there.TRANSCRIPT
![Page 1: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/1.jpg)
Designing UIPrinciples and Process
![Page 2: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/2.jpg)
Design
![Page 3: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/3.jpg)
which one?how to figure them out when you are in shower, half blind?
![Page 4: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/4.jpg)
connectorloop{flip, can’t insert, flip again, can’t insert}
![Page 5: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/5.jpg)
freeze or boilhow to set perfect temperature?
![Page 6: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/6.jpg)
dividerare they even safe? during night??
![Page 7: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/7.jpg)
but how?What was the installer/interior/engineer thinking?
![Page 8: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/8.jpg)
![Page 9: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/9.jpg)
Criteria
![Page 10: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/10.jpg)
affordancesWhen you see it you will know it.
![Page 11: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/11.jpg)
affordancesWhat to do with this controls
![Page 12: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/12.jpg)
constraintsrestrict user interaction to reduce error
![Page 13: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/13.jpg)
constraintsWhich of the controls are usable
![Page 14: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/14.jpg)
conceptual modelmental image of how system works, more closer to functionality the better.
![Page 15: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/15.jpg)
mappingrelationship between control parameters and it’s effect
![Page 16: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/16.jpg)
visibilitymake sure the available controls are obvious and visible
![Page 17: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/17.jpg)
feedbacklet user know what is happening
![Page 18: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/18.jpg)
feedbackThe states description
![Page 19: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/19.jpg)
consistencysimilarity in similar function and identical way to perform them
![Page 20: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/20.jpg)
consistencyThe button arrangement across different OSes
![Page 21: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/21.jpg)
Principle
![Page 22: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/22.jpg)
![Page 23: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/23.jpg)
Dieter Rams 10 principles of good design
•Is innovative •Makes a product useful •Is aesthetic •Makes a product understandable
•Is unobtrusive •Is honest
•Is long-lasting •Is thorough down to the last detail
•Is environmentally friendly
•Is as little design as possible
![Page 24: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/24.jpg)
Design process
![Page 25: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/25.jpg)
develop conceptobjective, user and resources
![Page 26: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/26.jpg)
researchdo need analysis, business research and constrains
![Page 27: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/27.jpg)
prototypeyou never know until you do it
![Page 28: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/28.jpg)
refinementiterate, review, tests and prototype again
![Page 29: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/29.jpg)
Implementpractices, documentation and polishing
![Page 30: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/30.jpg)
supportevaluation, maintenance and training
![Page 31: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/31.jpg)
Ethnography
![Page 32: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/32.jpg)
https://www.youtube.com/watch?v=N4t3-__3MA0How the design is perceived by real world
![Page 33: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/33.jpg)
Project Synopsis
![Page 34: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/34.jpg)
Content for synopsis • Summary (One sentence
description)
• Application (One paragraph brief explanation)
• Activity (Bullet list of activities)
• Audience (One paragraph about intended audience)
![Page 35: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/35.jpg)
Requirement
![Page 36: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/36.jpg)
Fashion store app• Functional: Allow consumers to browse and purchase clothing merchandise
• Data: The system must have access to prices, pictures of merchandise, and up-to-date inventory.
• Environmental: Widely distributed, usually home. On phone and tablets.
• User: Anyone with interest in clothing purchases
• Usability: Simple to operate. Give feedback on stage is sales process. Distinguish buying from “window shopping” payment application.Optimised for tablet viewing.
![Page 37: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/37.jpg)
User story
![Page 38: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/38.jpg)
persona
• Body
• Psyche
• Background Information
• Emotion and Attitude
• Personal Traits
![Page 39: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/39.jpg)
persona
![Page 40: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/40.jpg)
conceptual design
![Page 41: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/41.jpg)
metaphorphysical link with interface
![Page 42: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/42.jpg)
interface stylephysical link with interface
![Page 43: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/43.jpg)
interaction stylephysical link with interface
![Page 44: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/44.jpg)
Prototype
![Page 45: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/45.jpg)
Best description?
![Page 46: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/46.jpg)
![Page 47: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/47.jpg)
visual and hapticYou can feel, use and improve the product
![Page 48: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/48.jpg)
pretendotypePalm pilot prototype by Jeff Hawkins
![Page 49: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/49.jpg)
types
![Page 50: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/50.jpg)
lo-fipen and paper, goes well with scenario
![Page 51: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/51.jpg)
hi-fiTalks about look and feel, as good as final product
![Page 52: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/52.jpg)
functionalShows interactions, let user use it
![Page 53: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/53.jpg)
compromises
![Page 54: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/54.jpg)
horizontal vs verticalThe scope helps set target right
![Page 55: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/55.jpg)
Evaluation
![Page 56: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/56.jpg)
WHY EVALUATEto test the usability of the system and to avoid pitfalls
![Page 57: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/57.jpg)
COGNITIVE WALKTHROUGHdefine a task and walk through necessary steps to perform the
given task
![Page 58: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/58.jpg)
LIKERT SCALEasking questions the right way.
![Page 59: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/59.jpg)
NIELSEN AND MOLICH'S NINE HEURISTICS
• Simple and natural dialog Simple means no irrelevant or rarely used information. Natural means an order that matches the task.
• Speak the user's language Use words and concepts from the user's world. Don't use system-specific engineering terms.
• Minimize user memory load Don't make the user remember things from one action to the next. Leave information on the screen until it's not needed.
![Page 60: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/60.jpg)
NIELSEN AND MOLICH'S NINE HEURISTICS
• Be consistent Users should be able to learn an action sequence in one part of the system and apply it again to get similar results in other places.
• Provide feedback Let users know what effect their actions have on the system.
• Provide clearly marked exits If users get into part of the system that doesn't interest them, they should always be able to get out quickly without damaging anything.
![Page 61: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/61.jpg)
NIELSEN AND MOLICH'S NINE HEURISTICS
• Provide shortcuts Shortcuts can help experienced users avoid lengthy dialogs and informational messages that they don't need.
• Good error messages Good error messages let the user know what the problem is and how to correct it.
• Prevent errors Whenever you write an error message you should also ask, can this error be avoided?
![Page 62: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/62.jpg)
Tools
![Page 63: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/63.jpg)
PENCIL N PAPERUse what you are comfortable with, don’t build sandcastle with
bulldozer
![Page 64: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/64.jpg)
COMMUNICATEBiggest mistake that can be made is “assumption”
![Page 65: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/65.jpg)
COLLABORATIVE EDITHelps in iterative documentation and feedback
![Page 66: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/66.jpg)
Tips
![Page 67: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/67.jpg)
RESEARCHread, validate, gather information, learn new tricks
Template
![Page 68: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/68.jpg)
BUILD STORYEvery good design tells stories, what is yours?
Setup Confrontation Resolution
![Page 69: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/69.jpg)
PRESENTLet them know how awesome your project is. Talk, show and sell
![Page 70: Design Theory - Ankur Sharma - Presentation](https://reader033.vdocuments.us/reader033/viewer/2022060119/559065351a28ab7e638b4598/html5/thumbnails/70.jpg)
FUN