USER EDUCATION

Campaign insights was a brand new product. This product also introduced a lot of new design components that were not yet present in other surfaces on Pinterest for Business. The content design on this product needs to be a combination of tooltips, in-product text that was descriptive enough for the user to understand the product and informative errors and empty states. I also created a tour to introduce the product to the user. This tour was going to remain on the page for the user to access later, whenever they needed it.

Entry point education

Campaign insights would open up from the existing Ads reporting interface. The button was new. I used a pulsar to draw attention to the button, focused on the value of the new product in the education and added a button to the help center content so the user can learn how to get more out of this new product.

Product tour

Campaign insights was going to be rolled out over three releases and every release would have a few new features. I got the entire product team on board to include a brief and simple product tour with every release since the plan included several new features per release. This was the product tour for the first release. 

The intro focused more on the value of this new product. I used an encouraging and informative tone throughout. 

Instead of telling the user what to do on the page, I decided to highlight what the user could gain from the modules. The tour was only an intro and overview; it should work in combination with tooltips without repeating the instructions. I strategically placed the steps in a way that the user gained just enough context and not an overwhelming amount of information. I also broke the information into short, simple bullets to make it easily digestible. I also made sure that every step had a skip button and a way to stop the tour. 

The tour was bound by a few engineering constraints. One was that it was going to be difficult to highlight whole modules and sections on this page as part of the tour without running into bugs. I also didn't want the tour to be too long, so to keep it snappy, I decided to focus on some module headings instead. This would also allow us to only update that step of the tour if new sections were added to the module in further releases.

Tooltips

The first module was Performance summary. The module's heading and the graph underneath would change based on the time period the user selects.

I didn't want the user's understanding of this data to only depend on the colors in the visual. To avoid any accessibility issues and confusion surrounding the percentage increase/decrease and the graph, I made the tooltip for the metrics as descriptive as possible. 

I gathered all the tooltips on different ads product surfaces (including the ones I wasn't covering) and the help center and ensured that the metric definitions were consistent, simpler and more concise. I then presented the metric and section tooltips to the rest of the content design team to drive alignment across all the product areas and include them in the content standards we were building.

Errors and empty states

One of my bigger projects at Pinterest was to build an error and alert standards and framework. Errors and empty states must tell the user precisely and succinctly what's wrong, why and how to fix it.

It's important to place the education and encouragement where the user can actually perform an action or change something. In the case of Campaign insights, the user was only going to see some targeting information displayed on the page. They weren't going to act on this information right here. 

It also matters at what stage the users get this information. Are they going to change the targeting after the ad goes active? What's the best amount of information to give them? Based on all these learnings, I wrote the errors and empty states. 

For the earliest version, I wrote a "just in case" error that didn't explain anything and kept things frustratingly vague. This would be a placeholder for bugs and other unexpected situations where we couldn't explain to the user what was going on until we could clarify things.

I made the empty states succinct. I also considered adding a help center link to help the user learn more, but when we tested it out with the users, they made it clear that the additional information was no help; what they really needed was this much information. This made the most sense for this page.

I went on a quest to find the surfaces where the users set up the interests and keyword targeting and made sure to include more education there instead.