Design an Interactive Smartwatch with Figma and Motion Tools

Design an Interactive Smartwatch with Figma and Motion ToolsDesign an Interactive Smartwatch with Figma and Motion Tools

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

Abhrajit Ray

• Feb 28

Built this Fully interactive smartwatch with Figma Make, Claude and Motion. Inspired by Skeuomorphism and the iconic Teenage Engineering style, I wanted the watch to feel as tactile as possible. Figma Make paired with Claude, did an amazing job in getting all the ScrollTrigger animations and watch faces interactivity done right. The design and colors turned out pretty well too. My personal fav thing is that you can even play a game on it 🎮 Live: https://activewatch.figma.site/ 🚀 Checkout my LinkedIn post too😊: https://www.linkedin.com/posts/abhrajitray77_figmamakeathon-motion-react-activity-7433532536296841216-Gv0F Community file: https://www.figma.com/community/file/1609590243231299630/interactive-smartwatch Thanks! Have fun remixing it! ✨

figmamakeathon

Eric Elliot

• Feb 28

Very cool- how did you utilize Claude and GSAP with it?

Abhrajit Ray

• Feb 28

Thanks Eric! ✌️ I did not use GSAP, motion.dev was enough as I've kept the animations pretty simple. As for Claude, I used the Opus 4.6 model. Feed it detailed steps in specific technical terms in the prompt, and it yields pretty good results. 😄

motion.dev

Motion - A modern animation library for JavaScript and React

Motion is built on native browser APIs for a tiny filesize and superfast performance. It uses hardware acceleration for smooth and eco-friendly animations. Previously Framer Motion.

Eric Elliot

• Mar 3

Oh nice! I've implemented a little using the same motion package on what I'm building too. Thought about integrating GSAP, but time is running out!

Abhrajit Ray

• Mar 3

Niceee. Would love to see what you're building when you're done with it. 🙌

Praveen Kumar

max

• Apr 21

Mechanical watch diagram made in Figma

Figma 2D Animation Animation UX Writing

Godwin John

pro

• Apr 21

it's crazy what we can do with just Figma

Rudy Agnel

• Apr 21

Here's my last-minute submission for the Zo Computer Challenge.

I created a fun, interactive personal website that features a card menu with 3D tilt and shine effects, draggable stickers, and an exciting photo booth page where you can take a selfie and download it. If you're not satisfied with the result, you can easily remove the photo.

I invite you to visit my interactive website here: https://my-portfolio-rudypagnel.zocomputer.io/

Thank you! It has been a fun experience building this project using Zo Computer.

zocomputerchallenge

Bob Vasic

pro

• Apr 21

Last minute? Oh, just wait. A bit more hackathons that you notice what means to submit literally in the last minute. Haha! 😂

Aavirash Mitra

• Apr 21

I came to Contra through the @Rive & @Contra HQ HMI challenge (my submission!) and was blown away by the talent & community here, so I decided to stay. Hi! I'm Aavirash, an Art Director/Motion & Interactive designer and here are some snippets from past work. I'll be here more often. Come say Hi in the comments I would love to connect!