Hi Hackers 👋,
Bubble is the clear leader in the no-code space but designing in the editor is a known challenge, especially responsive design.
Story time 👇
I've been working with my colleague James over at Buildcamp to help people build better and more beautiful Bubble apps. We were the pioneers of the popular Bubble Design Camp where we teach Bubblers the ins and outs of design, be it brand, layouts or responsive design.
While working with James on various projects, I wanted a way to standardise the way we design within Bubble. James had his way, I had my way but I'd admit, his way was better. So we setup an internal design system and tried to follow that as closely as possible.
Following a design system is one of those challenges where it usually starts well, but people tend to slip. I also found myself spending a lot of time on Slack messaging asking James what to do in certain situations that were undocumented. How should we handle this behaviour, how should we process these images...
Over time I become dissatisfied and wanted something better to aligned our design output.
Hello Frames! ⛹️♂️
I noticed other teams in the Bubble community had created chrome extensions to essentially allow users to copy and paste pre-designed elements straight onto the canvas. Bingo! This could work at team Buildcamp and would hugely increase productivity and reduce design inconsistencies.
We set straight to work to build a Chrome extension that would enable James to design sections and pages, save them to a panel and let me or other users simply copy them onto the page. After about 3 weeks development, we had our prototype. It was tricky to build as we were in effect having to figure out how Bubble worked under the hood. What an education!
I thought to myself, this works so well. Why keep it to myself. So we decided to gift the Bubble community with the product for free. With a button click, they get access to beautifully designed and perfectly responsive sections, forms, repeating groups...you name it.
After a short alpha test, we received some feedback. A week later we went to production, let Twitter know and bam, 1,000 downloads in 3 weeks. We might be solving a real problem here.
You might be asking yourself, cool but it's free. What's the plan? Our plan is to gather feedback from a large sample size. Throwing up a paywall stunts early growth. Do we need money now? No we don't.
Frames will remain free as long as possible. Frames is not only saving Bubblers a huge amount of design time, it's also an educational tool and users are free to pick apart the elements to see how we designed them.
Shoot me your questions!