Podcast Awesome

In this episode of Podcast Awesome, Matt and Rob take you on a wild ride through the evolution of web icons — because who doesn’t love a good glow-up story? From the pixelated mess of Geocities and MySpace days (RIP low-res images) to the sleek world of custom web fonts and SVG's moment in the sun, they break down each tech's pros and cons so you don’t have to.

Ever wondered how icons went from blurry to brilliant? We've got questions and Rob’s got the answers! He explains how web fonts came in like a hero to save the day, improving performance and making your designs look sharp when retina screens appeared on the scene. But wait—SVGs are here too, offering even more flexibility, accessibility, and crispness for those big graphic-heavy projects. Plus, with Font Awesome Kits, you’ll learn how to easily mix and match your icons for peak performance without breaking a sweat.

So. What kind of icon is best for your project — Webfont or SVG. Rob dodges the dogmatism and simply says, "well, it depends."

Key Takeaways:

• Evolution of Icon Technology: An overview of the shift from low-resolution images to web fonts and SVGs, highlighting their impact on web design.
• Pros and Cons: Detailed comparison of the advantages and disadvantages of web fonts and SVGs, including aspects like performance, accessibility, and usability.
• Font Awesome Kits: Explanation of how Font Awesome Kits help developers navigate between web fonts and SVGs, offering features to optimize icon usage.
• Accessibility and Semantics: Discussion on the importance of accessibility and semantic considerations in choosing icon technology.
• Practical Advice: Guidance on how to decide between web fonts and SVGs for specific projects, with practical examples and insights.
  
  
  Timestamp Summary
  0:09 | 🌐 The Evolution of Icon Tech on the Web
  2:16 | 🖼️ Evolution of Web Icons from Images to Custom Fonts
  7:33 | ⚡ Web Fonts Versus SVGs for Faster and Accessible Icons
  12:13 | 🔍 Choosing Between SVG and Other Formats Depends on Your Project
  13:01 | 🎬 Web Fonts Versus SVG: Pros and Cons for Icon Animation
  15:40 | 🛠️ Making Web Fonts Accessible with Font Awesome Kits
  16:57 | 🎨 Advantages and Challenges of Using SVGs for Web Icons
  20:17 | 🚀 Optimizing Font Awesome: Web Fonts vs SVG
  26:40 | 🔧 Simplifying Font Awesome Upgrades with Kits
  28:27 | ✅ Making the Right Choice: SVG Versus Web Font
  
  Podcast Awesome: https://www.podcastawesome.com/
  Font Awesome Pro:  Level up with Font Awesome Pro!
  Webfont or SVG: Well, it Depends: https://blog.fontawesome.com/svg-or-webfont/
  https://fontawesome.com/plans
  Twitter: @fontawesome
  The Podcast Awesome theme song was composed by Ronnie Martin: https://ronniemartin.org/
  Audio mastering by Chris Enns at Lemon Productions: https://www.lemonproductions.ca/

Stay up to date on all the Font Awesomeness! 

💩⚡️ Hold onto your butts, folks, because this episode of Behind the Icon on Podcast Awesome is about to get ...  messy! We’re diving headfirst into the iconic history of one of Font Awesome’s quirkiest creations — the Poo-Storm icon. But if not for the creation of a stinker of a particular emoji, the poo-storm icon may never have come to fruition.

It all starts with the legendary rise of the poo emoji, a cultural masterpiece that has made its way into countless texts, memes, and conversations (whether you admit it or not). 💬

This episode is packed with everything you never knew you needed to know about emoji and icons, including a hilarious behind-the-scenes look at how Jory Raphael, Font Awesome’s own Icon Making Boss, got an icon mash-up idea. From the humble beginnings of the cloud icon to its thunderous twist into a storm of poo, Jory breaks it all down with plenty of laughs and middle-school humor. ✨💩

And yes, "icon creation", "poo emoji origin", and "Font Awesome magic" are the real stars here. Whether you're a design nerd or just here to catch a case of the goofballs, this episode is sure to entertain. 💥

