GoPro Professional

Telling new product stories for the professional consumer.

banner2.jpg

The Problem

GoPro's products are enjoyed by audiences ranging from the casual videographer wanting to share moments with friends and family to the professional looking to create high fidelity media. Their newest hardware product line at the time was a set of tools designed for professional use. Their website, however, did not have the necessary professional tone or language that would befit their new targeted audience for these products.

How can we create an experience catered to the professional consumer while retaining the spirit of GoPro?

The Audience

Professional videographers do not want to suss through a lot of marketing fluff in order to get to what they need. Their needs as a customer differed in that they needed more technical information and the confidence to ensure the professional quality of the products. It was key, however, to not completely alienate the casual consumer so the system needed to be flexible enough to accommodate for audiences of various technical knowledge and interest.


Defining architecture

To begin, we needed to understand how the GoPro Professional site would interact with the existing system. Ideally, it would be a separate portal with its own navigation systems, but understanding the potential technical limitations, we also proposed a compromise solution that would live within the site itself.

High-level partis drawings helped to visually convey this key difference while more in depth site architecture diagrams clarified the relationship of specific pages.

 
arch1a.jpg
arch2a.jpg
 
Reusable modules helped to provide consistency in the designs as well as cut down on development time

Reusable modules helped to provide consistency in the designs as well as cut down on development time

Page content

While GoPro had products in development, it had yet to define the language and messaging for the site. One of our major challenges was to craft that story in a compelling yet straightforward, no-fuss way. As we further developed the designs, we found that it was necessary to show the main points at a glance, but allow the user to dive deeper into the nitty gritty of the technical information at any point without interrupting the experience. This allowed for a flexible system that had an overview on the page but the option to access additional detail.

A reusable system

We also wanted to make a system that could scale and flex over time without too much additional development work. From this, we created a library of modules that could be reused across the different pages.

Each page served as an example template to show GoPro how modules could be pieced together to create certain types of pages like a Tier 1 product or a case study article detail.

See it in action on GoPro.com

Establishing a module library allowed GoPro to create pages piecemeal and equipped them with the necessary parts to make new future pages

Establishing a module library allowed GoPro to create pages piecemeal and equipped them with the necessary parts to make new future pages

Final wireframes helped to establish the product story, content blocks, and hierarchy on each page

Final wireframes helped to establish the product story, content blocks, and hierarchy on each page

 

Project done in March 2016 with Odopod

 

Looking for more?