David Kadavy is a user interface designer whose clients include Silicon Valley startups such as oDesk, UserVoice, and PBworks. He led the design departments at two Silicon Valley startups and an architecture firm, taught a college course in typography, and studied ancient typography in Rome. David blogs about design at kadavy.net, and his Twitter handle is @kadavy.

Select Guide Rating

• Introduction 1Design as Literacy 2The Hacker Attitude 3The Gap in Design Knowledge 5Part I: Understanding DesignChapter 1 Why Design Matters 9What Design Really Is 11What Design Is Not 13The Layers of Design 15Purpose 17Medium and technology 17Aesthetic decisions 18Conclusion 18Chapter 2 The Purpose of Design 19Visual Design and Its Relation to User Experience Design 21The basics of user experience design 22The visual design of one product versus another 24Sometimes a Visual Design Is Just Good Enough 25Sometimes Visual Design Is Your Advantage 26Reverse-Engineering the Twitter User Experience 28User personas 29Use cases 30Wireframes 32Knowledge Applied 33Part II: Medium and FormChapter 3 Medium and Form in Typography 37The Tragedy of Misuse: Why You Hate Comic Sans 38The Shackles of the Typographer: The Unalterable Word 45The Formation of Our Alphabet 47The Birth of Our Letters 50The Twitter of the Roman Empire 51The height of Roman typography 52The Type That Has Lived On 62The invention and spread of printing 63Punchcutting: The cradle of the unalterable word 64Venice and the Renaissance 65France and Garamond 66Garamond Today: Why You Don’t Use Garamond on the Web 66The birth of the “web font” 67A great leap 68Bridging the gap 69Limitations can be embraced – even parodied 72Knowledge Applied 73Chapter 4 Technology and Culture 75How Trends Are Created 76The birth of Impressionism 76Impressionism and the middle class 78Impressionism and photography 79Impressionism and modern art 81Web 2 0 graphics 82How Apple started the Web 2 0 style 83How Aqua influenced the web 85How Aqua met Web 2 0 86Form shapes technology, this time 90SEO Is Design 90Understanding why SEO is important 93Choosing the right keywords 94Considering content and coding 96URL 97Title tag 97Meta tags 98Headers 98Content: em, strong, img 98Authority of linking pages 99Content of linking pages and of anchor text of links 100Everything in moderation 100Getting the content, getting the links 101Knowledge Applied 102Part III: CompositionChapter 5 Fool’s Golden Ratio: Understanding Proportions 105What Is Proportion? 107Proportion and Design 109The Broken Promise of the Golden Ratio 110The golden ratio and the Fibonacci sequence: Similar, but different 112The golden ratio in the human form 113Misconceptions about the golden ratio 115The golden ratio in ancient Greece 115The golden ratio in fine art 117The golden ratio in nature 118The golden ratio in psychology 118Other Pleasing Proportions 119The root 2 rectangle 119The 2:3 rectangle 120The 3:4 rectangle 121Proportions in Our World 121Music and dance 122Nature 123Computers and mobile devices 125Proportions at Work 126Knowledge Applied 132Chapter 6 Holding the Eye: Composition and Design Principles 133Compositional Relationships 134Reading direction 135Guiding the eye with composition 136Renaissance sculpture 137Impressionist paintings 139Web design 140Foreground/background relationships 141In Seurat’s painting 142In interface and web design 143Design Principles 144Dominance 144Similarity 146Rhythm 148Texture 150Direction 151Contrast 156Why the MailChimp Logo Is Beautiful: Use of Composition and Design Principles 157Foreground/background relationships 159Dominance 160Similarity 160Rhythm 162Texture 163Direction 163Contrast 163Knowledge Applied 165Chapter 7 Enlivening Information: Establishing a Visual Hierarchy 167What I Mean by “Hierarchy” 168Hierarchy is expressive 170Many visual factors can affect hierarchy 170Hierarchical Factors in Isolation 171White space 172Using a grid to manage white space 172Establishing a hierarchy with white space 173Knowing how much white space to use 175Considering white space and italic font style 175Using a four-column grid 176Type weight and size 177Type weight 177Type size 179Combining weight and size 181Color 181Visual ornamentation 182Hierarchy at Work 187Knowledge Applied 190Part IV: ColorChapter 8 Color Science 195What Is Color? 197The Tricks Your Eyes Play 198Metamerism 199Color constancy 199Afterimages 200How the Visual System Works 201Cones 201Trichromatic theory and color opponent theory 202Mixing of dominant wavelengths and the color wheel 204Colorblindness 205Defining Color 207Munsell 208Hue, saturation, and brightness 209Lab color model 210Color Models and Data-Driven Graphics 211Color and qualitative data 211Color and quantitative data 212Sequential versus diverging color palettes 216Thinking in Hexadecimal Color: Understanding the Colors of the Web 217Understanding RGB 218How hexadecimal represents RGB 220Mentally navigating the hexadecimal “cube” 221The future: HSL 224Color Models in Action: Why Your Business Card Doesn’t (and Never Will) Match Your Website 225RGB displays versus CMYK color printing 226Color gamuts 227Working across media and managing color 229Adobe RGB versus sRGB 230“Proofing” and previewing color shifts 231Printing with spot colors 232Knowledge Applied 233Chapter 9 Color Theory 235Color Response throughout Human History 237Color Response and Human Biology 237The Power of Red: Why You Don’t Stand a Chance in the “Target Challenge” 238The effect of red on your brain 239The prefrontal cortex and rational thought 239The attack on your prefrontal cortex 240The prefrontal cortex and decision-making 241Color and context 243What this means to you 244Research on Other Colors 245Color and Culture 246Color Schemes and the Color Wheel 247Color Choices and Web Conventions 249Backgrounds 249White 249Off-white 250Dark 250Bright 250Graphics and text 251Green 252Yellow 252Red 253Blue 254Accent colors 254The Interaction of Colors: Why Monet Never Used Black 255The Impressionists: Masters of color 256Color theory: What the Impressionists discovered 256Warm colors pop, cool colors recede 257Tints pop, shades recede 257The importance of context 258Temperature versus tint 258How Monet used color 260Using color like Monet 262Enriching your typography 262Adding life to your graphics 263Color Schemes 264Monochromatic 265Analogous 267Complementary 269Split-complementary 271Triadic 274Tetradic 276Variations 276Creating a Mood with Color 280Mysterious or exclusive 280Active 280Muted 283Natural 284Tools for Creating Color Palettes and Schemes 285Knowledge Applied 287Part V: AppendixesAppendix A Choosing and Pairing Fonts 291Classifying Typefaces 293Serif typefaces 294Old style 294Transitional 294Modern 295Slab-serif 295Sans-serif typefaces 296Display typefaces 296Looking At Letter Structure: The Form of the Skeleton 297Humanist typefaces 297Geometric typefaces 298Realist typefaces 298Pairing Fonts 298The rule 299The exception to the rule 299Why certain fonts pair well 301Texture 301Character width 304The ultimate cheat: Staying faithful to a typographer 306All the Fonts You’ll Ever Need 307Appendix B Typographic Etiquette 311Distorting Type: What Not to Do 313Fake bold 313Fake italic 314Fake small caps 314Stretching type 317Outlining type 317Type and images or textures 318Setting Body Copy 319Indicating a change in paragraphs 319Avoiding justified type 321Avoiding widows and orphans 322Tending to Typographic Details 323Not all quotes are created equal 323Using dashes dashingly 324One space after a period, not two 324Ligatures bring letters together 325Index 329

