395: The Most Hearted of 2022

CodePen Radio

Episode | Podcast

Date: Wed, 04 Jan 2023 17:33:07 +0000

<p>Marie and I hop on the show to discuss our recently released <a href="https://codepen.io/2022/popular/pens/">Most Hearted of 2022 Pens</a>. We only did the calculations the day before, so this is more of a first reaction than a deep dive. </p> <ul> <li>Congrats to <a href="https://codepen.io/Hyperplexed">Hyperplexed</a> for <a href="https://codepen.io/Hyperplexed/pen/vYpXNJd">#1</a> and a massive year on CodePen. Last one entry on the Top 100, and this year, nine. "Full layouts" like this appeared a number of times, including Aysenur Turk, last year's winner, at #13 with Liquid Transition Effect, and there were two NFT-themed landing pages (<a href="https://codepen.io/dilums/pen/YzrvrBy">1</a>, <a href="https://codepen.io/erkanerdil016/pen/LYdOpKj">2</a>) in the Top 100. </li> <li>A lot of Pens attract attention when they have that "I could use this" feel to them, demonstrated by Ryan Mulligan's <a href="https://codepen.io/hexagoncircle/pen/wvmjomb">Logo Wall</a> at #2! </li> <li>High five to Greensock for taking <a href="https://codepen.io/GreenSock/pen/XWzRraJ">#3</a> with a re-creation of Brian Cross' lovely <a href="https://codepen.io/BrianCross/pen/PoWapLP">Pen</a>. <a href="https://codepen.io/tag/gsap">The tag "gsap"</a> was used a ton in the Top 100.</li> <li><a href="https://codepen.io/jkantner/posts/">Jon Kantner</a> took <a href="https://codepen.io/jkantner/pen/BarvVNa">#4</a> and <em>10 other spots</em> making this the most appearances on the Top 100 list ever, and also took a spot with a Pen made on December 13th! Aaron Iker and Yoav Kadosh both had 4 spots.</li> <li>Perhaps my favorite because of the deep CSS trickery involved was Scott Kellum's <a href="https://codepen.io/scottkellum/pen/gOvXodv" rel="noreferrer noopener" target="_blank">Apple inspired pride clock</a>. Scott has the oldest account of anyone in the list, over 10 years old! Huge fan of Steve Gardener's <a href="https://codepen.io/ste-vg/pen/PoQgvBK">joke,</a> though as well. </li> <li>11 of the Top 100 were created for <a href="https://codepen.io/challenges">CodePen Challenges</a>.</li> </ul> <h3 id="h-time-jumps">Time Jumps</h3> <h3 id="h-sponsor-notion">Sponsor: <a href="https://notion.com/codepen">Notion</a></h3> <p><a href="https://notion.com/codepen">Notion</a>&nbsp;is an amazing collaborative tool that not only helps organize your company’s information but helps with project management as well. We know that all too well here at CodePen, as we use Notion for countless business tasks. Learn more and get started for free at&nbsp;<a href="https://notion.com/">notion.com</a>. Take your first step toward an organized, happier team, today.</p>