Dashboard UI Design

Skills used: UI Design, Visual Design, Illustrator, Lofi Wireframes, Hifi Wireframes, Mockup Design, Mobile Design

During my time at MRI Software, I was tasked with creating mockups of dashboards that could potentially be implemented in future projects. Because this was more of a UI design project, I dove straight into the wireframe and mockups of these dashboards.

Task

To create a dashboard that incorporates the visualizations of data to illustrate information to the client

Dashboard component wireframes

The first thing I began designing were the wireframes of dashboard components. This was the first task I tackled because it was important for me to build components that were both informative and visually appealing before building the whole dashboard.

Lofi wireframe

Once the components were designed, it begun creating lofi wireframes of the dashboard layouts. I created multiple iterations of the layout in order to give users the ability to customize how they want their components to be presented. 

Hifi Wireframe

I then took my component designs and combined them with my layout wireframes to create hifi wireframes of what the dashboard would look like overall.

Mockup - Desktop

For the mockups, I created two different states of the dashboard: Default and Hovered.

mockup - Mobile

I also took my desktop mockups and converted them for mobile screens.