I try to live a superstar life: work full time, hang out with friends and work on my hobbies.
Is it exhausting? Yes.
Is it fulfilling? Also yes.
But to make it happen I have to decide on what to cut to be able to balance it all. One of my most neglected children is this portfolio. It’s not often I have time between projects to dabble in a little code or write a blog. Luckily today I had time to squeeze in a little update; One that I’ve been dreaming about: upgrading the pixelated duck to full 3D.
This was a not-so-quick, two step process:
- 3D model (in TinkerCAD)
- Embed the model on my website (ModelViewer.dev)
To speed up the modeling process I started by stealing. I used Battleship Customs‘ Rubber Duckies as a base. They had just the right amount of adorable for my purposes but still needed a bit of adjusting to fit my vision. Introducing the paraboloid. It was the perfect shape to stretch and shrink into a duck tail and two rounded wings. A couple tweaks to the size and tilt of the head and we’re perfect. If you’d like to build off of my version of the duck you can check it out here.
Next was to embed it on my website. To support displaying the 3D model (and being able to turn it in 3D space) I utilized ModelViewer.Dev. It lets you treat 3D files like any other HTML element, allowing you to drop in a URL for your model like you would an image. The 3D model rotating is a built-in feature, so once I dropped it in, it’s ready to go!
Okay, maybe sharing my secrets will make this website update a bit less cool and mysterious. But being able to embed 3D models can add interest to an otherwise dull experience. Invite people to turn around a model of your product, explore a rendered space, or check under it to get a secret password for a virtual geocache. Wait … that last idea is pretty good.
Thanks for reading,
Sarah