CodePen showcase: Round 2
14 Feb 2018
It's time for another round-up of some of the finest demos made with Metafizzy plugins.
I'll be collecting these in the Metafizzy showcase CodePen collection, as well as individual collections for each plugin.
Gabrielle Wee got my attention with pens that combined elegant design with fun animations. I was thrilled to see her work with Metafizzy.
Isotope Card Match is a perfect example. This demo makes use of a little known Isotope shuffle method to give a simple memory game a kick. The design is stunning: all done with CSS. I love how the card back's design is a timer.
See the Pen Isotope Card Match Game by Gabrielle Wee ✨ (@gabriellewee) on CodePen.
Gabrielle followed up with the Pokémon Sprite Sorter. It displays sprites for 184 Pokémon. This demo nicely shows Isotope's ability to organize information. You can make sense of a huge list of Pokémon by filtering via type or game release. Nice touches include pixel art sprites and background colors to indicate types.
See the Pen Pokémon Sprite Sorter by Gabrielle Wee ✨ (@gabriellewee) on CodePen.
Matt Soria put together this bespoke Font Showcase with Flickity. I like how Flickity is just part of the experience, allowing you to page through the characters.
See the Pen Font Showcase with Flickity by Matt Soria (@poopsplat) on CodePen.
Jack Rugile is a CodePen star. He produces wild visuals, fluid animations, and dang ol' video games in JavaScript. He was kind enough to descend from his heavenly realm and toil with Flickity to output Carousel Lock Interface. It's got it all: slick visuals in CSS, glitchy sounds, and an outside-the-box concept for Flickity. Check how the LOCKED status blinks.
See the Pen Carousel Lock Interface by Jack Rugile (@jackrugile) on CodePen.
I'm delighted to see what code artists can do when they get their hands on a Metafizzy plugin. If you're interested in making a demo, get in touch so I can make it worth your while. I'd love to show your work in the next round-up!