User Experience & Design…Designing for others…UED
-
Upload
preeti-chopra -
Category
Technology
-
view
19.505 -
download
1
description
Transcript of User Experience & Design…Designing for others…UED
![Page 1: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/1.jpg)
![Page 2: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/2.jpg)
![Page 3: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/3.jpg)
The intersection of all three is User-centered design
![Page 4: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/4.jpg)
![Page 5: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/5.jpg)
UCD User centered design See the world from user’s point of view…
UCD is a multistage process which allows designers to analyze and foresee how user is going to
use the product.
![Page 6: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/6.jpg)
User-centered design process phases
![Page 7: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/7.jpg)
Analysis Phase
Understand the goals of people who will use the product…
• Meet with key stakeholders to set vision • Include usability tasks in the project plan • Assemble a multidisciplinary team to ensure complete expertise • Develop usability goals and objectives • Conduct field studies • Look at competitive products • Create user profiles • Develop a task analysis • Document user scenarios • Document user performance requirements
![Page 8: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/8.jpg)
Design Phase
Understand pain points and problems of people….Fix the problems
• Begin to brainstorm design concepts and metaphors • Develop screen flow and navigation model • Do walkthroughs of design concepts • Begin design with paper and pencil • Create low-fidelity prototypes • Conduct usability testing on low-fidelity prototypes • Create high-fidelity detailed design • Do usability testing again • Document standards and guidelines • Create a design specification
![Page 9: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/9.jpg)
Implementation Phase
Meet with the demands of real people…
• Do ongoing heuristic evaluations • Work closely with delivery team as design is implemented • Conduct usability testing as soon as possible
![Page 10: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/10.jpg)
Deployment Phase
Getting started…take feedback of people….
• Use surveys to get user feedback • Conduct field studies to get info about actual use • Check objectives using usability testing
![Page 11: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/11.jpg)
Designing a product
![Page 12: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/12.jpg)
InnovateThink something new…Be original and simple…
![Page 13: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/13.jpg)
DesignBe different and design for average people…
![Page 14: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/14.jpg)
WireframeCreate Blueprint and prototype of product….
![Page 15: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/15.jpg)
User testingFind out how useful, usable and simple to operate product is….
![Page 16: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/16.jpg)
Understand more….
![Page 17: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/17.jpg)
user Interface It’s a crossroad between the user, computer (hardware) and computer
programs (software). A systematic approach through set of commands in machine to respond to user’s interaction with the system.
![Page 18: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/18.jpg)
usability It’s a study of how easy a user interface is to use in order to achieve some
goal. An art of making product more efficient, satisfying to use and easier to learn.
![Page 19: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/19.jpg)
AccessibilityUnderstand user’s needs, evaluate and make things accessible to them
accordingly.
![Page 20: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/20.jpg)
ChecklistA comparison between tasks, processes, behaviors, user interface components etc. based on predefined set of guidelines to evaluate a product.
![Page 21: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/21.jpg)
Information ArchitectureA science of understanding what you want your site to do, defining site’s goals, understanding target audience, their goals and creating a blueprint of things accordingly.
![Page 22: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/22.jpg)
Information DesignUnderstanding how people prefer to learn, their cultural differences and how they use the information.
![Page 23: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/23.jpg)
Interaction DesignDesigning a system which focuses on user’s goals and defining the behavior of system in response to its users.
![Page 24: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/24.jpg)
Content WritingLearn to speak the user’s language.
![Page 25: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/25.jpg)
Technical WritingThe technical communication of explaining the user how to use the product.
![Page 26: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/26.jpg)
Usability EngineeringDesigning a user friendly interface that allows user to effectively and efficiently accomplish his tasks.
![Page 27: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/27.jpg)
Visual DesigningTo give a nice, pleasant and beautiful feel to the user by using images, colors, shapes, typography, visual art and page layout.
Designs are created By Preeti Arora for www.99acres.com
![Page 28: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/28.jpg)
Web analyticsA tool to measure and analyze website traffic to optimize web usage.
![Page 29: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/29.jpg)
PersonasA persona represents the real user in form of fictional characterization.
Persona is created By Neha Modgil for www.techved.com
![Page 30: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/30.jpg)
ScenarioA scenario is a story described on paper of a persona (user) using a product to achieve a particular goal.
Scenario is created By Neha Modgil for www.techved.com
![Page 31: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/31.jpg)
StoryboardA technique to illustrate the series of drawings, sketches or words to explain the interaction between the interface and user. It basically shows how user interface changes in response to user’s actions.
Storyboard is created By Mahendra for www.jeevansathi.com
![Page 32: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/32.jpg)
BrainstormingA process which gives quantitative and creative multiple ideas or solutions for any topic or problem organized into groups.
![Page 33: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/33.jpg)
Field StudyA method for collecting data and information about the user, his requirement and product requirement through interview, observations or video recording.
![Page 34: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/34.jpg)
EthnographyThis is a process of gathering information of how end user uses the product or website in their natural environment.
![Page 35: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/35.jpg)
Think aloud protocolIt’s a method of user testing in which the user is asked to think out loud while performing a task. It helps one understand the expectations and confusions user faces with the system.
![Page 36: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/36.jpg)
Use CaseIt’s a set of possible sequences of interactions between the user and systems while accomplishing a particular task to achieve a goal by detailing scenario driven threads. A use case describes "who" can do "what" with the system.
![Page 37: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/37.jpg)
Card SortingIt’s a method of giving target users to organize the small index cards while designing the structure of information of any product i.e. websites having labeling and key content on it, the results reflect how users expect the concept should be presented.
![Page 38: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/38.jpg)
Eye TrackingThe way a person moves his eyes when looking at application. It helps understand which part of the object is getting attention of the user and which part is missing attention of the user.
![Page 39: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/39.jpg)
Focus GroupIt’s a discussion with target group users to find out problems they face while using any product related to usability issues.
![Page 40: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/40.jpg)
Mental ModelIt’s a study of understanding how human know, perceive, make decisions and construct behavior in different environments.
![Page 41: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/41.jpg)
Usability TestingIt helps designer understand the reality of their assumptions and about user’s behavior by doing real life testing of real user.
![Page 42: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/42.jpg)
Human Computer InteractionIt’s a study of interaction between human and computer. The goal is to improve computers and make it more usable and receptive to user’s needs.
![Page 43: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/43.jpg)
Ergonomics (Human Factor)It’s a science of multi-disciplinary field for understanding and improving human computer interaction or human interaction with any product or system to optimize it’s performance keeping in mind the health and safety of people involved.
![Page 44: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/44.jpg)
Heuristic evaluation
It’s a usability inspection method of user interface design for usability. It identify problems in the field of Human computer interaction.
![Page 45: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/45.jpg)
Ten Usability Heuristics – by Jakob Nielsen
• Visibility of system status – The system should always keep users informed about what is going on, through appropriate feedback
within reasonable time.
• Match between system and the real world – The system should speak the users' language, with words, phrases and concepts familiar to the user,
rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
• User control and freedom – Users often choose system functions by mistake and will need a clearly marked "emergency exit" to
leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
• Consistency and standards – Users should not have to wonder whether different words, situations, or actions mean the same thing.
Follow platform conventions.
• Error prevention – Even better than good error messages is a careful design which prevents a problem from occurring in
the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.
by Jakob Nielsen These are ten general principles for user interface design. They are called "heuristics" because they are more in the nature of rules of thumb than specific usability guidelines.
![Page 46: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/46.jpg)
Ten Usability Heuristics
• Recognition rather than recall – Minimize the user's memory load by making objects, actions, and options visible. The user should not
have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.
• Flexibility and efficiency of use – Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such
that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
• Aesthetic and minimalist design – Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of
information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
• Help users recognize, diagnose, and recover from errors – Error messages should be expressed in plain language (no codes), precisely indicate the problem, and
constructively suggest a solution.
• Help and documentation – Even though it is better if the system can be used without documentation, it may be necessary to
provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.
![Page 47: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/47.jpg)
User Experience
The perfect coordination between all the things I have mentioned here in the presentation and the goal is to create the best possible interaction between machines and users.
![Page 48: User Experience & Design…Designing for others…UED](https://reader035.fdocuments.in/reader035/viewer/2022062300/5551290eb4c905b3598b496b/html5/thumbnails/48.jpg)
So UED is…. how much you could understand from me and my experience today….?
If I am able to make you understand the basics of UED through this presentation I am a successful designer or I need to learn more….