Growth Driven Design: The Solution To Website Redesigns
2 likes1,407 views
Growth Driven Design (GDD) is a flexible website redesign model that emphasizes continuous improvement based on user data, replacing traditional, static design methods. It involves a strategy launch pad, wish list creation, and an ongoing process of building, learning, and transferring knowledge for significant user experience enhancements. This iterative approach allows businesses to optimize their websites over time, ensuring they remain effective and aligned with user needs.
Growth Driven Design: The Solution To Website Redesigns
- 1. Growth Driven Design THE SOLUTION TO WEBSITE REDESIGNS
- 3. GROWTH DRIVEN DESIGN (AKA GDD) Growth Drive Design is the process of designing a website that consistently improves. It’s a flexible model that allows you to change small things over time to improve your website user’s experience overall. This eliminates the guesswork that goes into traditional website design, and instead bases all changes on statistics and metrics. This model works in all scenarios, even if you’re looking for a complete overhaul of your current website. Let us explain.
- 4. TRADITIONAL WEBSITE DESIGN IS BROKEN. You can make a human in less time than it takes to update a website. Business moves far too fast for that kind of pace.
- 5. Large Upfront Cost For Customer Substantial Time/Resources Commitment Difficult To Keep On Production Schedule Content Collection Takes Forever Customers Not Responsive Changing Mind Scope Creep 100s of Decisions During Project “Everything Must be Perfect!” HERE ARE SOME TYPICAL PAIN POINTS IN TRADITIONAL WEBSITE REDESIGN
- 6. TRADITIONAL GDD 3-9 MONTH BUILD TIME LARGE COST UPFRONT BASED ON ASSUMPTIONS STATIC ON AVG. FOR 2 YEARS COST SPREAD OVER TIME CONTINUOUS IMPROVEMENT BASED ON FACTS & METRICS FLEXIBLE AND ALWAYS UPDATED vs BUSINESS WANTS SOLUTIONS FOR BUSINESS FEATURES USER CHALLENGES SOLUTIONS FOR USERS ALIGN WITH BUSINESS FEATURES
- 7. THE THREE STAGES OF GDD STRATEGY LAUNCH PAD WEBSITE CONTINUOUS IMPROVEMENT
- 8. D Strategy
- 9. IT ALL STARTS WITH THE DISCOVERY MEETING The discovery meeting is our official kickoff session to GDD. During this 4-8 hour session, we will set the strategic plan for the year. This covers everything from website updates to company goals. We’ll analyze the website, dig into the personas, and brainstorm methods for reaching goal. GDD isn’t supposed to be a platform for instant, on-demand website change requests. The purpose of GDD is to identify changes that will affect the goal, and complete changes based on how effectively they will do just that.
- 10. DURING THIS STRATEGY AND IDEATION SESSION, WE’LL LOOK AT: PERSONA RESEARCH DESIRED FEATURES WEBSITE AUDIT BUSINESS GOALS KPI
- 11. THIS IS A USER CENTRIC APPROACH It allows user patterns and desires to dictate their browsing experience, NOT the emotions and opinions of individuals running the website.
- 12. We do this through: • Interviews • Fundamental assumptions • Creating a user journey THE IMPORTANT THING IS TO GET INSIDE A USER’S HEAD AND IDENTIFY THEIR EMOTIONS AND TRIGGERS, BOTH ONLINE AND OFFLINE.
- 13. NEXT COMES NEXT WISH LIST SAMPLE WISHLIST The wish list consists of brainstormed elements that improve user experience and provide measurable value. This is the part of the process where everyone puts on their thinking caps and gets into the user’s shoes. From specific site functions to website content, everything goes on this list. Each item is then rated on its impact. Determine the impact of items by identifying the 20% of projects that will have 80% of the impact. Also be sure to differentiate the ‘nice-to-haves’ from the ‘must-haves.’
- 14. HOW DO YOU KNOW WHAT TO WORK ON? PIE ANALYSIS POTENTIAL IMPORTANCE EASE
- 15. Potential Importance Ease ScoreWishlist Items Update Main Template Design New Homepage Messaging & Hero Migration of Blogs New Service Page Landing Page Optimization Careers Page Resources Section 6 5 1 7 5 8 1 8 9 1 8 8 8 1 4 9 8 5 8 8 5 18 23 10 20 21 24 7
- 16. E X A M P L E CURRENT SITUATION • Website can’t be altered on current CMS • 150 page website • Copy needs to be updated site-wide • Dated design- three templates • Not responsive/No mobile • Confusing navigation/ information flow SOLUTION • Use HubSpot’s Migration Team to bring website to HubSpot COS • Identify the most important pages throughout website, AKA the Launchpad • Review current copy throughout website, rewrite as needed • Design Launchpad pages; design standard template for remaining pages • Design for mobile- ensure that all elements respond for any device • Restructure sitemap and navigation to logically lead user through website
- 17. TYPICAL TIMELINE Days 0 – 10: Strategy & Ideation Days 10 – 15: Site Audit & Launch Pad Planning Days 15 – 75: Launch Pad Build 1 2 3
- 18. Launch Pad
- 19. THE NEXT ACTION STEP TO TAKE IS THE LAUNCH PAD WEBSITE The launch pad website is a collection of the most important pages in your website. These pages have the highest impact, and should be designed and optimized for user experience from the very start.
- 20. YOUR WEBSITE IS NOT A PROJECT TO BE COMPLETED. IT’S A BUSINESS GROWTH ENGINE THAT SHOULD PERFORM AT ITS HIGHEST LEVEL – ALWAYS!
- 21. ONCE YOU HAVE THE LAUNCHPAD COMPLETED AND LIVE... then what ?
- 22. WHERE DOES THAT LEAVE THE REMAINING PAGES? When you’re looking to completely overhaul your website, does using this method mean leaving the majority of your pages in the old design style? No, not at all. Instead, you will put your focus and efforts into these launch pad pages, and use a simplified template for the remaining pages. As time goes on, the wish list determines the most important items to be designed. Eventually, all of the pages that have a high impact on your users will be optimized.
- 23. WHY DO IT THIS WAY? By using the launch pad method, the website redesign can happen quickly while ensuring quality. It narrows the focus and allows the website redesign to be done in bits, not all at once. This means no stressful, massive proofing effort right before launch. It also gives us a chance to gather data on each page and make educated decisions, and not guesses.
- 26. START WITH THE HARVEST PERIOD Once the launch pad website is launched, you will move into the harvest period. You will sweep through your wish list items that didn’t make it into the launch pad and identify low hanging fruit that can be rapidly and easily obtain for quick wins. These can be the result of quick updates based on user feedback and implementing high impact items on the wish list. These are smaller, obvious changes to improve the user experience, and don’t require in-depth experimentation to fix. We
- 27. PLANYou’ve identified an issue with something on your website. Perhaps people aren’t clicking through to the appropriate pages. Perhaps a page is getting a high bounce rate. These types of issues can be resolved through GDD. During the Plan stage, you will want to identify these issues and add them to the wish list. It’s important to gather data surrounding the item you want to improve. This means allowing the website enough time to accumulate views, and then benchmarking those analytics.
- 28. BUT HOW DO YOU GET DATA? Obtaining data is the single most important part about the GDD process. The data gathered will determine all website changes, and therefore all website success. There are a lot of ways to get website data. No matter what applications you use, however, you will need access to heatmaps, user recordings, and analytics. In order to create a website optimized for users, you must get inside their heads and understand the website from their perspective.
- 29. USE THE DATA TO MAKE A HYPOTHESIS By using the launch pad method, the website redesign can happen quickly while ensuring quality. It narrows the focus and allows the website redesign to be done in bits, not all at once. This means no stressful, massive proofing effort right before launch. It also gives us a chance to gather data on each page and make educated decisions, and not guesses.
- 30. QUESTION: “Why aren’t users clicking through to the product page?” RESEARCH: • Analytics show that users are bouncing off many pages- not finding what they need. • Heatmaps show that users are clicking around on pages, but not on links to the product page. • User recordings show that users are scrolling quickly through pages before jumping to the next, clearly not finding what they need. HYPOTHESIS: Users aren’t going to the product page because they’re having trouble finding it. By making product page links more visually obvious through website, we will improve page views by X%.
- 31. BUILDOnce the hypothesis has been formed and an action agreed upon, the next step is to Build. This is the stage where the solution is deconstructed, created, and launched.
- 32. DECONSTRUCTED How will we solve the problem? Who will do what? How long will it take? What are the potential obstacles? How can we help each other to achieve the final result? CREATED All hands on deck to build out the solution, whether this involves designers, content creators, or developers. Experiments will need to be set up to test the effectiveness. LAUNCHED The solution will need to be checked over and quality assurance testing must be done. Once completed, the solution can be launched.
- 33. LEARNThis stage is all about experimentation. We put our hypothesis to the test by allowing the project to accumulate a significant amount of views and reviewing. Without this stage, GDD would just be website updates. By intentionally studying the results of a change, we’re able to determine its success and move forward. It’s important to document your findings.
- 34. LEARNING QUESTIONS Was our hypothesis correct? Why or why not? What did we learn about our users? Did they act as excepted or not? How can we move forward with this knowledge? Do we need to adjust again to solve the issue?
- 35. TRANSFERThe Transfer stage is all about sharing the knowledge. It’s important to share progress, research, user learnings, and experiments results with the whole team. This opens up cross-team recommendations and group problem solving. By keeping everyone in the loop, you ensure that everyone is working towards the same goal.
- 36. WHAT SHOULD YOU SHARE? Put yourself in your teammates shoes- what would they need to know to help get to the goal overall? You won’t always have recommendations of valuable information to bring to the table, and that’s okay.
- 37. REPEATThis is pretty self-explanatory. The whole purpose of GDD is to have a constantly evolving website. By repeating this process over and over, while focusing on the most important areas and issues, we ensure that the website will be flexible and perform at maximum capacity.
- 38. Value Audience Personalization User Experience Conversion Rate Optimization EXAMPLEAREASOFFOCUS
- 40. EXAMPLE: MARCO HOMEPAGE PROBLEM: We noticed that CTAs off the homepage weren’t being clicked, the blog feed wasn’t working, and the different areas on the homepage were not driving traffic to the intended pages. SOLUTION: We thought it might be an ‘under the fold’ problem- the page’s most important content was below the point that viewers saw when first coming to the page. We also thought there were better ways of making the CTAs more noticeable. Version 1
- 41. EXAMPLE: MARCO HOMEPAGE PROBLEM: We changed too much at once. Numbers changed – some up and some down – but we had no really good way of attributing that change to the changes we made in the design because we changed so much at once. SOLUTION: We started small this time around- just changing the ‘hero image’ area (the first large image you see when going to the home page) to lead to the newly launched services page. We set up tracking on both the Homepage and Services page to see user patterns. Version 2
- 42. EXAMPLE: MARCO HOMEPAGE PROBLEM: We realized that this new page- the Services page- was garnering WAY more attention than any other page on the site. People were engaged in this page, and the numbers showed that this was quickly becoming the most important page to our viewers. SOLUTION: We made another big change- but this time with reasoning, data, and user feedback in mind. We made the Services page the new homepage- giving the viewers the very thing they came to the site to see right away. So far it has had an incredible impact sending on qualified visitors to the appropriate pages on the website to continue in their buyer’s journey. Version 3
- 43. DID YOU GET ALL THAT? LeightonInteractive.com/GDD Don’t worry – if you still have questions, you’re not alone. GDD can be a little confusing at first. Overall, the Growth Driven Design model is the single best way to ensure that your website is designed to be your #1 selling tool and resource while remaining flexible and up-to-date. If you have any questions, please feel free to reach out. We also have a free ebook that explains Growth Driven Design in depth. Get your free copy today at: