I love Bubble… I’m new to it but I see the value, I understand the power and I am very close to completing my first app!
But my biggest pain point by far is responsive design!
It is so poor, so unintuitive and I honestly spend countless hours trying to achieve such basic things that in Elementor or any other builder would take no more than 5 minutes!
It’s beyond shocking in my opinion and I honestly believe that it is the single biggest obstacle that stops adoption of the platform.
If I wasn’t already so invested in Bubble then I would be looking at other solutions.
With difficulty comes opportunity and the steeper the learning curve the more opportunity that creates for me but after spending at least 6 hours on a menu that still doesn’t work I can’t help but wonder how on earth everybody else copes when it comes to responsive design in bubble and does it get easier with time or is it the bane of everybody’s life and not just mine!!!
I agree… Bubble is an amazing platform and I am not adverse to investing everything into learning a platform but I swear the responsive engine is truly killing me!!!
Hey @shaun, I’ve definitely been there with those “banging my head against a wall” moments… But very worth it once you get the hang of it. If you have any specific questions happy to help.
Spend a lot of time in the responsive editor messing with min/max widths, alignment, and groups. Showing/hiding groups based on page width is nice. But when I want something to look really nice no matter the screen size, I still find creating separate mobile/desktop pages worth it on Bubble.
I’ve been using Bubble for a long time and am also a front end web developer and I agree with you.
After you work with Bubble for a while you’ll have your own library of responsive widgets that you can just add to the page. So the pain point will be vastly reduced. You’ll still need to adjust occasionally depending on data/image size but 99% of the time you won’t need to put that original effort in anymore!
I think it’s just a lot complicated to explain and make it clear to understand. This start from how to group element and manage space between them to how to manage min and max width. Add when you need to consider creating specific elements to show on mobile and other to hide (like menu). And each element may have different setting too (like keep aspect ratio for image, how you manage text when it become shorter, RG cell min width…)
And to be honest, the Responsive builder is not easy to work with.
But there’s some logic behind that that it’s all related on how Bubble work to render your app. (Look in Dev inspector to see code of the page and see how Bubble work a little bit more, this can help you understand some stuff on the responsive side). (R-line, R-box for example…)