Wireframing

[Sticky]

Hi all,


Just a query really. As I want to present and go through a professional level of design stages for future clients I’m thinking of purchasing some wire frame software. I was wondering what’s the most popular, what’s good, what’s bad, what you use etc
Also are there any good free packages out there?

Cheers

[digizan]

I use Visio for sitemaps & Illustrator for wireframes.

Edit: I know Mac users who swear by OmniGraffle.

Digi

[steve2112]

maybe i am quite the newbie to websites but what is the difference between a wireframe and sitemap?

steve

[digizan]

maybe i am quite the newbie to websites but what is the difference between a wireframe and sitemap?A sitemap shows the site's architecture (example 1 (http://www.cancerleadership.org/images/sitemap.gif), example 2 (http://www.projectpier.org/files/u16/ProjectPier-0_8-Sitemap-650.gif), example 3 (http://mcc.sws.uiuc.edu/images/sitemap/sitemap.gif)), whereas the purpose of a wireframe is to indicate content placement (example 1 (http://i209.photobucket.com/albums/bb100/helloanak/imathia/home-wireframe.jpg), example 2 (http://ets.tlt.psu.edu/designlibrary/files/designlibrary/images/tlt_wireframe_podcasts.preview.jpg), example 3 (http://totheweb.com/images/sub/wire_frame_example_home.gif))

Sometimes sitemaps will also show logic/decision making processes if there's a web application involved (see http://web.mit.edu/amps/process/webtool-prototypes.html).

Digi

[steve2112]

See i call site maps what you do but I just say page mock for wireframe. Wireframe sounds more professional though.

steve

[Two-Toe Tom]

page mock is what the finished page would look like (roughly), wireframes would just have where the elements are place (like a box with an x in it to represent an image). You could also overlay a grid on a wireframe to see how things are aligned.

[digizan]

See i call site maps what you do but I just say page mock for wireframe. Wireframe sounds more professional though.Ditto what Two-Toe Tom said.

Digi

[Sticky]

Thanks for those examples Digi, I think I'm going to base my own customer sitemaping on example 2 I really like the presentation of that layout.

Although I started this thread wanting to know about the software options out there for to help with wire framing. It seems it may be of more value to understand a little bit more about the actual 'theory' of wire framing and sitemapping.

So...... what should you note i.e what you should/shouldn't do, things to consider, areas that are notoriously tricky.

Cheers guys hope this thread will help both newbies (like me) and you pros!