Published inUX Collective·PinnedMember-only7 Principles of Icon DesignClarity, Readability, Alignment, Brevity, Consistency, Personality, Ease of Use. — More in the iconography series: • Foundations of Iconography • 5 Ways to Create a Settings Icon • Icon Grids & Keylines Demystified • Pixel-Snapping in Icon Design • 3 Classic Icon Families Creating a high-quality icon family requires a thoughtful approach, a trained eye, a bit of iteration, and…Icons10 min readIcons10 min read
Published inMedium.design·Mar 30Getting intentional with typeA design team exercise to try — We’ve started a “What if” series on the Medium design team. As a counterbalance to our rigorous day-to-day process, we needed a space to zoom out, experiment, and explore more broadly. …Typography4 min readTypography4 min read
Jan 1Member-onlyBest new icons of 2022Icon designers have been busy this year. Major platforms like Spotify and Twitter overhauled their icon systems for better readability, consistency, and brand resonance. Long-standing icon libraries like Streamline and Font Awesome continued to expand their offering. Independent icon designers surprised me with new unique styles. Here are my top…Icon Design4 min readIcon Design4 min read
Oct 13, 2020Phosphor Icons is live!A flexible icon family in 6 weights Introducing Phosphor Icons, a flexible icon family for everyone. Toby Fried and I have been hard at work the last 3 months drawing 588 icons in 6 weights, building out design and developer libraries, and showcasing the product in our website. Overview 588 icons…Icons1 min readIcons1 min read
Published inUX Collective·Jun 30, 2020Member-onlyPixel-snapping in icon designA rendering test. — More in the iconography series: • Foundations of Iconography • 7 Principles of Icon Design • 5 Ways to Create a Settings Icon • Icon Grids & Keylines Demystified • 3 Classic Icon Families We all want our designs to display sharp on all platforms, for all our users. To…Icons7 min readIcons7 min read
Jun 1, 2020Member-only3 Classic Icon FamiliesAnd why they matter — More in the iconography series: • Foundations of Iconography • 7 Principles of Icon Design • 5 Ways to Create a Settings Icon • Icon Grids & Keylines Demystified • Pixel-Snapping in Icon Design Icons communicate so much with so little. When they’re successful we hardly notice them—a pedestrian sign…Icons7 min readIcons7 min read
Published inUX Collective·Apr 30, 2020Member-onlyFoundations of iconographyDefinition, purpose, and benefits — More in the iconography series: • 7 Principles of Icon Design • 5 Ways to Create a Settings Icon • Icon Grids & Keylines Demystified • Pixel-Snapping in Icon Design • 3 Classic Icon Families An icon is a compact symbol that represents a discrete object, action, or idea. Icons…Icons6 min readIcons6 min read
Mar 16, 2020Member-onlyIcon Grids & Keylines DemystifiedPurpose, anatomy, and in-depth examples — More in the iconography series: • Foundations of Iconography • 7 Principles of Icon Design • 5 Ways to Create a Settings Icon • Pixel-Snapping in Icon Design • 3 Classic Icon Families If you’re a digital designer, you’ve probably encountered an icon grid before—perhaps while contributing to a set…Icons9 min readIcons9 min read
Feb 12, 2020Member-only5 Ways to Create a Settings IconLearn to use an array of Illustrator features through this exercise — More in the iconography series: • Foundations of Iconography • 7 Principles of Icon Design • Icon Grids & Keylines Demystified • Pixel-Snapping in Icon Design • 3 Classic Icon Families The gear has become a ubiquitous symbol for settings in our digital applications.Icons8 min readIcons8 min read
