The Public Persona View

Marketing departments can use Cintell's cloud platform to build and share buyer personas. One of the first things I did at Cintell was redesign the persona view that could be publicly shared. This was an exciting starting point because it laid the groundwork for revamping other parts of the platform moving forward to make the experience of creating a persona more engaging.

The backend functionality already existed, and we didn't want to lose any functionality with the redesign. One of the challenges was displaying all the possible data types and letting the design scale to accomodate any number of attributes and sections. Information had to be easy to find and the site had to be responsive because many users who accessed the finished personas were likely to be on the go.

Currently, personas are printed out on PDF's. To maintain familiarity, I made the main persona and data grouped as one unit that resembled a sheet of paper, allowing sections room to grow and reorganize as more data was added (a purely CSS solution to increase robustness). The meta-level functionality was moved to a separate side pane, which allowed for a nice translation on the mobile version.

The Interview Guide

Next, I was in charge of designing and defining the functionality of a new core product called the Primary Research module which allows marketers to gather intelligence about customers that is accessible company-wide. Based on the intitial high-level requirements about the product, I had to design the product.

Below is the Guide Listing page, which shows the user all of their Interview Guides. On this page it had to be easy to find a particular guide. One way to aid this was to allow tools for filtering and searching. A user might also want quick info about a guide, and in that case it would help to provided quick meta-data about the guide so that they wouldn't need to open the guide up to view that information.

The information hierarchy of the page becomes apparent with just a quick glance, and the design helps reiterate this by guiding your eyes from left to right, even as you scroll down on the page. The left column hold the functions which affect all of the guides, such as sorting. In each Guide section, the left half contains the main info about the Guide, while the right half contains meta-data, such as the number of question, answers, the tags, etc.

Interview Guide Creation

The experience of creating an Interview Guide had to be straightforward, to allow a user to come in and create one with little friction. I wanted to be able to guide a user through the creation process. One way was to set up the steps for creation linearly so that the user would work through the page from top to bottom.