bruh

Consistency

Graphical elements and layouts in a system are consistent for similar tasks to reduce confusion and increase predictability.

The back button on every page of an app looks the same and is always placed in the top-left corner.

Affordance

The visual design of an object suggests how it should be used. When looking at an object it has several cues that show you how to use it and they’re usually not even something you notice consciously.

How a coffee mug with a handle affords you to hold it with the handle.

A door handle shaped like a lever suggests that it should be pushed down.

Ecological Validity

A kind of validity that concerns how the environment in which an evaluation is done influences or even distorts the results.

For example, an evaluation that takes place in a lab will produce different results than a field evaluation and may produce a false expectation of how the object will perform in real life.

A study testing a fitness app in a gym (field study) might produce more realistic results than testing it in a lab.

Safety

Prevents users from making critical errors or ending up in dangerous situations.

A car’s reverse camera and warning sounds help drivers avoid hitting obstacles.

Learnability

How easy it is for users to learn a system and start using it effectively.

A beginner-friendly photo editing app that uses clear labels and tutorials has high learnability.

Accessibility

How well people of different abilities can use a product, including people with less-than-average abilities. This achieves inclusive design of technology and design of assistive technology.

A website that works well with screen readers is accessible for visually impaired users.

Memorability

How easy a product or product is to remember how to use, once learned at a different time.

A simple login system that always uses the same steps makes it easier to remember.

Utility

Refers to how appropriate the functions of the object are compared to the tasks that it is meant to execute. The right kind of functionality.

A note-taking app with tagging, reminders, and search functions offers high utility for organizing ideas.

Effectiveness

How good a product or system is at doing what it is supposed to do, for example, how bright a light shines or how black a black paint is.

A translation app that provides accurate and understandable translations is effective.

Visiblity

The importance of having information visible at all (or at least the right) time. Users can easily find and understand how to interact with a product or interface, reducing confusion and improving usability. Good visibility helps users quickly identify available actions and understand the system’s current state.

A media player with play/pause/skip buttons clearly visible on the main screen has good visibility.

Constraints

Deliberate limits built into the design to guide users and prevent errors when interacting with a system or product.

A credit card form that only allows 16 digits in the card number field prevents input errors.

Mapping

The relationship between a control and the object that is being controlled and their corresponding effects in a system. Users can intuitively understand how actions lead to outcomes. Good mapping leverages natural associations, such as spatial or visual cues, to make interfaces more predictable and easier to use.

A stove where knobs are arranged to match the burners’ positions on the stove top demonstrates good mapping.

Efficiency

Refers to how quickly and effortlessly users can complete their tasks or achieve their goals using a product or system. An efficient design minimizes unnecessary steps, reduces cognitive load, and streamlines workflows, enabling users to accomplish objectives with minimal effort and time.

Keyboard shortcuts in software like Photoshop make expert users more efficient.

Reliabiltiy

How well a product or system reproduces the same result doing the same task at different times. A reliable design ensures that users can trust the system to deliver accurate results and function as expected, contributing to a positive and seamless user experience.

A weather app that consistently gives accurate forecasts is reliable.

User-centered design

User-centered design entails that the user is a part of the design process. They are the main focus of ideation, and take part in later stages by giving feedback in evaluation and usability testing.

When designing a budgeting app for children, you’d involve both kids and their parents early on — conducting interviews, observing how they interact with money, and testing prototypes with them to get feedback. This ensures the product aligns with how kids actually think and behave.

Participatory Design

Includes the users as central actors in the design process, they are seen as active co-creators, instead of being seen as reactive informers.

In creating a new public transportation ticket machine, commuters and elderly users are invited to workshops to design the interface alongside developers — giving feedback, sketching ideas, and proposing changes.

The Double Diamond of Design

A design process where you design for a problem. You discover that problem first by interviewing and researching the user group, then defining the problem and requirements for how to solve it. Then you develop the solution while evaluating the prototypes several times in the process. Lastly, you deliver the final product to the users.

1. Discover (explore the problem),

