Successfully reported this slideshow.

Creating Sustainable Website Processes

1

Share

Upcoming SlideShare
Untangling the web - week 3
Untangling the web - week 3
Loading in …3
×
1 of 147
1 of 147

Creating Sustainable Website Processes

1

Share

Download to read offline

Description

DPM Summit 2016 Breakout Workshop, San Antonio TX

Transcript

  1. 1. CREATING SUSTAINABLE WEBSITE PROCESSES DPM Summit 2016 Natalie Semczuk @talkanatalka #dpmsummit2016
  2. 2. Hello
  3. 3. SUSTAINABLE WEBSITE PROCESSES
  4. 4. SUSTAINABLE WEBSITE PROCESSES • Considers the content manager • Makes scaling the site easier • Helps your team provide support • Provides a better foundation for post- launch site maintenance, growth and usage
  5. 5. SO, WHY DO WE NEED TO CARE?
  6. 6. POST-LAUNCH IS IMPORTANT
  7. 7. FOR YOUR CLIENT, THE SITE ONLY BEGINS TO EXIST AFTER LAUNCH
  8. 8. WEBSITES EVOLVE Website changes and maintenance are inevitable. Why not make it as easy, consistent, and valuable as you can for both yourself and your clients?
  9. 9. LET’S TALK ABOUT CLIENTS
  10. 10. WHO ARE YOUR CLIENTS? Activity
  11. 11. GENERALLY: OUR CLIENTS HAVE VERY DIFFERENT BACKGROUNDS
  12. 12. HOW DO OUR CLIENTS UPDATE THEIR SITES?
  13. 13. THESE VARIATIONS LEAD TO MANY DIFFERENCES IN SITE MANAGEMENT
  14. 14. SITE MANAGEMENT DIRECTLY IMPACTS USER EXPERIENCE
  15. 15. HOW?
  16. 16. HOW? (We’re getting to that)
  17. 17. BUT FIRST:
  18. 18. CONTENT DEBT
  19. 19. SUZANNE CHAPMAN csffct.co/uslib “…Organizations with large websites have a growing problem with…“content debt.” And like with “deferred maintenance” of buildings (the practice of postponing repairs to save costs), allowing too much…content debt will result in costing you much more in the long run.”
  20. 20. SUZANNE CHAPMAN csffct.co/uslib “…Organizations with large websites have a growing problem with…“content debt.” And like with “deferred maintenance” of buildings (the practice of postponing repairs to save costs), allowing too much…content debt will result in costing you much more in the long run.”
  21. 21. SUZANNE CHAPMAN csffct.co/uslib “…Organizations with large websites have a growing problem with…“content debt.” And like with “deferred maintenance” of buildings (the practice of postponing repairs to save costs), allowing too much…content debt will result in costing you much more in the long run.”
  22. 22. MELODY KRAMER csffct.co/18fcdb “Buildup of content debt may not be as apparent as technical debt, because it’s unlikely to initially cause software to break. Still, it could easily result in confusion…a greater need for customer support, slower progress, the need for more meetings, more external and internal complaints, and wasted time getting people on-boarded…”
  23. 23. MELODY KRAMER csffct.co/18fcdb “Buildup of content debt may not be as apparent as technical debt, because it’s unlikely to initially cause software to break. Still, it could easily result in confusion…a greater need for customer support, slower progress, the need for more meetings, more external and internal complaints, and wasted time getting people on-boarded…”
  24. 24. MELODY KRAMER csffct.co/18fcdb “Buildup of content debt may not be as apparent as technical debt, because it’s unlikely to initially cause software to break. Still, it could easily result in confusion…a greater need for customer support, slower progress, the need for more meetings, more external and internal complaints, and wasted time getting people on-boarded…”
  25. 25. GREAT PROCESSES PREVENT CONTENT DEBT
  26. 26. CONTENT DEBT CAN TAKE THE FORM OF:
  27. 27. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content
  28. 28. CONTENT DEBT CAN TAKE THE FORM OF:
  29. 29. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content
  30. 30. CONTENT DEBT CAN TAKE THE FORM OF:
  31. 31. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content Bloated upload directories
  32. 32. CONTENT DEBT CAN TAKE THE FORM OF:
  33. 33. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content Bloated upload directories Broken links
  34. 34. CONTENT DEBT CAN TAKE THE FORM OF:
  35. 35. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors
  36. 36. CONTENT DEBT CAN TAKE THE FORM OF:
  37. 37. CONTENT DEBT IS PREVENTABLE
  38. 38. CONTENT DEBT STARTS WITH US
  39. 39. CONTENT DEBT STARTS WITH US (Our teams, our work, our projects)
  40. 40. LET’S DO AWAY WITH: Hard-coded content
  41. 41. LET’S DO AWAY WITH:
  42. 42. LET’S DO AWAY WITH: Hard-coded content Poorly defined formatting options
  43. 43. LET’S DO AWAY WITH:
  44. 44. LET’S DO AWAY WITH: Hard-coded content Poorly defined formatting options Intensive image requirements
  45. 45. LET’S DO AWAY WITH:
  46. 46. LET’S DO AWAY WITH: Hard-coded content Poorly defined formatting options Intensive image requirements Lack of documentation
  47. 47. LET’S DO AWAY WITH:
  48. 48. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  49. 49. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  50. 50. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  51. 51. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  52. 52. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  53. 53. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION = FRUSTRATION
  54. 54. GIVING OUR CLIENTS THE TOOLS TO MANAGE THEIR SITES MAKES FOR BETTER USER EXPERIENCE
  55. 55. WE CAN REVERSE ENGINEER OUR PROCESSES TO INCLUDE EDUCATION + EXPECTATIONS
  56. 56. LET’S TALK PROCESS!
  57. 57. DISCOVERY, RESEARCH, AND PLANNING
  58. 58. WHO MANAGES THE CONTENT? Activity
  59. 59. GOAL: IDENTIFY YOUR CLIENT’S CONTENT MANAGEMENT WORKFLOW Who manages the content?
  60. 60. GOAL: IDENTIFY YOUR CLIENT’S CONTENT MANAGEMENT WORKFLOW Who manages the content? Tools: 1. Questions & the 5 Whys 2. Content Workflow and Responsibilities map
  61. 61. CREATE A POOL OF QUESTIONS YOU MIGHT ASK YOUR CLIENT ABOUT CONTENT MANAGEMENT Activity
  62. 62. CREATE A POOL OF QUESTIONS YOU MIGHT ASK YOUR CLIENT ABOUT CONTENT MANAGEMENT Activity Hint: Use “the 5 whys” to dig into the root of your questions.
  63. 63. DISCUSS: What questions did everyone come up with? What sort of questions did you end up needing to break down? Did these lead to further questions? What is a common unclear area that might be resolved with questions?
  64. 64. SORT YOUR QUESTIONS INTO A CHRONOLOGICAL CHART: WHERE IN THE CONTENT PROCESS DO THESE QUESTIONS FIT? Activity
  65. 65. SORT YOUR QUESTIONS INTO A CHRONOLOGICAL CHART: WHERE IN THE CONTENT PROCESS DO THESE QUESTIONS FIT? Activity 1. Needs discovered 2. Creation 3. Approval 4. Publication
  66. 66. DISCUSS: Where you able to see these distinct stages of content creation in your questions? Did you identify gaps in your questions?
  67. 67. WE CAN USE THESE TECHNIQUES TO CREATE A CONTENT WORKFLOW & RESPONSIBILITIES MAP
  68. 68. SOME CAN BE EXTREMELY SIMPLE:
  69. 69. OR IT COULD BE MUCH MORE COMPLEX: csffct.co/RGfGOu
  70. 70. OVERALL GOALS: • Educate ourselves and our clients about their content management workflow • Get clients thinking about their own process • Manage expectations from the start • Provide value prior to final launched product
  71. 71. DESIGN PHASE
  72. 72. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS
  73. 73. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS Style guides Pattern libraries Front-end frameworks Atomic design
  74. 74. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS
  75. 75. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS csffct.co/iaYqPP
  76. 76. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS
  77. 77. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS csffct.co/OuBxih
  78. 78. WE CAN THINK OF DESIGN + CONTENT AS PATTERNS AS WELL
  79. 79. RECOGNIZE CONTENT BLOCKS THAT ARE USED IN THE SAME WAY WHEN WE REVIEW DESIGN
  80. 80. BY THINKING IN CONTENT PATTERNS, WE CAN CONNECT FRONT-END USABILITY WITH BACK-END SUSTAINABILITY
  81. 81. HOW DO WE IDENTIFY THESE PATTERNS? Discussion/Activity
  82. 82. HOW DO WE IDENTIFY THESE PATTERNS? Discussion/Activity (and what do they look like?)
  83. 83. INVISION APP MARKETING SITE
  84. 84. INVISION APP MARKETING SITE
  85. 85. FEATURE PAGES
  86. 86. PATTERNS START TO EMERGE ACROSS PAGES
  87. 87. WHAT CAN WE INFER FROM THESE SIMILARITIES?
  88. 88. WE CAN UNDERSTAND HOW THIS MIGHT BE CODED MODULARLY
  89. 89. WE CAN ALSO SEE WHERE CONTENT IS USED CONSISTENTLY IN THE SAME MANNER
  90. 90. HOMEPAGE
  91. 91. ENTERPRISE PAGE
  92. 92. TAKE THESE PATTERNS AND MAP THEM
  93. 93. LET’S TRY ONE TOGETHER Discussion/Activity (quickly)
  94. 94. SO, WHAT ARE WE ACTUALLY DOING HERE WITH THIS?
  95. 95. DEVELOPMENT PROCESS
  96. 96. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns
  97. 97. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns
  98. 98. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns Identify content that will be used and updated similarly
  99. 99. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns Identify content that will be used and updated similarly Create specs for content field and entry types
  100. 100. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns Identify content that will be used and updated similarly Create specs for content field and entry types
  101. 101. IDENTIFYING COMMONLY-USED DESIGN + CONTENT BLOCKS HELPS INFORM MODULAR DEVELOPMENT OF CONTENT BLOCKS
  102. 102. CONTENT WORKFLOW MAPS + PATTERNS Helps prioritize development needs
  103. 103. THIS HELPS CREATE LESS MAINTENANCE OVERHEAD FOR OUR CLIENTS
  104. 104. WHICH ENSURES A MORE USABLE SITE POST- LAUNCH
  105. 105. PROCESSES NEED FEEDBACK LOOPS
  106. 106. Planning —> Research —> Design —> Development —> Launch —> Maintenance
  107. 107. Planning —> Research —> Design —> Development —> Launch —> Maintenance
  108. 108. Planning —> Research —> Design —> Development —> Launch —> Maintenance
  109. 109. THANK YOU! Natalie Semczuk @talkanatalka natalie@causeeffect.co causeeffect.co talkanatalka.com
  110. 110. A CASE STUDY
  111. 111. A LARGE PRODUCT STARTUP NEEDED A MARKETING SITE FOR CLOUD- BASED PRODUCT OFFERINGS
  112. 112. SITE CONSIDERATIONS AND DISCOVERIES: • Uses Craft CMS • Has strong, clear company branding guidelines • Creates many one-off marketing landing pages • Uses CTA, product marketing, and resource messaging repeatedly throughout the site • Has a content-heavy site, but with new content offerings and a growing marketing plan • Relies on a small team & tight deadlines to administer the site
  113. 113. WHAT WE STARTED WITH:
  114. 114. WHAT WE STARTED WITH: • Individual pages with specialized fields and elements
  115. 115. WHAT WE STARTED WITH: • Individual pages with specialized fields and elements • Elements defined per page or channel
  116. 116. INITIAL IMPRESSIONS
  117. 117. BUT WE REIMAGINED THIS ALL
  118. 118. WE BEGAN CONCEPTUALIZING CONTENT AS A SERIES OF REPEATABLE, FLEXIBLE BLOCKS
  119. 119. THIS WAS AN ONGOING, AGILE- LIKE PROCESS
  120. 120. WHY THIS WORKED
  121. 121. THE RESULT
  122. 122. SITE IS FLEXIBLE, CUSTOMIZABLE TO ALMOST ALL CONTENT MANAGEMENT NEEDS
  123. 123. CMS IS BEING EXTENDED WITH ADVANCED DEVELOPMENT TO FURTHER CONTROL CONTENT MANAGEMENT EXPERIENCE AND ORGANIZATION OF CONTENT
  124. 124. CONTENT MANAGER IS ABLE TO GROW PAGES AND CONTENT WITH COMPANY’S NEEDS
  125. 125. CONTENT MANAGER CAN SUPPORT MANY NEW MARKETING INITIATIVES
  126. 126. THE SITE IS NOW SCALABLE FOR ALL OF THE COMPANY’S NEEDS IN THE FORESEEABLE FUTURE
  127. 127. THIS MEANS THE CONTENT MANAGER IS HAPPY, THE CONTENT MANAGER’S COMPANY IS HAPPY, AND THE WEB DEVELOPMENT TEAM IS HAPPY
  128. 128. EVERYONE WINS!

