Create better website wireframes from Computer Arts Mag

---

List the elements Identify the pages on the site by walking through the steps the user goes through to fulfil the desired actions or tasks. Now list the page elements: standard ones, such as headers, footers, content areas, menus; and the non-standard ones, such as a calendar, RSS or Twitter feed. A matrix can be a useful way of seeing, at a glance, which elements go on what page. Remember you’re a user, too While you might not have a wealth of wireframing experience, you do have a lot of experience of being a visitor to a website. Draw upon the sites you regard highly and those you disregard completely. Give consideration for relevant comparator sites and see what you think works well or could be improved. Get your thoughts down There are numerous options for creating wireframes, ranging from pencil and paper sketches to the use of tools that produce wireframes resembling real-life webpages. Your approach and the level of detail should be informed by the purpose of the wireframe: if it’s only for you, sketches are fine, but if you’re working with another designer or need to present to the client, you’ll need something with more detail, presented more formally – for example using InDesign and Illustrator might be a better option.

New on computerarts.co.uk

	Tutorials Create radial patterns using type Video tutorial: Colour correction in After Effects Add more character with strokes in Illustrator Bind your own books
	Features and interviews Trend report: The real thing 10 D&AD tips for making yourself more employable The 200 best design moments ever, part 2 There’s no such thing as originality
	Blog Form turns 21 in style 2012 Vimeo Awards winners announced Inspiration Gallery - 7 June Sagmeister and Walsh join forces