Page Description Diagrams
Upcoming SlideShare
Loading in...5
×
 

Page Description Diagrams

on

  • 4,822 views

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.

Statistics

Views

Total Views
4,822
Views on SlideShare
4,822
Embed Views
0

Actions

Likes
8
Downloads
79
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • 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.

Page Description Diagrams Page Description Diagrams Presentation Transcript

  • Page Description DiagramsPresented by Nick Finck
  • About Me
    User Experience Evangelist
    Blink Interactive
    Personal Site
    NickFinck.com
    Twitter
    @nickf
    Nominated
    Seattle’s sexiest geek
    Photo by Jeff Croft - http://bit.ly/g0hPil
  • Overview
    What is a PDD?
    Why use PDDs?
    What goes into a PDD?
    Examples of PDDs
    PDD activity
    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?
  • Content
    Each 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
  • Layout
    Each 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
    Notes &
    General Info
    Second Priority
    Third Priority
    First Priority
  • 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: nick@blinkinteractive.com
    Twitter: @nickf