The idea

Product pages for drones usually show a static photo, and you can’t really see the product from different angles. I wanted to design a hero where you can explore it, turning the drone around the way you would in a shop.

What I designed

• A dark, minimal layout, so the drone is the main focus.

• A carousel of three models, Ultra Light, Superfast and Heavy, each with its own short tagline.

• Drag-to-rotate 360° on every model, with a subtle “drag to rotate” hint

• Clear calls to action: Official pre-order, Learn more and Buy now

How I built it

I designed the concept, layout and interaction in Figma. For the drones, I gave Claude Code stock photos as reference and asked it to recreate each one as an accurate 3D model that can be rotated. Then I used it to turn my design into a working interactive prototype. I wrote the prompts, reviewed each iteration and adjusted spacing, typography and motion until it matched my design.

What I learned

This project taught me how to build animation with Claude Code, going from a static Figma design to something that moves and reacts.

The biggest challenge was the 360° rotation. I learned how to set up a 3D model so it can be dragged and turned smoothly from any angle, and how to keep it feeling natural instead of jumpy.