2. Define (pinpoint the exact issue),

3. Develop (brainstorm and prototype solutions),

4. Deliver (final implementation).

A team wants to redesign a library’s digital catalog. They first conduct user interviews (discover), define the main issues like “search is too slow” (define), prototype new interfaces (develop), and finally launch a refined version after testing (deliver).

Design for Error

A principle that anticipates user mistakes and helps users recover from them.

To combat the errors you could for example include back buttons to escape unwanted situations (an example of safety), or to include pop-up menus for critical decisions to not make slips.

Brainstorming

A method for generating lots of ideas quickly without judgment.

When designing a new smart kitchen appliance, designers and potential users gather in a workshop to throw out as many ideas as possible — even wild ones like "a fridge that gives cooking suggestions based on mood."

Ideation

The creative process of forming ideas and concepts that could solve the defined problem.

After identifying that teens don’t trust online financial tools, the design team holds an ideation session to think of fun, game-based ways to teach saving.

Iterative Design

A continuous cycle of designing an object, iterating on it several times by prototyping, testing, analyzing, and refining the product continuously. (No matter how good the designers are, ideas will need to be revised, likely several times.)

When developing a fitness tracking app, the first version is released to a small group. Their feedback leads to several new versions until the app works seamlessly.

Prototyping

Condensing an intangible concept into a tangible form by for example sketching it or building a simplified model of the idea. (A way for stakeholders to interact with a design, and tests its suitability for their needs.)

When developing a fitness tracking app, the first version is released to a small group. Their feedback leads to several new versions until the app works seamlessly.

MoSCow

An abbreviation that stands for “Must have, Should have, Could have, Won't have” is a method to prioritize requirements in a design process.

For a food delivery app: “Login system” is a must have, “dark mode” is a could have, “drone delivery” is a won’t have.

Six Thinking Hats

A method that encourages group members to explore different perspectives by metaphorically “wearing different hats”:

• White Hat: facts & data

• Red Hat: emotions

• Black Hat: caution

• Yellow Hat: optimism

• Green Hat: creativity

• Blue Hat: process control

In a team designing a new learning app, they use the Red Hat to express user frustrations, and the Green Hat to brainstorm fun, engaging ways to keep students motivated.

Checkboxes

A type of UI element that lets users select multiple options from a list. Each box can be checked or unchecked independently.

When signing up for a newsletter, a form might ask you to check boxes like:
☑ Get weekly emails
☐ Receive product updates
☐ Join the beta test group
You can choose one, multiple, or none.

Radio Buttons

A group of buttons where only one can be selected at a time. Choosing one automatically deselects any other that was selected.

When selecting your gender in a form:

🔘 Male
⚪ Female
⚪ Non-binary
Only one option is active at a time, like buttons on old car radios — hence the name.

Contextual Menus

A menu that appears when you interact with something (often right-clicking), showing options relevant to that item.

Right-clicking on a file on your desktop brings up a menu with options like "Open", "Rename", or "Delete" — specific actions depending on the context.

WIMP

A classic interaction style in graphical user interfaces.

• Windows: Separate areas that show different applications or tools (e.g., your browser and a document editor open at the same time).

• Icons: Visual shortcuts to apps or actions (e.g., trash can = delete).

• Menus: Lists of actions, often grouped together (e.g., “File > Save”).

• Pointer: The cursor that lets you interact with on-screen elements.

A typical computer desktop interface uses all four elements.

Command Line Interface (CLI) vs GUI

An interface that expends barely any user experience, it has an input and displays outputs by printing text in so-called command lines.

Developers may use a CLI to navigate files or run programs faster, while everyday users rely on GUIs like Windows or macOS.

Direct Manipulation interface

A type of interface where the user is allowed to directly manipulate objects by moving and changing them.

For example, resizing a rectangle by dragging its corner compared to punching in the size of sides in a separate menu.

Dragging a file into a folder, resizing a photo by pulling a corner, or swiping to delete an email — no typing or commands needed.

Micro-Interactions

