Catherine Hicks
User Experience and Product Design Professional

NetBase

NetBase delivers the social intelligence that global brands and agencies use to publish, monitor, analyze and engage with customers in real time. Using a high-precision natural language processing (NLP) engine, our platform processes billions of social media posts to extract structured insights delivered via customizable dashboards. Our solutions enable digital marketing, public relations, brand management, customer service, sales, and product innovation leaders to craft winning strategies faster.

Role & Project Summary

  • Built upon Instant Search to complete a more robust platform

  • We needed a compact, expandable format that would allow multiple types of data coming from multiple sources to be shown on the dashboard
  • The cards will handle all types of data currently and be flexible enough to grow as the product grows, giving users detailed specific information they can manipulate as they see fit
  • The card concept will allow users to eventually manipulate the data in anyway they choose. At launch, the cards gave us clear delineations of data in a more visually appealing way than the outdate enterprise platform that users specifically asked for in the research

Project Constraints

  • The card concept came from a couple different places. The first was from looking at a competitor (Sprout Social) and the second was we had the basic idea of "modules/components" that were editable in the enterprise project, but not to the level of the card format. Looking at these two things together allowed us to come up with the card concept
  • We needed a way to show distinct pieces of data alongside other pieces, allowing the user to get a snapshot of all their relevant metrics in one view
  • We believe using the card structure, alongside the tabular structure they reside in, give us the ability to not only to present the data clearly and cleanly but will allow us to grow as additional features and data is needed

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

NetBase Pro: Card Concept

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?
  • What kind of wireframes did you make?
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing?
  • How many iterations did you have?

Summary

  • We believe using the card structure, alongside the tabular structure they reside in, give us the ability to not only to present the data clearly and cleanly but will allow us to grow as additional features and data is needed
  • We took all the different types of data in the enterprise platform, knowing we were not going to use the full set in the pro offering, and worked through how all the data and all its permutations could be designed to work well in a card format
  • While we were going to be building the Pro platform with a small subset of the data in our enterprise product, we looked at all the data types in enterprise and worked through the exercise of finding the patterns in the data
  • In finding where there were similar data representations, we were able to find all the categories of data types we needed to design to and we built the card system in a flexible enough way that, if needed, we could add to it
  • We worked through many different permuations of what a single and multiple card could be and we came up with the best formats for all the data types we currently had in the enterprise platform
  • Project was successfully launched and within the first month brought an additional 7 figures of profit into the company with companion license purchases