ui style and usability, user experience niteen borge
TRANSCRIPT
![Page 1: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/1.jpg)
UI Style and Usability, User Experience
Niteen Borge
![Page 2: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/2.jpg)
User Interface
A user interface is the system by which people (users) interact with a machine.
UI provide a means of: Input, allowing the users to
manipulate a system, and/or Output, allowing the system to
indicate the effects of the users
![Page 3: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/3.jpg)
Example
![Page 4: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/4.jpg)
UI Design Principles The structure principle. Your design should
organize the user interface purposefully, in meaningful and useful ways
The simplicity principle. Your design should make simple, common tasks simple to do, communicating clearly and simply in the user’s own language
The visibility principle. Your design should keep all needed options and materials for a given task visible without distracting the user with extraneous or redundant information.
![Page 5: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/5.jpg)
UI Design Principles (cont) The feedback principle. Your design should
keep users informed of actions or interpretations, changes of state or condition, and errors or exceptions that are relevant and of interest to the user
The tolerance principle. Your design should be flexible and tolerant, reducing the cost of mistakes and misuse by allowing undoing and redoing.
The reuse principle. Your design should reuse internal and external components and behaviors
![Page 6: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/6.jpg)
Key Aspects
Controls for different features should be presented in a consistent manner.
Various features should work in similar ways.
User interfaces should not change version-to-version -- user interfaces must remain upward compatible
![Page 7: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/7.jpg)
Processes
Functionality requirements gathering
User analysis Information architecture Prototyping Usability testing Graphic Interface design
![Page 8: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/8.jpg)
Some Website UI design
http://havenworks.com/ http://www.georgehutchins.com/
![Page 9: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/9.jpg)
What is usability?
Usability is the degree to which something - software, hardware or anything else - is easy to use and a good fit for the people who use it.
Generally associated with the functionalities of the product.
Characteristic of the user interface.
![Page 10: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/10.jpg)
Key Attributes
Learnability Efficiency Memorability Errors Satisfaction
![Page 11: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/11.jpg)
Usability considerations
Who are the users, what do they know, and what can they learn?
What do users want or need to do? What is the general background of
the users? What is the context in which the user
is working? What has to be left to the machine?
![Page 12: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/12.jpg)
Other considerations Can users easily accomplish their
intended tasks? How much training do users need? What documentation or other supporting
materials are available to help the user? What and how many errors do users
make when interacting with the product? Are there provisions for meeting the
special needs of users with disabilities?
![Page 13: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/13.jpg)
Discoverability Is the user ever expected to do something
that is not obvious? Are there hints and tips and shortcuts that
appear as the user is using the software? Is the user at a disadvantage for not
knowing certain keyboard shortcuts Is the learning curve (of hints and tips)
skewed towards point-and-click users rather than keyboard users?
![Page 14: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/14.jpg)
Usability Maxims Know the user, and YOU are not the user. Things that look the same should act the same. The information for the decision needs to be
there when the decision is needed. Error messages should actually mean
something to the user and tell the user how to fix the problem.
Everyone makes mistakes, so every mistake should be fixable.
Consistency, consistency, consistency.
![Page 15: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/15.jpg)
Designing for Usability
Three principles of design By John Gould and Clayton Lewis
Evaluation methods Empirical Measurement Iterative Design
![Page 16: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/16.jpg)
Evaluation methods
Parallel Design Inspection methods
Card Sorting Tree testing
Inquiry methods Task Analysis Questionnaires/Surveys
![Page 17: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/17.jpg)
Usability testing
Usability testing is a technique used to evaluate a product by testing it on users.
Usability testing focuses on measuring a human-made product's capacity to meet its intended purpose
![Page 18: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/18.jpg)
Goals of usability testing
Performance Accuracy Recall Emotional response
![Page 19: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/19.jpg)
Benefits of usability
Higher revenues through increased sales
Increased user efficiency and satisfaction
Reduced development costs Reduced support costs
![Page 20: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/20.jpg)
More Examples
http://www.phonetics-ltd.com/ http://www.flatpakhouse.com/
![Page 21: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/21.jpg)
User experience (UX)
User eXperience (UX) is about how a user feels about using a system.
ISO 9241-210 defines user experience as "a person's perceptions and responses that result from the use or anticipated use of a product, system or service".
UX is subjective and focuses on the use.
![Page 22: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/22.jpg)
History
The term user experience was brought to wider knowledge by Donald Norman, User Experience Architect, in mid-1990's.
![Page 23: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/23.jpg)
What affects user experience?
A diversity of things can influence a person's user experience with a system. User's state System properties Situation
![Page 24: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/24.jpg)
UX evaluation
UX evaluation means investigating how a person feels about using a system.
It hard to evaluate user experience and come up with solid results Subjective Context-dependent Dynamic over time
![Page 25: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/25.jpg)
UX evaluation approach
Goal: Summative (score) or Formative (areas for improvement)
Approach: Objective or Subjective Data: Quantitative or Qualitative Granularity: Momentary,
episodic, or overall UX Setup: Lab or field
![Page 26: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/26.jpg)
User Experience measures Utility: Does the user perceive the functions
in the system as useful and fit for the purpose? Usability: Does the user feel that it is easy
and efficient to get things done with the system?
Identification: Can I identify myself with the product?
Stimulation: What kind of experience I am getting from system?
Value: What is its value for me?
![Page 27: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/27.jpg)
UX evaluation methods
Diary methods Experience Sampling Method Day Reconstruction Method AttrakDiff: questionnaire for overall
UX evaluation Ladder interviews
![Page 28: UI Style and Usability, User Experience Niteen Borge](https://reader030.vdocuments.site/reader030/viewer/2022032414/56649ee45503460f94bf292b/html5/thumbnails/28.jpg)
Questions?