# A smartwatch landing page where the hands tell your time

> An interactive watch landing page in the spirit of Apple's product pages, with realistic rendering, a configurator that remembers choices and live hands.

Canonical page: https://andersonmancini.dev/blog/smartwatch-landing-page

Published: 2026-09-19 · 1 min read · Tags: three.js, webgl, product, configurator, launch

Product pages for watches have a particular look: soft studio light, glass reflections, materials that feel physical. This project asks what that page can do when the product is a real-time 3D model and not a video.

![The smartwatch landing page](https://andersonmancini.dev/images/watch_pro.webp)

## More than a hero

- **Realistic product rendering** in the spirit of Apple's product pages.
- A **built-in configurator** for bands, finishes and details, that remembers your choices as you explore.
- A watch that **stays alive**: the hands move in real time and sync to your local clock, so every visit shows the correct time on the dial.

That last detail is the one I like. It costs almost nothing, and it makes the model feel like a watch you could wear, not a render.

## Videos

There are three videos about it over the years: the [first demo](https://andersonmancini.dev/videos/threejs-smartwatch-demo), the [launch demo](https://andersonmancini.dev/videos/threejs-apple-watch-pro-launch-demo.md) and a [newer concept with source code](https://andersonmancini.dev/videos/apple-watch-landing-page-concept-using-source-code-example).

## Try it

The page is live at [watchpro.vercel.app](https://watchpro.vercel.app/), and the details are on the [project page](https://andersonmancini.dev/projects/smart-watch.md).

## Related projects

- [Smart Watch](https://andersonmancini.dev/projects/smart-watch.md) — Interactive watch landing page with live hands