DEV Community

Madza
Madza

Posted on

What wireframing tools do you use?

Wireframing is schematic or screen blueprint, is a visual guide that represents the skeletal framework of a website. It's an essential step after the initial planning of the idea, data and users.

Recently I discovered draw.io, which has been awesome for this purpose.

What wireframing tools do you use?

Top comments (7)

Collapse
 
zanetaylor profile image
Zane Taylor

I've used Whimsical a bit, and like it so far, but it would be really great if it exported layered / vector documents. The focus on wireframes means simpler tooling and streamlined components to map out a concept quickly. With full-fledged design tools like Figma and XD, it can be challenging to hit the right level of detail for wireframes, unless you're working with a comprehensive wireframe component kit.

Collapse
 
catmcgeecode profile image
Cat McGee

Draw.io is amazing! I also love Figma, which tends to be for designs rather than wireframes but it can be used for that too. And Adobe XD of course

Collapse
 
madza profile image
Madza

I use Figma for designs too, just find draw.io to be more specifically focused on wireframing :)

Collapse
 
steelwolf180 profile image
Max Ong Zong Bao

Figma for me as I can run it on my Linux machine.

Collapse
 
sarehprice profile image
Sarah Price

I use Figma and Adobe XD. Sometimes Miro or Google Draw as well when I need something really quick and fast.

Collapse
 
madza profile image
Madza

Thanks for recommendations, I need to look more into Miro and Google Draw :)

Collapse
 
markduiker profile image
Mark Duiker

Interesting discussion! I've more recently just opened up Microsoft Word to throw together a quick wireframe. This really helps me to avoid any visual design.