Interaction Design Articles & Videos

  • 3 Ways to Level Up Your Visual Design Skills

    Designers, researchers, and generalists alike can improve their visual design skills through creative exercises focused on identification, replication, or exploration.

  • The Aesthetic Usability Effect and Prioritizing Appearance vs. Functionality

    Users believe that designs that look good also work well, and UX should take advantage of this. But don't make aesthetic usability lead you astray as a designer, because the UI must actually work well for long-term success.

  • Designing Empty States in Complex Applications: 3 Guidelines

    Empty states provide opportunities for designers to communicate system status, increase learnability of the system, and deliver direct pathways for key tasks. This article provides guidance for designing empty-state dialogues for content-less containers.

  • Using Fitts's Law to Make Links and Buttons Easier to Click

    Fitts's Law describes how long time it takes to click a target, based on the distance to the target and its size. Use this information to make buttons and links faster to click.

  • 3 Types of Onboarding New Users

    How to familiarize users with new user interfaces? Onboarding techniques include feature promotion, customization, and instructions. All must be kept simple.

  • UI Modes and Modals

    Modes can be a hidden state and lead to user errors. But they can also make a user interface more efficient by allowing the same action to have different results, depending on the situation.

  • Direct Manipulation in User Interfaces

    Direct manipulation is an interaction technique in graphical user interfaces where users move depictions of objects around and get immediate feedback about their actions and the outcome of these actions.

  • UX vs. UI

    User experience and user interface are highly related. Both are important, but what's the difference between UX and UI? (Often confused!)

  • Sticky Headers: 5 Ways to Make Them Better

    Persistent headers can be useful to users if they are unobtrusive, high-contrast, minimally animated, and fit user needs.

  • When is It OK to Be Inconsistent in User Interface Design?

    Consistent design enhances learnability and is usually best for usability. But if the problem you're solving is sufficiently different, then inconsistency may be better.

  • UX Animations

    Animations can make user interfaces both easier and nicer to use, but the timing has to be right, as we demonstrate in this video. Many other details also contribute to the quality of animation in the user experience.

  • Augmented/Virtual Reality vs. Computer Screens

    Will 3D user interfaces like VR and AR replace flat screens, and how should UX designers prepare for these technologies?

  • 8 Design Guidelines for Complex Applications

    Despite great diversity in the workflows and end users supported by complex applications, these 8 design guidelines are generally applicable.

  • Virtual Tours

    User interfaces that simulate a presence in a physical space allow people to tour an environment without travelling there, but were mostly considered secondary by our research participants, partly because it’s currently slow and confusing to navigate virtual tours.

  • State-Switch Controls: The Infamous Case of the "Mute" Button

    On–off controls that switch between two different system states need to clearly communicate to users both the current state and the state the system will move to, should the user press that control.

  • Login Walls

    Demanding that users create a new account before they are able to access a website or mobile app is only justified in rare cases. Usually, people go away, rather than scale a wall placed between them and your offerings.

  • Virtual Tours: High Interaction Cost, Moderate Usefulness

    Virtual tours are an occasionally useful secondary tool for checking on specific details, but most users find them to be high effort, slow, and of limited value.

  • Learnability vs Efficiency in User Interface Design

    Two of the most fundamental usability metrics are learnability (the user's ability to use a new design they have not seen before) and efficiency (the speed with which people do tasks after they have learned the interface).

  • Better Forms Through Visual Organization

    How to organize and lay out your form fields and their labels to make data entry easier for users.

  • Listboxes vs. Dropdown Lists

    Listboxes and dropdowns are compact UI controls that allow users to select options. Listboxes expose options right away and support multi-selection while dropdowns require a click to see options and support only single-selection.

  • Gamification in the User Experience

    Gamification is the usage of game mechanics in non-game contexts, such as mainstream UX design. The most successful implementations of gamification begin with a learner-centered mindset.

  • Fitts's Law

    Fitts's Law describes how long it takes a user to hit a target in a graphical user interface (GUI) or other design, as a function of size and distance. Understanding this law helps us design better buttons, forms, lists, and other interactive elements.

  • Why Microinteractions Are Important for UX

    Defining microinteractions and why getting these small UI details right matters for the quality of the user experience.

  • Design Systems and Their Benefits

    Go beyond a brand or UX style guides to create engaging, consistent user interfaces. At the same time, fit design activities within in short development cycles, spending the least possible development time and money.

  • Checkboxes vs. Switches in Forms

    Navigating whether to use checkboxes or switches can help make your forms easier to use. This video covers guidelines of when to use each.

  • Design Patterns For Complex Apps and Workflows

    Two design principles for supporting complex and repetitive workflows.

  • Why Interaction Cost Matters to UX

    Interaction cost is a direct measure of usability. It’s an indicator of how difficult the interface is going to be for the user.

  • Skeuomorphic Design: Don' t Apply It Blindly (Bruce Tognazzini)

    When using skeuomorphic design, apply aspects of the real-world counterpart that are useful, and leave out the drawbacks.

  • Industries Impacted Most by UX (Jakob Nielsen)

    Industries such as technology and e-commerce have reaped the rewards of good UX. Other sectors such as B2B and Intranets are following suit.

  • Just-Enough Prototypes Make Communicating Specs More Successful

    High-fidelity prototypes take too long to produce and are insufficient at identifying the nuances of complex interactions and logic.

  • Usefulness, Utility, Usability: 3 Goals of UX Design (Jakob Nielsen)

    For products to be useful, they must have both utility and usability. Either UX quality alone won't cut it.

  • Thumbs Up for Solving Non-Linear Reading Needs

    The user-experience benefits of a design that makes it easier to navigate complex information and return to previous locations.

  • Designers Are Not Users

    Professional designers are very different from mainstream users, who will use your product in unexpected ways.

  • Designing Empty States in Complex Applications: 3 Guidelines

    Empty states provide opportunities for designers to communicate system status, increase learnability of the system, and deliver direct pathways for key tasks. This article provides guidance for designing empty-state dialogues for content-less containers.

  • Sticky Headers: 5 Ways to Make Them Better

    Persistent headers can be useful to users if they are unobtrusive, high-contrast, minimally animated, and fit user needs.

  • 8 Design Guidelines for Complex Applications

    Despite great diversity in the workflows and end users supported by complex applications, these 8 design guidelines are generally applicable.

  • State-Switch Controls: The Infamous Case of the "Mute" Button

    On–off controls that switch between two different system states need to clearly communicate to users both the current state and the state the system will move to, should the user press that control.

  • Virtual Tours: High Interaction Cost, Moderate Usefulness

    Virtual tours are an occasionally useful secondary tool for checking on specific details, but most users find them to be high effort, slow, and of limited value.

  • Listboxes vs. Dropdown Lists

    Listboxes and dropdowns are compact UI controls that allow users to select options. Listboxes expose options right away and support multi-selection while dropdowns require a click to see options and support only single-selection.

  • Drag–and–Drop: How to Design for Ease of Use

    Clear signifiers and clear feedback at all stages of the interaction make drag–and–drop discoverable and easy to use.

  • Treemaps: Data Visualization of Complex Hierarchies

    A treemap is a complex, area-based data visualization for hierarchical data that can be hard to interpret precisely. In many cases, simpler visualizations such as bar charts are preferable.

  • Accot-Zhai Steering Law: Implications for UI Design

    Dropdowns, hierarchical menus, sliders, or scroll bars involve steering a pointer or a cursor through a tunnel; optimal design for these GUI elements should consider the Steering Law.

  • Split Buttons: Definition

    A split button is a dual-function menu button that offers a default action as well as the possibility of choosing a different action by selecting from a set of alternatives.

  • Touch Targets on Touchscreens

    Interactive elements must be at least 1cm × 1cm (0.4in × 0.4in) to support adequate selection time and prevent fat-finger errors.

  • Modes in User Interfaces: When They Help and When They Hurt Users

    In a modal interface, the same user action can have different results depending on the state of the system. Poorly signaled modes can easily trigger user errors with disastrous consequences.

  • Top 10 Application-Design Mistakes

    Application usability is enhanced when the UI guides and supports users through the workflow.

  • How to Report Errors in Forms: 10 Design Guidelines

    Help users recover from errors by clearly identifying the problems and allowing users to access and correct erroneous fields easily.

  • Tooltip Guidelines

    Tooltips are user-triggered messages that provide additional information about a page element or feature. Although tooltips aren’t new to the web, they are often incorrectly implemented.

  • Design Guidelines for Input Steppers

    Reduce input effort for fields with values that vary little from the default by allowing users to increase or decrease the number in a single button press.

  • UX Guidelines for Recommended Content

    Encourage engagement with recommendations by presenting them prominently, segmenting suggestions into clear categories, and providing methods for users to give feedback.

  • Microinteractions in User Experience

    Microinteractions convey system status, support error prevention, and communicate brand. They are initiated by a trigger, are single-purpose, and can make the experience engaging.

  • Individualized Recommendations: Users’ Expectations & Assumptions

    Users appreciate personalized content suggestions and are willing to give up some of their privacy for quality recommendations, while accepting some inaccurate recommendations.

  • Intelligent Assistants: Creepy, Childish, or a Tool? Users’ Attitudes Toward Alexa, Google Assistant, and Siri

    Users assume that assistants have a low level of competence for complex tasks and find them to be socially awkward to interact with.