• Save

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Like this presentation? Why not share!

Strategy and Wireframes: Plan or Die

on

  • 5,809 views

My talk at FOWD presenting the different design deliverables involved in presenting strategy leading up to final UI.

My talk at FOWD presenting the different design deliverables involved in presenting strategy leading up to final UI.

Statistics

Views

Total Views
5,809
Views on SlideShare
4,078
Embed Views
1,731

Actions

Likes
23
Downloads
0
Comments
1

6 Embeds 1,731

http://www.wireframewednesday.com 1637
http://wolfbecvar.com 49
http://wireframewednesday.tumblr.com 22
http://posterous.com 13
http://feeds.feedburner.com 8
http://uxdesignstuff.collected.info 2

Accessibility

Upload Details

Uploaded via as Apple Keynote

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
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • you may think that designing right away allows you to move fast, which is awesome. more bucks per hour! <br />
  • <br />
  • result of poor planning. for your site&#x2019;s users: left feeling awkward and confused <br />
  • <br />
  • deliverables help you to be clear in your communication <br />
  • removes the &#x201C;aha&#x201D; moment, but increases success rate. there should be no suprises. <br />
  • <br />
  • <br />
  • Sun-Tzu wrote this great book. <br />
  • get buy-in during the objective parts of the process. speak to early design presentation experiences. <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • what are the deliverables, the process and that flows through a project <br />
  • understanding the problem (and the client) <br />
  • understanding the problem (and the client) <br />
  • understanding the problem (and the client) <br />
  • understanding the problem (and the client) <br />
  • phases of the process. strategy is foundational and each phase builds upon the previous. <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • exploring ideas and building a relationship, if you do the research allows you to immerse and understand the client <br />
  • branding <br />
  • perception - client&#x2019;s perception of themselves and users&#x2019; perception of brand <br />
  • target user <br />
  • competition <br />
  • what does success mean? <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • Shows where the content LIVES <br />
  • RETAIN ACCURACY. these documents should be as true at the end as they are at the beginning. if you have to change any of it, that is your big red flag that should drive you to ask for more money and time. <br />
  • sites are more dynamic now, so this doesn&#x2019;t work as well any more. <br />
  • wikipedia sitemap <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • Great design guru Bruce Lee says... <br />
  • <br />
  • 1 or 2 person collaboration with a whiteboard <br />
  • Photoshop 960.gs for organized layout <br />
  • <br />
  • Keep sections organized by layers <br />
  • Go as hi-fi as necessary <br />
  • Evolve the approved wireframe into a final design <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • focus groups + usability testing <br />
  • audit of all the domains in their portfolio <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />
  • <br />

