I am wondering who, if anyone uses the mobile first design methods?
If yes what are the benefits you find?
If no why not? what are the drawbacks?
What limitations does one find in designing this way?
I haven’t used this yet but am thinking that it might be a way to go seeing as most people are accessing webs and apps from mobile devices these days so basically it seems nearly all apps must be made mobile responsive and from what I understand of Mobile first design it is easier to from from mobile to desktop rather than the other way around. Is there merit in this statement or is it 6 of one and half a dozen of the other?
Looking forward to hearing peoples thoughts and experiences with this and what you have found to work best for yourselves.
I think that is a personal choice. Everybody’s mind works slightly differently, so to grasp how to tackle either approach would largely depend on how your mind approaches it. For me personally, I find design for desktop first, then allowing that design to decrease is far easier, since it is easier for my mind to comprehend how to make multiple elements that are on the same horizontal plane, to stack and move to the next ‘line’ when the page width decreases. I also find it easier to see when elements need to stop allowing their width to decrease and when it is necessary for force a page break when I take the larger width and decrease it, as well as easier for me to see when elements need to be removed.
Not many in my opinion
For me, it is hard to imagine how to take the smaller width design and expand it properly to still look good.
Often the desktop version is just a wider mobile version with larger margins on the sides. Or the desktop version lacks features it could of had, but since starting from mobile version first, maybe things that can be added go unnoticed. Again, I personally find it easier to have a desktop version first, and to remove things that don’t fit or work for the mobile version.
Everybody is different. I suggest trying out both approaches to see what you are comfortable with.
Most people if not all, including myself, are time and again surprised by how little people read and if they read how many will not understand what you are trying to say.
One of the hardest parts of successful products is to make it so simple, so logical with regards to UX/UI that people simply love to use it.
Making something simple is very very very hard. It pushes you to think about the importantce of something. What is really important and what is not. How can you say something in 5 words in stead of 10. What icon to use that is understood by all. How can you use colors, images, icons, font weigth etc to tell a story without writing a single letter.
All those things will be even more challenging when you only have so much real estate to work on. If you need to do all of the above on a small mobile screen it becomes even harder pushing you even more.
Once done, you can decide to add convenient things for a desktop design. But be carefull. A clean view on your product, showing of its power features in plain sight because there is nothing else will do wonders.
In addition to what the others mentioned, the idea of mobile design first is to limit the site to the basic features and prioritize what is needed and what not. It helps you keep the site small and fast, since this matters for UX and indexing. For a website this makes more sense than for a web app or saas solution (since these last two are more focused on what does the app need to do for the user vs. how to get my message across / how to get them to buy my product).
So it is not just starting with mobile or desktop first and creating a full featured website or web app with a lot of elements that will or will not be hidden. It is really designing you site or app to be as lean and mean as possible.
Two things to consider:
Mobile first design was introduced around 2011 and the world has changed, faster devices, internet, new web technologies etc.
Google switched to mobile first indexing, so the overall quality of your mobile site matters most for your ranking.
Thanks for your thoughts here @boston85719. It’s an interesting point of view and in my limited knowledge and understanding of UI/UX design as well as responsive design (I would consider myself maybe just past a beginner level bubbler at present) I find myself thinking on these points you made. And they do make sense to me
Thinking about how to build for a small screen and then how that will look on a full size desktop screen seems to feel a little more complex for me as well. I am also aware that people seem to be comfortable with the way they were taught or learnt to do something (in regards to anything) and thus changing to a new style can seem daunting.
I appreciate your input and look forward to seeing other points of view for and against
Thanks @sem, so are you saying that by designing with mobile first one can (possibly) build a more streamlined and structurally minimal app yet that still performs all the same tasks and features (within reason) as a full desktop app?
i think I understand your thinking and point of view on its very difficult to make things simple… I am often finding myself thinking " am I adding too many elements here? , can I reduce some of these parent groups and do what I want to do in a different way?, maybe use more conditionals rather than an extra icon in another row group" for example.
Do you have a “best practices set up” you use for mobile fist design? Such as go to sizes page breaks when to hide etc. any resources you might be able to recommend folks read?
So do you feel that in this day and age mobile first is less important than it was back in 2011?
I understand the importance of lean and streamlined but this (should in theory, if I’m not mistaken) be what all developers are striving and aiming towards in anything they build.
Maybe mobile first is just forcing them to not be complacent and take the easier road rather of less lean and streamlined?
I also understand that there may not be a right or wrong answer to these questions or original post and that it can be very individual as to what works best for that person. I’m just interested in people’s thoughts and I/we might also learn something new that can better suits us
Same here man, a lot of very bright people on the forum, very interested in their take and experiences, tips, tricks etc. Actually, maybe a topic should be made with the best posts/books/courses, categorized and pinned to the top in Tips. @fede.bubble, would it be possible to pin such a topic to the top of the tips category? For example a couple of months ago George created a topic about the info your app exposes, a must read for every Bubble developer. But because new topics are created these older topics get pushed down. Other examples, Petters book on security or Flusk’s privacy rule / security scanner.
For web apps, it really depends on the intended use of the app, mobile and/or desktop.
Definitely, but developers are a vain species (or maybe humans in general) , we like to show off. Also, when an app ages there will be an increase in technical dept (not always due to the developers, stakeholders want things done fast and cheap).
I don’t think so, it does not force you. Whether mobile first, responsive or another method, the easy road is always there man, tempting you (it is like dark side, come join us ).
Generalisation is simple but often not 100% true ;). Because some use cases need real estate to be able to work good but in general I would say that almost all use cases can be made to work good on mobile. Also good to know that most research I read about the amount of features in software not being used by the users is around 80%. So if you know what features fall in those 80% not being used you can already reduce 80%.
In the end it comes down to really understanding what you are trying to solve, who cares about it and how to deliver that solution as quickly as possible.
That’s a great idea for the pinned best/ important/ popular post or even of they could be added into a category of best/ important/ popular posts so that folks could just search that category, as if there are a number of them over time I can image that eg 25 of the most popular pinned posts at the top of the thread could become boring to scroll through for a user haha.
I’d be interested in reading those posts you mentioned, I’ll try and find those. And I have Petter’s book on bubble performance and also privacy… Both very good a fountain of info and knowledge there. Don’t know about Flusk’s privacy rules but I’m about to
And these again are fair points you make. As well as we all know the dark side is tempting haha.
Wow I didn’t know about the 80% not being used… Knowing that must change the way one designs builds. I guess the magic is then figuring out what falls into the 80% and removing it rather than mistakingly removing part of the 20% haha
I think this is very well said
Thanks for the resource links I’ll follow them up and I hope they can also help out others as well.
Perhaps I can even add that the trick is not stop thinking about the user and your product as a whole but dig deeper and ask the same question on each and every page/element. “Ok, so what type of user will see this, why should the user see this, is it really needed, what is the user trying to accomplish, does this element help to get there”
So you start first with…what problem am I going to solve, for who is this a problem, do they like my solution and how I present it. From there, given that you solve real pain for a known type of user, does this element help to get to the solution in the easiest and quickest way to the user and if so why, and if not, why not.
All of the above is really hard but I believe when you do that, stick to it and live up to it your app will be better than 90% of all the apps out there.
I know from a fact from my own experience and all the companies that I have helped that it will reduce the time and costs of building apps with about 80% at least.
If you ask…why is not everybody doing it then? Well, it just feels good to do something visible. Cranking out so many beautiful pages, so many test cases that end up being green after many pizza evenings. It feels better for most to put down fires than it is to sit back, relax, think things over, sketch, talk with a cup of coffee and stick to paper and pencil for a few months. While at the same time everybody around you thinks you are crazy since you are not working hard and DO something
If you have them handy could you add the links to these posts you mentioned? (Just if they are easy the
locate for you).
I had a quick look for George’s post but didn’t return anything. Maybe I had the title incorrect.
I personally go for web first with responsiveness in mind.
The rules that I follow:
Groups that act as screens should have a page width condition that sets padding down to 16 on all sides
None of the outer groups have min or max width
Fit width to content is used sparingly
For groups in a row container make sure to set min width to 200/220px so that once the page is below 640 px it breaks the group into a column format
Make sure to create separate headers and footers for mobile devices, it helps in updating them easily
Once a page is completed go to the responsive tab in the editor and view all screens individually. Also inspect the preview section without the debugger
I never use the responsive tab. I always test in browser with developer tools and the responsive mode. Firefox is best for this as Google chrome doesn’t work well with Bubble setup for some reason.
For anybody using the responsive tab, issues you will encounter is inability to see heights as it doesn’t respond for height, nor does it show responsive changes based on URL parameters. But if you are using the responsive tab and want to see responsiveness based on URL parameter you can simply manually add that parameter to the URL while in the responsive tab and then refresh and it will. But one of the biggest issues for me personally is the lack of responsiveness for height.
Actually, maybe a topic should be made with the best posts/books/courses, categorized and pinned to the top in Tips. 
, we like to show off. Also, when an app ages there will be an increase in technical dept (not always due to the developers, stakeholders want things done fast and cheap).