Key Takeaways:
💩 The history of the poo emoji dates back to the late '90s in Japan 🇯🇵, thanks to Shigetaka Kurita, who basically invented emoji communication as we know it.

⚡️ And when boredom and eye-crossing monotony set in on a particularly long day of icon design, Jory Raphael mashed up the poo emoji into something even more fun — thus the Poo-Storm icon was born. 💡 Humor + design is the name of the game at Font Awesome!

🌍 Thanks to the Unicode Consortium, the poo emoji officially went global in 2010, becoming the symbol for all things cheeky and lighthearted in digital communication.

🎨 Font Awesome’s philosophy? Playful design with a side of absurdity — the Poo Storm icon embodies this perfectly.

🚽 Pro tip: The Poo Storm icon isn’t just for giggles — it’s been spotted in the wild at a plumbing company, proving even the weirdest icons have a purpose!

Timestamp:
0:09 - The Evolution and Cultural Impact of the Poop Emoji 💩
4:58 - The Creation of the Poo Storm Icon ⚡️
8:04 - The Perfect Use of a Fun Icon 🚽
10:20 - Clever Use of Poo Storm Icon on a Home Inspections Website 🏠
12:26 - Awesome Theme Song and Video Editing Credits 🎶

Notes:
💡 Shigetaka Kurita: https://emojipedia.org/shigetaka-kurita/ 
🔤 Unicode Consortium: https://unicode.org  
💩 The Poo-storm Icon: https://fontawesome.com/icons/poo-storm?f=classic&s=solid  
🏠 ROI Home Inspections: https://roihomeinspections.com/ 
🎨 Font Awesome: https://fontawesome.com  
🐦 Twitter: @fontawesome: https://twitter.com/fontawesome  
📸 Instagram: @font.awesome: https://www.instagram.com/font.awesome 
💬 Threads: @font.awesome https://www.threads.net/@font.awesome  
💼 LinkedIn: Font Awesome: https://www.linkedin.com/company/fontawesome  
🎶 The Podcast Awesome theme song was composed by Ronnie Martin: https://ronniemartin.org/

Stay up to date on all the Font Awesomeness! 

In this headbanging episode of Podcast Awesome, we explore the story behind the devil horns gesture—an iconic symbol in the world of heavy metal. 🤘 From its origins in ancient superstitions to its popularization by metal legend Ronnie James Dio, this gesture has a history as rich as the riffs that accompany it. We also chat with Font Awesome’s own Jory Raphael, the creative mind behind the hand horns icon, to get an inside look at how this powerful symbol became part of the Font Awesome library. Whether you're a metalhead or just love a good story, this episode is a must-listen! 🎸

🕒 Timestamps: 
⏳ 00:09 - Heavy Metal and Visual Cues
🤘 00:35 - The Double Horns Hand Gesture
🧙‍♂️ 02:08 - Origin of the Devil Horns Gesture
🎤 02:49 - Ronnie James Dio and the Devil Horns
🧿 05:11 - The Evil Eye and Cultural Connections
🤟 06:56 - The Devil Horns as a Metalhead Salute
🎨 07:41 - The Creation of the Hand Horns Icon
🚀 09:56 - Call to Action for Font Awesome Community
🎧 12:36 - Credits and Closing Remarks

#DevilHorns #HeavyMetal #PodcastAwesome #IconDesign #MetalCulture #RonnieJamesDio

Podcast Awesome: https://www.podcastawesome.com/
Hand Horns Icon: https://fontawesome.com/icons/hand-horns
Font Awesome Pro: Ready to rock? Level up with Font Awesome Pro! https://fontawesome.com/plans
Twitter: @fontawesome
The Podcast Awesome theme song was composed by Ronnie Martin: https://ronniemartin.org/
Audio mastering by Chris Enns at Lemon Productions: https://www.lemonproductions.ca/

Stay up to date on all the Font Awesomeness! 