Strategy and Wireframes: Plan or Die Strategy and Wireframes: Plan or Die Presentation Transcript

  • hi Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • we are here Strategy & Wireframing: Plan or Die
  • we are here Tennessee Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Nashville Strategy & Wireframing: Plan or Die
  • Nashville Memphis Strategy & Wireframing: Plan or Die
  • Nashville Memphis Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Paramore|Redd Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • my desk Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • why strategy & wireframing? Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • “he who fails to plan is planning to fail.” - Winston Churchill Strategy & Wireframing: Plan or Die
  • move fast :) Strategy & Wireframing: Plan or Die
  • you will get screwed Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • 1. clarity 2. objectivity 3. focus Strategy & Wireframing: Plan or Die
  • communication Strategy & Wireframing: Plan or Die
  • incremental success Strategy & Wireframing: Plan or Die
  • 1. clarity 2. objectivity 3. focus Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • “every battle is won before it’s ever fought.” - Sun-Tzu Strategy & Wireframing: Plan or Die
  • 1. clarity 2. objectivity 3. focus Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • clients are no different Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Lorem Ipsum Strategy & Wireframing: Plan or Die
  • what does it look like? Strategy & Wireframing: Plan or Die
  • understanding the problem Strategy & Wireframing: Plan or Die
  • communicating the problem Strategy & Wireframing: Plan or Die
  • solving the problem Strategy & Wireframing: Plan or Die
  • * Image courtesy of Jesse James Garret Strategy & Wireframing: Plan or Die
  • 1. research 2. strategy 3. site map 4. wireframe 5. ui design Strategy & Wireframing: Plan or Die
  • what’s working? Strategy & Wireframing: Plan or Die
  • what’s not working? Strategy & Wireframing: Plan or Die
  • competitive analysis Strategy & Wireframing: Plan or Die
  • stakeholder interviews Strategy & Wireframing: Plan or Die
  • data Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • * Image courtesy of Silverbackapp.com Strategy & Wireframing: Plan or Die
  • 1. research 2. strategy 3. site map 4. wireframe 5. ui design Strategy & Wireframing: Plan or Die
  • collaboration Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • clarity Strategy & Wireframing: Plan or Die
  • purpose Strategy & Wireframing: Plan or Die
  • agreement Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • 1. research 2. strategy 3. site map 4. wireframe 5. ui design Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Home
  • Home Guide For Patients For Visitors About VUMC Pre-Register Prepare for Key Phone Visiting Overview Facts Your Stay Numbers Hours Insurance Pastoral Parking Where to Designations Quality Plans Care Sleep Privacy & Office of Where to HIPPA Patient Affairs Eat Travel History Records / Interpretor Gift Shop Mail Forms Services Healthy Guest Living Services
  • Conditions eg: Lung Cancer Home Doctors eg: Dr. Jim Smith Guide Locations eg: 100 Oaks For Visitors About VUMC ey Phone Visiting Overview Facts Numbers Hours
  • Conditions eg: Lung Cancer Search Make About Appointment Home Doctors eg: Dr. Jim Smith Doctor Template Related Show Conditions Location Reserve Appointment Guide Locations eg: 100 Oaks For Visitors About VUMC ey Phone Visiting Overview Facts Numbers Hours
  • View Read Research News Related Related Locations Doctors Phone About Number Browse Condition Search by Letter Template Conditions eg: Lung Cancer Search Make About Appointment Home Doctors eg: Dr. Jim Smith Doctor Template Related Show Conditions Location Reserve Appointment Guide Locations eg: 100 Oaks For Patients For Visitors About VUMC Location Search Template Pre-Register Prepare for Key Phone Visiting Overview Facts About Map Your Stay Numbers Hours Insurance Pastoral Where to Get Hours of Parking Designations Quality Operation Plans Care Sleep Directions Privacy & Office of Where to Related View HIPPA Patient Affairs Eat Travel History Conditions Doctors Records / Interpretor Gift Shop Mail Forms Services
  • View Read Research News Related Related Locations Doctors Phone About Number Browse Condition Search by Letter Template Member Login Conditions eg: Lung Cancer Search Make About Appointment Video Gallery Home Doctors eg: Dr. Jim Smith Doctor Template Related Show Conditions Location Reserve Appointment Guide Locations eg: 100 Oaks For Patients For Visitors About VUMC Location Search Template Pre-Register Prepare for Key Phone Visiting Overview Facts About Map Your Stay Numbers Hours Insurance Pastoral Where to Get Hours of Parking Designations Quality Operation Plans Care Sleep Directions Privacy & Office of Where to Related View Travel History Conditions HIPPA Patient Affairs Eat Doctors Records / Interpretor Gift Shop Mail Forms Services Healthy Guest Living Services
  • View Read Research News Related Related Locations Doctors Phone About Number Browse Condition Search by Letter Template Member Login Conditions eg: Lung Cancer Search Make About Appointment Video Gallery Home Doctors eg: Dr. Jim Smith Doctor Template Related Show Conditions Location Reserve Appointment Guide Locations eg: 100 Oaks For Patients For Visitors About VUMC Location Search Template Pre-Register Prepare for Key Phone Visiting Overview Facts About Map Your Stay Numbers Hours Insurance Pastoral Where to Get Hours of Parking Designations Quality Operation Plans Care Sleep Directions Privacy & Office of Where to Related View Travel History Conditions HIPPA Patient Affairs Eat Doctors Records / Interpretor Gift Shop Mail Forms Services Healthy Guest Living Services
  • Universal Navigation View Read Research News Related Related Locations Doctors Phone Global Navigation About Number Browse Condition Search by Letter Template Footer Member Login Conditions eg: Lung Cancer Search Make About Appointment Video Gallery Home Doctors eg: Dr. Jim Smith Doctor Template Related Show Conditions Location Reserve Appointment Guide Locations eg: 100 Oaks For Patients For Visitors About VUMC Location Search Template Pre-Register Prepare for Key Phone Visiting Overview Facts About Map SITE MAP LEGEND Your Stay Numbers Hours Insurance Pastoral Where to Get Hours of Main Section Plans Care Parking Sleep Designations Quality Directions Operation accessible from main navigation Privacy & HIPPA Office of Patient Affairs Where to Eat Travel History Related Doctors View Conditions Tools application-like interface Records / Interpretor Gift Shop Mail Forms Services Phase 2 Item out of current scope Healthy Guest Living Services Generic Interior Refer to detailed sitemap list
  • 1. research 2. strategy 3. site map 4. wireframe 5. ui design Strategy & Wireframing: Plan or Die
  • WHAT will appear WHERE Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • “the best style is no style.” - Bruce Lee Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • 960.gs Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • sketch Strategy & Wireframing: Plan or Die
  • sketch internal or personal Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • quick exploratory great for feedback Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • low fidelity Strategy & Wireframing: Plan or Die
  • low fidelity simple Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • good for testing structure allows for more flexible design Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • block diagrams grey-box method reference zones Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • high fidelity Strategy & Wireframing: Plan or Die
  • high fidelity complicated Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • very detailed no explanation required Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • specification Strategy & Wireframing: Plan or Die
  • specification sophisticated Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • shoot myself in the face
  • Strategy & Wireframing: Plan or Die
  • 1. research 2. strategy 3. site map 4. wireframe 5. ui design Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • case study Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy Session Strategy & Wireframing: Plan or Die
  • NAVIGATIONAL ELEMENTS View Read Research News Universal Navigation Related Related Locations Doctors • See Vanderbilt Sites • Login to My Health at Vanderbilt About Phone Number Global Navigation Condition Browse Search • News & Events by Letter Template • Pay Your Bill • Search Member Footer Login • Site Map Conditions • Media eg: Lung Cancer • Feedback Search • Address / Phone Number • Trademark • Disclaimer • Privacy Policy About Make Appointment Video Gallery Home Doctors eg: Dr. Jim Smith Doctor Template Related Show Conditions Location Reserve Appointment Guide Locations eg: 100 Oaks For Patients For Visitors About VUMC Location Search Template SITE MAP LEGEND Main Section Pre-Register Prepare for Key Phone Visiting Overview Facts About Map accessible from main navigation Your Stay Numbers Hours Tools Insurance Pastoral Parking Where to Designations Quality Get Hours of application-like interface Plans Care Sleep Directions Operation Privacy & Office of Where to Related View Phase 2 Item Travel History HIPPA Patient Affairs Eat Doctors Conditions out of current scope Records / Forms Interpretor Services Gift Shop Mail Generic Interior Refer to detailed sitemap list Healthy Guest Living Services Strategy & Wireframing: Plan or Die
  • Vanderbilt logo Main Nav/Guide Global Nav Search Bar Promo Area Headline & Copy Giving (graphic/copy) Social/Breakthroughs Footer Links (sitemap) Copyright/Address Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • presenting design Strategy & Wireframing: Plan or Die
  • the “reveal” method Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • Strategy & Wireframing: Plan or Die
  • thanks! Strategy & Wireframing: Plan or Die
  • @bradhaynes Strategy & Wireframing: Plan or Die