🎨 Design &amp; UX

Design System vs. Style Guide: The Parent and the Child

A Design System is the parent; a Style Guide is just one child. The system is a complete toolkit for building products, containing reusable components and code, used by large teams to maintain consistency.

The Buyer's Journey: A Funnel, Not a Tunnel

Think of the buyer's journey as a funnel, not a rigid path. It models how a customer moves from awareness of a problem to purchasing a solution. The footgun is assuming customers follow its stages linearly, when real behavior is often messy.

Discourse Analysis in UX Research

Discourse analysis treats language as a design artifact, revealing how users construct meaning. Apply it to interviews and support logs to find unstated needs. Footgun: mining for confirming quotes rather than analyzing how the narrative is built.

Measuring Design System ROI: From Cost to Investment

Frame a design system not as a cost but as a force multiplier for your team's time. Calculate its ROI to show management how much money reusable components and clear standards will save.

Design System Governance: Preventing UI Drift

Design system governance is the rulebook that stops your UI from becoming a free-for-all. It's used to manage contributions, maintain consistency, and ensure updates are intentional, preventing drift as teams and products scale.

The TOFU/MOFU/BOFU Content Marketing Funnel

The TOFU/MOFU/BOFU framework maps content to a buyer's journey, from initial awareness to a final decision. It ensures you create broad educational articles (Top), solution comparisons (Middle), and case studies (Bottom) to guide users.

Service Blueprint: The Wiring Diagram Behind User Journeys

A service blueprint X-rays the hidden machinery behind a customer journey. Use it for omnichannel services crossing departments. The footgun is producing generic diagrams untethered from a specific business goal like reducing redundancy.

POUR: The Four Pillars of Web Accessibility

POUR is a mental model for web accessibility. It asks: can users Perceive content, Operate the interface, Understand the information, and use it with Robust tools? It applies to all UI design.

Design System Triage: Treating Your DS Like a Product

Treat your design system like a product, not a static library. It requires a triage process to handle bugs and feature requests from its users—your designers and developers. This applies when a component breaks or needs a new feature.

Stevens' Four Levels of Measurement

Data is not just numbers; Stevens' levels classify the nature of information each variable holds. In UX research, this determines whether you can average feedback or only count it. Treating every rating scale as a ratio number wrecks your analysis.

Alt Text: Giving Images a Voice for Everyone

Alt text gives an image a voice when it can't be seen. It's read by screen readers for accessibility and displayed if an image breaks. The footgun is writing "image of..." or leaving it blank; instead, describe the image's content and purpose.

Driving Design System Adoption

A design system's value isn't in its components, but in its use. Drive adoption by creating collaborative feedback loops with users through interactive workshops and dedicated office hours.

White Papers: Explaining Complexity to Drive Decisions

A white paper is a persuasive essay disguised as a technical report. It educates readers on a complex problem to lead them toward the author's preferred solution. Use it to introduce new tech or establish thought leadership.

Normal Distribution: Two Parameters, One Bell Curve

A normal distribution is a bell curve for real-valued variables, defined by mean and standard deviation. Use it when values cluster around a center. The footgun is forcing normality on skewed or bounded data, which corrupts the probability density.

Focus Order: The Keyboard's Path Through Your UI

Focus order is the path a user takes through your UI using only a keyboard. It's crucial for accessibility, letting users navigate forms and menus without a mouse.

Breaking Change Policy: Managing API Evolution

A breaking change policy is a contract with your users, ensuring disruptive API changes are predictable, not chaotic. It governs how you alter shared libraries or design systems, like removing a prop, to prevent downstream failures and maintain trust.

Content Brief: The Blueprint for Your Content

A content brief is a short blueprint for a piece of content, ensuring the writer knows exactly what to create. It's essential when working with freelancers or team members to align on goals and format before work begins. Skipping it invites costly rewrites.

Correlation Does Not Mean Causation

Two metrics moving together does not mean one drives the other. In UX research, a spike in clicks after a redesign does not prove the redesign caused it. The footgun is treating every coincidence as proof your change worked.

Semantic HTML: Use the Right Element for the Job

Think of HTML tags as pre-built components, not just style containers. Using <button> instead of a styled <div> gives you keyboard navigation and screen reader support for free. The biggest mistake is using generic <div>s for interactive elements.