UX/UI DESIGN
I was tasked with creating the UI of data visualisation dashboards for advertising campaign performance. The dashboards were going to be developed on Power BI.
To create dashboard mockups to display data about the client’s advertising campaigns, and their performance and KPIs.
I needed to create dashboards for the client’s data from amazon advertising and Facebook ads. The data visualisation already existed, but needed a better UI.
I was given a specific structure and hierarchy to follow, as well as specifications on how the dashboards needed to behave.
I met with account managers and developers to understand the scope of the project and talk about any restrictions to have into account. I was given the original dashboards and data examples so I could work with actual content.
I started with doing some research on the Power BI itself. I wanted to know how it worked, what types of data visualisation were possible, and what other people created using this tool. I also wanted to find the scope of what I could design within the limits of the tool.
I did find some design limitations, this being the only fonts allowed were a small range of Microsoft fonts. The other limitation was that the tool interface was set up in a way that filters and other elements like tabs and icons were already fixed, therefore, I could not change their layout, and I had to take this into account when designing the dashboards.
I had a few discussions with the developers to understand some of the features that the client explicitly requested to be kept in the dashboards. I also worked on some wireframes to communicate how the dashboards would behave and get feedback from the developers and client.
In this case, the feature the client requested allowed every piece of data to be connected to one another. This meant that when selecting one specific piece in Data 1, as shown in the pictures below, Data 2 would sort and show the data specific to that piece. The same happened if other pieces were selected in Data 2, where Data 1 would sort and show the information relative to the piece in Data 2.
Before starting the designs, I wanted to have a foundation of visual elements to start with. I created a little style guide with a font that was allowed on the tool and a colour palette. The choice of colours was so that the data was easily readable and looked clean, so that emphasis was on the data.
These dashboards consisted of four main pages: a general performance overview, brand performance, product performance, and KPIs.
I displayed different use cases to illustrate how the elements interacted and showed more information. This included hover states, drop downs, table sections, and focus states.
These dashboards consisted of four main pages: a general performance overview, audience demographics, ad engagement, and ad investment.
Similar to the Amazon Advertising dashboards, I showcased the behaviour of the different elements within each graph. In this case, I also would like to highlight the feature requested by the client.
Other projects ✦
