Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Anatomy of a Large Website Project

1,131 views

Published on

The Mountaineers is the premier outdoor education nonprofit in the Pacific Northwest, with over 10,000 members and over 2,000 volunteer-led courses and activities every year. Their website, mountaineers.org, is the critical link between their members and volunteers and the outdoor learning that the organization offers. When they embarked on a major upgrade project, they took a holistic view of how they had used technology in the past and how they wanted to use it in the future. They had a clear vision to guide them: the website had to be deeply engaging for their target audiences, and easy for volunteers and members to use; and it had to simplify and improve as many of their processes as possible.

In this session from the 2016 Nonprofit Technology Conference, we’ll describe the life cycle of this major website redesign project:

- Defining the strategy driving The Mountaineers mission and website
- The requirements discovery process, including a huge community engagement effort
- The technology choices we made and why
- The importance of user experience (UX) design
- The agile process used to manage development
- Managing data and content migration, testing, and site launch
- Website support and ongoing evolution

Along the way, we’ll highlight the practices that made this project so successful.

Published in: Technology
  • Be the first to comment

Anatomy of a Large Website Project

  1. 1. 23 March 2016 Jeff Bowman, The Mountaineers Sally Kleinfeldt & David Glick, Jazkarta Karen Uffelman, Percolator Consulting #16NTCwebanatomy Anatomy of a Major Website Redesign Project
  2. 2. Housekeeping Collaborative Notes: http://po.st/webanatomy-16NTC
  3. 3. Presenters Jeff Bowman IT Manager The Mountaineers jeffb@mountaineers.org Sally Kleinfeldt Director of Consulting Services Jazkarta sally@jazkarta.com Karen Uffelman Principal Percolator Consulting karen@percolatorconsulting.com David Glick Architect/Developer Jazkarta david@glicksoftware.com
  4. 4. Anatomy of this Session 1. A gorgeous, hard-working site 2. Keys to Success 3. The strategy & vision 4. What does technical discovery look like? 5. UX & visual design 6. The build: timeline, process & shifting priorities 7. Bumps in the road 8. The project doesn’t end at launch...
  5. 5. The Mountaineers
  6. 6. Where We Were
  7. 7. Where We Are Now: A Gorgeous, Hardworking Website
  8. 8. Blog
  9. 9. Member Profiles
  10. 10. Badges
  11. 11. Member Profiles: Badges
  12. 12. Course and Activity Search
  13. 13. Course Registration
  14. 14. Shopping Cart
  15. 15. Rosters
  16. 16. Rosters Continued
  17. 17. Dashboards
  18. 18. Keys to Success
  19. 19. Keys To Success Solid Strategy Agile Process Trusted Partners
  20. 20. Okay… Let’s go!
  21. 21. The Strategy & Vision
  22. 22. Engagement Strategy 1. Theory of Change 2. Audiences 3. Roles & Value Propositions 4. Superpowers 5. Engagement Pyramid 6. Secret Shopping
  23. 23. Theory of Change
  24. 24. Theory of Change
  25. 25. Audiences
  26. 26. Superpowers
  27. 27. How could the new website facilitate ENGAGEMENT?
  28. 28. Secret Shopping
  29. 29. What Does Technical Discovery Look Like?
  30. 30. Agile
  31. 31. Things Change Priorities Requirements Personnel ?!?
  32. 32. Graceful Change
  33. 33. Agile Essentials User stories Iterations Communication
  34. 34. User Stories As a <role> I want <goal> so that <benefit>
  35. 35. Requirements Gathering
  36. 36. The Business Requirements Document
  37. 37. Requirements List (screenshot of Ryan’s list)
  38. 38. Turn Requirements into User Stories
  39. 39. User Stories
  40. 40. Technical Architecture
  41. 41. Product vs. Platform
  42. 42. The Mountaineers Platform
  43. 43. How big is it?
  44. 44. Bad Estimation http://xkcd.com/1658/
  45. 45. Bottom Up
  46. 46. Planning Poker
  47. 47. Planning Poker
  48. 48. Top Down
  49. 49. Hard Choices
  50. 50. UX & Visual Design
  51. 51. Developers & Designers: Coordination is Key
  52. 52. What good UX process looks like
  53. 53. One million wireframes
  54. 54. The Value of Visual Design
  55. 55. Visual Design: Creative Brief
  56. 56. The Build: Timeline, Process & Shifting Priorities
  57. 57. Timeline May June July Aug Sept Oct Nov Dec Jan Feb Mar Apr May 6, 2013 May 5, 2014 Launch! 20 Development iterations UX Design Visual Design & Theming Data Migration TestingDiscovery
  58. 58. ● Jeff Bowman, Project Owner ● Sally Kleinfeldt, Project Manager ● David Glick, Carlos de la Guardia, Cris Ewing, Plone Developers ● Chris McCullough, Karen Uffelman, Strategy Consultants ● Matthew Scholtz, Nicolas Campbell, John Fine, Salesforce Developers ● Kevin Brooks, HTML/CSS developer ● Darrell Houle, UX Designer ● Neal Maher, Graphic Designer
  59. 59. Iterations Timeboxed Highest priorities Testable product
  60. 60. How it Works from: extremeprogramming.org
  61. 61. What happens in an iteration? S M T W Th F S Iteration planning Standup Standup Standup Standup Demo work in progress testing & bugfixing
  62. 62. Special Snowflakes
  63. 63. Data Migration Run migration TestFix
  64. 64. Testing
  65. 65. Bumps in the Road
  66. 66. Executive Commitment
  67. 67. Choosing Your Project Partners
  68. 68. Contingency Planning
  69. 69. What Happened in this Project?
  70. 70. The project doesn’t end at launch...
  71. 71. Dealing with bugs, etc.
  72. 72. Collecting 
 User Feedback
  73. 73. Does the launched website ACTUALLY work?
  74. 74. Does it continue to work over time?
  75. 75. Long-term Budget
  76. 76. In Conclusion Engagement strategy + robust technical discovery + agile development + strong UX and visual design + the right project partners + executive buy-in and internal leadership + contingency planning + commitment to ongoing development = GORGEOUS, HARDWORKING SITE
  77. 77. Please Complete the Feedback Survey! Evaluation Link: http://po.st/mxsS9Q
  78. 78. Questions? Jeff Bowman IT Manager The Mountaineers jeffb@mountaineers.org Sally Kleinfeldt Director of Consulting Services Jazkarta sally@jazkarta.com Karen Uffelman Principal Percolator Consulting karen@percolatorconsulting.com David Glick Architect/Developer Jazkarta david@glicksoftware.com

×