How To Make A Wireframe
by | Posted in User Experience Design 5 Comments »This 12-minute video shows new UX designers how to make a basic website wireframe using Omnigraffle 5.0 on a Mac. Windows users will also benefit since you can do a lot of similar things in Visio. The biggest takeaway is to use templates and stencils to speed up your workflow. Having templates and stencils readily available speeds up development time so you can spend more time thinking and less time tweaking. Remember, UX design/IA is good thinking written down. The whole purpose of wireframes is to help the team visualize the system and solve design problems before they start. Please let me know if this video is helpful, and happy wireframing!
Tags: IA, wireframes


September 7th, 2009 at 6:34 pm
[...] First, Wireframe Later Here’s my own philosophy and approach to making wireframes. 13. How To Make A Wireframe This 12 minute video shows you how to make a basic wireframe using Omnigraffle. [...]
November 19th, 2009 at 6:43 pm
[...] made this a long time ago in Omnigraffle and set it as the default whenever I open a new file (see How to Make a Wireframe). Make sure you can output a PDF to the proper page size. If you don’t you’ll be [...]
November 20th, 2009 at 10:04 am
Maybe you wanna give HotGloo a try and let me know what you think about it? HotGloo is an online wireframe app, completely webbased and designed for full interactivity and team collaboration. More elements and features added weekly based on user feedback.
Cheers
Wolf
@HotGloo
November 20th, 2009 at 6:44 pm
Hi Wolf, I just signed up for your beta program. Very cool stuff! Thanks for the tip
February 9th, 2010 at 7:38 pm
very helpful, thank you Mary.
best
—vic