๐ฅ Black Friday Sale ENDS SOON! 40% off on all Flux Academy courses: https://bit.ly/47rlrAD
There is a new design trend out there that is gaining traction in web design, and that is the Bento Grid. In this video, I want to show you what it’s all about, and some examples. You learn what’s good about this layout, and what you want to be careful with when using it. Also, how you can use this style in your own web design.
๐ฝ๏ธ CHAPTERS
—————————
00:00 – Intro
00:11 – What Are Bento Grids?
01:07 – Examples
02:26 – What To Be Aware Of
03:40 – How To Build A Bento Grid Layout In Webflow
What trading design topics do you want to hear about? ๐ฌ
Continue learning from us on other social channels
—————————
Instagram: https://www.instagram.com/flux.academy/
Tiktok: https://www.tiktok.com/@fluxacademy
X: https://twitter.com/FluxAcademyHQ
Linkedin: https://www.linkedin.com/school/flux-academy
#webdesign #freelancewebdesigner
source
It looks like joomla circa 2005.
Love this video!
I feel like Apple presentations also strongly contributed to creating a bento trend.
first noticed it in the apple keynotes since like 2020 they used to show all the features of their product in a single slide… ppl hated when microsoft did it in windows 8 ๐๐
I started seeing these layouts on Apple's website many years ago and also on their Keynotes, which they still use.
Ok, but Whate about Mobil?
Its because of Apple
One of the things I hate in web nerd space is people constantly re-invent old things and present it as a new original concept that gets popular.
so basically they reinvented Tumblr
The ui made on the tiny screen is shown and you call it a trend. I'm sure it is. Accounts with small followers do not even get likes for this. You will show ui, when you show ui on a tiny screen, there is no point.
Oh look, it's Twitter Bootstrap, that I've been using since 2011.
I have seen this a few times not much, this is more for personal websites but not for big tech… Still looks nice.
Seem to me that it evolved from the way Apple create their end of section cards during live events. They began using a Bento layout on them a few years ago.
so, metro on web with rounded corners.
Been around for a while though
Is responsiveness also a challenge, when developing for a large range of device types/sizes?
Apple is doing this for years in their keynotes and presentations to summarise key facts. Google also adopted/copied the style of apple 1:1 in the pixel 8 presentation.
All the super rounded shapes feel so early 2000's to me, like the whole design trend is going backwards instead of innovating. It also feels forced, in a way that it sacrifices usability and usage of space for a "trendy aesthetic".
4:02 Congratulations you just brought back pre-css table layout from the late '90s. ๐
Goooooooood
No!
I first saw it in Apple keynotes
FREE PALESTINE
Hi Ran How are you ?! Thanks you your awesome webflow course. I have a question about bento trends. Like you , I am often confuse about find important information in bento website but I love so much this kind of design. I would like to know who use perfectly bento design minimalist for portfolio , if you have exemple to share. Thx
Apple uses it a lot on their launch events for a year maybe more โฆ
Revealing content when scrolling is one of the web cancers we seem to be unable to get rid of (as seen in the diagram website you showed).
Mostly seen in Apple's "feature summary" slide. Where they minimalistically summarise all features of an iPhone or Mac. That slide looks cool.
You noticed this trend a little 10 years late lmao
Feature summary endcards in Apple product reveals use this design, and it's feels quite frankly very overwhelming.
In Apple's case, it works very well in fluffing up the features & make it feels like the new product has more features & advancements than it actually has especially for iPhones. but it feels too overwhelming when I'm in the position of the audience.
In my opinion users dont read in this pattern , for my eyes its annoying
This is calles a staggeredView widget in Flutter and it's been around for a while.
Maybe it's will be more interested if you wanted make tutorial with framer or figma. So we can learn more
I personally love the "bento box" design, but I have to try not to want to use it for everything. I think it works well for weather or certain science oriented apps, and tech.
You're about a year late
more like ipad menu dropdown….. not trend.
People rebranded the masonry layout. Cool!
This design is a mess. There is no clear structure. You don't know where you are supposed to look at first. Form follows function โ not the other way round.
The iCloud looks like that.
i was doing this bevels in 2015 LOL
Apple and Google now do it in their presentations a lot too
If done well. I think it can be really good.
I'm all for chasing trends, but this is rather niche. Shouldn't be used if it isn't already immediately clear what your product is. Like some tech startup probably should focus more on explaining what they're doing rather than throw all kinds of boxes at the visitor.
apple has been doing this on their product pages and keynotes for like 5 years
wouldnt call this new