I’m curious if anyone else has done a prototype in Anvil and Bubble and come away with thoughts, specifically regarding the responsiveness of your app.
i was originally leaning towards signing up with anvil b/c i really like the VB6-like approach, and it’s responsive out of the box (allegedly?).
would it be fair to characterize Bubble-built apps as being “Responsive by default, and customizable for fine-grained mobile/responsive settings”?
has anyone else compared the two services?
as a long-time, super-cranky, pseudo-app-dev who basically hates coding and garbage technology, i’m really psyched at how far the tech has come – specifically anvil and bubble.
Getting responsive right in a Bubble app can be a frustrating endeavor. At least it was for me since there are quite a few variables per element to take into consideration. Apart from some quirks where a transparent group element is needed to align certain groups of data, it is a matter of being very precise in the positioning of your elements and making sure they have the same minimum and maximum widths (especially for data tables).
In addition to the responsive editor, another big plus thans to Bubble’s flexibility is that you can also just create a different layout and show this depending on the screen width using a condition. In some cases I want to use a completely different layout in mobile view and this comes in very handy.
I don’t have experience using Anvil but a large chunk of my app is responsive and it looks great to be honest. To say it has responsiveness out of the box may be a bit too much but once you understand the mechanism its not that hard
so to fix, i went thru a couple more app starts and now think i know to select ‘centered’ and then go back and make the page ‘not fixed width’ to be able to see what it looks like on mobile, which allows the page to be responsive, which is what i would have thought i was getting by default, whether we call that ‘centered’ or ‘mobile’ or ‘not centered’ or something else.
i’m obviously missing something.
so this below, to me, looks normal. it looks good. it looks like…a good, default, out of the box look/setting. it is centered, and not fixed width – which is not mobile in bubble because it’s centered? or because it’s not fixed width?
def interested in building web apps, but responsive web apps.
i know i’m missing something. setting a custom size width and using fixed or not – all of that seems…weird. i mean i guess it’s possible that bubble was designed to not work on mobile, but i’m not buying it.
there’s gotta be something else. maybe the default bubble app is ‘weird’ – designed to be used only on a fixed width device – say, only desktop – but…there’s got to be something else.
I’m not sure what the problem is? You can start from scratch and put some elements on a page to see how it looks without investing anything in terms of workflows and databases.
Responsive works very well. There is just a learning curve to it.
if it is then true to say that Bubble is not responsive by default, is that going to change at some point?
if nothing else, it seems it would drive adoption, drive down support, etc.
i think i figured out how to get a text element to center, and stay centered across screen sizes, and it’s something like:
on that text element, set a max width — this prevents the element from growing in width, even whitespace to the right of your text, as your screen width increases. something about this just seems wrong. i guess i could see an argument being made if the text element grew in size in proportion to the size of the screen, whether heigh/width, aspect ratio, etc., but whitespace to the right?
on that text element, set a min width – this prevents your “hello, world” text element from collapsing into a 1.5 characters on two lines:
He
Wo
There should not be a separate ‘Responsive’ tab. The functionality should just be built into the the UI Builder tab. So now you can get rid of the tabs altogether.
The error message you get when clicking on the ‘Responsive’ tab is not proper English – not a crime – but it’s confusing. It’s also confusing just because the idea/framing/semantics of using a ‘Responsive’ tab is misleading. Responsive means…your page/app/elements are responsive. A viewer is just a viewer. I’d call it ‘Viewer’. I’ll suggest an edit:
Original:
“The page index is set to be fixed-width. That prevents your page to adjust to the width of the page and to use this view.”
Fixed:
“This page, ‘index’, is set to be fixed-width. We are not going to allow you to view this page in the Viewer tab because then you would be able to see what this page looks like on a device of different sizes. If you would like to see what this page looks like on devices of different sizes, please click here and uncheck the ‘Make this element fixed-width’ checkbox.”
Bubble should change their default apps to be responsive – not ‘Fixed width’.
Text element boxes should wrap text, growing the box if necessary, by default, instead of text being cut off.
Allow dragging of elements into the page. Show text being typed on the page as you type it.
Show horizontal/vertical “this element is now centered!” guides (like Mac Keynote, Anvil, etc.). This is a big time-saver, bomb feature, etc.
Allow changing ‘index’ to…whatever we want. ‘index’ is a nerdy/techie thing. Allowing name changes is better for newbies. And, why not.
Snap elements to edges vs. Snap elements to grid – if it’s one or the other, it should be a radio button set, not a checkbox set.
The ‘Appearance’ panel moves laterally slightly – couple of pixels at a time, which is…probably/hopefully not supposed to happen. Maybe just my small screen.
The default width is 980 px. There are 24.33 (or so) boxes across the page. That gives us 40.3 px per box. Why not make that number of boxes across…24. Or 25. Or 37. Anything but 24.33. If you need to change the 980, change the 980. Make it…960 px, at 40 px per box. Maybe 24.33 is industry standard. No idea.
For text elements, apply a max width by default. And min width. Or just make it fixed width. Otherwise your text element does not stay centered by default. It’ll collapse to garbage. etc.
================================================
To say it has responsiveness out of the box may be a bit too much but once you understand the mechanism its not that hard 
