graphical user interfaces Articles & Videos

  • Common Fate: Gestalt Principle for User Interface Design

    Things that move in synch are perceived as belonging to the same group and being different than other screen elements that stay put or move differently.

  • Connectedness: Gestalt Principle for User Interface Design

    Visual design elements that are connected (for example, by a line) are seen as belonging together. This principle is strong enough to overrule small differences between the items.

  • Closure: Gestalt Principle for User Interface Design

    People often fill in the gaps between visual elements, using closure to perceive them as a whole instead of being separate UI items.

  • Proximity: Gestalt Principle for User Interface Design

    UI elements that are close together are perceived as belonging together, whereas users think that things that are apart play different roles in the interaction.

  • Similarity: Gestalt Principle 1 for UI Design

    User interface elements that share one or more traits (such as shape, color, size, etc.) will be seen by users as being similar and belonging together.

  • The Gestalt Principles for User Interface Design

    The gestalt principles for visual perception make users see some graphical user interface design elements as parts of a whole, and others as being separate, and thus different.

  • The UX of Phone-Tree Systems: 16 Usability Guidelines

    Phone trees are often frustrating. Badly designed interactive voice-response (IVR) systems violate many of the 10 usability heuristics.

  • The Dos and Don’ts of Pairing Typefaces

    When choosing typography to use in designs, narrow down your options by understanding the most common classifications, looking for typefaces with multiple variations and distinct characters, and pairing typefaces together with consistency and readability in mind.

  • 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.

  • Video Game Design and User Experience

    Video game design is a special case of user interface design, with some differences (especially in user goals) but also many similarities with more traditional UX design problems and methods.

  • 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.

  • Similarity Principle in Visual Design

    Design elements that appear similar in some way — sharing the same color, shape, or size — are perceived as related, while elements that appear dissimilar are perceived as belonging to separate groups.

  • Proximity Principle in Visual Design

    Design elements near each other are perceived as related, while elements spaced apart are perceived as belonging to separate groups.

  • The Principle of Common Region: Containers Create Groupings

    In visual design, elements within the same boundary are perceived as related.

  • 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.

  • Steering Law for Cursor and Mouse Movements in a GUI Tunnel

    In a graphical user interface, having the user move a cursor within a narrow path (e.g., in a hierarchical menu or a slider) follows a strict law for how easy or difficult it is to do, depending on the specifics of the GUI.

  • Why You Should Use a Grid for Designing Layouts

    Grids are a great framework to help designers quickly put together a clean, well-aligned interface, and help users to easily scan, read, and use those interfaces.

  • 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.

  • 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.