Building An App In 30 Days — Is It Even Possible?
Follow my journey from non-programmer to creating my first no-code Bubble app
Day 0 — The Story Begins…
I run a social enterprise called UniRise — we help disadvantaged students get into top universities. Mentors, personal statement reviews, course recommendation algorithm, etc.
Everything is 100% free and we’ve helped ~9000 students so far.
But this year we want to 10x to 100,000 users! And launch a bigger, better, more bad*ass tech platform.
No more Typeform, Zapier, Teachable. We want something custom-built.
But when we reached out to developers, the lowest quote we got back was £25,000…
So now I’m building it all myself on Bubble.
Today I mocked up the designs in Figma (the most intuitive but versatile design software I’ve ever used):
I feel like what we’re building is so simple! But the developers we’ve spoken to have spooked me out with their £X0,000 quotes and technical jargon…
I just made my Bubble account.
Starting to play around with the software.
Their tutorials are amazing! Like the best tutorials ever.
Day 1 — I’m actually making sh*t!
Today I finished Bubble’s tutorial content!
I made all sorts of cool things like a simplified Instagram, a song library search tool and this shopping list app.
I think very logically so always felt like I’d make a good coder…but every time I’d tried before, I get bogged down by the /// and <>:; and I never get anywhere…
I remember wasting £200 and 10 hours at a coding boot camp in my first year at university just to learn how to publish an ugly af HTML homepage.
My first day on Bubble and I’ve built a login dashboard, integrated a Typeform survey, and laid out the application infrastructure.
Check it out 👇
What makes Bubble so easy-to-use is everything is plain English!
Instead of having to code out a confusing if/then statement and storing stuff in databases, you can add workflows to Bubble like:
“If user clicks this button” → “Take them to this page” → “Increase progress bar fill by 12%”
It’s so easy as soon as you strip out the :://<> jargon.
The main difficulty I’m having right now is integrating Typeform and Bubble…but we’ll deal with that tomorrow.
Also, I think I’m addicted 👀 I got back home at 1 last night and stayed up till 3am no-coding…
Day 2–Typeform, I’d like to introduce you to someone…
Today I spent the first half trying to get Typeform to “speak” to Bubble.
Unfortunately there’s no good direct integration, so I investigated Typeform Developer APIs etc. but got scared so started looking for an alternate solution.
And what I found
Day 3— 2 functions, 1 button
Today I built my beautiful progress bar!
So now as students work their way through the course, they can see their live progress up top.
Check it out 👇
I also ran into some difficulties getting around the infamous 2 functions, 1 button problem.
Basically: when you click Complete Lesson the first time, I wanted the progress bar to fill up, the button to go green and the student to move onto the next lesson…but if they clicked the button again it would “uncomplete” the lesson, reversing the student’s progress etc.
With the help of Bubble’s insanely responsive forum, I found a solution!
After the first button click, Bubble would change the variable M1L1 to take value 1.
I then attached a condition to the button, stating that if M1L1 is already 1, then another click would change M1L1 back to 0.
So when students first click the button: M1L1 goes to 1, the button goes green, and the progress bar fills up.
But second click: M1L1 goes to 0, button goes grey, and progress bar reverses — all triggered by the different values of the M1L1 variable I made.
Day 4— make art, not tech
Check out the new dashboard 👇
Still a work in progress but kinda peng right?
The beautiful thing about no-code is designers get total control over their product!
As an artist, I’ve always felt frustrated when building tech products.
I’d have these beautiful visions in my head…but when I communicated them to developers/technical cofounders, they’d come back (usually several weeks of development later) with designs that made me 🤢
Amazingly talented coders, they just didn’t have the design skills…
But even when communication was crystal clear, the spark always missing.
Now that I’ve got 100% creative control, the spark’s back!
Instead of handing over design sketches and praying for the best, I’m constantly iterating and redesigning on the go.
Our signup page started off a boring email/password form; now it’s Harry-Potter-themed with beautiful testimonials on the side.
And the main dashboard (see below👇) is space-themed; with colour-coded graphics to match our company colours.
It’s these little touches that (for me at least!) make a product truly special; when a product goes from tech utility to emotional experience.
But maybe that’s just me 🤷🏽♂️ would love your feedback on the designs!
Today’s lesson: make art, not tech!
Day 5— Nikes on my feet, the cipher’s complete
BOOOM! The whole platform is now functional👇
Thanks so much to Rob Blake — my Bubble coach — who in just an hour transformed my understanding of database structures and turned a 100+ page product into a 3-page design! 😂
Not sure why I look so red in the video but super excited now.
With 25 days left in the challenge, I’ve increase my ambition and will be building some insane new features like our Course Explorer and Viral Referral Engine 😎
Day 6— Back to the drawing board
With the core platform taken care of, I’ve turned my attention to our course explorer.
You’ll be able to explore every course in the UK and watch day-in-the-life vids + honest interviews with current students; find out what grades successful applicants commonly have, campus tours, application guides and so much more!
We mocked up a version in Notion^ a few months back as an MVP and students loved it!
But the UI sucked, and within the parameters of a static Notion page we couldn’t really deliver on the promise of “one-stop-shop” for university application information.
So I’ve spent the day mapping out our new and improved course explorer.
The rough designs are BTEC af (I know):
But I’ve taken inspiration from Airbnb and other UI beasts.
This is an important point for edtech founders. Almost all edtech products I’ve seen look ugly af; I think it’s because a) “it’s education, who cares about aesthetics” and b) edtech founders just copy each others’ platforms (lol) so they all end up looking equally meh.
Obviously there are exceptions (Duolingo, Masterclass) but everything else is just unsightly 🙊 (Teachable, Coursera, Applyboard — yes I’m throwing shade, sorry not sorry)
Day 7— Back to endz
I’ve now got the backend set up for our course explorer:
I’m using AirTable to store all our content, and I’ve synced it up to Bubble so it’ll just pull content from AirTable and display for our users.
You can think of AirTable as Google Sheets on steroids. And with ~50 million data points to be added to our content database…I wanted to use a tool designed to handle those data quantities (not Bubble’s native database).
Day 8— First roadblock
Today is the first day I felt out of my depth:
A stupid problem with this “fuzzy search” plugin I’m using is screwing everything up and now I’m wasting time connecting up APIs.
The documentation for these APIs is awful and obviously written for technical people so I’ve literally spent all day just googling term after term: bearer token, API connector, GET request, private key header…ugh!
Update: I decided to return to the problem just before midnight and found an uncompromising workaround using God’s best friend, Zapier ✌️
Thank you no-code universe 🙏🙏🙏