Jess Eddy UX

case study

Enterprise Dashboard Design
with Actionable Insights

DialedIn is a platform that allows users to create, distribute and track sales pitches. Customers use the DialedIn platform to create and distribute presentations as well as track activity of interaction of presentations. The goal of this project was to redesign their platform starting with a dashboard.

Dashboard Design

Context

Dashboard Utility & Key Actions

Dashboards contain a ton of utility. When done correctly, they do a number of things well such as give users quick insights into what has happened since they were there last, activity and metrics around key actions. Most importantly though, a dashboard allows users to see quickly, what actions they should do next.


Designing for the Workspace First

Since designing a dashboard can be a fairly large task, my initial goal was to break the design process down into smaller steps. I also wanted to make sure the group had more than one option to consider for how to entire UI might come together. I started by designing options for the workspace (the container of the app) first.

01
Designing the
Workspace

Designing the Workspace first, is a great way to start a product design process. I designed four Workspace options. Each option has the same exact navigational structure as defined as part of the initial phase of the project. The difference between them is that each Workspace option shows the navigation elements presented in a different way. This gave the team a chance to consider different UI compilations before diving too deep into the product design.

Designing for the Workspace First on Medium →

Workspace Design

02
Workspaces
With Color

While these options were great too consider, it takes quite a bit of imagination to visualize what the dashboard(s) might look like in their end state. To mitigate this, I pulled some existing dashboard designs out and copied them into the blank space of the Workspace designs and just added a little color to match. Now easily and very quickly, we had solid visuals to look at and better understand. It took all of two minutes for the group to decide which Workspace design they preferred.

Workspace Design With Color

03
Design Iterations
& User Testing

Once the Workspace design was decided upon it was time to design the contents of the dashboard. This took place over five rounds of high-fidelity wireframes. Throughout the design process, I performed user testing:

  • Designs tested with 10 customers
  • Each session was recorded (audio)
  • Feedback for each session recorded on designs in notations
  • All feedback folded into PDF for easy consumption

User testing had a big impact on many of the design decisions made in the dashboard and overall went very well. User testing results made design reviews much easier as instead of basing decisions on a group consensus or individual opinions, the user testing results spoke for themselves.

Dashboard

Example of high-fidelity design with customer feedback.

Dashboard

Example of high-fidelity design.

04
Visual Design

With the high-fidelity wireframes design finished, I started working on the visual design using cues from the aesthetic direction exercise we did in the beginning of the project. Having high-fidelity designs done and some light branding makes the visual design step much more straightforward and it’s easier to look at different aesthetic directions.

Visual Design Dashboard


case study

Designing an Ideation Platform for a Consulting Company →