DEV Community

loading...
Cover image for Awesome Things for Awesome People - September 2020

Awesome Things for Awesome People - September 2020

jh3y profile image Jhey Tompkins ・2 min read

Here's a roundup of what I made in September! 😎

Move Things with CSS

Promo for my CSS animation and transitions ebook over on Gumroad.

Cool Steps

3D cool steps 😎 Also featured in Val Head's newsletter.

Hi-fi

Bring an SVG Hi-fi stack to life with GreenSock. Let me show you how in this Twitter thread.

3D Social Distancing Toggle

Playful perspective changes with the Mac Finder icon. Be safe!

100 Div Tada!

For the CodePen challenge, created a "Tada!" with 100 divs and GreenSock.

Apple Event Hashflag

Hashflags are everywhere lately. Recreated the one from the Apple Event with GreenSock. Added some sparkles and sound. Micro-interactions are cooler with sound.

Orion's Galaxy

Did you know you can flow an SVG outside of it's viewBox? You can. And if you animate the viewBox, you can create a zoom effect. Guess the film for this one!

CSS 3D Sandbox

Not much to explain here. All will be revealed in an upcoming article. But this is how I approach my 3D CSS work. This sandbox shows how it works in my head haha.

CSS Xbox Series S

Playstation? Xbox? PC? Switch?
There are so many CSS Nintendo Switches out there. The Xbox Series S looked like it was worth making.

CSS Studio Room

Created my workspace in CSS. That's right. This is my desk and office set up recreated in CSS.

CSS 3D Balloons

Created some balloons for creating the house from "Up". These are nifty because as we rotate the camera, we offset the balloon rotation. This gives the "faux" 3D affect.

CSS House from Up

The house from "Up". Can't say much more. It's likely to spin up your fans so I've not embedded it haha.

Check it here


That's that!

Wanna see more? Reach out and say "Hi!" on Twitter!

Discussion

pic
Editor guide
Collapse
manishfoodtechs profile image