Content Audit

Content audit was the first step on my journey to improve the IA of the website (as of Feb-April 2018). To limit the scope, I was particularly interested in the content that highlights Hero6 camera, which added up to 13 website pages in total. 

CONTENT AUDIT SUMMARY

1. Almost 50% of content on Hero6 covers Use and Cultivation step of customer journey and targets existing customers.

2. “Pure” support content accomodates for 46% of all content.

3. Despite of the abundance of the support content, this content is hard to find. There is a Support menu option in the top navigation menu but it’s not emphasized strongly enough. Once user clicks on Support, they are taken to the general support page, and often fail to find the user forum where they can get help troubleshoot their issues.

Problem Statement

Based on the content audit, we can identify the first, and as it turned out later, the main problem with the current GoPro website information architecture:

Even though the support content accounts for almost 50% of the website content, it’s hard to find and fully explore.

Initial Site Map

Now that I got myself familiarized with the content strategy and the structure of the current website, I was ready to construct a site map. It will come in handy a bit later, during IA testing, with the goal of identifying usability and IA problems.

User Interviews | User Needs

The next question was:

Who are GoPro users and what are their needs when it comes to the GoPro website?

To answer this, I conducted five in-person interviews with GoPro current and potential users. The following user needs were discovered during the interviews:

1. The need for researching camera accessories, and getting full product specifications.

2. The need for accessing Help and Support functionality to troubleshoot issues with the purchased product;

3. The need to update product software and read product manuals;

4. The need to find out more about the GoPro community;

5. The need to get video editing tips because editing footage is challenging.

Personas

Interviewing users provided valuable insights that I could use for persona creation and redesigning the IA. Two types of users emerged - an active GoPro user who actively participates in content creation and a GoPro community, and a seasonal GoPro user who uses the camera mostly for family vacations twice a year. Based on these insights, I created a primary and a secondary personas. James uses Hero6 for his regular skiing trips. James’s need on the GoPro website is to check community updates, look up camera accessories, get video editing tips, and update the software. Amy uses Hero6 for family trips twice a year, and Amy’s needs are to troubleshoot camera issues, read product manuals, and update product software. I tried to address all these needs during the redesign.

Tree Jack Testing | Usability Problems

By now we already know who our potential users are and the persona, their goals and needs. We know the site architecture, and that one of the problems is that it’s hard to locate the Support and Community pages. Now it’s time to identify other IA problems.

Based on the user needs, I came up with 10 common tasks that users perform on the website. They were:

1. Search for accessories and products;

2. Troubleshoot issues;

3. Consult user manuals;

4. Update firmware;

5. Learn more about GoPro products;

6. Check out what’s new in Community;

7. Watch customer videos;

8. Research video editing options and tips;

9. Search for more advanced products;

10. Find GoPro awards.

Card Sort

After discovering usability issues with the IA of GoPro website, it’s time to explore how users would actually organize the website and see their mental models. For this I used an online card sorting tool CardSort by Optimal workshop. I performed one in-person card sort and four online ones. The respondents were given individual menu items of the current website and were asked to categorize them in buckets. 

There were 24 different groupings created by the respondents. My main take-away from the study is that many respondents were confused about the wording of the categories. For example, some put Quick Stories into the Footer grouping, some put GoPro Rewards into the Account grouping, some put Quick Stories into the Community, and so on. 

People couldn’t tell the content of the menu item based on its name.

Some of the findings helped me redesign the website architecture. For example, I considered putting Refurbished products into the Products category (it is currently under the Footer). And the navigation labels were fixed.

Information Architecture Explorations

Now it was time to start putting pieces of the puzzle together. Based on the user interviews, jack tree testing and a card sort findings, I developed two IA explorations. I went with the first one because it lists more Products, has a bigger Community menu, and breaks down the footer into submenus.

UI Explorations

I selected the first version of the content groupings, and next I explored different UI arrangements for this version.

Version 1 of the UI explorations has the menu located vertically and encourages menu exploration in general, while Version 2 mimics the the current layout, and adds more menu items to it. Both versions have a cleaned up and grouped footer, and a search bar that moved to the upper right corner (it is currently in the middle of the header). I decided to chose the second UI layout because it reflects a more established UI pattern.

Revised Site Map

And, finally, the revised website map of the GoPro website was ready.

Final Designs

I redesigned the IA for the Products, Support and Community menus, as well as the Support Hub IA.

PRODUCTS MENU

Current products menu is located under Shop and contains four items.

Solution

• User’s current location is emphasized by the underlined global navigation menu.