Ever wonder how a chaotic internet meme became an iconic design? Join us in this episode as we dive into the fascinating journey of the Dumpster Fire icon—from its fiery beginnings as a viral GIF to its status as a symbol of modern times. 🔥

(And if you want ever more entertainment from this episode, make sure to check out the YouTube version!)
 
We’ll explore the history behind the phrase “dumpster fire,” its cultural impact, and how it inspired the creation of one of Font Awesome’s most beloved icons. Plus, hear behind-the-scenes stories from our design team and discover why this icon is as relevant as ever!

🕒 Timestamps: 
⏳ 00:00 Intro and Overview of the Dumpster Fire
👋 01:15 Origins of the Phrase "Dumpster Fire"
📈 03:22 The Rise of the Dumpster Fire Meme
🖥️ 05:45 Tracing the Source of the Original Dumpster Fire GIF
🎨 07:35 Designing the Dumpster Fire Icon for Font Awesome
🔥 09:10 Why the Dumpster Fire Icon Belongs in the Political Category
💡 11:50 Fun Facts and Design Insights from the Font Awesome Team
🙌 14:20 How You Can Use the Dumpster Fire Icon in Your Projects
🎉 16:05 Conclusion and Final Thoughts

#DumpsterFire #FontAwesome #IconDesign #MemeCulture #InternetHistory

Podcast Awesome: https://www.podcastawesome.com/
YouTube video version of this episode: https://youtu.be/8X40p-kfxYo
Dumpster Fire Icon: https://fontawesome.com/icons/dumpster-fire
Font Awesome Pro: Want to put the Icon Wizard to use? Grab a Font Awesome Pro subscription! https://fontawesome.com/plans
The Origin of the Internet's Most Famous Dumpster Fire: https://www.entrepreneur.com/science-technology/the-origin-of-the-internets-most-famous-dumpster-fire/284041
Twitter: @fontawesome
The Font Awesome theme song was composed by Ronnie Martin https://ronniemartin.org/
Audio mastering by Chris Enns at Lemon Productions https://www.lemonproductions.ca/

Stay up to date on all the Font Awesomeness! 

The Story Behind the Mullet Icon: Celebrating an Enduring Cultural Symbol

🎬 Join us as we delve into the resilient history of the mullet, from its uncertain origins to its pop culture prominence in the '80s and '90s. 🎸 Learn about the creation of Font Awesome's 'User Mullet' icon and enjoy entertaining stories from team members who sported mullets. ✂️ Discover the evolution of this iconic hairstyle and how it has shaped popular culture over the decades.

🕒 Timestamps:
⏳ 00:00 The Enduring Legacy of the Mullet  
👋 00:55 Introduction to the Series  
📜 01:24 Historical Origins of the Mullet  
🎤 02:19 Cultural Impact and Popularity  
📚 03:17 Etymology and Alternative Names  
🔄 05:13 The Mullet's Modern Resurgence  
🖌️ 05:35 Creating the Mullet Icon  
🎨 06:10 Design Insights from Jory Raphael  
🎉 08:47 Personal Mullet Stories  
🙌 15:57 Conclusion and Community Engagement

#MulletMadness #FontAwesome #IconicStyles #PopCulture #MulletIcon

Podcast Awesome: https://www.podcastawesome.com/
User-hair-mullet icon: https://fontawesome.com/search?q=user%20hair%20mullet&o=r
Twitter: @fontawesome
The Font Awesome theme song was composed by Ronnie Martin
Audio mastering by Chris Enns and Lemon Productions

Stay up to date on all the Font Awesomeness! 

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

• Font Awesome: Font Awesome Website
• Twitter: @fontawesome
• The Font Awesome theme song was composed by Ronnie Martin
• Audio mastering by Chris Enns and Lemon Productions

Stay up to date on all the Font Awesomeness! 