Moments of interactions at the interface - despite being small - can have a big impact on the user experience.

A “like” button that gives a heart animation, a toggle switch that animates smoothly when turned on/off, or a buzz when you complete a to-do item. These tiny touches make a big difference in how intuitive and satisfying a product feels.

User Experience (UX)

Refers to the overall experience a user has when interacting with a product or system, encompassing aspects like usability, accessibility, design, and emotional satisfaction. It focuses on creating intuitive, efficient, and enjoyable interactions that meet the needs and expectations of the user. (Pragmatic and hedonic aspects of use, A range of emotions and felt experiences)

Booking a flight on a site that’s fast, visually clear, gives confirmation emails, and lets you make changes easily = good UX. UX covers both pragmatic aspects (is it usable?) and hedonic ones (does it feel good or pleasant?).

User Experience UX Easy

The overall feeling and effectiveness of a user’s interaction with a product or system — including how easy, enjoyable, and satisfying it is.

“Think aloud” technique

A technique used in evaluation when testing a prototype, where the user is tasked to say aloud what they’re thinking when performing a task. It is useful to get information that the user might forget to talk about when asked about later.

A user testing a new banking app says, “I don’t see a ‘transfer’ button—maybe it’s under ‘more’?” while navigating.

Consent form

A document where the participant provides permission for how they will participate in the study and how they want their data to be used.

A participant signs a form allowing a researcher to record their usability test session and use the insights in a report.

Slips

A type of error a user can make when they are absent-mindedly clicking on something, or not entirely focused on what they're doing.

(Errors that you make by accident or due to lack of concentration.)

Clicking “delete” instead of “download” when multitasking.

Gulf of execution

The gap between what a user wants to do and how to do it in the system. Closing this gulf involves designing intuitive and user-friendly interfaces that bridge the gap between user intent and system functionality.

A user wants to print a document but can’t find the print option.

Gulf of evaluation

The gap between what the system shows and how easily the user can understand the outcome. It highlights how easily users can interpret the system's feedback to evaluate the outcome of their actions. Bridging this gulf involves designing clear, concise, and meaningful feedback that helps users assess the results of their interactions effectively.

(The distance between the physical presentation of the system state and the expectation of the user.)

After clicking “submit,” nothing happens—so the user is unsure if the form was actually sent.

Heuristic evaluation

Usability inspection method where a group of usability experts review a user interface according to a small set of principles. Identifies usability issues by examining the interface to ensure it aligns with best practices (heuristics), helping improve the overall user experience.

Experts evaluate a health app and find that inconsistent icons confuse users.

A fit criterion

In the context of design, a fit criterion refers to a standard or measure used to evaluate how well a design solution meets the desired objectives, constraints, or requirements. It helps assess whether the design aligns with the intended purpose and performance expectations.

(The measure of whether a requirement has been fulfilled)

“The app should load in less than 2 seconds” is a fit criterion for performance.

Formative evaluation

Evaluation conducted during different times during the design process to gather feedback and make improvements. It helps identify strengths, weaknesses, and areas for refinement before finalizing the product or solution.

Testing a prototype halfway through development to refine navigation.

Summative evaluation

Done at the end of a development cycle to verify that it fulfills the goals.

After releasing an app, a company gathers user satisfaction scores and completion rates to evaluate its effectiveness.

Cognitive walkthrough

Usability evaluation method where experts simulate a user's problem-solving process while interacting with a system or product. It focuses on identifying potential usability issues by examining how easy it is for users to complete tasks and whether they can easily understand the system's functionality.

(evaluates: Learnability)

Evaluators walk through the steps of using a photo editing tool and ask, “Will the user know what to do next?”

Feedback

The user gets information about which action has taken place and what effect on the system the action had. Intended to guide improvement or reinforce positive aspects. Helps identify strengths and areas for improvement, enabling iterative refinement and better alignment with user needs or goals.

It can also mean the response from the system when an action is performed.

A progress bar during a file upload tells the user that the task is ongoing.

Test metrics

