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.
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.
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.
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.
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.
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:
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.
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.