what, when and why of wireframes - james kelway - 2009 08 17
TRANSCRIPT
![Page 1: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/1.jpg)
The what, when and why of wireframesBy James Kelway
![Page 2: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/2.jpg)
What are wireframes?
Boxes
Text
Arrows
![Page 3: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/3.jpg)
What are wireframes?
![Page 4: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/4.jpg)
What are wireframes?
![Page 5: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/5.jpg)
Wireframes are NOT....
• 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
![Page 6: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/6.jpg)
Why do we use them?
To help gain understanding
![Page 7: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/7.jpg)
Why do we use them?
To help project workflow
![Page 8: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/8.jpg)
Why do we use them?
To help stakeholders
![Page 9: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/9.jpg)
Why do we use them?
To help designers and developers
![Page 10: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/10.jpg)
When should they be used?
![Page 11: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/11.jpg)
What are the different types?
Hand drawn
sketches
![Page 12: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/12.jpg)
What are the different types?
Collaborative sketches
![Page 13: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/13.jpg)
What are the different types?
Annotated Wireframes
![Page 14: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/14.jpg)
What are the different types?
Hi-fidelity Wireframes
•For opinion
•Requires an explanation
•Very near the final execution
![Page 15: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/15.jpg)
How do we use them at Hello?
Websites
![Page 16: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/16.jpg)
How do we use them at Hello?
Dashboards
![Page 17: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/17.jpg)
How do we use them at Hello?
Optimisation
![Page 18: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/18.jpg)
Why are they important?
![Page 19: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/19.jpg)
Why are they important?
![Page 20: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/20.jpg)
Why are they important?
![Page 21: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/21.jpg)
Why are they important?
![Page 22: What, when and why of wireframes - James Kelway - 2009 08 17](https://reader034.vdocuments.us/reader034/viewer/2022050613/53e9a0c78d7f7298708bd282/html5/thumbnails/22.jpg)