I remember that on version 4 or 5 not sure
the way to work on the different breakpoints was to start with mobile first
meaning:
start to design everything on XS (576px to 0) when design ok:
going to SM (adjusting everything on this BPoint) when ok:
going on MD (adjusting to this break point)
and finally LG (to have everything done on it)
right now (I don’t know when it happens)
i have to change my way of working and start to LG first
which I don’t like it AT ALL
because when you are used to consider that when you change something on LG breakpoint (color or size of an element)
it will be ONLY on LG
but unfortunately all the work you did is now on all others breakpoints and you cannot undo because you did it, few steps ago and didnt check…
it is not efficient (loosing time) when u are used to a method that most of the people use… mobile first is pretty common on designing UI/UX
is there a way to say to blocs 6 on PROJECT SETTINGS or GENERAL SETTINGS
to choose between MOBILE FIRST (for people like me who are used to it)
or DESKTOP FIRST (for people who prefer to use as it is right now)
I’ve used Blocs since about version 2, and I honestly don’t know what you are describing. That is probably due to the fact that I start my work in LG, and for good reason. You see, I can fit more content into LG mode, and it’s easier for me to strip out some of the lesser necessary content as screen sizes shrink. So the LAST breakpoint I design for is XS (mobile).
For example, when you have a very large table, you can display everything in LG, and as I reduce screensize in each breakpoint, I allow lesser important columns to drop out of view. Here’s one such page on my Japanese site:
Lower down on that page you will find a table. View it on a desktop computer with the browser window wide. You will see 3 columns. Slowly shrink the window width to see how columns vanish at certain breakpoints.
So for people like me, designing in LG first, is the best choice because I have a lot of content, and I put priority on content first. Mobile users largely get the same content, except for tables. I’ve not found a good solution for mobile that allows all columns you see in LG to also be viewable in XS.
But going back to your post though, I can only guess you are asking for a WISH LIST feature request? Meaning, you want a Preference option that would allow you to create a New Blocs document, or open an existing one, and have Blocs present you with XS first, never showing LG first. If so, just create a WISH LIST feature request for that.
thank you but I guess I didn’t explain well
let me add more infos:
BLOCS APP is based on bootstrap 5
bootstrap 5 is MOBILE FIRST
According to @Norm
bootstrap 5 is mobile first going upward
and CSS grid (as example) going cascade down
my point is to be able to choose on upward method or cascade down method
maybe I am totally wrong about the point that before it was mobile first (maybe I made a mistake with another app I used before, waiting for confirmation or not from @Norm or someone in the team) if so, very sorry for that
but yes would be very great as wishlist:
to be able to choose between UP (XS >>> LG) and DOWN (LG >>> XS) depending of the way we approach a website
if I understood for you: more infos at start and reducing later is best (CSS way)
for me developing everything on mobile (less is more) and going upward is much better (bootstrap way)
let see what the BLOCS team say about that
PS: I go very often to Toyota and Okazaki (for job) I should come to visit you to say hi one day
Blocs still allows Bootstrap 4, and I continue to use it exclusively because some important Brics I have work only with Bootstrap 4.
Thank you for explaining about Bootstrap 5 though. That makes more sense to me now. Maybe one day my important Brics will get updated and I can finally make the move to Bootstrap 5!
It’s funny. Most people outside Japan don’t know there is a city named “Toyota.” It illustrates just how powerful and influential that company is here.
Sadly, Toyota is so focused on exports now (due to the weak Yen) that most people in Japan who order a new Toyota car have to wait 6 to 8 months for delivery. Popular models can take a year. The Land Cruiser is more than a year wait.
I am already 100% convinced about that
all my studies and huge part of my carreer was linked to it…
I did my Ronbun-Hakase at Toyota
and on the field of the Toyota seisan hoshiki
Right now living in Kyoto but still base all my job on the TPS
Hiya @SENEK I think it is more a way of working than a framework being ‘mobile first’. I’ve always worked mobile first for a good number of years now. Bootstrap provides for mobile first, just like every other modern framework. I switched to Blocs in October after using another system for many years that used a mobile layout by default, but that was due to workspace on a 13" Macbook and the rest of the other palettes and menus of the UI forcing a mobile view. If I connected to an external monitor it would by default show the by default the screen layout that would fit on a larger screen.
The way I work, I tend to use the larger screen size of XL, get all my content on then start the layout formatting from XS upwards to XL. With Blocs all the changes with columns etc cascade up from XS to XL, such as two columns on XS, that will reflect up to XL unless I make a change at one of the breakpoints along the way.
The confusing bit though I found at first with Blocs, and it still catches me out, is the changes within classes at different breakpoints, they cascade down from XL to XS. I’m guessing that though is some technicality of the system that it must work that way.
But… I would go back to the initial point, I’ve always interpreted mobile first as being a mindset in the design process, that you consider the mobile user first and ensure the design meets that format, and then work up, if it doesn’t work on mobile, rethink the design. The is especially true with interactive content created in apps such as Hype. If it won’t work or fit a mobile then it isn’t designed right.
Others may agree or disagree with this notion, but that’s the way I’ve always worked for the last decade.
Blocs provides me with that way of working extremely well with the shift in layouts at different breakpoints, I can then design accordingly with mobile first, compared to web building systems in the early, mid, late 2000s that just provided one screen way of working such as Macromedia/Adobe Dreamweaver that was just one screen layout essentially.
mobile first as being a mindset in the design process, that you consider the mobile user first and ensure the design meets that format, and then work up, if it doesn’t work on mobile, rethink the design. The is especially true with interactive content created in apps such as Hype. If it won’t work or fit a mobile then it isn’t designed right.
Same here I come from Hype that I still use btw
but on Blocs I do everything at once:
I design on XS (so mobile) I make everything good in shape and if interaction etc goes well then I go on SM etc etc
Everything directly in Blocs (no Figma for example)
, kind of Full stack (If I can say so): UI/UX at once…
The confusing bit though I found at first with Blocs, and it still catches me out, is the changes within classes at different breakpoints, they cascade down from XL to XS. I’m guessing that though is some technicality of the system that it must work that way.
this is the point
when I am Happy with my design from XS and go step forward
as you described: change something in a class on LG and hop: all the others will have it
I would prefer to make an option to say:
which way you develop breakpoint:
DOWN: from LG to XS
UP: from XS to LG
and classes, etc etc EVERYTHING that u change respect this flow (up or down)
I get that, it would be really good if that was possibe to be implemented or set as a choice in the app preferences, if classes have to work from XL to XS, then it would be really beneficial if layout changes cascade down in the same way XL to XS, or vice-versa classes and layout changes cascade up XS to XL.
It has always been mobile first - but I always work on desktop first and adapt every section / font/ design / image etc for each break point. Once I have several blocs that look great on all breakpoints I tend to use though throughout the whole website to keep a level of consistency in the design and change headers, text and images etc…
Keep it simple and don’t matter if you work mobile first or desktop first! - but If I want a change to mirror throughout then it’s mobile first.
