第 1 章
The Psychology Behind Every Click: How Design Shapes User Behavior
Ever noticed how some websites feel instantly familiar, while others leave you fumbling around? Or why certain apps keep you scrolling for hours while others frustrate you within seconds? These aren't accidents-they're carefully engineered psychological principles at work. Jon Yablonski's "Laws of UX" has become something of a bible in design circles since its publication, with tech giants like Google and Apple implementing its principles across their products. What started as Yablonski's personal reference website during a challenging design project has evolved into one of the most influential frameworks for creating intuitive digital experiences. The book's genius lies in translating complex psychological concepts into practical design applications-bridging the gap between how humans naturally think and how digital products should function.
第 2 章
The Familiarity Principle: Why Users Crave What They Already Know
When you visit a new website, you expect the logo in the top left corner, navigation at the top, and a footer with contact information. This expectation isn't random-it's Jakob's Law in action, which states that users spend most of their time on other sites and prefer yours to work similarly to what they already know.
This principle, established by usability expert Jakob Nielsen in 2000, recognizes a fundamental truth about human cognition: we develop mental models based on cumulative experiences. These mental models represent what users think they know about how systems work, and they apply this knowledge whenever they encounter something new.
Consider how form controls in digital interfaces mirror physical control panels. This design choice isn't arbitrary-it leverages our familiarity with real-world counterparts. When designs don't align with users' mental models, problems arise-a phenomenon called mental model discordance. Snapchat experienced this painfully in 2018 when their major redesign confused and alienated users, leading to a petition signed by over 1.2 million people demanding the old design back.
In contrast, Google has mastered the art of gradual transition. When redesigning products like YouTube, they allowed users to opt in to new versions gradually, minimizing discord by letting people continue using familiar interfaces while adjusting to changes at their own pace.
E-commerce sites like Etsy leverage familiar patterns because they understand that when users focus on learning new interfaces, they're not focusing on purchasing. Even physical products benefit from this principle-Mercedes-Benz seat controls are shaped like seats themselves, creating an intuitive mapping between controls and what they adjust.
Jakob's law doesn't advocate for creating identical products-that would be boring and stifle innovation. Instead, it reminds designers that people leverage previous experiences to understand new ones. Common conventions built around existing mental models help users be immediately productive rather than spending time learning how an interface works. The key is to begin with familiar patterns and only depart when it clearly improves the core experience-and always test unconventional approaches with actual users.
第 3 章
The Science of Selection: Why Size and Distance Matter
Have you ever struggled to tap a tiny button on your phone or found yourself frustrated by closely-packed navigation links? These frustrations stem from violations of Fitts's Law, which states that the time required to select a target is determined by its size and distance from the user's current position.
Developed by psychologist Paul Fitts in 1954, this principle predates graphical interfaces but applies perfectly to digital movement. Fitts proposed that selection time depends on the ratio between distance and target width, establishing what's now considered one of the most successful mathematical models of human motion.
This principle manifests in common interface elements like form text labels that expand the selectable area of inputs, and submission buttons placed near the final form field to minimize movement distance. When interactive elements are too close together, as seen in LinkedIn's connection request screen, users must slow down to avoid misselections.
Tesla's Model 3 dashboard demonstrates excellent implementation of Fitts's Law with ample spacing between navigation items, reducing accidental selections despite the driver's divided attention. Apple's Reachability feature addresses the law by bringing elements at the top of larger iPhone screens down to the lower half with a simple gesture, making them accessible for one-handed use.
Touch targets on mobile devices require particular attention. Research shows they should be large enough for easy selection (minimum sizes vary by platform), have ample spacing between them (at least 8dp according to Google), and be placed in easily accessible screen areas. Interestingly, people prefer the center of smartphone screens where accuracy is highest, rather than scanning from upper left to lower right as they do on desktops.
Mobile interfaces are particularly susceptible to Fitts's Law due to limited screen real estate. To create easily selectable interactive elements, designers should make them sufficiently large, provide ample spacing between controls to prevent accidental selections, and place them in easily accessible areas of the interface. After all, a key responsibility for designers is ensuring interfaces augment human capabilities rather than hindering them.
第 4 章
The Paradox of Choice: When More Options Lead to Fewer Decisions
Have you ever stared at a restaurant menu with dozens of options, only to freeze in indecision? This phenomenon is explained by Hick's Law, which states that decision time increases with the number and complexity of choices available.
Formulated in 1952 by psychologists William Edmund Hick and Ray Hyman, this principle emerged from studying the relationship between stimuli quantity and reaction time. They discovered that increasing available choices logarithmically increases decision time-meaning each additional option adds disproportionately to the cognitive burden.
This relates directly to cognitive load-the mental resources required when using digital products. Like a device with limited memory, our brains have finite processing capacity. When information exceeds our working memory buffer, we struggle, miss details, and feel overwhelmed, often leading to frustration or task abandonment.
TV remote controls perfectly exemplify Hick's Law in action. As television features increased over decades, remotes became increasingly complex, requiring significant mental processing or muscle memory. The phenomenon of "grandparent-friendly remotes" emerged when people taped off all but essential buttons. Modern smart TV remotes now simplify controls to necessities, transferring complexity to on-screen menus.
In digital interfaces, Google Search demonstrates this principle by providing filtering options only after the initial search, keeping users focused on the primary task. Slack excels at onboarding by initially hiding all features except messaging, then progressively introducing additional functionality as users become comfortable.
While simplification reduces cognitive load, oversimplification can lead to abstraction where available actions become unclear. Iconography exemplifies this challenge-while icons save space and provide visual interest, truly universal icons are rare. The same icon may represent different actions across products, creating confusion. Adding text labels to icons provides clarity, aids discovery and recognition, and effectively reduces abstraction.
Hick's Law underlies everything in user experience design. Busy interfaces with unclear actions and hard-to-find information increase cognitive load. The process of reduction-eliminating elements that don't help users achieve their goals-is critical to design. The less users must think about reaching their goals, the more likely they'll achieve them.
第 5 章
Memory Limitations: The Art of Information Chunking
"The Magical Number Seven, Plus or Minus Two"-this phrase from George Miller's groundbreaking 1956 paper has become one of the most misunderstood concepts in design. Miller observed that young adults could remember approximately seven items in short-term memory, regardless of how much information each item contained. This discovery revolutionized our understanding of human cognitive limitations and information processing capabilities, though its applications have often been oversimplified in practice.
The real value of Miller's research lies in the concept of chunking-our ability to group basic familiar units into collections stored in memory. He found that chunk size didn't matter; seven words could be held in short-term memory as easily as seven letters. This principle extends beyond simple memorization to how we process and understand complex information. For instance, expert chess players don't memorize individual pieces but rather recognize familiar patterns and positions as single chunks, allowing them to recall complex board configurations easily.
Chunking manifests in numerous everyday examples. Phone numbers (123-456-7890) demonstrate how breaking information into smaller groups aids memory and comprehension compared to unformatted strings (1234567890). Social security numbers, credit card numbers, and ZIP+4 codes all employ similar chunking strategies. In content design, chunking transforms intimidating walls of text into digestible sections through strategic use of headings, subheadings, bullet points, and paragraph breaks. Studies show that properly chunked content can improve reading speed by up to 20% and comprehension by 15%.
Leading digital platforms effectively utilize chunking principles. Bloomberg's financial dashboard chunks market data into distinct modules for indices, currencies, and commodities. Nike.com organizes product information into clear categories: performance features, sizing, reviews, and related items. Amazon's product pages chunk information into scannable sections for specifications, pricing, shipping options, and customer reviews. Each chunk serves as a discrete unit of information while contributing to the overall user understanding.
Miller's law is frequently misinterpreted as a strict rule limiting interface elements to seven items. This oversimplification ignores the crucial distinction between items that must be memorized and those that remain visible for reference. Modern navigation systems, like those on Apple.com or Microsoft.com, successfully implement extensive menus through careful categorization and visual hierarchy, proving that well-organized information can exceed the "magical number seven" while remaining user-friendly.
As we face increasing information complexity in digital interfaces, understanding chunking becomes more critical. Research shows that properly chunked information can reduce cognitive load by up to 40% and improve task completion rates by 25%. Effective chunking strategies include using clear visual boundaries, consistent formatting, logical grouping, and progressive disclosure of information. These techniques help users navigate and process complex information landscapes while working within our cognitive limitations.
The enduring relevance of Miller's research reminds us that while technology advances rapidly, human cognitive capabilities remain relatively constant. Success in modern interface design depends on respecting these limitations while leveraging chunking strategies to present information in ways that align with our natural information processing abilities.
第 6 章
The Robustness Principle: Flexibility in a Complex World
"Be conservative in what you do, be liberal in what you accept from others." This elegant statement, known as Postel's Law or the robustness principle, was originally formulated by computer scientist Jon Postel for the early internet's TCP protocol. While initially a technical guideline for network communication, it has profound implications for human-centered design.
Postel suggested programs sending data should conform strictly to specifications, while receiving programs should be robust enough to accept nonconformant input. This fault tolerance helped ensure reliable communication between nodes on the early internet and influenced software architecture, including HTML and CSS's loose error handling.
In UX design, Postel's law manifests through input forms, where designers should be conservative in requesting information while being liberal in accepting varied input formats. Apple's Face ID exemplifies this by eliminating manual authentication entirely. Instead of forcing users to remember and enter passwords, the system handles the complexity behind the scenes.
Responsive web design, introduced by Ethan Marcotte in 2010, embodies this principle by creating websites that fluidly adapt to any screen size rather than creating device-specific experiences. Progressive enhancement similarly applies this philosophy by ensuring basic content accessibility for all users while progressively adding enhancements as device capabilities allow.
Design systems also exemplify Postel's law by liberally accepting diverse inputs from contributors while conservatively producing clear guidelines and components. This balance ensures consistency while accommodating the varied needs of different teams and projects.
Design resiliency acknowledges that user input varies widely, requiring systems that liberally accept input while anticipating potential problems. Internationalization exemplifies this challenge-English text can expand up to 300% when translated to languages like Italian, and text orientation varies globally. Another example is font size customization, which improves accessibility but can break layouts in poorly designed systems. Amazon demonstrates resilience by intelligently reorganizing navigation elements as font size increases, prioritizing important links while removing less critical ones.
Postel's law bridges the human-machine gap by creating systems that liberally accept variable human input while translating it into structured, machine-friendly output. This approach shifts burden away from users, ensuring a more human experience while building products that adapt to growing scale and complexity.
第 7 章
The Peak-End Rule: Why Final Impressions Matter Most
Have you ever wondered why a vacation with a fantastic final day feels better in retrospect than one with consistently good experiences throughout? Or why a medical procedure that ends less painfully is remembered more favorably, even if it lasted longer? These phenomena are explained by the Peak-End Rule, which states that people judge experiences primarily based on how they felt at the emotional peak and at the conclusion, rather than the sum or average of every moment.
This principle emerged from Daniel Kahneman's surprising 1993 study where participants preferred longer uncomfortable experiences when they ended less painfully. Subsequent medical research with colonoscopy patients confirmed this phenomenon-patients who underwent longer procedures with less painful endings rated their overall experiences more positively and were more likely to return for follow-up procedures.
The Peak-End Rule functions as a memory bias, distorting how we recall experiences by emphasizing emotionally intense moments and endpoints rather than the complete experience. It relates to the recency effect, where items at the end of a sequence are most easily remembered.
Mailchimp masterfully applies this principle by enhancing emotionally charged moments in email campaign creation. At the peak emotional moment of sending a campaign, they present a confirmation modal featuring their mascot Freddie nervously hovering over a button, complete with animated sweat beads. After sending, users receive a confirmation screen where Freddie offers a congratulatory high-five, creating positive emotional closure.
Uber similarly addresses negative emotional peaks by redesigning wait times in their Express POOL service, using animations to reduce idleness aversion, providing operational transparency about arrival calculations, and showing progress toward ride completion.
Product failures inevitably create negative emotional peaks-whether from server outages, security vulnerabilities, or design oversights. However, these moments can become opportunities when handled properly. The common 404 error page represents one such potential negative peak that can be transformed through thoughtful design. Many companies leverage humor and brand personality in their error pages to create rapport with customers and turn a potentially frustrating moment into a positive brand interaction.
Our memories are rarely perfect records of events. Users judge past experiences not on how they felt throughout the entire duration but on the average of peak emotional moments and the end. These critical moments determine whether users will return to a product or recommend it to others.
第 8 章
The Beauty-Usability Connection: Why Attractive Things Work Better
Have you ever found yourself more forgiving of quirks in a beautifully designed product than in an ugly one? This isn't just personal preference-it's the aesthetic-usability effect in action. Aesthetically pleasing design creates positive responses in users' brains, leading them to believe the design actually works better.
First documented in 1995 by researchers at the Hitachi Design Center, a groundbreaking study tested 26 ATM interface layouts with 252 participants, revealing that perception of usability was strongly influenced by visual attractiveness. Later research by Tractinsky further confirmed that interface aesthetics significantly affect users' perception of system usability.
This phenomenon aligns with Daniel Kahneman's dual-system thinking model: System 1 operates impulsively with little psychological effort, quickly generating impressions and intuitions, while System 2 handles more deliberate, complex problem-solving. For digital products, System 1 thinking forms crucial first impressions within 50 milliseconds, with visual appeal being the primary determining factor.
Two companies exemplify the aesthetic-usability effect through their design philosophies. Braun, under Dieter Rams' "less but better" approach, created products like the SK4 record player that balanced functional minimalism with aesthetic beauty. Apple continues this legacy with devices like the iPod, iPhone, and iMac that echo Braun's minimal aesthetic while focusing on ease of use. Apple's attention to aesthetics extends beyond industrial design to interfaces, becoming a competitive advantage that has helped make it one of the world's most beloved brands.
The aesthetic-usability effect presents a challenge for usability testing. Research by Sonderegger and Sauer showed that participants not only rated more attractive interfaces as more usable but actually completed tasks faster on them-even when the functionality was identical to less attractive versions. This effect can mask genuine usability problems during testing, making it crucial for researchers to look beyond user statements and carefully observe behavior.
Aesthetically pleasing design creates positive emotional responses that enhance cognitive abilities and influence perceived usability. While users tend to overlook minor issues in beautiful interfaces-seemingly advantageous-this effect can actually mask significant usability problems during testing. Designers must balance visual appeal with genuine usability to create truly effective experiences.
第 9 章
Standing Out in the Crowd: The Power of Visual Distinction
When multiple similar objects are present, the one that differs from the rest is most likely to be remembered. Named after German psychiatrist Hedwig von Restorff, this effect emerged from her 1933 study showing that participants better remembered items that were distinctly different from others in a set.
The von Restorff effect leverages humans' sophisticated visual processing systems that have evolved to quickly identify objects and detect pattern differences. For digital interfaces, contrasting elements draw attention faster, making this principle crucial for directing user focus while avoiding competing points of emphasis.
This principle connects to selective attention-our tendency to filter the overwhelming sensory information around us, focusing only on what seems relevant while filtering out the rest. This survival instinct helps us maintain focus on important information by limiting our attention's capacity and duration, directing cognitive resources to what matters most in any given moment.
The von Restorff effect appears in countless digital products where visual distinction directs user attention. Interactive elements like buttons benefit from visual differentiation to prevent accidental actions. Google's floating action button (FAB) exemplifies this through consistent placement and design. Pricing tables commonly emphasize preferred subscription options through color, size, and positioning, as seen in Dropbox's "advanced" plan. Notifications leverage the effect to demand attention, while news websites use scale to make featured headlines stand out against other content.
Effective contrast can be created through color, scale, shape, negative space, and motion-all directing users to what matters most. However, the effect must be applied with restraint-too much contrast creates visual competition that overwhelms users and dilutes emphasis.
Accessibility considerations are crucial when creating visual distinction: color alone fails users with color vision deficiencies, motion can trigger vestibular disorders causing dizziness or nausea, and insufficient contrast hinders those with low vision. Designers must carefully balance drawing attention to important elements while ensuring the interface remains accessible to all users.
When used strategically and sparingly, the von Restorff effect helps users quickly identify critical information and actions. However, restraint is essential-competing visual elements dilute each other's impact.
第 10 章
The Ethics of Design: Power and Responsibility in the Digital Age
As designers leverage psychological principles to create more engaging products, we must confront an uncomfortable truth: the same techniques that make products more intuitive can also be used to manipulate users against their best interests. With growing evidence of technology's negative impacts on mental health and society, ethical considerations in design have never been more important.
Understanding how technology shapes behavior begins with B.F. Skinner's foundational work on operant conditioning. Using his eponymous "Skinner box," he demonstrated how behaviors could be modified through associations between actions and consequences. Modern slot machines exemplify this principle perfectly, mesmerizing gamblers into "continuous productivity" states. When players approach their algorithmically calculated "pain point," casinos dispatch "luck ambassadors" with incentives to keep them engaged.
Digital products similarly shape behavior through various methods: intermittent variable rewards (like pull-to-refresh features that mimic slot machines), infinite loops (autoplay videos and endless scrolling that maximize time on site), social affirmation (likes and comments that deliver dopamine hits), strategic defaults (settings that rarely get changed), friction removal (making desired actions effortless), reciprocity (leveraging our impulse to repay gestures), and dark patterns (deceptive techniques that trick users into unintended actions).
As digital technology becomes increasingly embedded in our daily lives, we must consider the ethical implications of its influence. Companies rarely set out to create harmful products, yet unintended consequences abound: Facebook's "like" button becoming an addictive feedback mechanism, Snapchat's filters driving cosmetic surgery, and disappearing videos enabling harassment.
Research now reveals disturbing effects: smartphones reduce cognitive capacity even when turned off, social media increases depression and loneliness in young adults, and correlates with rising suicide rates among adolescents. The ethical imperative is clear: designers must create products that support users' goals and well-being rather than exploiting vulnerabilities for commercial gain.
To build products that genuinely support users' goals, we must integrate ethics into the design process. First, think beyond the "happy path" scenarios that provide the path of least resistance-consider edge cases and vulnerable users first when defining minimum viable products. Second, diversify teams to avoid blind spots from homogeneous thinking-different genders, races, ages, and backgrounds bring broader human experience into the design process. Finally, look beyond quantitative data to understand not just how people use products but why-this means getting away from screens, talking directly with users, and using qualitative research to inform design evolution.
Technology significantly affects people's lives, and we must ensure that impact is positive by making ethical design decisions that acknowledge human vulnerabilities without exploiting them.
