documenting designa critical step in any developers work flow                                9/19/2012 - LISA SABIN-WILSON
Lisa Sabin-Wilson•DESIGNER SINCE 1998•“DEVELOPER” SINCE 2003•DEVELOPER SINCE 2007•AUTHOR: WORDPRESS FOR DUMMIES•OWNER: EWE...
documenting design ...                   9/19/2012 - LISA SABIN-WILSON
lives within that preciousspace betweendesign &development                    9/19/2012 - LISA SABIN-WILSON
Let’s call itassumption alley - -because this is whereMOST of the assumptionsbegin and then stick.                  9/19/2...
EliminateAssumptions• Saves time• Reduces headaches• Avoids hard feelings• Happy client• Happy developer                  ...
SetExpectationsEarly• Keeps project realistic• Keeps projects on time• Avoids miscommunication• Happy client• Happy develo...
DocumentProjectRequirements• Ready reference point for all• Eliminates “he said/she said”• Provides a work flow• Happy clie...
NOT YOUR AVERAGE JOESPROJECT          HTTP://NYAJ.COMDATE                    CLIENT          JULY 2012              NOT YO...
NOT YOUR AVERAGE JOE’SPROJECT          HTTP://NYAJ.COMDATE                    CLIENT          JULY 2012              NOT Y...
INITIAL CLIENT CONTACT                       |           PRE-SALES DISCUSSIONS                       |            INITIAL ...
INITIAL CLIENT CONTACT                          |              PRE-SALES DISCUSSIONS                          |           ...
documenting the designfiles eliminates the guesswork.                   9/19/2012 - LISA SABIN-WILSON
WE BUILT A SITEMAP - WHICH WAS HELPFUL...BUT IT WASN’T ENOUGH                9/19/2012 - LISA SABIN-WILSON
WE HAD A 16 PAGE STATEMENT OF WORKBUT IT STILL WASN’T ENOUGH           9/19/2012 - LISA SABIN-WILSON
PSD Files Acquired.    DESIGN APPROVAL DONE!                            9/19/2012 - LISA SABIN-WILSON
A TOTAL OF 26 DIFFERENT PAGE VIEWS/LAYOUTSBELIEVE IT OR NOT ... THIS WAS STILL NOT ENOUGH   9/19/2012 - LISA SABIN-WILSON
at this point?it is really tempting to digright in and startdeveloping this bad boy.                     9/19/2012 - LISA ...
the sooner you get it done...the sooner you get paid.the sooner you can update your portfolio.the sooner the client is hap...
right?         9/19/2012 - LISA SABIN-WILSON
What they wanted... ?       LISA NEEDS TO START DEVELOPMENT NOW                      BECAUSE    WE WANT THIS DONE & LIVE I...
What they needed... ?                STOP ... TAKE A BREATH ...         LISA NEEDS TO DEFINE THE DEVELOPMENT    IN A WAY T...
eliminate  removeobliterate assumptions.
as a developer - I canmake assumptions withthe BEST of them
assumptions are based ona persons own frame ofreference.
what i see in my head willbe different from what yousee in your head.
interpretations will vary.
For example . . .
THE LANDING PAGETHERE IS A LOT GOING ON HERE
i made some assumptions           :(                 9/19/2012 - LISA SABIN-WILSON
THE LANDING PAGEMORE PHOTOS? IT’S A SIDEBAR CAROUSEL - IT FLIPS THROUGH STAFF PHOTOS
THE LANDING PAGETHE REALITY .... THE CLIENT’S INTENTION ? ...
THE LANDING PAGETHE REALITY .... IT’S A SLIDESHOW/CAROUSEL OF PHOTOS IN THE MAIN BODY
a sidebar carouselis HUGELY differentthan a slideshow in themain content area.                    9/19/2012 - LISA SABIN-W...
if i had gone with myinitial assumption withoutdiscovering the clientsintention ...                    9/19/2012 - LISA SA...
i would have wasted time.                   9/19/2012 - LISA SABIN-WILSON
i would have presentedincorrect work to theclient.                  9/19/2012 - LISA SABIN-WILSON
i would risk the clientlosing confidence in me.                  9/19/2012 - LISA SABIN-WILSON
especially if i had mademy next assumption . . .                    9/19/2012 - LISA SABIN-WILSON
THE LANDING PAGEREMEMBER THIS?     9/19/2012 - LISA SABIN-WILSON
THE LANDING PAGEJOIN OUR EMAIL CLUB - - LINKS TO A PAGE WITH A SUBSCRIPTION FORM - RIGHT?
THE LANDING PAGENOT EXACTLY - CLICK IT AND IT OPENS INLINE - NO NEW PAGE LOAD.   9/19/2012 - LISA SABIN-WILSON
THE NAVIGATION MENULINKS TO INTERNAL PAGES?   9/19/2012 - LISA SABIN-WILSON
THE LANDING PAGENOPE! IT CONTAINS A FLY OUT MENU WITH SUB NAVIGATION   9/19/2012 - LISA SABIN-WILSON
none of this was indicated        •INITIAL REQUIREMENTS        •STATEMENT OF WORK        •SITE MAP        •PSD FILES      ...
a smart developer       •RECOGNIZES GAPS       •ASKS QUESTIONS       •SEEKS ANSWERS       •REQUIRES CLARIFICATION         ...
i have not always been asmart developer      •WASTED HOURS UPON HOURS      •FRUSTRATING BACK AND FORTH      •LOST MONEY   ...
when you have your handson the approved designfiles - get into the mind ofthe user                    9/19/2012 - LISA SABI...
you know ....the person who is actuallygoing to use the web site                   9/19/2012 - LISA SABIN-WILSON
you will do yourself andyour client a favor if youstart asking questionslike...                     9/19/2012 - LISA SABIN...
whathappenswhen I clickthis?               9/19/2012 - LISA SABIN-WILSON
how many photosare loaded into thiscarousel?what happens when iclick “more photos?”does clicking on anindividual photo tak...
asking questions likethese gives the clientthe chance to correctyour assumptions...“oh no, that’s not for those photos ......
so then you canclarify....•HOW MANY PHOTOS?•ARE THEY LINKED TO ANYTHING?•ARE THESE POSTS WITH FEATURED IMAGES?•DOES THIS H...
whereverthere is anactionindicated ...clarify it                9/19/2012 - LISA SABIN-WILSON
Never beafraid to...ask questionsget clarificationcorrect your assumptions
Doing soshows ...initiativemotivation to do it rightconfidencethoroughness
but wait ....don’t stop at simply havingthe conversation                   9/19/2012 - LISA SABIN-WILSON
document it.               9/19/2012 - LISA SABIN-WILSON
make it part of thecontract.                      9/19/2012 - LISA SABIN-WILSON
before you lay down onesingle piece of code - getyour client to sign off on it.                      9/19/2012 - LISA SABI...
find amethod youprefer - butdefinitelydocument it               9/19/2012 - LISA SABIN-WILSON
•AUDIO: RECORD THE CONVERSATION•OLD SCHOOL: SPREADSHEET•CONCEPT SHARE•HTTP://WWW.CONCEPTSHARE.COM•CAGE APP•HTTP://WWW.CAGE...
whatever method youchoose to use - make sureyou document the process                  9/19/2012 - LISA SABIN-WILSON
Documenting eachelement in the projectadded approximately2 hours.                    9/19/2012 - LISA SABIN-WILSON
if it wasn’t documented              ...      it didn’t happen                 9/19/2012 - LISA SABIN-WILSON
The End.           9/19/2012 - LISA SABIN-WILSON
Upcoming SlideShare
Loading in...5
×

Documenting Design: A Critical Step in Any Developers Workflow

5,773

Published on

Designer, author and entrepreneur Lisa Sabin-Wilson walks through the critical step of documenting design with your client and how it will save you time and help your clients.

2 Comments
9 Likes
Statistics
Notes
No Downloads
Views
Total Views
5,773
On Slideshare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
0
Comments
2
Likes
9
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • BEFORE NEXT SLIDE - In my years working as a Registered Nurse...we had a daily saying to remind us...\n
  • \n
  • \n
  • Documenting Design: A Critical Step in Any Developers Workflow

    1. 1. documenting designa critical step in any developers work flow 9/19/2012 - LISA SABIN-WILSON
    2. 2. Lisa Sabin-Wilson•DESIGNER SINCE 1998•“DEVELOPER” SINCE 2003•DEVELOPER SINCE 2007•AUTHOR: WORDPRESS FOR DUMMIES•OWNER: EWEBSCAPES DESIGN STUDIO 9/19/2012 - LISA SABIN-WILSON
    3. 3. documenting design ... 9/19/2012 - LISA SABIN-WILSON
    4. 4. lives within that preciousspace betweendesign &development 9/19/2012 - LISA SABIN-WILSON
    5. 5. Let’s call itassumption alley - -because this is whereMOST of the assumptionsbegin and then stick. 9/19/2012 - LISA SABIN-WILSON
    6. 6. EliminateAssumptions• Saves time• Reduces headaches• Avoids hard feelings• Happy client• Happy developer 9/19/2012 - LISA SABIN-WILSON
    7. 7. SetExpectationsEarly• Keeps project realistic• Keeps projects on time• Avoids miscommunication• Happy client• Happy developer 9/19/2012 - LISA SABIN-WILSON
    8. 8. DocumentProjectRequirements• Ready reference point for all• Eliminates “he said/she said”• Provides a work flow• Happy client• Happy developer 9/19/2012 - LISA SABIN-WILSON
    9. 9. NOT YOUR AVERAGE JOESPROJECT HTTP://NYAJ.COMDATE CLIENT JULY 2012 NOT YOUR AVERAGE JOES
    10. 10. NOT YOUR AVERAGE JOE’SPROJECT HTTP://NYAJ.COMDATE CLIENT JULY 2012 NOT YOUR AVERAGE JOE’S
    11. 11. INITIAL CLIENT CONTACT | PRE-SALES DISCUSSIONS | INITIAL REQUIREMENTS |Typical STATEMENT OF WORK |work flow DESIGN PROCESS | DESIGN APPROVAL | DEVELOPMENT | TESTING | GO LIVE! 9/19/2012 - LISA SABIN-WILSON
    12. 12. INITIAL CLIENT CONTACT | PRE-SALES DISCUSSIONS | INITIAL REQUIREMENTS |New-Typical STATEMENT OF WORK | DESIGN PROCESSwork flow | DESIGN DOCUMENTATION | DESIGN APPROVAL | DEVELOPMENT | TESTING | GO LIVE!
    13. 13. documenting the designfiles eliminates the guesswork. 9/19/2012 - LISA SABIN-WILSON
    14. 14. WE BUILT A SITEMAP - WHICH WAS HELPFUL...BUT IT WASN’T ENOUGH 9/19/2012 - LISA SABIN-WILSON
    15. 15. WE HAD A 16 PAGE STATEMENT OF WORKBUT IT STILL WASN’T ENOUGH 9/19/2012 - LISA SABIN-WILSON
    16. 16. PSD Files Acquired. DESIGN APPROVAL DONE! 9/19/2012 - LISA SABIN-WILSON
    17. 17. A TOTAL OF 26 DIFFERENT PAGE VIEWS/LAYOUTSBELIEVE IT OR NOT ... THIS WAS STILL NOT ENOUGH 9/19/2012 - LISA SABIN-WILSON
    18. 18. at this point?it is really tempting to digright in and startdeveloping this bad boy. 9/19/2012 - LISA SABIN-WILSON
    19. 19. the sooner you get it done...the sooner you get paid.the sooner you can update your portfolio.the sooner the client is happy. 9/19/2012 - LISA SABIN-WILSON
    20. 20. right? 9/19/2012 - LISA SABIN-WILSON
    21. 21. What they wanted... ? LISA NEEDS TO START DEVELOPMENT NOW BECAUSE WE WANT THIS DONE & LIVE IN LESS THAN 30 DAYS. 9/19/2012 - LISA SABIN-WILSON
    22. 22. What they needed... ? STOP ... TAKE A BREATH ... LISA NEEDS TO DEFINE THE DEVELOPMENT IN A WAY THAT TAKES QUESTIONS OUT OF THE ENTIRE DEVELOPMENT PROCESS. 9/19/2012 - LISA SABIN-WILSON
    23. 23. eliminate removeobliterate assumptions.
    24. 24. as a developer - I canmake assumptions withthe BEST of them
    25. 25. assumptions are based ona persons own frame ofreference.
    26. 26. what i see in my head willbe different from what yousee in your head.
    27. 27. interpretations will vary.
    28. 28. For example . . .
    29. 29. THE LANDING PAGETHERE IS A LOT GOING ON HERE
    30. 30. i made some assumptions :( 9/19/2012 - LISA SABIN-WILSON
    31. 31. THE LANDING PAGEMORE PHOTOS? IT’S A SIDEBAR CAROUSEL - IT FLIPS THROUGH STAFF PHOTOS
    32. 32. THE LANDING PAGETHE REALITY .... THE CLIENT’S INTENTION ? ...
    33. 33. THE LANDING PAGETHE REALITY .... IT’S A SLIDESHOW/CAROUSEL OF PHOTOS IN THE MAIN BODY
    34. 34. a sidebar carouselis HUGELY differentthan a slideshow in themain content area. 9/19/2012 - LISA SABIN-WILSON
    35. 35. if i had gone with myinitial assumption withoutdiscovering the clientsintention ... 9/19/2012 - LISA SABIN-WILSON
    36. 36. i would have wasted time. 9/19/2012 - LISA SABIN-WILSON
    37. 37. i would have presentedincorrect work to theclient. 9/19/2012 - LISA SABIN-WILSON
    38. 38. i would risk the clientlosing confidence in me. 9/19/2012 - LISA SABIN-WILSON
    39. 39. especially if i had mademy next assumption . . . 9/19/2012 - LISA SABIN-WILSON
    40. 40. THE LANDING PAGEREMEMBER THIS? 9/19/2012 - LISA SABIN-WILSON
    41. 41. THE LANDING PAGEJOIN OUR EMAIL CLUB - - LINKS TO A PAGE WITH A SUBSCRIPTION FORM - RIGHT?
    42. 42. THE LANDING PAGENOT EXACTLY - CLICK IT AND IT OPENS INLINE - NO NEW PAGE LOAD. 9/19/2012 - LISA SABIN-WILSON
    43. 43. THE NAVIGATION MENULINKS TO INTERNAL PAGES? 9/19/2012 - LISA SABIN-WILSON
    44. 44. THE LANDING PAGENOPE! IT CONTAINS A FLY OUT MENU WITH SUB NAVIGATION 9/19/2012 - LISA SABIN-WILSON
    45. 45. none of this was indicated •INITIAL REQUIREMENTS •STATEMENT OF WORK •SITE MAP •PSD FILES 9/19/2012 - LISA SABIN-WILSON
    46. 46. a smart developer •RECOGNIZES GAPS •ASKS QUESTIONS •SEEKS ANSWERS •REQUIRES CLARIFICATION 9/19/2012 - LISA SABIN-WILSON
    47. 47. i have not always been asmart developer •WASTED HOURS UPON HOURS •FRUSTRATING BACK AND FORTH •LOST MONEY •FRUSTRATED CLIENTS •SCOPE CREEP •NEVER ENDING PROJECT 9/19/2012 - LISA SABIN-WILSON
    48. 48. when you have your handson the approved designfiles - get into the mind ofthe user 9/19/2012 - LISA SABIN-WILSON
    49. 49. you know ....the person who is actuallygoing to use the web site 9/19/2012 - LISA SABIN-WILSON
    50. 50. you will do yourself andyour client a favor if youstart asking questionslike... 9/19/2012 - LISA SABIN-WILSON
    51. 51. whathappenswhen I clickthis? 9/19/2012 - LISA SABIN-WILSON
    52. 52. how many photosare loaded into thiscarousel?what happens when iclick “more photos?”does clicking on anindividual photo takeme anywhere? 9/19/2012 - LISA SABIN-WILSON
    53. 53. asking questions likethese gives the clientthe chance to correctyour assumptions...“oh no, that’s not for those photos ...it’s for the main photos on the left!” 9/19/2012 - LISA SABIN-WILSON
    54. 54. so then you canclarify....•HOW MANY PHOTOS?•ARE THEY LINKED TO ANYTHING?•ARE THESE POSTS WITH FEATURED IMAGES?•DOES THIS HAPPEN ON OTHER PAGES?•OR JUST THE HOME PAGE? 9/19/2012 - LISA SABIN-WILSON
    55. 55. whereverthere is anactionindicated ...clarify it 9/19/2012 - LISA SABIN-WILSON
    56. 56. Never beafraid to...ask questionsget clarificationcorrect your assumptions
    57. 57. Doing soshows ...initiativemotivation to do it rightconfidencethoroughness
    58. 58. but wait ....don’t stop at simply havingthe conversation 9/19/2012 - LISA SABIN-WILSON
    59. 59. document it. 9/19/2012 - LISA SABIN-WILSON
    60. 60. make it part of thecontract. 9/19/2012 - LISA SABIN-WILSON
    61. 61. before you lay down onesingle piece of code - getyour client to sign off on it. 9/19/2012 - LISA SABIN-WILSON
    62. 62. find amethod youprefer - butdefinitelydocument it 9/19/2012 - LISA SABIN-WILSON
    63. 63. •AUDIO: RECORD THE CONVERSATION•OLD SCHOOL: SPREADSHEET•CONCEPT SHARE•HTTP://WWW.CONCEPTSHARE.COM•CAGE APP•HTTP://WWW.CAGEAPP.COM 9/19/2012 - LISA SABIN-WILSON
    64. 64. whatever method youchoose to use - make sureyou document the process 9/19/2012 - LISA SABIN-WILSON
    65. 65. Documenting eachelement in the projectadded approximately2 hours. 9/19/2012 - LISA SABIN-WILSON
    66. 66. if it wasn’t documented ... it didn’t happen 9/19/2012 - LISA SABIN-WILSON
    67. 67. The End. 9/19/2012 - LISA SABIN-WILSON

    ×