DEV Community

Andrés Clúa
Andrés Clúa

Posted on

That Side Project You Abandoned? I Finally Finished Mine.

#react #ui #webgl

We all have one. That side project you started super excited, thinking it would be the one. You set up the repo, picked the stack, maybe even bought a domain. And then... life happened. Work got crazy. A new idea came up. The project just sat there for months.

This is the story of how I finally finished mine.

Last year, I stopped by Hotel Domine in Bilbao to grab a bite. The lobby has this crazy clock on the wall. I stood there like an idiot for five minutes, watching the hands move together to form numbers. I later found out it was inspired by "A Million Times" by Humans Since 1982 — an art piece where hundreds of analog clocks work together to display time. Each small clock does its own thing, but together they show something bigger.

I was hooked. I had to build a web version.

I started the project that same week. I went with React and Vite — not my usual stack at all. I started with Angular 1.6 **(yes, I'm that old), quickly moved to **Vue and never left that ecosystem. These days I mostly work with Astro. Playing with time and dates is one of the first things you learn as a developer, right? So building a clock in React felt like a good way to get familiar with it without getting too deep. I had a basic grid of clocks working in a few hours. This was going to be easy!

Then I didn't touch it for almost two years. Sound familiar?

The problem wasn't motivation. It was that weird gap between "it works" and "I'm actually proud of this." That phase where you're moving pixels around, questioning every decision, and wondering if anyone will even care.

What Finally Got Me to Finish

I'm not going to lie, there was no magic moment. What worked for me was simple: I made it smaller.

Instead of building the ultimate clock with every feature I could think of, I focused on:

  1. The main thing — Mini clocks with two hands that rotate to form digits
  2. One animation — A nice entrance when the page loads
  3. One extra detail — A WebGL background that reacts to mouse movement

That's it. No settings. No themes. No "export as GIF." Just a clock that looks cool.

The Technical Stuff

For those who want to know how it works:

The Clock Grid:
Each digit is a 3×6 grid of mini analog clocks. Every mini clock has two hands that can point anywhere. By setting the right angles, you can "draw" numbers:

// Each position is [hourHand, minuteHand] angles
const digitPatterns = {
  0: [
    [TL, H, TR],  // Top: corners + horizontal line
    [V, D, V],    // Vertical lines with fill
    [V, D, V],
    [V, D, V],
    [V, U, V],
    [BL, H, BR],  // Bottom row
  ],
  // ... more digits
};
Enter fullscreen mode Exit fullscreen mode

The Entrance Animation:
GSAP handles the staggered reveal. Each mini clock scales and rotates in from a random position:

gsap.fromTo(miniClocks,
  { opacity: 0, scale: 0, rotation: -180 },
  {
    opacity: 1,
    scale: 1,
    rotation: 0,
    stagger: { each: 0.03, from: 'random' },
    ease: 'back.out(1.7)'
  }
);
Enter fullscreen mode Exit fullscreen mode

The Background:
Three.js with particles. They float slowly, but when you move your mouse (or tilt your phone), they react. It adds some depth without distracting from the clock.

What I Learned

1. Done is better than perfect

I could have spent another month adding features. Instead, I shipped something that works and looks good. The "just one more thing" mindset kills projects.

2. Limits make things easier

Having only three things to build made every decision simpler. Should I add dark mode? No, it's not on the list. Should I add 12-hour format? No. Move on.

3. Side projects don't need to be useful

This clock has no practical purpose. Your phone already tells time. But building something just because it's cool is a good enough reason. Not everything needs to be a startup idea.

Try It

The clock is live at clock.andresclua.com

Move your mouse around (or tilt your phone) to see the background react. Watch the seconds go by. Maybe stand there like an idiot for five minutes, like I did in that hotel lobby.

And if you have your own abandoned project sitting in a repo somewhere — maybe it's time to make it smaller and ship it.

What's your abandoned side project? Drop it in the comments — maybe we can push each other to finally finish them.

Top comments (0)