The what, when and why of wireframes<br />By James Kelway<br />
What are wireframes?<br />?<br />Boxes<br />Text<br />Arrows<br />
What are wireframes?<br />
What are wireframes?<br />
Wireframes are NOT....<br /><ul><li> for an external audience  without an explanation of context
 the design of a page
 to portray any graphic elements
 to convey the brand of a website</li></li></ul><li>Why do we use them?<br />To help gain understanding<br />
Why do we use them?<br />To help project workflow<br />
Why do we use them?<br />To help stakeholders<br />
Why do we use them?<br />To help designers and developers<br />
When should they be used?<br />
What are the different types?<br />Hand drawn <br />sketches<br />
What are the different types?<br />Collaborative sketches<br />
What are the different types?<br />Annotated <br />Wireframes<br />
What are the different types?<br />Hi-fidelity Wireframes<br /><ul><li>For opinion
Requires an explanation
Very near the final execution</li></li></ul><li>How do we use them at Hello?<br />Websites<br />
How do we use them at Hello?<br />Dashboards<br />
How do we use them at Hello?<br />Optimisation <br />
Why are they important?<br />
Why are they important?<br />
Upcoming SlideShare
Loading in...5
×

What, when and why of wireframes - James Kelway - 2009 08 17

24,412

Published on

Hello Ignite presentation by James Kelway on wireframes based on his blog post at userpathways.com . This is a slidecast - audio has been synchronised with the presentation

Published in: Design, Education, Spiritual

What, when and why of wireframes - James Kelway - 2009 08 17

  1. 1. The what, when and why of wireframes<br />By James Kelway<br />
  2. 2. What are wireframes?<br />?<br />Boxes<br />Text<br />Arrows<br />
  3. 3. What are wireframes?<br />
  4. 4. What are wireframes?<br />
  5. 5. Wireframes are NOT....<br /><ul><li> for an external audience without an explanation of context
  6. 6. the design of a page
  7. 7. to portray any graphic elements
  8. 8. to convey the brand of a website</li></li></ul><li>Why do we use them?<br />To help gain understanding<br />
  9. 9. Why do we use them?<br />To help project workflow<br />
  10. 10. Why do we use them?<br />To help stakeholders<br />
  11. 11. Why do we use them?<br />To help designers and developers<br />
  12. 12. When should they be used?<br />
  13. 13. What are the different types?<br />Hand drawn <br />sketches<br />
  14. 14. What are the different types?<br />Collaborative sketches<br />
  15. 15. What are the different types?<br />Annotated <br />Wireframes<br />
  16. 16. What are the different types?<br />Hi-fidelity Wireframes<br /><ul><li>For opinion
  17. 17. Requires an explanation
  18. 18. Very near the final execution</li></li></ul><li>How do we use them at Hello?<br />Websites<br />
  19. 19. How do we use them at Hello?<br />Dashboards<br />
  20. 20. How do we use them at Hello?<br />Optimisation <br />
  21. 21. Why are they important?<br />
  22. 22. Why are they important?<br />
  23. 23. Why are they important?<br />
  24. 24. Why are they important?<br />
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×