The best products start with great collaboration on low-fidelity wireframes. Blocks is a Figma plugin that features a library of components so you can create low-fidelity wireframes with your whole team - in minutes.
Hey everyone 👋
I’m Thibaud, Hexa’s cofounder. For those who don’t know Hexa, we’re a startup studio that’s built over 40 products, many of which have become great SaaS success stories like Aircall, Front, Spendesk. Every product that we ever built has followed the same process: it begins with creating low-fidelity wireframes, with the entire team.
But the process of building low-fidelity wireframes is flawed. It begins with founders and product managers who create the first wireframes in one tool, then designers convert these into mock-ups in another tool, developers code the final product, and marketers introduce it to the market. This results in inefficiencies and silos and creates sub-par products.
We are firm believers that it is by 👏 bringing the whole team👏 into the low-fidelity wireframing process that we can build game-changing products: more options are considered, iterations happen quickly, and you avoid becoming attached to any one style too early-on. It doesn’t only lead to better product discussions, it also leads to superior products.
But we never found the right tool to do just that. Traditional wireframing tools were only adopted by founders & product managers, while designers stayed on Figma.
So we decided to build Blocks 🤗 Blocks is a low-fidelity wireframing tool that happens right in Figma.
With Blocks:
🟧 You’ll never ever have to switch from wireframing tools to design tools ever again
🟧 Your whole team will get to participate in the most crucial part of product building
🟧 You'll be able to wireframe any idea you've got on your mind with our library of best-in-class components
🟧 You'll wireframe much faster with drag-and-drop and endless customization
🟧 You'll have the best product conversations with all of your team - and build the best products!
Great products are born on Blocks. Get started now: https://www.blocks.pm/
@tiboel I'm interested in why your SaaS product approach starts with wireframing...rather than with user/customer research into digital product usage behaviours?
Looks great. Although, am I doing something wrong? Whenever I drag a component - say a sidebar into a desktop browser - it locks the position of the element. I have to click on the "Absolute position" button each time to move it, feels like an extra click that's not needed.
@mydigitalself hey Mike, thanks for your feedback. I guess you have difficulties handling Figma's auto-layout for the component you dropped ! We are going to deactivate it in the component so that it doesn't trouble in the future
In love with it. I'm tired of projects getting directly to high-fidelity, I miss the balsamic days. That's the best thing that could happen to Product Design this year @tiboel
Congrats on the launch guys! Such a useful tool to test things rapidly at the beginning of a project – makes me think of Balsamiq, but it’s so much more powerful to have it in Figma directly!
Thx @robi ! We loved Balsamiq too, but then Figma came along, and we started focusing more on the design than the content. That was our mistake. So, we created this plugin to bring back low-fidelity wireframes.
I remember very well how we used to wireframe back in the day. I also remember how this early process was at the center of eFounders' building strategy, and how we could spend hours brainstorming on UI/UX matters.
No wonder why so many great products came out of the studio in just a few years.
So let's just say it, @tiboel -> you just killed moqups .com 😉
Exactly the tool I'm needing now! I want to explain some ideas to my product and design team for a new product we are starting, and I was lazy to do that in Figma with all the bell and whistle. Simple high level wire-framing is what I need and can use quickly without being a hardcore Figma user.
Thanks @tiboel and @vicgrss for the perfect timing 😀 !
folk