Comments on post “Webflow Flexbox UI Builder”
Vlad Magdalin
@callmevlad · CEO @ Webflow
Hey Product Hunt!
If you've ever tried to build anything with CSS, you know how annoying it can be to get even the basics right. There have been entire blog posts written on something as simple as centering an element vertically, and entire books written on how to write code to get basic layouts to work.
Thankfully, the people who define web standards have come up with something to solve most of our CSS problems — it's called CSS Flexbox, and it has nearly universal support across all modern browsers. However, it's so complicated that even most seasoned developers have to have a cheatsheet open to look up the right code syntax for specific layout settings.
Well, we thought this was a terrible way for creative people to utilize the power of flexbox, so we created a totally visual flexbox UI and built it into Webflow. Our approach looks and feels a lot more like Photoshop/Illustrator/Sketch-inspired alignment and distribution buttons than a long list code properties that you have to remember.
Also, we created this game to help you visually learn the concepts used by flexbox: https://www.flexboxgame.com/ — I bet you can't pass level 28 :P
We'd love to hear your feedback on both the product and the game, and we'll be hanging out here all day.
Cheers,
Vlad
22sharetweet・
Tash Jefferies
@yourtash · Co-Founder of TazaApp.com. I love sushi.
@callmevlad Love this! I'm now immersed in the tech world here in San Francisco, and I really abhor the notion that I'd have to learn how to write code again in order to make great looking products! Can't wait to try out your game :)
1sharetweet・
Zack Bloom
@zackbloom · Engineering Manager, Cloudflare
@callmevlad The game is such a brilliant way to introduce people to the (incredible) power of flexbox.
4sharetweet・
Justin Hernandez
@300mhz · UX Designer, Strategist & Curator
@zackbloom @callmevlad It really is. I wish more tutorials were games!
2sharetweet・