• Product menu has now 6 categories allowing easier access to the most used items.

• Accessories are placed next to Cameras reflecting common mental models. 

• Apps and Refurbished products are now under the Products menu. Refurbished products solve user’s needs for buying cheaper products, and placing them in the user’s view might help GoPro compete against Amazon more effectively. Our James persona would appreciate it.

• Plus warranty now has a clear label - Camera Protection, and it has been moved under Products as well. 

• Community and Support menus are now in a global navigation, and are easily accessible and emphasized.

• Search is located in the upper right corner reflecting a more common location for search.

SUPPORT MENU

Current design doesn’t display the Support menu items upon click on the Support menu. Once you are on the Support page, you see the following menu items.

Solution

• Current website has Support in the secondary navigational menu, it’s lost there and doesn’t display menu items upon click. Now users can quickly access Support and view its content.

• Camera software updates and Product manuals are the first items in the Support menu because  they are most commonly used.

• Video editing tips seems to be popular content, so it was included in the  Support menu.

• To address the business goal of up selling PLUS camera protection, and also to help users get to the product warranty faster, I placed it here as well.

• Community page has lots of Help and Support content so was made more prominent.  

• Contact us was hiden in the Footer navigation, and now it’s a part of the Support menu as well. 

• KARMA is now renamed to Drone because users were confused about what it was.

COMMUNITY MENU

There was no navigation that lead to Community at all (the feature was buried deep under the Support menu), and the actual community created content was under the Watch menu. However, users were confusing this navigation with the product page for a watch which they thought was a GoPro product.

Solution

• I placed Community menu in the global navigation because 50% of the GoPro website content has to do with the Community, and users seem to be interested in it.

• By placing Community Help Hub in the user’s view I wanted to help users get all their questions answered much faster and efficiently.

• Now users won’t confuse Watch menu item with the actual watch product  -  it is clearly communicated that it is all about watching users’ videos and viewing pictures. 

• I included Join the GoPro movement item because most of the current website users are existing users, and it will be great to move them into the Advocacy stage of a customer journey.

• GoPro Video Rewards now have more context as well.  

ACCOUNT MENU

Clicking on the current Account menu only displays Settings and Sign out which seemed like a missed opportunity. Once on the Account page, users can see Add a device, Personal information, and Settings options. Users cannot check Order status from the Account page, only from the Footer or a Support page.

Solution

• Users can now easily access Account submenus from the Home page.

• Now user can add devices from the Account page - it was previously buried in the website. This is very important for the users because one of the most common tasks they perform on the website, per my research, is updating camera software.

• Check order status functionality was previously available in the Footer navigation and from the Support page, which was hard to find. Now it’s in the Account menu, again reflecting common mental models. 

FOOTER NAVIGATION

Current footer contains 16 menu items and uses a tiny font. There is no content classification whatsoever, and the items are placed more or less randomly. This makes it hard for a user to find important items like order status, refurbished products, etc.

Solution

• The redesigned footer navigation menu inspired by the card sort testing, groups the items into the categories that reflect common mental models more effectively. 

• The font is now larger and more readable. 

SUPPORT PAGE

I wanted to redesign a Support page because based on the user research, it is an important destination for new and existing users. It has the following problems.

Problems

• When the user looks at the Community Support Hub page currently, the emphasis is on the search bar, and they don’t see the Help categories (Cameras, GoPro Care, etc.) without scrolling down the page. 

• The page looks very crowded and contains the content that might not be relevant. For example, there is a link to the Youtube video but we don’t know how it’s related to the context of the page.

• Once user navigates away from the Home page and lands on any pages of the GoPro website, there is no indication of where they are on the website.  

SOLUTION

• When user navigates away from the Home page, now he sees the bread crumps indicating her current location on the website. 

• The submenus (Cameras, Accessories & Mounts, Drone, etc.) are now in much closer proximity to the search bar and are visible without scrolling down the page. 

• I added a “Learn to edit your videos like a Pro” item under the categories to help users learn more about video editing. Based on the user research, video editing was very important and appeared to be one of the ways for a user to enter a GoPro community. 

Final Notes

This project showed me how important it is for a designer to make sure that the user can find any information they need without being lost in a deep forrest of website information. Website architecture should reflect common mental models, navigation should use clear labeling, and menu item groupings should make sense. I think that the current version of the GoPro website at the time of the project was lacking this, and I hope that the redesign addressed most of the problems making browsing the website more rewarding. The most challenging part of the project was the content audit because it was very time consuming and reminded me of an archeological adventure, because GoPro has a lots of content.