She says final-dissecting-khepp

228 views

Published on

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

  • Be the first to like this

No Downloads
Views
Total views
228
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

She says final-dissecting-khepp

  1. 1. DISSECTING A PROJECTBUILDING A WEBSITE
  2. 2. PITFALLS AREEVERYWHEREBUT NOT HIDDEN
  3. 3. DON’T FORGET EVERYTHING THAT HAPPENS BELOW THE WATER. PROJECTS NEED PLANNINGThanks Chris Berger
  4. 4. THERE IS NO SILVER BULLET EVERY PROJECT IS DIFFERENTAlthough no project is the same, there are key steps that are standard that you need to keep in mind to move
  5. 5. LET’S GET GOING The client likes it. The paperwork is signed. Let’s go. SOME THINGS TO THINK ABOUT: The concept calls for what kind of technology? What are the target devices? Just desktop? Mobile? Where will this live (hosted) and for how long? What does it do and how is measured? Does the content need to be updated after launch?This is what I would do. Not the right-way becauseguess what, there is no right or wrong way. Is theremanagement post-launch?
  6. 6. BREAKING IT DOWNTHE ELEMENTS
  7. 7. KEY STEPS Discovery Define Design Development / Build / QA- Bring up the sabra site now
  8. 8. KEY REQUIREMENTS FOR THE SITENeed to build a product site:- Create a simple, visual appealing, innovative,universally accessible resource for consumers to get allof the sabra-related info in one place.- Give users an ability to embrace sabra with content.- Stay Relevant. offer information on how to integrateSabra into their diet with product and nutritionalinformation
  9. 9. Project Plan Discovery Define Design BuildDiscovery Phase QA Testing
  10. 10. DISCOVERY Functional Questions: What Questions should we ask, what is the needs we need to call-out?Ex. For example, a functional requirement is that an author needs to create a content article easily. It is not that a content management system needs to be purchased. So you don’t say what needs to be done, you say what “functionality” needs to exist in the new application or site. Other examples of functional requirements:An article cannot be published until it is reviewed and approved by an editor•A product cannot be purchased until an email address is given
  11. 11. DISCOVERY Functional Questions: - What functions do we need on the site (do users need to login? what would the flow be?) - Is there a need for a DB, are we collecting information? - Is the user being launched out of the site? - We want a promotional area - Users the ability to print the recipes - Ability to search for a store in their areaEx. For example, a functional requirement is that an author needs to create a content article easily. It is not that a content management system needs to be purchased. So you don’t say what needs to be done, you say what “functionality” needs to exist in the new application or site. Other examples of functional requirements:An article cannot be published until it is reviewed and approved by an editor•A product cannot be purchased until an email address is given
  12. 12. DISCOVERY Technical Questions: What Questions should we ask, what is the needs we need to call-out?Ex. For example, a functional requirement is that an author needs to create a content article easily. It is not that a content management system needs to be purchased. So you don’t say what needs to be done, you say what “functionality” needs to exist in the new application or site. Other examples of functional requirements:An article cannot be published until it is reviewed and approved by an editor•A product cannot be purchased until an email address is given
  13. 13. DISCOVERY Technical Questions: -Server Needs – What type of server will it be hosted (existing or does this need to be determine - DB Needs? - Where will the Website be hosted? Will site be on a dedicated or shared server? - Does the site need to have a CMS built behind it - Are there already metrics platform being used, or can we set up tracking? - Metrics - What are we tracking?-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  14. 14. TECHNICAL SPECS EX.-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  15. 15. TECHNICAL SPECS EX.-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  16. 16. PROJECT CALENDAR-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  17. 17. DISCOVERY Final Deliverables: - Timeline - Technical / Functional Requirements - Technical / Functional Specs - Metrics Defined Teams Included in this Phase: - Producer - Tech Lead - Information Architect - Creative - Analytics (strategy)-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  18. 18. Project Plan Discovery Define Design BuildDefine Phase QA Testing
  19. 19. DEFINE- Are we creating templates? How Many?- Did we include all functionality that was included in the specs- Does the User Flow make sense?
  20. 20. DEFINE Final Deliverables: - Site Map - User Flow/Test flow - Wireframes (Templates - HP, Product/Recipe Carousel, Product/Recipe detail, Store Locator, Article Page) - Copydeck Teams Included in this Phase: - Producer - Tech Lead - Information Architect - Creative-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  21. 21. Project Plan Discovery Define Design BuildDesign Phase QA Testing
  22. 22. DESIGNNot some many questions for this phase, but more staying on top of the creative.- Are we staying true to the wireframes?- is creative staying on strategy and brand?- are there any assets that also need to be created?- do we need to provide a style guide?
  23. 23. Final site designs
  24. 24. DESIGN Final Deliverables for this phase: - Site Map - PSDs - Asset Created - PDF StoryBoards Teams Included in this Phase: - Producer - Creative - UX Designer - Potential Developer - Tech Lead-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  25. 25. Project Plan Discovery Define Design BuildBuild Phase QA Testing
  26. 26. DEVELOPMENT / BUILD / QA- Continually checking in to verify development is moving- Is the development matching up to the Functional specs defined- Is the creative true to psds handed over- Does the site match the defined User Flow?- Manage QA verification (Quality Assurance Plan)
  27. 27. SITE CMS
  28. 28. DEVELOPMENT Final Deliverables for this phase: - Live Site Teams Included in this Phase: - Producer - UX Designer - Potential Developer - Tech Lead-­‐   Technology  should  be  determined  based  on  your  audience,  not  based  (ex.  Don’t  do  ;lash  for  the  want  of  ;lash)  If  a  site  needs  to   be  addressing  search  needs,  you  cannot  build  in  ;lash
  29. 29. When you want to make a change to something already built it is like untangled spaghetti.It looks like a big mess of spaghetti?
  30. 30. BUILD ITRIGHT THEFIRST TIMEOR BUILD IT TWICE
  31. 31. EXTRAS
  32. 32. HELPFUL RESOURCES PSD2HTML DESIGNERS TOOLBOX A LIST APART Turns your PSD into a functioning A variety of templates including For people who make websites. HTML page. They can add web browser frames and web-safe JavaScript and even do WordPress areas. Articles covering topics such as templates. Founded in 2005, they code, content and culture. claim to now have 50,000 clients. Helpful when you need to mock something up inside of a browser Though targeted towards Great for rapid-prototypes and window to simulate the actual user developers the articles are written getting a proof-of-concept in front experience. in a friendly manner to the non of the client fast. technical and could provide some www.designerstoolbox.com solid educational reading. Excellent customer service. www.alistpart.com Inexpensive with a quick turnaround. www.psd2html.comPSD2HTML does strict compliant clean code including WAI 2.0, Section 508, print style-sheets
  33. 33. THE END
  34. 34. QUESTIONS?

×