About This Project

The Support site has a concept called a “family page,” which is a page that allows people to navigate to specific Support pages in that “family,” while also offering some content. The concept wasn’t working for Mac, but what is the right mix of content & navigation for this page?

My Role

I teamed up with a Content Strategist to determine the mix of information for the page, a Researcher to gather data and help interpret the results, and a CMS Integrator to build each version and advise on design compatibility.

The Challenge

The Mac Support page had high traffic and good amount of click throughs... on two links.

This is the Mac family page as it was a few months ago. The design started with navigation to hardware and software pages, but also had quite a few links to other content.

The only things people were clicking on were two of the Mac products from the hardware navigation at the top of the page. The next biggest “click” users were doing was to exit the page entirely!

There were two competing ideas of what to do with this page. Our Mac Integrator proposed turn it into a pure navigational page. I felt strongly that featuring the right mix of content more prominently (above the nav) would drive traffic through those links and get people where they needed to go even faster.

After considering the different ideas, I proposed a three-phased test approach to see what the right direction was going to be.

ReseArch and Analysis

We'll Do It Live!

We've never been able to get "true" A-B testing set up. As such, our normal course of business is to make changes in some lower-traffic country who's usually patterns followed the US, and see what happens. To my surprise (and delight), the Integration Manager was on board with doing our changes live on the US site.

(The A-B testing is a saga worth telling someday, but this isn't the place. As is the real reason this was allowed to be a US site experiment)

So began the experiment.

Phase 1

For this phase, I kept all of the pieces the same and simply swapped the navigation element to near the bottom of the page. This gave the content a chance to be seen before the users navigated away.

While I didn’t think the content on the page was the right mix, I wanted to keep the page the same other than the nav switch to have an accurate comparison between the two versions.

Phase 2

One of our site’s most used page areas is what we call the “utility promo bar,” a component that sits just below the hero area and points to highly-relevant and highly-trafficked pages. This bar gets as high as half the click-through on some pages.

For this phase, I simply added a utility promo bar to see what that might do to the traffic. All other elements stayed the same from phase 1.

Phase 3

For this phase, I went through all the data for our most popular Mac-related pages. I was looking for content that had a lot of traffic and was well-rated by our users.

I kept the utility promo bar as-is, but changed all the content below that. I also updated the navigation to match the standard look from Marcom, as well as using our new Contact layout.

The hypothesis was that if this page showcased all the most popular content, users would click something here instead of navigation or search.

Key Findings

There's a reason why you test your hypotheses...

We tracked click-throughs all the way through the different phases and learned quite about along the way.

Moving the navigation down in Phase 1 did drastically reduce the clicks on it. All the other elements did see an uptick in clicks, but not nearly enough to make up for the reduction from the nav.

The exits from the page nearly doubled.

In Phase 2, the utility promo bar performed way above my expectations. The fourth promo for Mac repair shot up to be the #1 click for the page. This change also began to reduce the page exits, as well as users clicking on Contact or using Search. The only other item to see significant clicks was the Get macOS High Sierra promo.

3-19 Mac Family Optimization smooth phase 3.png

When I thought back about my experience with other Support pages, Repair was often the #1 click on those as well. This data was telling me that there was a good chunk of users who were looking for either a link to their hardware product (often to click Repair) or a direct link to Repair itself.

For phase 3, the data threw me another curveball. The hypothesis that giving users the most relevant content on this page would lead to higher click-through was shown to be wrong.

The traffic to the page was down slightly overall, so all the numbers went down slightly except two. Search went down about about double everything else while Exits stayed flat. It looks like this page made it slightly less likely that a user would search, possibly because they feel like the page is pretty thorough. At the same time, it made the user slightly more likely to exit, perhaps for the same reason (“if I don’t see my answer here, they probably don’t have it”).

The biggest thing to take away here is, making the page content-focused did next-to-nothing for its performance, and moving the navigation down drove the click-through rate down significantly.

I was wrong, and that's okay!

Now it was time to come up with a final version.

Final Design

Navigation and promotion page.

For this final version, I focused on the pieces that worked and discarded those that didn’t.

Key features:

Leads with promotional space for Update and Repair, the only non-navigation items to get any sort of clicks (in the case of Repair, the majority of them)
Showcases navigation followed by Search
Includes a promo space for AppleCare (management request), so that sits below Search along with the new Contact design

This version is live now and I am expecting data on its performance soon.

< Back to Portfolio