Wireframe generators

Does anyone use a wireframe generator that they recommend? Or do you just use RW?

I’m going to be doing a little non-profit event site that’ll have a short turnaround time. I want to do a really basic wireframe to get approval for general layout, navigation, and content organization.

I’d normally do a mockup in RW but I don’t want them being distracted by design feedback (colours, images, etc) - I luckily should have pretty good autonomy there - but I want to make sure the organization of content makes sense. before I get too far into it

I’ve long used (and love) Balsamiq. It’s a quick and easy wire framing tool that is super easy, and very intuitive, to use. Screenshot below is one of dozens I’ve created for clients prior to creating a website (this one is currently under development). Balsamiq Wireframes - Industry Standard Low-Fidelity Wireframing Software | Balsamiq (not a referral link).

5 Likes

I’ll also used Balsamic. Very good!

4 Likes

@jabostick If you want a fully functioning responsive killer wireframe solution, then use the Source CSS Grid and add a border to create the “wireframe”.

You don’t need any content in a CSS Grid to work as long as you give each row some height, and adding b-1 to the Grid Items stack will add the border defined in the settings. You could literally edit this layout in live preview and show the various layouts and illustrate why stuff needs to be certain max lengths, etc… You can define different wireframe colours and widths and add labels using text.

I regularly do this and it is an elegant and quick way to build and then adjust layouts, solution which can look very profeesional in front of a client and can also be used to illustrate the effect of screen size on area content.

Below is an examle I used in my most recent Project which shows the sidebar and main content area for that layout.

4 Likes

Thanks! Balsamiq was perfect for this case.
Gary - great idea also, I’ll definitely keep that in mind for future demos.