Overview

‍

My journey with Data Island began when they first approached me to design a prototype for a simple admin dashboard. Following our successful collaboration, I was offered a part-time opportunity to further develop and refine the MVP. The end goal was to deliver a functional product to demonstrate it to potential investors, hotel and restaurant owners.

‍

Limitations

‍

• It may sound obvious, but I have come to realise there's no ideal design process when you have to deal with many factors, be it budget, tight deadlines, or API constraints.
• I thought that the best option would be to prioritise the things together with the team – what is feasible to achieve now and what could be done a later stage. So in my process I tried to adhere to the below Impact-Effort Matrix.

‍

Problem

‍

One of the issues was that in the existing interface everything was competing for attention, it felt a bit noisy and chaotic. Also, the typeface (Rota) was not quite readable.

‍

Another problem was that apart from existing features, the team wanted to add additional functionalities, but I did not have any information how the navigation should work.

‍

On top of that, we had a very narrow choice of colours, predominately orange and black, but for a modern interface it was necessary to come up with a more comprehensive set of colours and shades.

‍

While some design issues were obvious (such as inconsistent icons), others required a more in-depth research and user testing.

‍

Process

‍

While I haven't designed any data-dense dashboards before, I have participated in several workshops on data visualisation. A big thank you to my great teachers, Darjan Hil at Superdot and Christian Schneider at Hochschule Luzern!

‍

Since Data Island did not have any developed personas, I decided to identify the most common types of users based on their roles. I needed to understand what kind of data and metrics is important for users and should be emphasised. As we all know, most of the work on Dribbble and Behance are conceptual and not always meant for real-life applications — they're more for inspiration. For this project, I used some real commercial examples from www.tableau.com as my references.

‍

I also conducted a competitive audit, analysing 4 main competitors in the global market. The majority of them lacked AI features like those in our product, while one had similar AI functionality but was missing killer features we planned to introduce in future versions. In order to get access to a demo version of their product and explore it in more detail, I had to create a different email address and pretend to be a business user to register an account with them. They even called me several times after :)

‍

‍

Next, I created diagrams with a new user flow and checked my ideas with the team.

‍

‍

I started with the pieces of functionalities, and explored several time-tested fonts, comparing factors like x-height, stroke contrast, width, and spacing for suitability in data-dense layouts. As a result, I insisted on using Noto Sans because its x-line height seemed to be more suitable for smaller text sizes, and it was free for commercial use.

‍

I did not introduce any new colours at this stage, as I wanted to explore different layouts ideas, spacing and come up with a more clearer visual hierarchy.

‍

‍

I tested the new font and layouts with functionalities that were ready, and focused on elements that could be implemented within the deadline.

‍

At this stage I started working on a new colour system. The new dashboard should look more professional, so instead of using orange here and there I decided to explore variations of blue and turquoise, colours that feel safe and familiar to many people. Once we reached an agreement with the team on the best colour set, I created primitive and semantic colour variables.

‍

‍

Next, I started systematising values for any future font size decisions, box shadows, spacing etc.

‍

‍

I started building components for the most important design elements, such as cards (widgets). First I created basic components that form part of more high-level components.

‍

‍

The engineering team was also actively working on new AI features, but they could not be fully implemented as the API was not ready. I also faced certain design challenges, as some data could not be generated "on the fly" and the initial solution was not optimal. That is why we decided to design some features later, but to go with the simple version to reduce the risks.

‍

‍

‍

‍

Other screens in production

‍

Analysis of the results

‍

• While we weren't able to implement and launch all the planned features before the anticipated deadline, we did make great progress. During the presentations, users had the chance to try out and test the product, and we gathered valuable feedback that will help us improve moving forward.
• Several hotels decided to subscribe to the paid beta version even before the presentations, which was a key success criteria for the project.
• Some features didn’t perform as expected, particularly with API data retrieval taking longer than anticipated. However, the presentations were a great opportunity for people to interact with the product. We were able to identify key areas for improvement, which will guide my next steps.
• Integrations with major platforms like Booking.com, Expedia.com, and Google.com are highly desirable, and it's clear that users want to send generated responses directly. While these integrations are not yet in place, they are a top priority in the upcoming development phase.
• It became clear that the filter functionality still requires many improvements. We decided to work on enhancing this feature to ensure it meets user expectations.
• We’ve decided to re-evaluate user scenarios through different stages of development. I'm also planning to conduct corridor tests to identify any gaps in the interface and use that feedback to iterate on the designs, ensuring a more user-friendly experience.

‍