How I Hit #1 on Product Hunt in 2 Weeks
Take a look into how Botroast.io reached #1 Product of the Day after launching in just 2 weeks
For 2024 I’m building 12 products in 12 months.
So for February, as part of the Indie Hackathon, I built and launched BotRoast.io, a simple app that gives you design feedback in 1 click.
This app took me 2 weeks from idea to launch, and it ended up hitting #1 Product of the Day on Product Hunt.
Follow along and I’ll share some insights on how I launched Botroast.io, and the experiments I’ve been running for it.
Ideation
Leading up to the start of the Indie Hackathon, I had kicked around a few ideas of what I wanted to build.
Pretty much every time I would scroll my Twitter feed, I’d see somebody asking for others to “roast” or provide feedback on their landing page.
That’s when the lightbulb went off.
With GPT Vision models becoming more and more available — why not just use AI to roast your landing page?
Save time and money.
This project would also fit well within the scope of the Indie Hackathon, where each participant has 4 weeks to make their first dollar from their project.
A kinda-stupid-but-kinda-cool project to hack on that I could monetize in some way.
And funny enough, one night as I was working on it, I saw this tweet from Tony Dinh that really made things click.
The more you build and experiment, the more you’ll begin to identify things that work and things that don’t.
Prototyping
My first thought was “let’s see if this thing is even possible”.
The initial prototype was dead simple.
I made an API request to OpenAI’s GPT 4 Vision model, passing in the prompt and the URL to a landing page screenshot.
Since I hadn’t messed around with any of these vision models prior to Botroast.io, it was mostly just a matter of tweaking the prompt a number of times to get the output close enough to what I had envisioned.
Soon after, I was able to get an output that I could build an MVP with.
MVP functionality
The goal here was to keep things very simple, just as I did with the prototype.
The MVP would let the user:
Enter a URL
Click a button to start the roast
View their roast when complete
Under the hood, in order to enable this functionality, I had to:
Configure a simple API to accept the landing page URL entered by the user
Capture a screenshot of the landing page
Pass the screenshot to the GPT Vision model along with a prompt
Format the response from the AI model
Return it back to the client
All things considered, this was pretty straightforward stuff.
I opted to use a stack I’ve never tried before — the T3 stack.
Overall, it was fine. It just wasn’t my usual stack so I naturally moved a little slower.
It was easy enough to setup the roast tRPC procedure (essentially an endpoint) that would accept the URL provided by the user.
I also got authentication out of the box since the T3 stack uses NextAuth.js.
Next I needed a way to automatically capture a screenshot of this user-provided URL.
Now — I could’ve opted to go with an image upload input that would allow the user to manually upload their own screenshot, but it would’ve added more friction to the user experience.
It was just “one more thing” for the user to do, and naturally some people would drop off and not do it.
So instead, I decided to automate the screenshot capture.
I’ve been following Dmytro Krasun on Twitter for some time now, and he’s always sharing interesting insights into what he’s building. His main project these days is ScreenshotOne.com and so it immediately came to mind when I needed to automate screenshot capture for my app.
Super easy to use, and within 5 minutes I had a core piece of my MVP working.
I also wanted a way to store the screenshots, so I configured an S3 bucket on AWS, and automatically uploaded the screenshots to my bucket after capturing them with ScreenshotOne.
Next up, I needed to integrate with OpenAI’s API.
Another simple API call, passing in a prompt and a URL to the screenshot.
This was mostly just prompt engineering (*cringe*) a.k.a a ton of trial and error.
After getting the model’s output mostly to my liking, I needed to parse the OpenAI response and return it back to the frontend.
But because GPT-4 Vision doesn’t support structured JSON output (yet), I needed to get creative with my prompt and my parsing logic to massage the data into a predictable and reliable format.
I found that giving the model an example payload of the output your expecting goes a long way here.
And yeah, that was mostly it.
At this point, I had pretty much all of the functionality I needed for a user to successfully roast their landing page in 1 click.
Monetizing this thing
This wouldn’t be an Internet Money post unless we talked about monetization.
For Botroast.io, the clear path to monetization was to charge for roast credits.
So I integrated Stripe Buy Buttons along with a webhook so that users could purchase credits to roast their designs.
Baking in virality
Roasts in general strike me as something inherently “shareable”.
Bot roasts, even more so. They’re automated and fun.
I felt that people would naturally just want to show off their roasts on social media and share them with friends because it was a funny, novel thing.
Then their friends would sign up, share their roasts, rinse, and repeat.
Especially since the roasts had scores on them, people could brag or make fun of themselves.
Not to mention, both parties earn free roast credits with a referral.
Easy enough.
At the time of this writing, BotRoast.io has 1,285 users and 17 of them signed up via a referral code.
That means just over 1% of sign-ups have come from a referral link so far.
My initial reaction is to say that adding the referral code functionality was a bust, but I think it has mainly been a miss on where I’ve placed referral links for sharing and sign ups.
This is something worth experimenting with for sure.
Nonetheless, a lot of people have still shared their Roast Reports as I expected they would.
I don’t have hard data on this, but I’ve been tagged in a number of tweets and seen a lot of Roast Reports shared, which is a good sign.
Eat with your eyes first
Most picky eaters know this.
We, as humans, “eat” with our eyes first.
Our perceptions are largely influenced by appearance, whether it’s food or products.
Probably more than we’d like to admit.
I spent a lot of time putting together a fun brand image for Botroast.io, starting with the name.
A play on pot roast, a delicious food — but instead, it’s a bot…that roasts.
*Cue the laugh track*
I took my time curating the colors of the site, the fonts, and the design assets to make for a cohesive, fun, and almost sarcastic brand.
You might argue that none of that matters, but I beg to differ.
A cohesive brand greatly enhances the perception of your product, especially nowadays.
As they say, the devil is in the details.
And by the way, I wouldn’t consider myself a “good” designer.
There’s plenty of design theory and best practices I’m not privy to.
But I have built enough things on the internet where I’ve been able to sharpen my eye for design and come up with some semblance of my own style over the years.
As they say, the devil is in the details.
Balancing act
If you’re building an MVP, by definition, you can’t — and shouldn’t — spend time on things that don’t matter.
But it doesn’t mean your product shouldn’t be polished.
If you’re launching on Product Hunt, there’s a lot of stiff competition out there, so to stand out, you should sweat at least some of the small stuff.
But of course, you’re left with a decision.
How much time do you spend on the “other” things?
The things other than your core feature set.
That’s up to you at the end of the day, but the more of those finishing touches you can add to your product, the greater returns in perceived quality you will get for your MVP.
Just be sure to strike the right balance.
Don’t enter the territory of diminishing returns.
Don’t delay your launch because every pixel isn’t perfect, every feature isn’t working 100%.
Stick to the 80/20 rule.
Don’t enter the territory of diminishing returns.
The stats
So far, BotRoast.io has:
3,100+ unique visitors
1,285 registered users
1,574 total roasts (1.22 roasts per person)
3 paying customers totaling $47 of revenue
17 users registered via referral code
Experimenting a bit
I would love to have made more sales so far, but it’s likely because the product in it’s current state is just not compelling enough.
For the initial launch, every user received 3 free roast credits.
That’s probably more than enough for the average person to never need to pay for a BotRoast ever again, or at least for a long time.
So last week I ran an experiment.
I made it so new users would not receive any free roast credits upon registering.
Over a 1 week span:
42 new users registered
1 new paying customer for $9 revenue
This boils down to a 2.38% conversion rate.
Now, contrast that with the first 1,243 users accounting for only 2 sales at a 0.16% conversion rate.
That’s a 1,387.5% increase!
Ok ok, this is such a limited amount of data that it’s hard to really say for sure whether or not this will continue, but I like where it’s headed!
Here’s to some more internet money for all of us!
Stay tuned for more posts like this where I share insights on the products I’m building, and the experiments I’m running.
Loving the format! And loving your eye for design! Good luck on your April project!