D / RACING

Dashboard Designs - UI & UX ▸ NDA

One of the biggest racing organizations decided to create an internal dashboard in which team admins and members be able to view the performance of their drivers before, during, and after each race. I was assigned to work on this exciting project, which was a great chance to combine a nice UI with a solid UX input.

01-cover

GETTING STARTED

When I started on this dashboard project, I had limited resources such as Excel files and written documents with several restrictions. In another saying, I was supposed to create the most efficient data visualisation to give users every single detail available before and during the race.

I worked on UX and UI, also on the art direction with the client. I asked tons of questions, learnt how this should work and started on initial designs, even skipping wireframing!

02a

 On the initial screen, team members can see all drivers take a place in the next race (and also during the race). On the bottom, the timeline shows which day the data is available with a subtle comparison (ups and downs) for each driver. A team member only can see their own drivers which is indicated with a label on the top left. 

Other initial options are placed around the focus area. These options are selector for Season, Race for that specific season, List and Graph views for presented data, if available. And as the main navigation, we have Leaderboard, My Drivers and Global View. My Drivers is an alternative option to access specific team drivers.

02b

 Once a driver is selected, this is the screen a team member will have. Since there are always two drivers per team, I placed them side by side to make the data available for comparison and easy follow up rather than creating an extra step. 

For each driver, team members have a simple breakdown for Online and Social votes, details for country-based votes and race results and points for the actual race and social voting scores.

02c

If a team member wants to see a more detailed view of country breakdown for their drivers' votes, this is the screen they look at. With simple navigation (considering it may be a desktop or tablet) they can click/tap on the map between indicated (blinking dots) areas to see where do votes come from. 

The bigger circles get, the more votes it means. So team members can see where they are doing a good job on social media and they can focus on wherever they would like to get more votes!

ASSET MANAGEMENT

elements

 Since we didn't have access to existing assets, I recreated every single element by following styles from the Formula-E website. Then I added bits and pieces like background textures, gradients and small hover/tap states - essentials really. 

And the good thing is, every single thing we created as an asset was used on FanBoost website design as well. I ended up having a nice, tidy symbol library in Sketch. 

There is more on this project (a responsive website), just give me a shout if you want to know more.

Selected Works

D / RACINGWeb & Tablet UI/UX Design

WesleyanDesktop UI Design

hayuVideo on Demand mobile and tablet app

DotmailerWeb App UI and Ux

Acremonte DistilleryResponsive Web Design

Deviant RobotBranding and Illustrations

WorkPlace - iPad AppMobile/Tablet Design

Better FacilitiesUX and Information Architecture

TicketmasterUX study on search functionality

Battle CrownGame 3D and Texture Design

Logofolio 1Logo and Branding 2010-2017