The Story Behind the Sharp Icons: How a Whiteboard Idea Accidentally Turned into a Full Icon Set


Episode Artwork
1.0x
0% played 00:00 00:00
Jul 30 2024 34 mins  

In this deep dive into the creation of Font Awesome's Sharp Icon Set, designers Jory and Noah share the behind-the-scenes story of transforming a casual idea into a reality.

Jory recounts the unplanned inception of the Sharp Icon Set, initially just a bullet point on a whiteboard that evolved into a full-fledged project due to a promotional video. The discussion sheds light on the challenges they faced, such as maintaining consistency with the existing icon grid sizes and artboard constraints, while exploring the potential for new design directions in the future. Noah elaborates on his journey from Figma advocate to a pivotal member of the Font Awesome team, charged with defining the rules and styling for a sharp rendition of their iconic set.

Timestamp Summary

| 0:01:04 | The idea of Sharp icons accidentally made it into a video.
| 0:02:01 | Sharp icons originated during a brainstorming session.
| 0:03:31 | The concept of sharp icons was included in the version six video.
| 0:04:09 | We'd committed ourselves to Sharp icons, and Noah was hired to help.
| 0:06:26 | Noah played a significant role in designing the Sharp icons.
| 0:07:47 | Noah initially declined to help, but eventually joined the team.
| 0:09:44 | Jory worked on the Sharp icons while quarantined with COVID.
| 0:10:53 | Matt and Noah collaborated on copy and graphics for the Sharp icons.
| 0:11:47 | The main challenge was adapting the icons to a different grid size.
| 0:12:20 | The challenges of maintaining consistency between icon families.
| 0:12:50 | Making design choices to ensure compatibility with existing designs.
| 0:13:33 | The challenges of showcasing different icon families on the website.
| 0:14:18 | Updating icon search to include references to Sharp & Classic styles.
| 0:15:03 | Jory and Matt discuss the user-friendly design of the icon search tool.
| 0:15:26 | The complexity of managing a large number of icons and styles.
| 0:16:22 | How Noah got involved with the Sharp project and his initial work.
| 0:18:22 | Noah and Jory's collaboration on a Figma event.
| 0:19:22 | Noah explains how he joined the Sharp project.
| 0:20:36 | Noah discusses the challenges of creating Sharp icons.
| 0:21:24 | The visual density between rounded and sharp corners in icons.
| 0:22:39 | Establishing constraints for the Sharp icon set.
| 0:25:11 | Using Sharp icon sets and their suitability for different types of UI.
| 0:26:37 | Sharp icons work well with stark and geometric typefaces.
| 0:27:51 | Sharp icons may be suitable for fintech and professional themes.
| 0:28:16 | The difference between icon families and styles in Font Awesome.
| 0:30:38 | Choosing the right icon weight based on the legibility required.
| 0:32:23 | New icons based on a mathematical shape called the super ellipse.
| 0:32:51 | Good design should go unnoticed and guide the user intuitively.

Show Notes

Stay up to date on all the Font Awesomeness!