Description

DPM Summit 2016 Breakout Workshop, San Antonio TX

Transcript

  1. 1. CREATING SUSTAINABLE WEBSITE PROCESSES DPM Summit 2016 Natalie Semczuk @talkanatalka #dpmsummit2016
  2. 2. Hello
  3. 3. SUSTAINABLE WEBSITE PROCESSES
  4. 4. SUSTAINABLE WEBSITE PROCESSES • Considers the content manager • Makes scaling the site easier • Helps your team provide support • Provides a better foundation for post- launch site maintenance, growth and usage
  5. 5. SO, WHY DO WE NEED TO CARE?
  6. 6. POST-LAUNCH IS IMPORTANT
  7. 7. FOR YOUR CLIENT, THE SITE ONLY BEGINS TO EXIST AFTER LAUNCH
  8. 8. WEBSITES EVOLVE Website changes and maintenance are inevitable. Why not make it as easy, consistent, and valuable as you can for both yourself and your clients?
  9. 9. LET’S TALK ABOUT CLIENTS
  10. 10. WHO ARE YOUR CLIENTS? Activity
  11. 11. GENERALLY: OUR CLIENTS HAVE VERY DIFFERENT BACKGROUNDS
  12. 12. HOW DO OUR CLIENTS UPDATE THEIR SITES?
  13. 13. THESE VARIATIONS LEAD TO MANY DIFFERENCES IN SITE MANAGEMENT
  14. 14. SITE MANAGEMENT DIRECTLY IMPACTS USER EXPERIENCE
  15. 15. HOW?
  16. 16. HOW? (We’re getting to that)
  17. 17. BUT FIRST:
  18. 18. CONTENT DEBT
  19. 19. SUZANNE CHAPMAN csffct.co/uslib “…Organizations with large websites have a growing problem with…“content debt.” And like with “deferred maintenance” of buildings (the practice of postponing repairs to save costs), allowing too much…content debt will result in costing you much more in the long run.”
  20. 20. SUZANNE CHAPMAN csffct.co/uslib “…Organizations with large websites have a growing problem with…“content debt.” And like with “deferred maintenance” of buildings (the practice of postponing repairs to save costs), allowing too much…content debt will result in costing you much more in the long run.”
  21. 21. SUZANNE CHAPMAN csffct.co/uslib “…Organizations with large websites have a growing problem with…“content debt.” And like with “deferred maintenance” of buildings (the practice of postponing repairs to save costs), allowing too much…content debt will result in costing you much more in the long run.”
  22. 22. MELODY KRAMER csffct.co/18fcdb “Buildup of content debt may not be as apparent as technical debt, because it’s unlikely to initially cause software to break. Still, it could easily result in confusion…a greater need for customer support, slower progress, the need for more meetings, more external and internal complaints, and wasted time getting people on-boarded…”
  23. 23. MELODY KRAMER csffct.co/18fcdb “Buildup of content debt may not be as apparent as technical debt, because it’s unlikely to initially cause software to break. Still, it could easily result in confusion…a greater need for customer support, slower progress, the need for more meetings, more external and internal complaints, and wasted time getting people on-boarded…”
  24. 24. MELODY KRAMER csffct.co/18fcdb “Buildup of content debt may not be as apparent as technical debt, because it’s unlikely to initially cause software to break. Still, it could easily result in confusion…a greater need for customer support, slower progress, the need for more meetings, more external and internal complaints, and wasted time getting people on-boarded…”
  25. 25. GREAT PROCESSES PREVENT CONTENT DEBT
  26. 26. CONTENT DEBT CAN TAKE THE FORM OF:
  27. 27. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content
  28. 28. CONTENT DEBT CAN TAKE THE FORM OF:
  29. 29. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content
  30. 30. CONTENT DEBT CAN TAKE THE FORM OF:
  31. 31. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content Bloated upload directories
  32. 32. CONTENT DEBT CAN TAKE THE FORM OF:
  33. 33. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content Bloated upload directories Broken links
  34. 34. CONTENT DEBT CAN TAKE THE FORM OF:
  35. 35. CONTENT DEBT CAN TAKE THE FORM OF: Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors
  36. 36. CONTENT DEBT CAN TAKE THE FORM OF:
  37. 37. CONTENT DEBT IS PREVENTABLE
  38. 38. CONTENT DEBT STARTS WITH US
  39. 39. CONTENT DEBT STARTS WITH US (Our teams, our work, our projects)
  40. 40. LET’S DO AWAY WITH: Hard-coded content
  41. 41. LET’S DO AWAY WITH:
  42. 42. LET’S DO AWAY WITH: Hard-coded content Poorly defined formatting options
  43. 43. LET’S DO AWAY WITH:
  44. 44. LET’S DO AWAY WITH: Hard-coded content Poorly defined formatting options Intensive image requirements
  45. 45. LET’S DO AWAY WITH:
  46. 46. LET’S DO AWAY WITH: Hard-coded content Poorly defined formatting options Intensive image requirements Lack of documentation
  47. 47. LET’S DO AWAY WITH:
  48. 48. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  49. 49. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  50. 50. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  51. 51. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  52. 52. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION
  53. 53. Outdated content Difficult to find content Bloated upload directories Broken links Content styling & display errors HARD-CODED CONTENT POORLY DEFINED FORMATTING OPTIONS INTENSIVE IMAGE REQUIREMENTS LACK OF DOCUMENTATION = FRUSTRATION
  54. 54. GIVING OUR CLIENTS THE TOOLS TO MANAGE THEIR SITES MAKES FOR BETTER USER EXPERIENCE
  55. 55. WE CAN REVERSE ENGINEER OUR PROCESSES TO INCLUDE EDUCATION + EXPECTATIONS
  56. 56. LET’S TALK PROCESS!
  57. 57. DISCOVERY, RESEARCH, AND PLANNING
  58. 58. WHO MANAGES THE CONTENT? Activity
  59. 59. GOAL: IDENTIFY YOUR CLIENT’S CONTENT MANAGEMENT WORKFLOW Who manages the content?
  60. 60. GOAL: IDENTIFY YOUR CLIENT’S CONTENT MANAGEMENT WORKFLOW Who manages the content? Tools: 1. Questions & the 5 Whys 2. Content Workflow and Responsibilities map
  61. 61. CREATE A POOL OF QUESTIONS YOU MIGHT ASK YOUR CLIENT ABOUT CONTENT MANAGEMENT Activity
  62. 62. CREATE A POOL OF QUESTIONS YOU MIGHT ASK YOUR CLIENT ABOUT CONTENT MANAGEMENT Activity Hint: Use “the 5 whys” to dig into the root of your questions.
  63. 63. DISCUSS: What questions did everyone come up with? What sort of questions did you end up needing to break down? Did these lead to further questions? What is a common unclear area that might be resolved with questions?
  64. 64. SORT YOUR QUESTIONS INTO A CHRONOLOGICAL CHART: WHERE IN THE CONTENT PROCESS DO THESE QUESTIONS FIT? Activity
  65. 65. SORT YOUR QUESTIONS INTO A CHRONOLOGICAL CHART: WHERE IN THE CONTENT PROCESS DO THESE QUESTIONS FIT? Activity 1. Needs discovered 2. Creation 3. Approval 4. Publication
  66. 66. DISCUSS: Where you able to see these distinct stages of content creation in your questions? Did you identify gaps in your questions?
  67. 67. WE CAN USE THESE TECHNIQUES TO CREATE A CONTENT WORKFLOW & RESPONSIBILITIES MAP
  68. 68. SOME CAN BE EXTREMELY SIMPLE:
  69. 69. OR IT COULD BE MUCH MORE COMPLEX: csffct.co/RGfGOu
  70. 70. OVERALL GOALS: • Educate ourselves and our clients about their content management workflow • Get clients thinking about their own process • Manage expectations from the start • Provide value prior to final launched product
  71. 71. DESIGN PHASE
  72. 72. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS
  73. 73. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS Style guides Pattern libraries Front-end frameworks Atomic design
  74. 74. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS
  75. 75. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS csffct.co/iaYqPP
  76. 76. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS
  77. 77. DESIGNERS THINK IN PATTERNS TO CREATE MODULAR SYSTEMS csffct.co/OuBxih
  78. 78. WE CAN THINK OF DESIGN + CONTENT AS PATTERNS AS WELL
  79. 79. RECOGNIZE CONTENT BLOCKS THAT ARE USED IN THE SAME WAY WHEN WE REVIEW DESIGN
  80. 80. BY THINKING IN CONTENT PATTERNS, WE CAN CONNECT FRONT-END USABILITY WITH BACK-END SUSTAINABILITY
  81. 81. HOW DO WE IDENTIFY THESE PATTERNS? Discussion/Activity
  82. 82. HOW DO WE IDENTIFY THESE PATTERNS? Discussion/Activity (and what do they look like?)
  83. 83. INVISION APP MARKETING SITE
  84. 84. INVISION APP MARKETING SITE
  85. 85. FEATURE PAGES
  86. 86. PATTERNS START TO EMERGE ACROSS PAGES
  87. 87. WHAT CAN WE INFER FROM THESE SIMILARITIES?
  88. 88. WE CAN UNDERSTAND HOW THIS MIGHT BE CODED MODULARLY
  89. 89. WE CAN ALSO SEE WHERE CONTENT IS USED CONSISTENTLY IN THE SAME MANNER
  90. 90. HOMEPAGE
  91. 91. ENTERPRISE PAGE
  92. 92. TAKE THESE PATTERNS AND MAP THEM
  93. 93. LET’S TRY ONE TOGETHER Discussion/Activity (quickly)
  94. 94. SO, WHAT ARE WE ACTUALLY DOING HERE WITH THIS?
  95. 95. DEVELOPMENT PROCESS
  96. 96. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns
  97. 97. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns
  98. 98. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns Identify content that will be used and updated similarly
  99. 99. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns Identify content that will be used and updated similarly Create specs for content field and entry types
  100. 100. BY IDENTIFYING THOSE CONTENT PATTERNS IN THE DESIGN, WE: Define content with existing design and front-end patterns Flag content that does not fit well within patterns Identify content that will be used and updated similarly Create specs for content field and entry types
  101. 101. IDENTIFYING COMMONLY-USED DESIGN + CONTENT BLOCKS HELPS INFORM MODULAR DEVELOPMENT OF CONTENT BLOCKS
  102. 102. CONTENT WORKFLOW MAPS + PATTERNS Helps prioritize development needs
  103. 103. THIS HELPS CREATE LESS MAINTENANCE OVERHEAD FOR OUR CLIENTS
  104. 104. WHICH ENSURES A MORE USABLE SITE POST- LAUNCH
  105. 105. PROCESSES NEED FEEDBACK LOOPS
  106. 106. Planning —> Research —> Design —> Development —> Launch —> Maintenance
  107. 107. Planning —> Research —> Design —> Development —> Launch —> Maintenance
  108. 108. Planning —> Research —> Design —> Development —> Launch —> Maintenance
  109. 109. THANK YOU! Natalie Semczuk @talkanatalka natalie@causeeffect.co causeeffect.co talkanatalka.com
  110. 110. A CASE STUDY
  111. 111. A LARGE PRODUCT STARTUP NEEDED A MARKETING SITE FOR CLOUD- BASED PRODUCT OFFERINGS
  112. 112. SITE CONSIDERATIONS AND DISCOVERIES: • Uses Craft CMS • Has strong, clear company branding guidelines • Creates many one-off marketing landing pages • Uses CTA, product marketing, and resource messaging repeatedly throughout the site • Has a content-heavy site, but with new content offerings and a growing marketing plan • Relies on a small team & tight deadlines to administer the site
  113. 113. WHAT WE STARTED WITH:
  114. 114. WHAT WE STARTED WITH: • Individual pages with specialized fields and elements
  115. 115. WHAT WE STARTED WITH: • Individual pages with specialized fields and elements • Elements defined per page or channel
  116. 116. INITIAL IMPRESSIONS
  117. 117. BUT WE REIMAGINED THIS ALL
  118. 118. WE BEGAN CONCEPTUALIZING CONTENT AS A SERIES OF REPEATABLE, FLEXIBLE BLOCKS
  119. 119. THIS WAS AN ONGOING, AGILE- LIKE PROCESS
  120. 120. WHY THIS WORKED
  121. 121. THE RESULT
  122. 122. SITE IS FLEXIBLE, CUSTOMIZABLE TO ALMOST ALL CONTENT MANAGEMENT NEEDS
  123. 123. CMS IS BEING EXTENDED WITH ADVANCED DEVELOPMENT TO FURTHER CONTROL CONTENT MANAGEMENT EXPERIENCE AND ORGANIZATION OF CONTENT
  124. 124. CONTENT MANAGER IS ABLE TO GROW PAGES AND CONTENT WITH COMPANY’S NEEDS
  125. 125. CONTENT MANAGER CAN SUPPORT MANY NEW MARKETING INITIATIVES
  126. 126. THE SITE IS NOW SCALABLE FOR ALL OF THE COMPANY’S NEEDS IN THE FORESEEABLE FUTURE
  127. 127. THIS MEANS THE CONTENT MANAGER IS HAPPY, THE CONTENT MANAGER’S COMPANY IS HAPPY, AND THE WEB DEVELOPMENT TEAM IS HAPPY
  128. 128. EVERYONE WINS!

More Related Content

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

×