From Pixels to Purpose: The Tinybeans Design Story

Tinybeans App Clone

I cloned by favorite parenting app that we've been using for more than 7 years. The first page took forever as I was fighting with icon customisation and boolean operations while obsessing over pixels. But by page five, I wasn't struggling anymore and focused on designing. The difference? I understood why the app made the choices it did such as the key navigation pages and overlays to support those functions.

The Real Learning

I cloned the welcome screen, login page, the social feed, calendar view with upload function, and the notifications feed. The biggest thing I learned is that good design solves actual problems. Tinybeans says 'loved your moment' instead of 'liked.' That's not just copy as it changes the entire vibe of the app. It tells you this isn't about metrics but key personal events that are treasured. It's about families caring about each other. Once you see that, everything else makes sense.

My speed in cloning the app didn't matter as I progress due to the fact that I start to understand the design thinking behind the app. But it's hitting 2 goals in 1 stone as I develop both my design and thinking skills in 1 go.

Compare the Before and After with My Prototype Link

Here's the link to the UI design wherein the odd pages are the originals while the even numbers are the clones: Click to open the Prototype here