Dive into the wild world of web development with the Web Awesome team! Listen as Matt, Lindsay, and the (podcast) elusive Corey dish about their successful Kickstarter, the alpha launch of Web Awesome, and the exciting future of web components. You'll get the inside scoop on their perfectionist struggles, theming API adventures, and how they're revolutionizing the way teams collaborate. Plus, bonus cat cameos!


Timestamp Summary

 | 0:10  | Web Awesome Alpha Launch and Team Reflections
 | 3:22  | Redesigning Theming API for Web Awesome's Alpha Release
 | 9:22  | Challenges in Developing Complex UI Components
 | 10:49  | Building Web Awesome: From Open Source to Paid Product
 | 15:38  | Web Awesome Pro Features and Launch Timeline
 | 19:04  | Revolutionizing Team Collaboration with Functional Design Systems
 | 23:04  | Exciting Updates on Alpha Release and Lifetime Discounts

"I think I can speak for the whole team that we're all a bit of perfectionists, so I don't think we were ever ready to release an alpha."

"The theming was a big thing that I think we wanted to have pretty much a bow on when we released the alpha."

"Shout out to Lindsey for her amazing work on the theming API, which is completely redesigned a lot, lot easier."

"Shout out to Connor, who's not on this chat today, but he did some amazing work to convert to all of the form controls to use a new API that never existed when these form controls were originally created."

"We've had quite a few issues reported so far that we're looking into a lot of discussion started."

"Obviously, we couldn't have done this without you."

"I kind of have a component addiction. I really like doing this stuff. So my hobby is also my career, and so that it's cool that that got to converge in such a way that I can work full time on something I actually really enjoy working on."

----------------------
Show Notes

• Font Awesome: Font Awesome Website
• Web Awesome: Kickstarter Website  
• Twitter: @fontawesome
• The Font Awesome theme song was composed by Ronnie Martin
• Audio mastering by Chris Enns and Lemon Productions

Stay up to date on all the Font Awesomeness! 

In this episode of Podcast Awesome, host Matt Johnson takes listeners behind the scenes of starting and producing Podcast Awesome. Despite being a newbie to podcasting, Matt shares his journey, from finding the initial idea buried in a Basecamp thread to releasing 20 episodes. He discusses capturing the podcast's vibe, and choosing the right software and equipment. Matt also shares insights from podcasting veteran Matt Carter and highlights the challenges and triumphs of what it takes to capture an authentic feel. And if gear and software is your thing, there's some conversation about that, too.

Feeling intimidated by starting your own podcast? Don't know what you're doing? You're in good company, we're figuring it out, too, as we "build the plane in the air." !


Timestamp Summary

 | 0:00:08  | Introduction to the podcast and its purpose
 | 0:01:04  | The decision to start recording episodes without much feedback
 | 0:02:04  | Importance of capturing the podcast's vibe and subject matter
 | 0:03:33  | Emphasis on Font Awesome's nerdery and company culture
 | 0:05:14  | Determining the purpose and voice of the podcast
 | 0:05:47  | Meeting with creative team and understanding brand guidelines
 | 0:06:25  | Advice from podcasting buddy Matt Carter
 | 0:08:06  | Choosing the right software for recording and editing
 | 0:09:58  | Workflow for editing using GarageBand, Audio Hijack, and Descript
 | 0:11:50  | Importance of quality gear for audio capture
 | 0:12:50  | Tips for getting good audio and avoiding common mistakes
 | 0:13:24  | Creating a checklist for podcasting setup
 | 0:13:49  | Importance of capturing good audio at the beginning
 | 0:14:19  | Editing tips: finding the right balance, getting feedback
 | 0:15:37  | Choosing theme music: options and licensing agreements
 | 0:16:42  | Using interstitials to create a relaxed atmosphere
 | 0:18:37  | Nerd show and tell: short episodes featuring team members
 | 0:19:08  | Constantly improving editing, hosting, and content marketing
 | 0:19:32  | Getting over the discomfort of hearing one's own voice
 | 0:19:57  | Rolling the credits: acknowledgments and production details

Quotes

