The Perfect Website Redesign Project

Capacity Interactive AUTHOR: Capacity Interactive
Oct 13, 2016
Min Read
Listen

Blog_The_Perfect_Website_Redesign_PURPLE_1.png

I want to tell you about The Perfect Website Redesign Project. It happened about a year ago with the Palo Alto Dance Theater Company (or PADT for short), an arts organization started by a group of software engineers in Silicon Valley with a mission to balance the lives of desk-bound coders with inspiring dance programs. My firm had been selected to overhaul the existing website and build a new experience that would:

  • Better represent the breadth of the organization’s offerings.
  • Increase online donations.
  • Increase ticket sales to performances.

Our client was Christine. As Director of Marketing for PADT, she was tasked with overseeing the website redesign project. Christine had over a decade of experience as a marketer in the nonprofit world and had just moved to the arts organization 10 months prior to the start of the website redesign project. In that time, she had already initiated and completed a re-brand of the organization. A local branding agency had helped them with positioning, messaging, and streamlining their visual identity system. By the time Christine called us to let us know we had a project, she had brand guidelines firmly in place.

Christine was very transparent and upfront with us when it came to discussing budget and the structure of the engagement. “From my experience working on these big redesign projects, I know that the website is never 100% perfect when it’s launched. In fact, it’ll probably always need some work. We have a fixed budget for this project that’s mostly being funded by a grant. How about we see what we can get launched with 60 to 70% of the budget and reserve the rest for post-launch enhancements? I’ll also see if we can allocate budget to work with you guys beyond that for on-going optimization work.” Having seen the positive results of long-term engagements that allow for on-going iterations to the website, we wholeheartedly agreed with the approach and negotiated fees for the initial build and for post-launch enhancement work. We loved the long-term view.

Blog_The_Perfect_Website_Redesign_PURPLE_2.png

From day one, Christine made it clear to us how she expected communication to flow throughout the project. She had hired Jill to be the project manager on PADT’s side. Jill would coordinate meetings, provide us with necessary content and info, and be the one to aggregate feedback and streamline comments coming from the PADT team. Christine, for her part, said she would make sure to loop in major stakeholders throughout the process and involve key members early on. She noted that she wanted leaders from development, IT, and programming to be present at a couple of the early workshops to share their perspectives on what worked and didn’t work on the existing site and what they would love to see on the new website. Christine also told us that her boss and Executive Director Sandy would be present for kickoff and for key design presentations. “I’ll make sure Sandy doesn’t hold up the design process,” Christine assured.

The project kicked off smoothly. We had our initial intake discussions and workshops to map out content and align on the creative direction. As we started zeroing in on content, I was pleased to find that Christine and her team were really invested in producing high quality content. They had set aside a sizable budget to produce new content that would be used on the website. We brainstormed and worked through a number of ideas before coming up with a comprehensive content creation plan. Some of the highlights included:

  • A 120-second brand video that succinctly told the story of PADT including its unique mission to help Silicon Valley software engineers appreciate dance.
  • A 60-second clip along with a very visual infographic that outlined the benefits of becoming a member and how a donation can make a big difference.
  • Several video clips of dance performances and classes that we were able to use as ambient background videos on different pages.
  • Beautiful custom icon illustrations to represent each of the organization’s major programs including its School, its Performance Center, and its After School Programs.

Blog_The_Perfect_Website_Redesign_PURPLE_3.png

The PADT team also paid great attention to the written content, getting started on the writing for new sections very early on in the project and even enlisting a copywriter to polish headlines and streamline voice and tone. We were very lucky to have real, approved copy to use in our design mock-ups. This made design reviews more productive and allowed us to spend time refining the details of the experience.

Speaking of design reviews, the PADT team was very receptive when it came to a data-driven approach to design. Earlier in the project, we had reviewed the website analytics together. We noted that mobile traffic was now more than 50% of all website sessions and that a great deal of traffic was coming from Facebook through social posts and paid ads. Another insight was that individual performance pages were popular landing pages, meaning that visitors first landed on those pages rather than the homepage. We decided to start out with mobile designs and focused a large chunk of time on making performance pages more engaging. I was surprised at how quickly we moved through the homepage designs, typically the toughest page to get approved, and how the PADT team was eager to uncover and address more data-backed usability issues.

Turning the designs into a fully-coded website was a very efficient process. We worked in 2-week sprints and had bi-weekly walk-throughs of our progress. As customization on the content management system got farther along, we held training sessions with key PADT team members and got them comfortable with adding, editing, and removing content. They were also very helpful in providing feedback so we could make necessary adjustments in order to make the content management experience more efficient.

The last few weeks of the project went by quickly. We tested the website on multiple browsers and devices, and also got help from the PADT team as they participated in the quality assurance process. We also allocated time to optimizing the website performance, running various speed tests to pinpoint improvement areas, compressing the size of image and video assets, and setting up caching. We prepped for launch day by working closely with the PADT IT team to make sure hosting and DNS settings would be good to go, and we also coordinated with the marketing team on timing for the launch announcements to go out.

We celebrated the launch of the website on a Wednesday. Our teams congratulated each other and immediately saw positive feedback on social media. But we weren’t done. We were gearing up to closely observe initial user behavior, check on the site analytics, and gather qualitative feedback about the new experience. The goal was to build a backlog of enhancements and spend the next twelve weeks working out kinks and iterating on the website, adjusting existing features and introducing new ones as necessary.

The twelve weeks went by quickly, and with great success. We made various adjustments to the website based on user feedback. We introduced A/B testing to certain parts of the website, and we made enhancements to the donation flows, helping to increase conversion rates. After the twelve weeks, PADT signed us on for a monthly retainer to continue making improvements, monitoring user experience, and running A/B tests.

A year after launch, the website still looks fresh and works magically. The PADT team has become experts in managing content, creating new pages, and swapping out assets. We still find ways to add value in optimizing the website. Just the other day, we worked on pushing live some new content modules that will be used on landing pages promoting a special tour series of the dance company. We’ll be monitoring closely to see how well Facebook ad traffic converts once it hits the page.

Blog_The_Perfect_Website_Redesign_PURPLE_4.png

What I’ve shared above is a work of fiction. Well, sort of. It is, in fact, a composite of many of our client experiences over the years. Our team at Barrel has been blessed to work with all kinds of brands and nonprofit organizations over the years, and we’ve been exposed to it all. And we’ve come across many Christines who were smart, pragmatic, decisive, and had an eye on long-term success.

In a world where the digital experience is increasingly shaped by mobile devices and social channels, the website needs to be a flexible platform that can quickly understand visitor intent and facilitate the user’s desired action. The Perfect Website Redesign Project is no longer about crafting that beautiful homepage or introducing cool scroll effects; it’s about investing in and building a critical business tool that can power the growth of your organization.

Blog_The_Perfect_Website_Redesign_PURPLE_5.png

Peter Kang is the Creative Director and Co-Founder of Barrel, an interactive design and development agency in New York. Barrel was a sponsor of Digital Marketing Boot Camp for the Arts in 2016.