HCI Cheat Sheet: by Via
HCI Cheat Sheet: by Via
HCI Development Cycle Neilson's 10 Design Heuristic Neilson's 10 Design Heuristic (cont)
Design Evaluate Implement Visibility of system status:The system Flexibility and efficiency of use: Accele‐
Ethnography Prototype Expert should always keep users informed about rators — unseen by the novice user — may
Evaluation what is going on, through appropriate often speed up the interaction for the expert
feedback within reasonable time. user such that the system can cater to both
Task GUI tools Usability testing
Match between system and the real inexperienced and experienced users. Allow
Analysis
world: The system should speak the users' users to tailor frequent actions.
Design Guidelines
language, with words, phrases and Aesthetic and minimalist design
Scenarios
concepts familiar to the user, rather than Help users recognize, diagnose, and
This HCI development cycle involving system-oriented terms. Follow real-world recover from errors
(DESIGN -- EVALUATE -- IMPLEMENT) is conventions, making information appear in
Help and Documentation
an iterative process and should be used a natural and logical order.
at every stage. User control and freedom: Users often QUOTE TO REMEMBER
choose system functions by mistake and
Evaluation methodologies Do everything possible to understand
will need a clearly marked "emergency exit"
users(people).
Expert: Inspection methods(Heuristic to leave the unwanted state without having
evaluation, cognitive walk-through), Models to go through an extended dialogue.
Interview(techniques)
Support undo and redo.
User testing: Qualitative methods(obser‐
Formerly structured,Semi-structured,Open-
vation, interviews, questionnaires, think-‐ Consistency and standards
ended questions, Closed-ended questions,
aloud), Quantitative usability evaluation Error prevention
Grand tour questions
User testing is difficult than Expert Recognition rather than recall: Minimize
evaluation the user's memory load by making objects, Stakeholders
actions, and options visible. The user
Primary Secondary
PACT should not have to remember information
from one part of the dialogue to another. Tertiary Facilitators
P(People) A(Activities)C(Context)T (Tech‐
Instructions for use of the system should be Identify stakeholders for your system, so
nologies)
visible or easily retrievable whenever you know what to give more importance.
“People use technologies to undertake
appropriate.
activities in contexts” (To understand how to
develop the best interfaces, we must
understand people!)
Your best User is Users are The Model, View, Controller Gulf of execution: User’s formulation of
is not good always not user is actions
MVC divides application into:
enough right designers not Gulf of evaluation: User’s expectations
- Model of core functionality and data
always about system state
- Views displaying information to user
right
- Controllers handling user input
Designers less is Details Help Horton’s checklist for icon designers
are not more matter does MVC Pros and Cons Understandable. Spontaneously suggest
users not
Pros Cons the intended concept to the viewer?
Usability vice presidents are not users
Multiple views of Complexity for simple Unambiguous. Are additional cues (label,
engineering
same model interactors other icons documentation)
is a
Synchronized Potentially excessive Informative. Why is the concept important?
process
views updates/messages Attractive. Does the image use smooth
Types of Metaphors Pluggable V & C Tight coupling, in edges and lines?
and “look and feel” practice Legible. Test all combinations of color and
Orient‐ Ontolo Structural Metonymy
Lack of portability size?
ational gical
eg: eg: eg: file magnifying Some toolkits make
'Understanding' before making the
spinner "kill deletion glass:For MVC framework hard
design
controls the is using search
and up proces trash can ICONS It is important to create personas and
voting s" scenarios before you start designing.
Icons make use of three principle types of Personas: Fictional characters, which you
Orientational:Gives a concept a spatial
representation: create based upon your research in order to
orientation
-- Metaphor relies on people transferring represent the different user types that might
Ontological: Identifies an abstract system
knowledge from one use your service, product, site, or brand in a
concept with a basic category of existence
domain and applying to another similar way. Creating personas will help you
in the physical world: substance, object,
-- Direct mapping - creating a more or less to understand your users' needs, experi‐
container or entity
direct image of ences, behaviours and goals.
Structural: Identifies an abstract system
concept with a detailed real world concept what the icon is intended to represent Scenarios:Stories(real-world experiences of
or object -- Convention - arbitrary design, which has people), Conceptual(abstract descripti‐
Metonymy: use of the name of one thing become accepted ons),Concrete(specific design decisions and
for that of another of which it is an attribute as standing for what is intended over time tech. added), Use cases(formal descriptions
or with which it is associated that can be implemented)
Gestalt Properties