This is a Hackathon prototype that UI/UX team has put together. We were aiming to create a marketplace app that combined the idea of NFT and War Dragons’ dragon collections. I was responsible for the visual design part of this project and did everything within one workday. I will showcase how I did it step by step. This was amazing teamwork and I want to especially shout out to our graphic designer Jonathan Peñaloza for providing his frame design’s vector file in a beautiful, timely manner, which gives me a solid base to 3dization the vector work he has done.
Original Design
Heightmap
I have an idea of turning the NFT cards into this into 3d from the get-go (cuz it's NFT, why not!?), here’s what I did:
Starting from Jonathan’s original design, I’ve converted the vector file into the heightmap by simply using one of photoshop’s effects: bevel&emboss.
3D Coat
The heightmap gives me the solid information to make it into a relief-like 3d model. I’m targeted to make this NFT a pre-render piece instead of realtime, because we do not have time to build a dedicated shader for this project, so I don’t have to worry about retopology at all.
WIP, All Mighty Cinema 4D combo with Octane Render
For the next step, I brought it into C4D, light the scene, rich the frame with the intended content, then texture and animate the frame with some F-Curves.
Finally, I rendered the PNG sequences out for each card and brought it to After Effects for some final tweaks. And deliver them to the engineer for implementation.
Thank you for reading :)