Matt-(0:02:49)

Stay up to date on all the Font Awesomeness! 

Episode Summary:

In this episode of Podcast Awesome we have an inspiring chat with Konnor Rogers, a developer at Web Awesome with a fascinating career trajectory. Starting his professional life as a paramedic and self-teaching his way into web development, Connor's journey epitomizes the relentless pursuit of a  career in technology. 

Konnor shares insights into his transition from paramedic to coder, highlighting the challenges of being self-taught and the breakthrough opportunities that led to his role alongside Corey at Web Awesome. He discusses current projects such as component development, the intricacies of form association, and the excitement of tackling the much-anticipated Kickstarter stretch goals like date pickers and rich text editors. Listeners can expect to hear a developer-centric conversation enriched with the technical specifics of Web Awesome's ongoing efforts to deliver awesome components to customers.

 
Timestamp | Summary

2:58 | From Paramedic to Web Developer: A Journey of Learning
4:05 | Balancing Education, Work, and Family Life
4:38 | Discovering and Contributing to Shoelace Components
5:04 | From Startup to Microsoft and Beyond
6:45 | Unconventional Paths to Tech Careers and Self-Taught Success
9:40 | Improving Form Controls in Web Development
12:58 | Refining Radio Button Accessibility and Behavior
14:09 | Challenges of Building an Accessible Date Picker Component
17:02 | Embracing Iterative Progress in Product Development
17:03 | Challenges in Building Advanced Web Components
20:00 | Early Mornings and Unusual Paramedic Tales
23:15 | Discussing Favorite Fonts, Icons, and Web Components
25:11 | Competitive Gaming and Balancing Family Life
26:42 | Recognizing Personal Limits with Hobby Enthusiasm

Resources:

• The Odin Project: An open-source project that provides a free education in web development. The Odin Project
• Syntax FM podcast: A popular tech podcast discussing web development topics that Connor mentioned during the conversation. Syntax FM
• Font Awesome: Font Awesome Website
• Web Awesome: Kickstarter Website  
• Twitter: @fontawesome
• The Font Awesome theme song was composed by Ronnie Martin
• Audio mastering by Chris Enns and Lemon Productions

Stay up to date on all the Font Awesomeness! 

Episode Summary:

In this episode of Podcast Awesome, we chat with the Lindsay Miller, the first brave soul from the Web Awesome team to take the hot seat on the Nerd Show and Tell. 

Beginning with a look into the inception of Lindsay's career and her interaction with Font Awesome before joining the Web Awesome team, we discuss the significance of a design system — a topic often shrouded in industry jargon yet fundamental to cohesive digital experiences. Lindsay also recounts  being part of the recent Web Awesome Kickstarter campaign, which hit the 700,000 milestone.

Timestamp | Summary

0:00 | Chatting Design, Tech, and Font Awesome with Lindsay Miller
3:14 | From Solo Designer to Font Awesome Enthusiast
4:13 | Embracing Company Culture and Innovative Products
6:53 | From Childhood CSS Fascination to UX/UI Professional
10:32 | Landing the Dream Job (While Experiencing Imposter Syndrome)
14:56 | Addressing Inconsistencies in Development Practices
15:54 | Design Systems: Building Blocks for Developer Efficiency
19:47 | Developing and Perfecting Thematic Web Design Systems
23:47 | Kickstarter Success Brings Exciting Yet Daunting Challenges
24:36 | The Complexities of Building an Accessible Date Picker
27:59 | Icon Design Delights and the Font Awesome Possum
32:37 | Homeownership Inspires Mario-Inspired Wall Art
34:59 | Nostalgic Reflections on Star Wars and Creative Inspirations

Resources:

• Font Awesome: Font Awesome Website
• Web Awesome: Kickstarter Website  
• Twitter: @fontawesome
• The Font Awesome theme song was composed by Ronnie Martin
• Audio mastering by Chris Enns and Lemon Productions

Stay up to date on all the Font Awesomeness!