Quantitative measures used to assess the effectiveness, efficiency, and quality of a product or system during testing. Factors like task completion time, error rates, user satisfaction, and the number of issues identified, helping to evaluate performance and guide improvements.

8 out of 10 users successfully complete the checkout process in under 3 minutes.

Usability testing

Method of evaluating a product or system by observing real users as they complete tasks. It helps identify usability issues, measure user satisfaction, and assess how easily and effectively the product can be used, providing insights for improvements before the final release.

Watching users try to buy a train ticket using a kiosk and noting where they get stuck.

Empirical measurement

Identifying specific goals up front that the product can be empirically evaluated against. Process of collecting data through direct observation or experimentation, rather than theory or assumptions.

Measuring how long it takes users to complete a task with a new interface.

Requirements

Requirements are the specific needs that a product or system must meet to be considered successful. They define what the design or solution should accomplish, including functional, technical, and user-related aspects, and serve as a foundation for development and evaluation.

(They specify what is needed and how to know if it has been delivered but allow for freedom in how they are implemented. Reduce costs and time in development, reduce confusion in communication, and provide good testing criteria for the final product.

Should be: Clear, unambiguous, specific, and measurable.)

“The app must support up to 10,000 users simultaneously” is a requirement.

Wizard of Oz

A testing method where users interact with a prototype that’s secretly controlled by a person simulating system responses, mimicking the functionality of a fully automated system. This method is used to test user reactions and gather feedback before fully developing the system.

A chatbot seems to answer questions using AI, but a researcher types the responses manually behind the scenes.

Interview

A qualitative research method where information is gathered through direct conversation between the interviewer and the interviewee. Interviews are used to gain insights into user experiences, needs, and preferences, helping improve products or services.

(A definite purpose; planned and organized; a premium placed on making meanings explicit; the interviewer is responsible for the topics.  interview schedule: A structured set of questions that guide the interviewer.)

A designer interviews parents about how their kids manage pocket money to inform a budgeting app.

Stakeholder

Any individual, group, or organization that has an interest in or is affected by a product or system. They can influence or be influenced by the success or failure of the project. This can include users, customers, team members, or investors.

In developing an educational app, students, teachers, and school administrators are all stakeholders.

Aesthetic and Minimalist Design

Keep interfaces clean and only show necessary information.
Dialogs or objects should not contain information that is irrelevant or rarely needed, it competes and sometimes disturbs its usability.

A calendar app that only shows today’s events unless more are requested.

Flexibility and Efficiency of Use

Provide accelerators for the more proficient users, like shortcuts that aren’t immediately apparent for novice users.

Ctrl+S for saving a document speeds up the process for experienced users.

Recognition Rather than Recall

Minimize the user’s memory load by making objects, actions, and options visible, and letting them recognize it, rather than letting them try to remember an action they want to do.

A toolbar with icons for formatting text lets users recognize the bold function instead of remembering a command.

User Control and Freedom

You should provide the user with clearly marked emergency exits to leave the unwanted states.

An “Undo” button in a drawing app gives users control

Match Between the System and the Real World

The system should speak the users’ language rather than internal jargon.

A trash can icon for deleting files makes sense to most users

Visibility of System Status

The system should always keep the user informed about what is going on, through appropriate feedback in a reasonable amount of time.

A loading spinner shows the system is working on something.

Consistency and Standards

Follow industry conventions, users should not have to wonder whether words actions, or situations mean the same thing.

A floppy disk icon for saving is recognized across many applications

Error Prevention

Prevent errors by either preventing them from happening in the first place or informing the user with a dialogue box before letting them commit to the action.

A confirmation message before deleting a file helps avoid accidental loss

Help Users Recognize, Diagnose, and Recover from Errors

Error messages should be clear and offer solutions in plain language.

Password must be at least 8 characters” tells the user exactly what to fix.

Help and Documentation

sometimes it is necessary to provide extra documentation to provide the user with information about the object and help with completing tasks.

A help center with search and tutorials supports users stuck on tasks.