David Kadavy is a user interface designer whose clients include Silicon Valley startups such as oDesk, UserVoice, and PBworks. He led the design departments at two Silicon Valley startups and an architecture firm, taught a college course in typography, and studied ancient typography in Rome. David blogs about design at kadavy.net, and his Twitter handle is @kadavy.

Select Guide Rating

• Introduction 1Design as Literacy 2The Hacker Attitude 3The Gap in Design Knowledge 5Part I: Understanding DesignChapter 1 Why Design Matters 9What Design Really Is 11What Design Is Not 13The Layers of Design 15Purpose 17Medium and technology 17Aesthetic decisions 18Conclusion 18Chapter 2 The Purpose of Design 19Visual Design and Its Relation to User Experience Design 21The basics of user experience design 22The visual design of one product versus another 24Sometimes a Visual Design Is Just Good Enough 25Sometimes Visual Design Is Your Advantage 26Reverse-Engineering the Twitter User Experience 28User personas 29Use cases 30Wireframes 32Knowledge Applied 33Part II: Medium and FormChapter 3 Medium and Form in Typography 37The Tragedy of Misuse: Why You Hate Comic Sans 38The Shackles of the Typographer: The Unalterable Word 45The Formation of Our Alphabet 47The Birth of Our Letters 50The Twitter of the Roman Empire 51The height of Roman typography 52The Type That Has Lived On 62The invention and spread of printing 63Punchcutting: The cradle of the unalterable word 64Venice and the Renaissance 65France and Garamond 66Garamond Today: Why You Don’t Use Garamond on the Web 66The birth of the “web font” 67A great leap 68Bridging the gap 69Limitations can be embraced – even parodied 72Knowledge Applied 73Chapter 4 Technology and Culture 75How Trends Are Created 76The birth of Impressionism 76Impressionism and the middle class 78Impressionism and photography 79Impressionism and modern art 81Web 2 0 graphics 82How Apple started the Web 2 0 style 83How Aqua influenced the web 85How Aqua met Web 2 0 86Form shapes technology, this time 90SEO Is Design 90Understanding why SEO is important 93Choosing the right keywords 94Considering content and coding 96URL 97Title tag 97Meta tags 98Headers 98Content: em, strong, img 98Authority of linking pages 99Content of linking pages and of anchor text of links 100Everything in moderation 100Getting the content, getting the links 101Knowledge Applied 102Part III: CompositionChapter 5 Fool’s Golden Ratio: Understanding Proportions 105What Is Proportion? 107Proportion and Design 109The Broken Promise of the Golden Ratio 110The golden ratio and the Fibonacci sequence: Similar, but different 112The golden ratio in the human form 113Misconceptions about the golden ratio 115The golden ratio in ancient Greece 115The golden ratio in fine art 117The golden ratio in nature 118The golden ratio in psychology 118Other Pleasing Proportions 119The root 2 rectangle 119The 2:3 rectangle 120The 3:4 rectangle 121Proportions in Our World 121Music and dance 122Nature 123Computers and mobile devices 125Proportions at Work 126Knowledge Applied 132Chapter 6 Holding the Eye: Composition and Design Principles 133Compositional Relationships 134Reading direction 135Guiding the eye with composition 136Renaissance sculpture 137Impressionist paintings 139Web design 140Foreground/background relationships 141In Seurat’s painting 142In interface and web design 143Design Principles 144Dominance 144Similarity 146Rhythm 148Texture 150Direction 151Contrast 156Why the MailChimp Logo Is Beautiful: Use of Composition and Design Principles 157Foreground/background relationships 159Dominance 160Similarity 160Rhythm 162Texture 163Direction 163Contrast 163Knowledge Applied 165Chapter 7 Enlivening Information: Establishing a Visual Hierarchy 167What I Mean by “Hierarchy” 168Hierarchy is expressive 170Many visual factors can affect hierarchy 170Hierarchical Factors in Isolation 171White space 172Using a grid to manage white space 172Establishing a hierarchy with white space 173Knowing how much white space to use 175Considering white space and italic font style 175Using a four-column grid 176Type weight and size 177Type weight 177Type size 179Combining weight and size 181Color 181Visual ornamentation 182Hierarchy at Work 187Knowledge Applied 190Part IV: ColorChapter 8 Color Science 195What Is Color? 197The Tricks Your Eyes Play 198Metamerism 199Color constancy 199Afterimages 200How the Visual System Works 201Cones 201Trichromatic theory and color opponent theory 202Mixing of dominant wavelengths and the color wheel 204Colorblindness 205Defining Color 207Munsell 208Hue, saturation, and brightness 209Lab color model 210Color Models and Data-Driven Graphics 211Color and qualitative data 211Color and quantitative data 212Sequential versus diverging color palettes 216Thinking in Hexadecimal Color: Understanding the Colors of the Web 217Understanding RGB 218How hexadecimal represents RGB 220Mentally navigating the hexadecimal “cube” 221The future: HSL 224Color Models in Action: Why Your Business Card Doesn’t (and Never Will) Match Your Website 225RGB displays versus CMYK color printing 226Color gamuts 227Working across media and managing color 229Adobe RGB versus sRGB 230“Proofing” and previewing color shifts 231Printing with spot colors 232Knowledge Applied 233Chapter 9 Color Theory 235Color Response throughout Human History 237Color Response and Human Biology 237The Power of Red: Why You Don’t Stand a Chance in the “Target Challenge” 238The effect of red on your brain 239The prefrontal cortex and rational thought 239The attack on your prefrontal cortex 240The prefrontal cortex and decision-making 241Color and context 243What this means to you 244Research on Other Colors 245Color and Culture 246Color Schemes and the Color Wheel 247Color Choices and Web Conventions 249Backgrounds 249White 249Off-white 250Dark 250Bright 250Graphics and text 251Green 252Yellow 252Red 253Blue 254Accent colors 254The Interaction of Colors: Why Monet Never Used Black 255The Impressionists: Masters of color 256Color theory: What the Impressionists discovered 256Warm colors pop, cool colors recede 257Tints pop, shades recede 257The importance of context 258Temperature versus tint 258How Monet used color 260Using color like Monet 262Enriching your typography 262Adding life to your graphics 263Color Schemes 264Monochromatic 265Analogous 267Complementary 269Split-complementary 271Triadic 274Tetradic 276Variations 276Creating a Mood with Color 280Mysterious or exclusive 280Active 280Muted 283Natural 284Tools for Creating Color Palettes and Schemes 285Knowledge Applied 287Part V: AppendixesAppendix A Choosing and Pairing Fonts 291Classifying Typefaces 293Serif typefaces 294Old style 294Transitional 294Modern 295Slab-serif 295Sans-serif typefaces 296Display typefaces 296Looking At Letter Structure: The Form of the Skeleton 297Humanist typefaces 297Geometric typefaces 298Realist typefaces 298Pairing Fonts 298The rule 299The exception to the rule 299Why certain fonts pair well 301Texture 301Character width 304The ultimate cheat: Staying faithful to a typographer 306All the Fonts You’ll Ever Need 307Appendix B Typographic Etiquette 311Distorting Type: What Not to Do 313Fake bold 313Fake italic 314Fake small caps 314Stretching type 317Outlining type 317Type and images or textures 318Setting Body Copy 319Indicating a change in paragraphs 319Avoiding justified type 321Avoiding widows and orphans 322Tending to Typographic Details 323Not all quotes are created equal 323Using dashes dashingly 324One space after a period, not two 324Ligatures bring letters together 325Index 329

