Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Phil Pickering
1,343 PointsRecommended web-based wireframing tools?
Does anyone have any favorite web-based wireframing tools that they would recommend?
5 Answers
Roger Lüchinger
11,403 PointsMy favourites are Balsamiq.com and proto.io – although I have switched to the native mac version of Balsamiq recently. Both the web and the local version are pretty identical, but as I work a lot on the train I prefer the local version.
Chris McKay
2,401 PointsI'm not sure why you would be interested in a web-based wireframing tool. However, check out https://balsamiq.com they offer a native app and a web app also. Other apps to look at:
However, you can do your wireframes in a native product like http://bohemiancoding.com/sketch/ or even Keynote and then use http://invisionapp.com or https://marvelapp.com to make them interactive.
Marvel app has a really neat iPhone app that allows you to take pictures of actual sketches on paper and make them interactive. Hope this helps.
Phil Pickering
1,343 PointsThanks Chris! Some great apps and workflow solutions there. Wireframe.cc looks particularly good (along with Balsamiq). I'll keep a note of using a combination of Sketch or Keynote, plus Invision or Marvel for later on in my career.
(I'm not working at the moment and I'm using a Chromebook which dual-boots into Ubuntu & Chrome OS, so cost and being a web-based solution are really important to me).
Michelle Pepe
Courses Plus Student 2,076 PointsAdobe Photoshop Phil, there's a free trial. Learning Photoshop is a + on the resume. Michelle Pepe
John Mutch
6,962 PointsI spend most of my time in SharePoint and have looked into the previously suggested tools. Nothing beats pen and graph paper when you first start brainstorming IMO. Once I have a sketch of my site; I will break out the MS tools. I know, I know, I said it, and I am serious. The whole office suite has everything you need to get started on any web project. I use Visio to create the wireframes. You can find some already made templates for just about anything in MS Office, a search for them is a great way to get an idea of what is needed. Visio has the ability to scan and create mapsof websites and present the content in near real-time. MS Word has become a powerful tool for mindmaping and creating outlines. These are just a few more suggestions. Great discussion!
Jeff Ramos
259 PointsI used Invision to wireframe/mockup an iOS app and it was a lifesaver.
I created all the images in Photoshop and imported them into Invision to make an interactive version. I totally recommend it.
Phil Pickering
1,343 PointsPhil Pickering
1,343 PointsThanks Roger! Balsamiq looks very good and I see there's a decently-priced Google Drive version for only $5 per month. Proto.io looks decent too but limited to mobile apps, not general websites.
Roland Studer
155 PointsRoland Studer
155 PointsI recommend to go for the Desktop Version of Balsamiq. Buy it once and never pay again (I actually bought my license about five years ago and never paid for any upgrade).