alaskaair.com responsive redesign (2014)

context.

In 2014 Alaska Airlines wanted to redesign its $2.5B e-commerce experience to better exemplify its brand, reduce customer effort, and increase sales.  Alaska worked with an outside design agency to create a vision for the new experience--my job was refine that vision into a production web experience.

my role.

I served as design manager on this project, leading a team of 5 user experience designers and providing input into the work of four visual designers.  As is often the case for design leaders during a big design project, my work varied by day. I provided design direction on decisions big (responsive breakpoints) and small (photo selection); I reviewed and provided feedback on work-in-progress. I also scoped, prioritized, and scheduled work for the designers. 

project goals.

The prior site was functional and performed relatively well from a business perspective, but it wasn't accessible for people with disabilities, it wasn't optimal in merchandising products and services beyond flights, and it didn't work well on mobile. The goals of the project were therefore to 1) improve merchandising , 2) make the homepage and navigation responsive, 3) improve information discovery by rethinking the site navigation, 4) make the site accessible for people with motor and visual impairments, 5) improve conversion rate, and 6) improve the overall customer experience. 

Homepage before

The website homepage prior to the redesign.

The prior site was not responsive, and viewing the main site through a mobile phone or tablet browser resulted in a suboptimal customer experience (horizontal scrolling, tiny touch targets, hover effects not available to touch users, etc.).

Homepage before on mobile (left) and tablet (right)

process.

My first task was to understand the business goals and objectives for the project and ensure everyone was aligned to them. From there, I began to sequence the redesign work. This included undertaking a survey of what major features/pages the site contained. I then worked with the designers to assign areas of ownership for features, and create a high level plan for the work that needed to be done. Then we dug in. As we wanted to completely rethink the site navigation, I conducted an initial series of card sort studies with customers to inform our information architecture; below is an output of one of the card sorts I conducted:

The results of a card sort study I used to inform information architecture for the new site.

Other designers began working on their features, and as part of that process I commissioned and designed usability studies to iterate design work. In fact, the design process was strongly user-centered and throughout the project the design team conducted more than 40 hours of user research (moderated and unmoderated) with more than 100 customers, including work on usertesting.com:

Excerpts from some of the 100+ user tests conducted in support of the redesign.

I even got out to the airport to conduct research myself. (Some of our customers noticed this research--see below.)

Eventually the design was polished enough to move beyond user testing and into the revenue-generating world. Design isn't complete in e-commerce until the data says it meets business goals, and so I opted to A/B test the new experience against the existing one. During A/B testing of the experience, I served as focal to review the data from a design perspective, and hypothesize and propose design solutions to issues that were revealed. From there I worked with the designers to address emergent issues. This lasted until the redesign met its business goals and was made the default alaskaair.com experience. 

people.

My strategic work leading the designers and building the team's ability was the lion's share of my effort and the most rewarding. A large design project should leave a design team stronger than it was before.  As part of that effort I created processes and structures to help the team—and the company--grow into a design-first culture. To do that, the team needed to demonstrate that it could think strategically about design and create a collaborative, inclusive working model where everyone is focused on the customer experience. To enable the designers to create one coherent user experience, I formalized weekly collaboration meetings and established a peer review system. To inspire the designers and create a larger discussion about design, I created an event series featuring speakers and design-related documentaries. To ensure new design work inspired the rest of the company, I instituted monthly design forums that allowed leadership to view the latest design work and be involved in the design process. In short, I worked to build the team and then I advocated for them and the role of design at the company. Ultimately the design team was far more robust as a result of the project.

product.

The resulting website met its business objectives. It was far more modern and engaging, but it was also easier to use on mobile devices with large, touch-friendly fields and buttons as well as more modern interaction paradigms.  The site now has a record high conversion rate (more than 2% higher than late 2014).  Just as importantly, we vastly enhanced the platform, creating an entirely new responsive web experience in addition to  redesigning the desktop experience. Through it all the design team grew in ability and visibility, and we moved away from design-as-service to a strong design culture. 

All-in-all I really couldn't have been more proud of the designers, and I feel proud of my role enabling their success. Below are examples of the site as designed by my team:

Site homepage after

The menu was significantly improved too--we made it responsive, accessible for people with visual/motor impairments, and we also made it easier to find information:

Menu after

This project also committed to making the site homepage responsive (in addition to content pages). This goal was met as well with significant investment in in-person and online usability testing:

Mobile responsive homepage (phone and tablet) after

In total, my team substantially updated the customer experience by 1) improving merchandising , 2) making the homepage and navigation responsive, 3) improving information discovery 4) making the site accessible for people with motor and visual impairments, 5) improving conversion rate, and 6) improving the overall customer experience.  We also updated the overall brand style. The before/after comparison below demonstrates how substantial the improvements were: 

Before and after comparison

 

customer feedback.

Customers responded favorably to our design work too. Among the positive feedback we received were tweets from existing Alaska Airlines customers, like these:

 

hear more!

This was a large and challenging project in that it represented not just an improved visual style and navigation, but also a move toward responsive design. You can learn more about this project (and how to manage large scale redesigns)  in a case study I presented at ConveyUX in 2016.