David Kadavy is a user interface designer whose clients include Silicon Valley startups such as oDesk, UserVoice, and PBworks. He led the design departments at two Silicon Valley startups and an architecture firm, taught a college course in typography, and studied ancient typography in Rome. David blogs about design at kadavy.net, and his Twitter handle is @kadavy.

Select Guide Rating

• Introduction 1Design as Literacy 2The Hacker Attitude 3The Gap in Design Knowledge 5Part I: Understanding DesignChapter 1 Why Design Matters 9What Design Really Is 11What Design Is Not 13The Layers of Design 15Purpose 17Medium and technology 17Aesthetic decisions 18Conclusion 18Chapter 2 The Purpose of Design 19Visual Design and Its Relation to User Experience Design 21The basics of user experience design 22The visual design of one product versus another 24Sometimes a Visual Design Is Just Good Enough 25Sometimes Visual Design Is Your Advantage 26Reverse-Engineering the Twitter User Experience 28User personas 29Use cases 30Wireframes 32Knowledge Applied 33Part II: Medium and FormChapter 3 Medium and Form in Typography 37The Tragedy of Misuse: Why You Hate Comic Sans 38The Shackles of the Typographer: The Unalterable Word 45The Formation of Our Alphabet 47The Birth of Our Letters 50The Twitter of the Roman Empire 51The height of Roman typography 52The Type That Has Lived On 62The invention and spread of printing 63Punchcutting: The cradle of the unalterable word 64Venice and the Renaissance 65France and Garamond 66Garamond Today: Why You Don’t Use Garamond on the Web 66The birth of the “web font” 67A great leap 68Bridging the gap 69Limitations can be embraced – even parodied 72Knowledge Applied 73Chapter 4 Technology and Culture 75How Trends Are Created 76The birth of Impressionism 76Impressionism and the middle class 78Impressionism and photography 79Impressionism and modern art 81Web 2 0 graphics 82How Apple started the Web 2 0 style 83How Aqua influenced the web 85How Aqua met Web 2 0 86Form shapes technology, this time 90SEO Is Design 90Understanding why SEO is important 93Choosing the right keywords 94Considering content and coding 96URL 97Title tag 97Meta tags 98Headers 98Content: em, strong, img 98Authority of linking pages 99Content of linking pages and of anchor text of links 100Everything in moderation 100Getting the content, getting the links 101Knowledge Applied 102Part III: CompositionChapter 5 Fool’s Golden Ratio: Understanding Proportions 105What Is Proportion? 107Proportion and Design 109The Broken Promise of the Golden Ratio 110The golden ratio and the Fibonacci sequence: Similar, but different 112The golden ratio in the human form 113Misconceptions about the golden ratio 115The golden ratio in ancient Greece 115The golden ratio in fine art 117The golden ratio in nature 118The golden ratio in psychology 118Other Pleasing Proportions 119The root 2 rectangle 119The 2:3 rectangle 120The 3:4 rectangle 121Proportions in Our World 121Music and dance 122Nature 123Computers and mobile devices 125Proportions at Work 126Knowledge Applied 132Chapter 6 Holding the Eye: Composition and Design Principles 133Compositional Relationships 134Reading direction 135Guiding the eye with composition 136Renaissance sculpture 137Impressionist paintings 139Web design 140Foreground/background relationships 141In Seurat’s painting 142In interface and web design 143Design Principles 144Dominance 144Similarity 146Rhythm 148Texture 150Direction 151Contrast 156Why the MailChimp Logo Is Beautiful: Use of Composition and Design Principles 157Foreground/background relationships 159Dominance 160Similarity 160Rhythm 162Texture 163Direction 163Contrast 163Knowledge Applied 165Chapter 7 Enlivening Information: Establishing a Visual Hierarchy 167What I Mean by “Hierarchy” 168Hierarchy is expressive 170Many visual factors can affect hierarchy 170Hierarchical Factors in Isolation 171White space 172Using a grid to manage white space 172Establishing a hierarchy with white space 173Knowing how much white space to use 175Considering white space and italic font style 175Using a four-column grid 176Type weight and size 177Type weight 177Type size 179Combining weight and size 181Color 181Visual ornamentation 182Hierarchy at Work 187Knowledge Applied 190Part IV: ColorChapter 8 Color Science 195What Is Color? 197The Tricks Your Eyes Play 198Metamerism 199Color constancy 199Afterimages 200How the Visual System Works 201Cones 201Trichromatic theory and color opponent theory 202Mixing of dominant wavelengths and the color wheel 204Colorblindness 205Defining Color 207Munsell 208Hue, saturation, and brightness 209Lab color model 210Color Models and Data-Driven Graphics 211Color and qualitative data 211Color and quantitative data 212Sequential versus diverging color palettes 216Thinking in Hexadecimal Color: Understanding the Colors of the Web 217Understanding RGB 218How hexadecimal represents RGB 220Mentally navigating the hexadecimal “cube” 221The future: HSL 224Color Models in Action: Why Your Business Card Doesn’t (and Never Will) Match Your Website 225RGB displays versus CMYK color printing 226Color gamuts 227Working across media and managing color 229Adobe RGB versus sRGB 230“Proofing” and previewing color shifts 231Printing with spot colors 232Knowledge Applied 233Chapter 9 Color Theory 235Color Response throughout Human History 237Color Response and Human Biology 237The Power of Red: Why You Don’t Stand a Chance in the “Target Challenge” 238The effect of red on your brain 239The prefrontal cortex and rational thought 239The attack on your prefrontal cortex 240The prefrontal cortex and decision-making 241Color and context 243What this means to you 244Research on Other Colors 245Color and Culture 246Color Schemes and the Color Wheel 247Color Choices and Web Conventions 249Backgrounds 249White 249Off-white 250Dark 250Bright 250Graphics and text 251Green 252Yellow 252Red 253Blue 254Accent colors 254The Interaction of Colors: Why Monet Never Used Black 255The Impressionists: Masters of color 256Color theory: What the Impressionists discovered 256Warm colors pop, cool colors recede 257Tints pop, shades recede 257The importance of context 258Temperature versus tint 258How Monet used color 260Using color like Monet 262Enriching your typography 262Adding life to your graphics 263Color Schemes 264Monochromatic 265Analogous 267Complementary 269Split-complementary 271Triadic 274Tetradic 276Variations 276Creating a Mood with Color 280Mysterious or exclusive 280Active 280Muted 283Natural 284Tools for Creating Color Palettes and Schemes 285Knowledge Applied 287Part V: AppendixesAppendix A Choosing and Pairing Fonts 291Classifying Typefaces 293Serif typefaces 294Old style 294Transitional 294Modern 295Slab-serif 295Sans-serif typefaces 296Display typefaces 296Looking At Letter Structure: The Form of the Skeleton 297Humanist typefaces 297Geometric typefaces 298Realist typefaces 298Pairing Fonts 298The rule 299The exception to the rule 299Why certain fonts pair well 301Texture 301Character width 304The ultimate cheat: Staying faithful to a typographer 306All the Fonts You’ll Ever Need 307Appendix B Typographic Etiquette 311Distorting Type: What Not to Do 313Fake bold 313Fake italic 314Fake small caps 314Stretching type 317Outlining type 317Type and images or textures 318Setting Body Copy 319Indicating a change in paragraphs 319Avoiding justified type 321Avoiding widows and orphans 322Tending to Typographic Details 323Not all quotes are created equal 323Using dashes dashingly 324One space after a period, not two 324Ligatures bring letters together 325Index 329