Redesign of AI technology website

Our mission was to create a responsive website for DreamQuark that would let the users spend time and engage with the content on the website. Potential clients would be captivated at workshops and events by their product but be let down by their website which didn't cary enough information or reflect the good impression they had of DQ from the event they attended

Client

Dreamquark, AI technology for wealth managers



Collab

This was a collab between creative studio Made abroad & branding house Cutler & Goddard



Role

UX/UI designer for Made abroad



Timeline

The project started in December 2020 and was finished in February 2021.

Goal

The goal was to create an engaging website that would represent them well and offer more content to their users



Solution

Solutions included a rebrand to reflect their innovative product, and to increase engagement we added a resources tab where users could dig into event information, white papers,informative articles and gated content.

01

Discover

Desk research, Field studies, Client interview

02

Explore

Competitive analysis, user personas, user journeys

03

Ideate

Brainstorming, Concept sketch, Wireframing

04

Prototype

Low-fidelity, Mid-fidelity and High-fidelity prototypes

01. Discover


In this initial phase we focused mainly on research and gathering all the information we could about the market, Dreamquark and their users.

We kicked off the UX research with a conversation with the Dreamquark team through an online workshop on Mural. The workshop gave us insights on their goals and their users and helped the team form a clear and consice idea of what they wanted.

Their main concern was to have a professional looking website that the users could interact with more that would be responsive and scalable.

02. Explore


Here we focused mainly on the competitors to get a better idea of the market. How does their website look like, how do they structure their content, what are their unique points, how do they explain their service, what type of language they use etc. DreamQuark's differentiates from their competitors DataIku and DataRobot by targeting mainly wealth managers.

Since we didn't get access to their users to interview or survey them we had to rely on online articles and youtube interviews of wealth managers.

User personas


With the purpose of empathising with our users needs and frustrations and get a sense of what it is like to walk in their s shoes I created fictive user personas based on the research

On the right you can see the decision maker, Clara who is VP of sales. For the wealth manager to use a product like Brain from DreamQuark, they would have to convince VP of sales that it is a good idea. Therefore Clara, is the main person we need to convince on the website.

Clara wants to be able to keep up with rapid market changes and she's open to tools that integrate seamlessly and gives business and tech a common language to communicate better

The wealth manager wants to keep their clients happy and to do so in a time efficient manner. The driving factor for them is return of investment (ROI). It is important to get quick, reliable and ethical results and to be convinced they will need to see statistics and proof that it works before presenting it to their VP of sales.

User journeys


The user journeys aims to capture what the user is thinking, feeling and doing while going through the DreamQuark website. In this case a potential new client visits the website to find out whether Brain is a good fit for the company but gets overwhelmed with the text heavy site and ultimately leaves when he finds out he cant get access to a live demonstration of the product straight away.

At the bottom of the chart I also took notes on missed opportunities on how their experience could be improved in every step.

03. Ideate


Through methods like concept sketching and wireframes the project started shaping. The business and user needs were prioritized in order and the aim was to follow that information hierarchy when we made the wireframes.

Rafa, Senior Product designer @Made abroad, showed me a great trick for making sure your wireframe is constructed in accordance with the research findings. This entailed noting down business and user goals in the margin next to the wireframe sections to able to easily keep things in check.

04. Prototype


The prototyping phase was very iterative, like always. We worked hard to find the delicate balance between being informative, concise and easy for the developer to implement since we were working under a tight deadline. There was a lot of discussion on whether to use sliders or not but we found research suggesting that sliders should only used as a last resort as it decreases the visibility of content and most people find them annoying.

The final product

Thank you for reading! You can have a look at the final product here

Learnings

Thanks to a very patient and talented senior designer I learned a lot of helpful tricks to add to my designer toolbelt!

I also learned that UX doesn't necessarily always happen at the very beginning of the project. This was a great challenge for me as I needed to change and adapt my methods in order for the project to reap benefits of UX even with its late arrival in the process.

Music inspo