Prototyping my first product

Prototyping my first product
Photo by Matt Artz / Unsplash

This post follows up part 1 about what HouseHeld is and why I've been working on it. You might want to start there.

Fortunately, I’ve spent the last decade working directly with some wildly talented founders and investors. I read the Lean Startup the year it came out (HOW WAS THAT TWELVE YEARS AGO) and I’ve seen companies fail for the wrong reasons and the right ones.

As a result, I decided to try and find out what I didn’t know.

Step 0: Questionnaire + user interviews

Obviously you shouldn't try and make anything people don't want. So step was was distributing a questionnaire aiming for friends of friends to get under the skin of the problem.

I didn't appreciate how exciting it would be to start getting real insights and info from people around the subject area.

Step 1: Figma (for user research)

The journey began with Figma. And boy, what a beautiful way to bring something to life. I couldn’t believe how quickly and easily you could get a truly tactile prototype together. Hours, if not minutes, to validate the feel for something.

Indeed, as I’ve moved onto nocode prototyping, I definitely notice my mentality and creativity is slightly shackled by knowing it has to actually work behind the scenes.

Figma was enough to get something together for user research (watching + interviewing people who opted in during my questionnaire research.)

But, both for my product-learning journey and for my validation, it just felt a bit too light. And, just as importantly, I was learning so much about which features leapt out, what features complemented them, how we might actually help people GET THINGS DONE.

Step 2: Softr + Airtable

A short phase, really dipping our toe in the water with real NOcode (emphasis on the no.)

Key observations were that there was something great about being able to quickly take photos on mobile in Airtable. In MVP terms, it didn't quite feel like I could give it to a user and learn enough.

In retrospect I also find it interesting how the tools you're using shape how you see what's possible in the product. Figma is such a blank canvas, and "native" mobile feel that it really felt like making a sophisticated app. The limitations of Airtable had the opposite effect.

Step 3: Webflow

A great recommendation from Dharmesh. I think about a week’s work went into building in Webflow, which helped with doing more user demos. Ultimately though, it felt clear after a point that it was focused more on how things looked than how they truly worked under the surface.

I learned a lot about different design directions at this stage. But feature-wise, I started to but up against what was possible for doing deeper tests with users. I couldn't really leave them with a version of the product to try over time.

Based on what I was learning, it felt like the right time to go deeper and explore more of the functionality space.

Step 4: Bubble (+ GPT)

What a difference. Bubble is a beautiful monster.

Having the database built in has taught me so much, made me think about data types, the relations between them, how you can fudge things using them in multipurpose ways.

The first version in Bubble felt like the first one that was a real thing. It was also a total mess, as the result of building and learning at the same time.

Version 2 explored more features and a more sophisticated navigation, rebuilt on a Sunday morning while looking after both my kids. It split Pros into their own tab, bringing the idea of a contact book way up the hierarchy (based on insights from my user interviews.)

Version 3 came about after a week away from Bubble and returning to prototypes in Figma. In a research interview, it struck me how much of the value was fragmented and all over the place, almost hidden away. A timeline view would put it at the heart of the experience, bringing actions all the way up to the surface.

What people wanted wasn’t to press ten buttons to achieve the useful thing ten times. They wanted to just get the useful value, more or less automatically.

Building the third version with more discipline (no placeholders - nothing new goes in until everything there already works) also lead to a startling realisation: the product works. It’s done.

This has been maybe the most shocking aspect of the process so far. I have something that does what I set out to design. And so many more cool things. And with more on the roadmap to come.

Next time I’ll speak about what’s in the product and why. What’s dropped, what has changed through the process.