Loading…
Loading…
From cognitive biases to visual design — understand the psychology, methods, and frameworks that shape every interface.
There's an optimal level of arousal for performance — too little or too much both hurt outcomes.
Empty areas between design elements that improve readability and visual clarity.
The amount of change needed to be noticed is proportional to the original magnitude — bigger stimuli need bigger changes.
Making relevant controls and information visible so users know what actions are possible.
Creating products usable by the widest range of people without needing adaptation.
A design principle where all elements feel like they belong together as a whole.
Undo/redo functionality allows users to reverse actions and recover from mistakes, enabling confident exploration and reducing error anxiety.
Touch and mouse are fundamentally different input paradigms requiring intentional design for each, not treating one as a degraded version of the other.
Tooltips and popovers are contextual overlays providing additional information or controls without navigation away from the current view.
Designing systems that handle user errors gracefully and minimize negative consequences.
Toast notifications are transient, non-modal messages appearing briefly to confirm actions or surface information without interrupting workflow.
Tap and click inputs differ in precision, states, target sizes, and capabilities, requiring distinct design considerations.
Tabs and segmented controls switch between related views or categories within the same context without page navigation.
Swipe gestures allow actions through directional finger movement on touch screens, providing efficient shortcuts for common actions.
Success states confirm a user's action completed as intended, providing closure and guiding toward the next step.
Steppers break complex processes into sequential steps with visual progress, making lengthy workflows manageable.
UI state management means designing for every possible condition an element can be in, ensuring nothing is left to chance or browser defaults.
Sort patterns allow users to reorder displayed content by criteria like date, name, relevance, or custom fields.
Skeleton screens display a wireframe preview of the page structure while content loads, creating the perception of faster loading.
Reducing complexity so users can accomplish tasks with minimal effort and confusion.
Signifiers are perceivable cues indicating what actions are possible and how to perform them, bridging affordances and user understanding.
Share patterns provide mechanisms for users to distribute content through links, social platforms, messaging, or native OS share sheets.
Search patterns encompass the full experience of finding content through text queries, from input to results to refinement.
Designing systems that maintain usability and performance as they grow in scope.
How pleasant and fulfilling users find the experience of using a product.
Using repeated visual patterns to create a sense of movement and flow in a layout.
Responsive interaction means adapting how users interact with your product based on their device, input method, and context.
Reusing visual elements consistently to create cohesion and reinforce design patterns.
Showing users options and cues rather than requiring them to remember information.
Pull to refresh is a touch gesture where dragging down from the top of scrollable content triggers a data refresh, popularized by Loren Brichter.
The relative size relationship between elements that creates balance in a design.
Having too many options leads to decision paralysis, anxiety, and lower satisfaction.
Pagination divides content into discrete pages with navigation, providing position awareness, control, and finite content boundaries.
Onboarding guides new users from sign-up to their first moment of value, teaching core functionality while driving toward the 'aha moment.'
Breaking a design into independent, reusable components that can be combined flexibly.
Modals are overlay windows requiring interaction before returning to main content, used for critical decisions and focused tasks.
Microinteractions are tiny, functional animations and responses that occur when users interact with UI elements, communicating status and guiding users through tasks.
How easily users can remember how to use a product after time away from it.
The relationship between controls and their effects, making interactions feel intuitive.
Long press is a touch gesture triggering secondary actions or context menus after a sustained touch (300-500ms).
Loading patterns are design strategies for managing user perception during data fetching, processing, or state transitions.
How quickly new users can understand and become proficient with a product.
Infinite scroll automatically loads new content as the user approaches the bottom, creating seamless browsing for content discovery.
Designing for the full range of human diversity including ability, language, and culture.
Hover states provide visual feedback when a cursor is over an interactive element, signaling clickability and enabling progressive disclosure.
Organizing elements by importance so users naturally focus on key content first.
Resources like guides and FAQs that help users understand and use a product.
Haptic feedback uses device vibration to provide physical confirmation of digital interactions, adding a tactile dimension to touch interfaces.
Letting users undo or recover from mistakes easily without losing their work.
Interfaces that accommodate both novice and expert users through shortcuts and customization.
Filter patterns allow users to narrow displayed content by applying criteria, making large datasets manageable and relevant.
Feedback loops ensure every user action produces an immediate system response, closing the gap between action and understanding.
Visual, auditory, or haptic responses that inform users their action was received.
Error states communicate failures or invalid inputs with clear explanation and actionable recovery paths.
Empty states are screens shown when no data exists, serving as opportunities to guide, educate, and motivate users toward their first action.
Using size, color, or contrast to draw attention to the most important elements.
Crafting experiences that evoke positive feelings and meaningful connections with users.
How quickly users can complete tasks once they have learned the interface.
How accurately and completely users can achieve their intended goals.
Drawers and sidebars provide navigation, settings, or contextual information alongside main content.
Drag and drop enables direct spatial manipulation of UI elements for reordering, organizing, or transferring content between containers.
How easily users can find features, content, or actions within an interface.
Disabled states indicate an element exists but cannot currently be used, preventing invalid actions while maintaining visibility for context.
Letting users interact with on-screen objects directly, like dragging or resizing.
Design decisions backed by research, data, and rationale that can withstand scrutiny.
People overwhelmingly accept default options, making pre-selected choices one of the most impactful design decisions.
Dark mode provides an alternative color scheme with dark backgrounds and light text, requiring careful color and contrast management.
Copy to clipboard provides one-click copying of content, requiring clear visual confirmation that the copy succeeded.
Using differences in color, size, or shape to create visual hierarchy and interest.
Design limitations that guide users toward correct actions and prevent errors.
Technology that informs without demanding attention, staying at the periphery.
Breadcrumbs display hierarchical path from root to current page, enabling quick navigation to parent levels.
Bottom sheets are mobile UI surfaces sliding up from the bottom edge, providing contextual actions while maintaining connection to the underlying view.
Distributing visual weight evenly across a layout to create stability and harmony.
Arranging UI elements along a common edge or axis to create visual order and consistency.
Affordances are perceived and actual properties of an object that determine how it could be used. In UI, they signal what actions are possible.
Active states provide immediate visual feedback during the press moment, confirming the system received input before action completes.
Accordions allow progressive disclosure by expanding/collapsing sections, reducing information overload.
The design principle that products should be usable by people of all abilities and disabilities.
Humans have communicated through stories for 100,000+ years — our brains are literally wired for narrative processing. Paul Zak's neuroscience research shows that stories trigger oxytocin release, creating empathy and trust. In UX, storytelling operates at multiple levels: micro (microcopy that tells tiny stories), macro (the overall product journey as narrative), and meta (brand storytelling that creates meaning). Slack's onboarding tells the story of 'your team, getting organized.' Spotify Wrapped tells 'your year in music.' Headspace tells 'your journey to calm.' The best products have a clear narrative: protagonist (user), challenge (their problem), guide (your product), and resolution (their success). This is Donald Miller's StoryBrand framework applied to UX. To apply: (1) Define your user as the hero, your product as the guide, (2) Create a clear narrative arc in onboarding (setup, challenge, first win), (3) Use microcopy that tells stories ('You're all caught up' tells a completion story), (4) Design transitions between features as narrative connections, (5) End sessions with resolution, not abandonment. Common mistakes: making the brand the hero instead of the user, telling stories that are too long for the context, inconsistent narrative voice across touchpoints, and storytelling that obscures rather than clarifies functionality.
Content testing applies user research methods to evaluate the effectiveness of text-based content. It goes beyond proofreading to test whether users can find information, understand it, and use it to complete tasks. Methods range from quick guerrilla tests to formal A/B experiments.
Progressive content disclosure is the strategy of layering information from simple to complex. Users see a summary first and can drill into details on demand. This reduces initial cognitive load while making comprehensive information available for those who need it.
Information scent describes how well navigation elements (links, buttons, headings, breadcrumbs) communicate what users will find when they follow them. Strong information scent helps users confidently navigate; weak scent causes pogo-sticking (clicking back and forth) and abandonment.
Content strategy defines the plan for content across an entire product or organization. It encompasses what content to create, for which audiences, through which channels, and how to measure success. It's the strategic layer above content creation, style guides, and governance.
A content audit is a systematic inventory and evaluation of existing content. It catalogs every piece of content, assesses quality and performance, and produces actionable recommendations. Content audits are essential before redesigns, migrations, and strategy shifts.
Content governance establishes the rules, roles, and workflows for creating, reviewing, publishing, and maintaining content. Without governance, content quality degrades over time — pages go stale, terminology drifts, and nobody owns cleanup.
Localization (l10n) is the process of adapting a product for a specific locale, including language, cultural norms, formatting conventions, and legal requirements. Translation is one component; localization also covers date formats, currencies, imagery, colors, and cultural references.
Inclusive language is writing that avoids expressions, assumptions, or terms that exclude or marginalize groups of people. In UX, this covers gender-neutral language, accessibility-aware phrasing, cultural sensitivity, and avoiding stereotypes in examples and illustrations.
Urgency and scarcity copy leverages the psychological principle that people value things more when they're limited. Urgency applies time pressure ('Sale ends tonight'); scarcity applies quantity pressure ('Only 3 left in stock'). When genuine, these are powerful motivators. When fake, they're dark patterns.
Social proof copy leverages the psychological principle that people look to others' behavior when making decisions. In UX, this includes customer testimonials, usage statistics, brand logos, ratings, and peer activity indicators. It's most effective when the proof comes from people similar to the user.
Value proposition copy is the headline-level messaging that communicates your product's core benefit. It appears on landing pages, app store listings, onboarding screens, and upgrade prompts. Effective value props focus on user outcomes rather than product capabilities.
A call to action is the text that prompts users to take a specific action — signing up, purchasing, downloading, or engaging further. CTA writing combines action-oriented language with value communication to motivate clicks. The best CTAs answer: 'What do I get when I click this?'
The choice between lists and paragraphs significantly impacts readability. Lists excel at presenting parallel items, sequential steps, and comparable options. Paragraphs excel at providing context, explaining relationships, and building narrative. Using the wrong format for the content type reduces comprehension.
Headings and subheadings create the structural skeleton of content. They serve three audiences: scanners who only read headings, screen reader users who navigate by heading level, and search engines that use headings to understand content structure.
Content hierarchy is the deliberate arrangement of information based on importance. It uses visual techniques (size, weight, color, position) and structural techniques (headings, grouping, progressive disclosure) to guide users from the most important information to supporting details.
Scannability is the degree to which content can be quickly understood through scanning rather than reading word-by-word. Users read only 20-28% of page content on average. Scannable content uses headings, lists, bold text, short paragraphs, and visual hierarchy to surface key information.
Cialdini distinguished Unity from Liking: liking comes from similarity, but unity comes from shared identity — being part of the same group, tribe, or category. Unity triggers in-group favoritism, one of the strongest social biases. Apple users form an identity around the brand — they're not just customers, they're 'Apple people.' Harley-Davidson riders don't just like motorcycles; membership defines who they are. In digital products, Unity manifests as community identity. GitHub's developer culture, Figma's design community, and CrossFit's tribe mentality all leverage unity. Notion's 'Made by Notion' community creates shared identity among power users. Indie Hackers builds unity among solo founders. To apply: (1) Create shared identity language ('we,' 'our community'), (2) Build community spaces where users connect with each other, (3) Celebrate community members and their work, (4) Create exclusive but inclusive group experiences, (5) Align your product with a larger identity or movement. Common mistakes: manufacturing fake community, creating exclusivity that alienates, using 'we' language without genuine community investment, and tribalism that defines itself against others rather than for shared values.
Readability scoring uses mathematical formulas to estimate how difficult text is to read. Common methods include Flesch-Kincaid Grade Level, Flesch Reading Ease, Gunning Fog Index, and SMOG. These scores help writers benchmark and improve content clarity.
Plain language is a writing approach that prioritizes reader comprehension. It uses familiar words, short sentences, active voice, and logical organization. The goal is not to dumb down content but to make it accessible to the widest possible audience.
Cialdini identified five factors that increase liking: physical attractiveness (halo effect), similarity ('like me'), compliments (even obvious ones work), familiarity (mere exposure), and positive associations. In digital products, liking translates to brand personality, visual design quality, tone of voice, and the feeling that the product 'gets' you. Mailchimp's friendly chimp mascot and playful microcopy create liking that differentiates it from corporate competitors. Slack's casual, emoji-rich interface feels like talking to a friend. Notion's clean, minimal aesthetic appeals to design-conscious users who see themselves in the product. Duolingo's owl character Duo has become beloved through personality, humor, and (slightly unhinged) push notifications. To apply: (1) Develop a consistent, likeable brand personality, (2) Use conversational, human tone of voice, (3) Invest in visual design that appeals to your audience, (4) Show the humans behind the product, (5) Mirror your users' language and values. Common mistakes: trying too hard to be cool or relatable (cringe), using liking to mask poor product quality, inconsistent personality across touchpoints, and copying another brand's personality instead of developing your own.
A content style guide covers the mechanical aspects of writing: capitalization rules, punctuation preferences, date/time formatting, number conventions, and terminology standards. It ensures every part of the product reads as if written by one person.
Cialdini showed that once people make a commitment — especially publicly or actively — they align future behavior to be consistent. Freedman and Fraser (1966) found that homeowners who agreed to display a small 'Be a Safe Driver' sign were 4x more likely to later agree to a large, ugly billboard. In digital products, this manifests as progressive onboarding: get users to take one small action (create a username), then another (add a photo), then another (invite friends). Duolingo's 'just 5 minutes a day' is a small commitment that becomes a daily habit. LinkedIn's profile completion leverages consistency — once you start filling it out, the incomplete state feels inconsistent. Fitness apps like Strava let you set goals publicly, leveraging social consistency pressure. To apply: (1) Start with easy, low-stakes asks, (2) Make commitments active (typing > clicking > passive), (3) Celebrate small commitments to reinforce identity, (4) Use progressive onboarding sequences, (5) Connect product usage to user identity and values. Common mistakes: asking for too large an initial commitment, using consistency to trap users (difficult cancellation), creating guilt around broken streaks, and manipulating identity-based commitment for business gain.
A voice and tone guide defines how a brand communicates. Voice is the consistent personality (friendly, professional, bold); tone is the contextual adaptation (celebratory for success, empathetic for errors). The guide ensures consistency across teams, channels, and writers.
Reciprocity is perhaps the most universal social norm. Cialdini showed that Hare Krishna donations skyrocketed when they gave flowers before asking for money. Regan (1971) demonstrated that participants bought twice as many raffle tickets from someone who gave them a Coke. In digital products, reciprocity powers the freemium model: give free value, create psychological debt, then offer paid upgrades. HubSpot's free CRM, blog content, and tools create massive reciprocity before any sales pitch. Canva offers a powerful free tier — users feel the value and reciprocate by upgrading. Notion's generous free tier lets users build significant projects before hitting limits. Open-source communities run on reciprocity — developers contribute because they've received value. To apply: (1) Offer genuine free value before asking for anything, (2) Provide unexpected extras (surprise features, bonus content), (3) Give personalized value — generic gifts feel transactional, (4) Don't immediately ask for reciprocation — let the debt build naturally, (5) Make the free offering genuinely useful, not a crippled teaser. Common mistakes: giving token freebies then demanding disproportionate reciprocation, making 'free' offerings that feel like traps, immediately pivoting to hard sales after giving something, and offering value so limited it creates resentment instead of reciprocity.
Cialdini showed that scarcity increases perceived value through two mechanisms: limited quantity ('only 3 left') and limited time ('offer ends midnight'). Worchel, Lee, and Adewole (1975) demonstrated that cookies from a nearly empty jar were rated tastier than identical cookies from a full jar. In digital products, scarcity is powerful but ethically fraught. Genuine scarcity: airline booking sites showing actual remaining seats, event platforms showing real ticket counts, and SaaS companies with honest limited-time pricing. Manufactured scarcity: fake countdown timers, artificial 'limited stock' warnings, and perpetual 'sales' that never end. Booking.com uses scarcity extensively — '2 rooms left' and '5 people looking at this property' — some genuine, some questioned. Supreme's entire brand is built on artificial scarcity. Ticketmaster shows real-time seat availability. To apply: (1) Display real inventory or availability data, (2) Use genuine deadlines for time-limited offers, (3) Show real demand signals ('12 people viewing'), (4) Highlight when popular items are running low, (5) Be transparent about what makes something scarce. Common mistakes: using fake countdown timers that reset, manufacturing urgency with artificial scarcity, creating perpetual 'limited time' offers, and scarcity claims that contradict user experience ('only 2 left' for months).
Chatbot writing is the specialized practice of scripting automated conversations. It includes greeting messages, response templates, error handling, escalation prompts, and personality guidelines. Unlike static UI copy, chatbot writing must account for variable user inputs and maintain coherence across many exchange paths.
Conversational UI copy drives chat-based interfaces, voice assistants, and dialog flows. It requires a different approach than traditional UI copy — it must feel natural in a back-and-forth exchange while managing user expectations about what the system can and cannot do.
Cialdini's Authority Principle explains why expert endorsements, credentials, and certifications powerfully influence behavior. Milgram's experiments showed the extreme end — 65% of participants obeyed authority to the point of administering apparently lethal shocks. In everyday UX, authority manifests through expert endorsements, certification badges, professional design quality, and institutional trust signals. Healthline displays medical reviewer credentials on every article. AWS prominently features enterprise customer logos (authority by association). Stripe's documentation quality itself signals authority — polished docs imply engineering excellence. Norton and McAfee 'secured by' badges on checkout pages leverage security authority. To apply: (1) Display relevant credentials and certifications, (2) Feature expert endorsements with verifiable credentials, (3) Invest in professional design quality — it signals competence, (4) Show industry awards and recognitions, (5) Use authoritative language backed by data and sources. Common mistakes: using fake authority badges, displaying irrelevant credentials, over-relying on authority without substance, and not verifying that authority claims are current and accurate.
Cialdini identified social proof as a fundamental influence principle: in uncertain situations, people look to others' behavior as a guide. Types include: expert social proof (endorsed by authorities), celebrity social proof, user social proof (reviews/ratings), wisdom of crowds ('bestseller'), and wisdom of friends (friend recommendations). In digital products, social proof is ubiquitous and enormously powerful. Amazon's entire review ecosystem is social proof architecture — star ratings, review counts, verified purchase badges, and 'customers also bought' recommendations. Airbnb's trust system relies on mutual reviews to overcome the inherent risk of staying in strangers' homes. Basecamp's homepage features customer counts and testimonials prominently. Stripe displays logos of companies using their platform. To apply: (1) Display genuine user counts, reviews, and ratings, (2) Show what similar users chose ('popular with people like you'), (3) Use specific numbers over vague claims ('12,847 teams' not 'thousands'), (4) Feature reviews from users similar to the target audience, (5) Show real-time activity ('Sarah from London just purchased'). Common mistakes: fabricating reviews or inflating numbers, showing social proof that backfires (low numbers), using fake real-time activity notifications, and not updating social proof (stale testimonials from 2015).
Push notifications appear on lock screens and notification centers outside of your app. They're the most disruptive communication channel and the easiest to disable. Every push must justify its interruption with timely, relevant, actionable content.
Email UX writing covers transactional emails (receipts, confirmations), lifecycle emails (onboarding, re-engagement), and notification emails. Unlike marketing emails, these serve functional purposes and must prioritize clarity over persuasion.
Notification copy covers in-app alerts, banners, badges, and system messages that inform users of events, changes, or required actions. Good notifications provide the right information at the right time; bad ones train users to ignore all alerts.
Thaler and Sunstein argued that since every choice must be presented somehow, and presentation affects decisions, designers are inevitably choice architects. Key principles: the order of options matters (primacy/recency effects), the number of options matters (paradox of choice), default selections matter (status quo bias), and framing matters (prospect theory). In UX, choice architecture encompasses layout, ordering, grouping, defaults, and information display. Pricing pages are pure choice architecture: the 'recommended' tier, the decoy option, the visual emphasis — all guide selection. Slack's onboarding choice architecture channels new users through a specific setup sequence. Apple's privacy permissions use choice architecture — each permission is requested at the moment of relevance with clear context. Uber's ride options are ordered by default selection (UberX first), with premium options visible but secondary. To apply: (1) Make the best option for users the default, (2) Order options with the most common/beneficial first, (3) Use visual hierarchy to emphasize recommended choices, (4) Group related options to reduce cognitive load, (5) Test your architecture — small changes have outsized effects. Common mistakes: using choice architecture to serve business over user interests, creating 'decoy' options that manipulate rather than inform, failing to test architecture with real users, and not recognizing that every design IS choice architecture.
Onboarding copy is the text that guides new users through initial setup and feature discovery. It encompasses welcome screens, setup wizards, tooltips, checklists, and first-run experiences. The goal is to get users to value as quickly as possible while building confidence.
Thaler and Sunstein's 'Nudge' (2008) introduced libertarian paternalism — guiding people toward better decisions while preserving freedom of choice. Classic nudge examples: organ donation opt-out defaults, cafeteria placement of healthy food at eye level, and fly-in-urinal targets that reduced spillage 80%. In digital UX, nudges are everywhere: LinkedIn's profile completion bar (progress nudge), Google's password strength indicator (feedback nudge), and Duolingo's push notification owl (social nudge). The ethical framework requires nudges to be: transparent, easy to resist, and aligned with the user's own interests. Spotify nudges users toward Wrapped at year-end, creating engagement that genuinely delights. Apple's Screen Time nudges healthier phone usage without blocking apps. UK Government's Behavioural Insights Team ('Nudge Unit') used email subject lines to increase tax compliance by 15%. To apply: (1) Set beneficial defaults (opt-out > opt-in for good outcomes), (2) Use social norms ('80% of guests reuse towels'), (3) Provide timely feedback on behavior, (4) Simplify the path to good decisions, (5) Make good options the easy options. Common mistakes: using nudges to serve the business against user interests (dark patterns), making nudges difficult to resist (sludge, not nudge), hiding the nudge mechanism, and failing the 'would the user thank you?' test.
Help text is supplementary information that clarifies interface elements, explains requirements, or provides additional context. It appears as inline text near form fields, tooltips on hover, expandable FAQ sections, or contextual hints within workflows. Effective help text anticipates confusion and resolves it in place.
Placeholder text appears inside form fields as light gray text that disappears when users begin typing. It's useful for showing formatting examples but problematic as a replacement for labels. Users lose context once they start typing, and placeholder text often fails color contrast requirements.
Form labels identify what information is needed, while instructions explain how to provide it. Together, they eliminate ambiguity and reduce form abandonment. The placement, wording, and visibility of labels directly impact completion rates and error frequency.
Buttons are the primary interaction triggers in any interface. Their labels are the final piece of microcopy users read before committing to an action. Vague labels create hesitation; specific labels create confidence. The best button labels complete the sentence 'I want to...'
Empty states occur when a page, list, or component has no data to display — first use, cleared lists, no search results, or filtered-out content. Rather than showing blank space or a generic 'Nothing here' message, effective empty states use copy and design to onboard, motivate, and guide users.
Success messages close the loop on user actions. They confirm that an operation completed, describe the outcome, and often suggest a next step. Well-crafted success messages build confidence and momentum, while vague confirmations leave users uncertain.
Error messages are the most critical microcopy in any product. They appear when users are already frustrated, confused, or anxious. A well-crafted error message transforms a negative moment into a recoverable one. The best error messages follow a three-part structure: what happened, why it happened, and what to do next.
Microcopy refers to the short, targeted text strings found throughout a product interface. These include button labels, placeholder text, error messages, tooltips, and confirmation dialogs. Effective microcopy answers the user's immediate question: 'What happens if I click this?' or 'What should I enter here?'
UX writing encompasses all text users encounter in a product — from button labels to error messages. Unlike marketing copy, UX writing serves the user's immediate needs. It reduces cognitive load by using familiar language, consistent terminology, and action-oriented phrasing. The discipline sits at the intersection of design, content strategy, and user research.
Every application has an inherent amount of complexity that cannot be removed.
Be liberal in what you accept, conservative in what you send.
Work expands to fill the time available for its completion.
Roughly 80% of effects come from 20% of causes.
The simplest solution is usually the best.
Productivity soars when response times are under 400ms.
Use our 378+ free design tools to apply what you've learned — contrast checking, spacing scales, typography, and more.