Snapshot

The Disconnect
Popdock is a powerful data aggregating platform allowing users the ability to view all of the data from their cloud services through one source. Most users signing up for the trial plan do not use—or know how to use—the product and miss out on the exceptional value Popdock can provide them.

Helping Users Find the Value
By designing a clear visual hierarchy, global navigation, helpful modals providing user guidance, and improved clarity in the content, we worked towards a solution that would help users understand the capability and usefulness of the platform—while giving them easy access to their data and the insights contained within.

Project Type
Team project with three people including myself

My Role
Research, ideation and synthesizing, mid-fidelity wireframes, and prototyping

Timeframe
Three weeks

Discovery

The Current User Experience
Our research revealed that IT and marketing professionals—the potential users of a product like Popdock—do, in fact, frequently generate data reports for stakeholders. This is often a difficult process of pulling the data from various sources and then having to manually analyze that data.

User Testing
In performing our own user tests of the current Popdock interface, we gained some valuable insight as to why users did not continue to engage with the product:

• Confusion about the navigation.

• Lack of clear visual cues.

• Uncertainty about terminology.

• Interface did not perform as expected generally.

Design Hypothesis

How to Increase Engagement
We determined that users would need more assistance upon signing in, and along the way, if they were going to understand how to use Popdock and utilize its powerful features.

Design Priorities
We addressed the following items with our design strategy:

• Design global navigation to prevent users from getting lost.

• Provide directions for users to navigate more effectively with the interface.

• Use alternative terminology to help users with understanding content.

• Clean up the visual design so there is clear visual hierarchy and fewer competing elements.

Prototype

Testing a New Design
Using mid-fidelity wireframes, I built a prototype to test our thinking—and see if our design hypothesis was accurate.

What We Learned
Testing the prototype revealed some improvement, but also some issues that still needed work:

• It was clear that setting up a connector was the first, and most important, way to get started using the product.

• It was still not clear what actions could be taken after setting up a connector.

• The initial connector landing page was still overwhelming with the number of options available.

• The part of the interface displaying raw data had been renamed from "Tabs" to "Lists", but it was still not clear what to use this part of the site for.

Final Mockups

Hi-Fidelity Screens
After testing the prototype we strategized how to overcome the difficulties users had experienced with our mid-fidelity prototype. We implemented these revisions in the hi-fidelity mockups.

Visual Design
With the background visual lightened, varying font sizes and weights introduced, reworking some of the icons, and creating some consistency between elements we were able to clean up and simplify the interface, while creating a stronger sense of visual hierarchy in guiding users eyes through the content.

Guiding Users
With a conversational tone we alerted users to the types of tasks that needed to be performed in order to use the product, and provided information about other steps that could be taken to get the most out of Popdock.

Increasing Engagement
With a global navigation added, content to explain various features of the product, a card displaying recent activity on the home page, and using self explanatory terminology we designed the Popdock interface to engage users and eliminate confusion or ambiguity.

Providing facility managers an intuitive tool for controlling HVAC operations.

Providing users an intuitive alternative for sharing content.

Giving customers quicker access to the help they need.