Visual Design Articles & Videos

  • Handmade Designs: The New Trust Signal

    In an era of AI-generated-everything, AI-fatigued users want designs that look like they were made by a person.

  • Analyzing Good Designs: Figma’s Shortcut

    In Figma’s Shortcut, typography and other elements are aligned to a grid, a clear visual hierarchy is established, and various design elements are used consistently in the design.

  • Validate Your Visual Design: 6 Methods

    Test your site’s visual design using these 6 methods: 5-second test, first-click test, preference testing, visual design questions after usability testing, eyetracking, and A/B testing.

  • Good Visual Design, Explained

    To create appealing designs, align type and elements to a grid, build a clear visual hierarchy, use color intentionally, and stay consistent with every design choice.

  • Liquid Glass Is Cracked, and Usability Suffers in iOS 26

    iOS 26’s visual language obscures content instead of letting it take the spotlight. New (but not always better) design patterns replace established conventions.

  • Anatomy of Good Icons

    Icon clarity is shaped by consistent layout, stroke thickness, and the handling of exterior and interior corners.

  • Preference Testing for Assessing Visual Design

    Preference testing is a tool to evaluate multiple design variations, helping you make informed decisions that align with your brand and resonate with your audience.

  • Designing Use-Case Prompt Suggestions

    Use-case prompt suggestions show how to effectively prompt AI tools. They aid learnability and creativity, helping users explore what AI tools can do.

  • Button States 101

    Understand how button states support usability. Design clear visual cues for each state to guide and inform user actions.

  • Grids 101

    Page grids use columns, gutters, and margins to structure content—boosting layout consistency, readability, and visual flow.

  • Visual Design Principles in Action

    Use the 5 key visual design principles—scale, hierarchy, balance, contrast, and Gestalt principles—to objectively critique and improve designs.

  • Button States: Communicate Interaction

    Minor visual changes help users distinguish between 5 different button states: enabled, disabled, hovered, focused, pressed.

  • Card View vs. List View

    List view allows for easy sorting and is space efficient, while card view is visually engaging and creates effective groupings.

  • Neobrutalism: Definition and Best Practices

    As a UI design style, neobrutalism focuses on raw, unrefined elements like bold colors, simple shapes, and intentionally "unfinished" aesthetics.

  • Testing Visual Design: A Comprehensive Guide

    Use methods like 5-second testing, first-click testing, and preference testing to gain insights into how users perceive your visual design.

  • Why 90’s Designs Are Coming Back

    Understanding the cyclical nature of design trends allows us to build on the past and fulfill the evolving needs of users. 3 examples of returning trends are neumorphism, dark mode, and gradients.

  • Glassmorphism: Definition and Best Practices

    Glassmorphism is a UI design trend that features translucent interface components to create depth.

  • Design Systems vs. Style Guides

    Design systems are a set of standards (like Google’s Material Design or IBM’s Carbon Design System) needed to manage design at scale. Style guides (like content or visual style guides) are just one piece in a design system.

  • Visual Design: Glossary

    Use this glossary to quickly clarify key terms and concepts related to visual design.

  • Typography Terms: Glossary

    Use this glossary to clarify key definitions related to typography.