The Most Annoying Cookie Consent Banner Ever Hackathon
We at Wasp just finished off a fun little hackathon where we asked our users to create the most annoying cookie consent banners they could think of (because cookie banners aren’t annoying enough already, right?). Then we let our community pick the winner in an elimination style tournament on X/Twitter.
It was a lot of fun, and the submissions were really creative, so we thought we’d highlight some of our favorites for you, including the community chosen winner. Check ‘em out below. We hope they inspire you… to… not use them on your own sites. :)
The GDPR Quiz
The General Data Protection Regulation (GDPR) is the EU’s data privacy law that requires websites to get explicit consent from users before collecting their data through cookies.
GDPR is the reason we have cookie consent banners today.
This submission by Cam Blackwood gets to the core of why cookie consent banners are annoying: they force users to make a decision about something they barely understand (or care about), based on a regulation they probably don’t even know exists.
Thanks for the reality check, Cam.
Windows of Time
Do you ever feel like cookie consent banners are UX design pattern from the past? Well, this submission by Lazi confirms that, by sending you through an operating system time machine to a past we’d all like to forget.
Disturbing, yet oddly comforting.
Find all the Cookies
There are some sites that make rejecting cookies a real pain, as if you were trying to find a needle in a haystack, or as if you were looking at a Where’s Waldo puzzle.
This submission by Fecony, Wasp community meme lord, is just that. We find it annoying and fun at the same time, but what we’re not sure about is if it’s even possible to find them all.
Well played, Fecony.
Fresh Batch of Cookies
Most of us probably just smash the “accept” or “reject” button without even reading the fine print. But Henry Boyd is a maniac and with his submission, you have to accept ALLLLL the cookies.
And that’s a whole lot of cookies.
Cookie Management Application Process
What’s more annoying than cookie consent banners? Probably job applications. Well [Wardbox], community builder extraordinaire, combines the best (or worst) of both worlds to make the cookie mangament process even more tedious than you could imagine.
Now all we have to do is wait for the rejection email.
Grand Prize Winner: Gangnam Style Beat
Our community-chosen winner’s submission pretty much speaks for itself.
Make sure you turn on the sound for this one!
🎤 Eeeeh, sexy cookie. Op! op-op-op! 🎵
And there you have it!
Thanks to everyone who participated! We had a lot of fun looking at all the submissions and we’re glad to see that the community is as creative (and annoying) as ever.
And now for a quick PR announcement:
At Wasp we’re working hard to build a modern, open-source full-stack React/NodeJS framework.
The easiest way to show your support is just to star the Wasp repo! 🐝 It helps us spread the word and motivates us to keep building.
The goal here is simple. Make THE MOST ANNOYING COOKIE BANNER you can think of.
Cookie consent banners annoy us all. So we thought, why not have some fun with them? Here are a couple examples of what that might look like:
The Cookie Consent Wheel of Fortune:
The “Hit Enter When the Red Ball is Over the Accept Button to Consent” Banner:
Now it’s time for you to get creative. Btw, if you’re looking for some inspiration, check out these Ridiculous Volume Slider UI’s.
Prizes
2 winners will receive a nice mechanical keyboard, an additional annoying gift, as well as a shoutout on our socials.
The 2 winners will be selected by:
The Wasp team
Our Community (Discord & Twitter)
The community will get a chance to vote in a battle royale style elimination tournament, where two banners will go head-to-head and the winner will advance to the next round.
(The brand/style will depend on the winner’s location, but we’ll do our best to find one with a Wasp look and feel 😃)
Submit your PR before the 21st of October to be eligible to win!
Be sure to join our Discord or follow us on Twitter/X for updates and the final results!
Let’s annoy our users! 🚀
Let’s create the most annoying cookie consent banner and have some fun! This hackathon is your chance to show off your creativity and tech skills. We’re super excited to see what wild ideas you come up with.
Remember, this is all about having fun and pushing the boundaries of user interface design!
I’m a self-taught developer that changed careers during the Covid Pandemic. I did it because I wanted a better career, enjoyed programming, and at the same time, had a keen interest in IndieHacking.
If you’re not aware, IndieHacking is the movement of developers who build potentially profitable side-projects in their spare time. And there are some very successful examples of IndieHackers and “solopreneurs” out there inspiring others, such as levels.io and Marc Lou.
This thought of being able to build my own side-project that could generate profit while I slept was always attractive to me.
So I’m happy to report that I’ve finally done it with my first software-as-a-service (SaaS) app, CoverLetterGPT.xyz, which I launched in March 2023!
I’ll be the first to admit that the results aren’t spectacular, but they’re still something I’m very proud of:
over 5,000 registered users
$203 monthly recurring revenue (MRR)
Below, I’m going to share with you how I built it (yes, it’s open-source), how I marketed and monetized it, along with a bunch of helpful resources to help you build your own profitable side-project.
What the heck is CoverLetterGPT?
CoverLetterGPT.xyz was an idea I got after the OpenAI API was released. It’s an app that allows you to upload a PDF of your CV/resumé, along with the job description you’re applying to, and it will generate and edit unique cover letters for you based on this information.
It also lets you save and manage your cover letters per each job, making it easy to make and apply to multiple jobs without having to keep copy and pasting all your important info into ChatGPT!
What’s the Tech Stack?
CoverLetterGPT is entirely open-source, so you can check out the code, fork it, learn from it, make your own, submit a PR (I’d love you forever if you did 🙂)… whatever!
Because Wasp as a framework allows you to describe your app’s core features in a main.wasp config file. Then it continually compiles and “glues” these features into a React-ExpressJS-Prisma full-stack app for you.
All you have to focus on is writing the client and server-side logic, and Wasp will do the boring stuff for you, like authentication & authorization, server config, email sending, and cron jobs.
For the UI, I used Chakra UI, as I always do. I like that it’s a component-based UI library. This helps me build UI’s a lot faster than I would with Tailwind or vanilla CSS.
For payments, I used Stripe, (I’ll go into the details of monetization below).
By the way, If you’re interested in building your own SaaS with almost the same stack as above, I also built a free SaaS template you can use that will save you days of work!
How I Marketed It
My biggest take-away from this whole project was that open-sourcing it was the best way to market it!
This seems counter-intuitive, right? Why would making the code available for anyone to see and copy be good for a business? You’re basically rolling out a red carpet for competitors, aren’t you?
Well, not quite.
First of all, the number of people who will realistically spend the time and energy launching a direct competitor is low. Also, most people interested in your open-source code want to learn some aspect of it and apply it to their own ideas, not just copy yours directly.
Secondly, and most importantly, the fact that it’s open-source makes people a lot more receptive to you talking about it.
When you present something you’ve built and give people the opportunity to learn from it, they’re much more welcoming! As a result, they’re more likely to upvote it, share it, use it, and recommend it to others.
This is exactly what happened with CoverLetterGPT! As a result of me sharing the open-source code, it get featured on the IndieHackers.com newsletter (>100k subscribers), shared on blogs, and talked about on social media platforms.
And even though it’s a small, simple product, I tried launching it on Product Hunt, where it also performed considerably well.
So, all together, these initial efforts combined gave my product a good initial marketing presence. To this day, I haven’t really done much else to market it, except some twitter posts (and this post, if you want to consider it marketing 🤑).
How I Monetized It
When I first launched in March 2023, I didn’t really expect anyone to pay for the product, but I wanted to learn how to use Stripe as a payments processor, thinking that the skills might be useful in the future.
So I started simple, and just put a one-time payment link for tips. No paywall, no subscriptions. It was entirely free to use with any tip amount welcome.
To my surprise, tips started coming in, with some as high as $10 dollars!
This encouraged me to force users to login to use the product, and add a paywall after users used up 3 credits.
My initial payment options were:
$4.95 for a 3 months access
$2.95 for 10 cover letter generations
That went reasonably well until I implemented the ability for users to use GPT to make finer edits to their generated cover letters. That’s when I changed my pricing and that’s when better profits started to come in:
$5.95 / month subscription with GPT-4
$2.95 / month subscription with GPT-3.5-turbo
Currently, over 90% of my customers choose the more powerful, more expensive plan with GPT-4, even though the 3 trial credits use the GPT-3.5-turbo model.
(I also integrated Bitcoin Lightning payments — check out the repo if you want to learn how — but haven’t received any yet.)
Now, with an MRR of ~$203, my monthly profit of course depends on my costs, which are:
Domain Name: $10/year
OpenAI bill: ~ $15/month
Hosting bill: ~ $3/month
Which leaves me at about ~ $183/month in profits 😀
Future Plans
One of the most surprising aspects about CoverLetterGPT.xyz’s success is that, on the surface, the product is very simple. Also, I’ve done very little in the way of SEO marketing, and haven’t continued to market it much at all. The current growth is mostly organic at this point thanks to my initial marketing efforts.
add more features, like the ability to generate interview questions based on the cover letters
improve the UX and make it look more “professional”
If you have any other ideas how I could improve it, drop me a comment, message me on twitter/x, or submit a PR to the repo.
Final Words + More Resources
My intention with this article was to help others who might be considering launching their own SaaS product. So I hope that’s been the case here. If you still have any questions, don’t hesitate to ask.
Here are also the most important links from this article along with some further resources that will help in building and marketing your own profitable side-project:
