Page Description Diagrams
-
Upload
nick-finck -
Category
Education
-
view
104 -
download
0
description
Transcript of Page Description Diagrams
Who is using your system? We know them.Evidence Driven Design
Page Description DiagramsPresented by Nick Finck
About Me
Photo by Jeff Croft - http://bit.ly/g0hPil
User Experience EvangelistBlink Interactive
Personal SiteNickFinck.com
Twitter@nickf
NominatedSeattle’s sexiest geek
Overview
1) What is a PDD?2) Why use PDDs?3) What goes into a PDD?4) Examples of PDDs5) PDD activity 6) Q&A
What is a PDD?
“Page Description Diagrams are simply a tool for communicating IA decisions without talking about the visual design.”
PDDs
Why should we care?
Stuck on design
Restrained designers
By Jason Campbell
“We can't solve problems by using the same kind of thinking we used when we created them.” - Albert Einstein
Why?• Documents the elements of each screen
without specifying layout. • May be used instead of wireframes, or
preceding wireframes. • Allows greater collaboration between team
members responsible for visual design and functional specification.
What goes into a PDD?
ContentEach element may include one or more of the following:• Description of each element• Finalized or draft content• Designs, sketches, or wireframes
Components PDDs should cover the following:• Design elements• Content elements• Interface elements
LayoutEach PDD page should include the following:• One screen per page• Screen name• Three columns (high, medium, & low
priority)• Optional notes or general screen info
Screen Name
First Priority Second Priority Third PriorityNotes &General
Info
Some PDD examples
Page Description Diagram
By Dan Brown
Page Description Diagram
By Nick Finck
PDD activity
Thank You
Questions
Follow-up questions
• Consulting: BlinkInteractive.com• Personal: NickFinck.com• Email: [email protected]• Twitter: @nickf