Your SlideShare is downloading. ×
0
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Page Description Diagrams
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Page Description Diagrams

4,609

Published on

A brief overview on Page Description Diagrams that I gave for Misty Weaver's Content Strategy class at the University of Washington.

A brief overview on Page Description Diagrams that I gave for Misty Weaver's Content Strategy class at the University of Washington.

Published in: Education, Technology
0 Comments
7 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,609
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
88
Comments
0
Likes
7
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • Despite our best efforts, clients can get caught in the designwhen looking at wireframesrather than focusing on the structure & organization ofinformation on the page.
  • Wireframes dictate a lot about the design of a screen.This restricts visual designersfrom doing… well, design.
  • Transcript

    • 1. Page Description DiagramsPresented by Nick Finck<br />
    • 2. About Me<br />User Experience Evangelist<br />Blink Interactive<br />Personal Site<br />NickFinck.com<br />Twitter<br />@nickf<br />Nominated<br />Seattle’s sexiest geek<br />Photo by Jeff Croft - http://bit.ly/g0hPil<br />
    • 3. Overview<br />What is a PDD?<br />Why use PDDs?<br />What goes into a PDD?<br />Examples of PDDs<br />PDD activity <br />Q&A<br />
    • 4. What is a PDD?<br />
    • 5. “Page Description Diagrams<br />are simply a tool for <br />communicating IA decisions<br /> without talking about<br /> the visual design.”<br />
    • 6. PDDs<br />
    • 7. Why should we care?<br />
    • 8. Stuck on design<br />
    • 9. Restrained designers<br />By Jason Campbell<br />
    • 10. “We can't solve problems by<br />using the same kind of <br /> thinking we used when we<br />created them.”<br />- Albert Einstein<br />
    • 11. Why?<br /><ul><li>Documents the elements of each screen without specifying layout.
    • 12. May be used instead of wireframes, or preceding wireframes.
    • 13. Allows greater collaboration between team members responsible for visual design and functional specification.</li></li></ul><li>What goes into a PDD?<br />
    • 14. Content<br />Each element may include one or more of the following:<br /><ul><li>Description of each element
    • 15. Finalized or draft content
    • 16. Designs, sketches, or wireframes</li></li></ul><li>Components <br />PDDs should cover the following:<br /><ul><li>Design elements
    • 17. Content elements
    • 18. Interface elements</li></li></ul><li>Layout<br />Each PDD page should include the following:<br /><ul><li>One screen per page
    • 19. Screen name
    • 20. Three columns (high, medium, & low priority)
    • 21. Optional notes or general screen info</li></li></ul><li>Screen Name<br />Notes &<br />General Info<br />Second Priority<br />Third Priority<br />First Priority<br />
    • 22. Some PDD examples<br />
    • 23. Page Description Diagram<br />By Dan Brown<br />
    • 24. Page Description Diagram<br />By Nick Finck<br />
    • 25. PDD activity<br />
    • 26. Thank You<br />
    • 27. Questions<br />
    • 28. Follow-up questions<br />Consulting: BlinkInteractive.com<br />Personal: NickFinck.com<br />Email: nick@blinkinteractive.com<br />Twitter: @nickf<br />

    ×