DEV Community

Cover image for Awesome Things for Awesome People - September 2020
Jhey Tompkins
Jhey Tompkins

Posted on

6

Awesome Things for Awesome People - September 2020

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!

SurveyJS custom survey software

Build Your Own Forms without Manual Coding

SurveyJS UI libraries let you build a JSON-based form management system that integrates with any backend, giving you full control over your data with no user limits. Includes support for custom question types, skip logic, an integrated CSS editor, PDF export, real-time analytics, and more.

Learn more

Top comments (1)

Collapse
 
manishfoodtechs profile image
manish srivastava โ€ข

Wow nice

Cloudinary image

Optimize, customize, deliver, manage and analyze your images.

Remove background in all your web images at the same time, use outpainting to expand images with matching content, remove objects via open-set object detection and fill, recolor, crop, resize... Discover these and hundreds more ways to manage your web images and videos on a scale.

Learn more

๐Ÿ‘‹ Kindness is contagious

Please leave a โค๏ธ or a friendly comment on this post if you found it helpful!

Okay