Datamilk
DataMilk is a tool that optimizes e-Commerce websites with new UI/UX elements and AI-driven personalised content. Business model is simple: we improve the experience for our customers clients with effective UI and AI-driven personalization, clients get more sales we charge by optimized sessions that delivered growth.
I was a design lead, managing and guiding a team of 3 middle designers and 1 webflow developer, and working closely with the sales and product teams to ensure that the design team's work aligns with the overall goals of the organization.
I joined DataMilk just after they closed seed round, so I had to do a lot of things from the scratch. As part of the early team, I was responsible for a wide range of tasks, from finding a new visual language for the company to building the website and designing a process for creating sales materials, incorporating right solutions and fining new employees to execute on tasks and goals.
1. Sales materials production system
Our company is targeting enterprise businesses, thus we have a sales process that involves creating personalised presentations for each potential client.
Our features are mostly dynamic, so we are using gifs in these presentations to show how exactly they will function on a client's website. That brought lot of work to the historical method of producing these sales decks, so one presentation took 4 hours of work.
Our features are mostly dynamic, so we are using gifs in these presentations to show how exactly they will function on a client's website. That brought lot of work to the historical method of producing these sales decks, so one presentation took 4 hours of work.
The problem was, we had 5 sometimes 6 sales people in the company and 2 designers that worked with presentations. Moreover, we actively participated in exhibition throughout the year, so on these days we could need around 20 presentations during the day. So I was to find a way to supply the volume.
Historically, sales decks were owned my sales people, so the company did the presentation in Google Slides.
So to create a live demo presentation, a designers would have to prepare prototypes, record screen, convert it gif, and insert the gif into Google Slides.
So the most time consuming and wasteful part was converting animated prototypes into small gifs and inserting them into the presentation.
So to create a live demo presentation, a designers would have to prepare prototypes, record screen, convert it gif, and insert the gif into Google Slides.
So the most time consuming and wasteful part was converting animated prototypes into small gifs and inserting them into the presentation.
So it was obvious to me that we need to do two things:Cut all the steps between Figma and Google Slides
So, I decided that the sales team will use the Figma presentation link. As the result we cut all the steps of converting our Figma designs to Google Slides. As a bonus advantage, we fixed the issue with bad looks of the animations (Google Slides required compressing the gifs), so in Figma they looked cutting-edge.
Automate preparation of prototypes I built a system of reusable elements for every step of an animation, that allowed just adding new customer’s visuals and that’s it. I also created a brief tutorial for designers, so we found several freelance designers that could prepare presentations independently.
In addition, I developed a process for the sales team to request sales materials, and created and managed a tracking sheet, to ensure the production is timely and accurate
So, I decided that the sales team will use the Figma presentation link. As the result we cut all the steps of converting our Figma designs to Google Slides. As a bonus advantage, we fixed the issue with bad looks of the animations (Google Slides required compressing the gifs), so in Figma they looked cutting-edge.
Automate preparation of prototypes I built a system of reusable elements for every step of an animation, that allowed just adding new customer’s visuals and that’s it. I also created a brief tutorial for designers, so we found several freelance designers that could prepare presentations independently.
In addition, I developed a process for the sales team to request sales materials, and created and managed a tracking sheet, to ensure the production is timely and accurate
As the result I developed a system that allows efficiently producing a large number of presentations, including emergency presentations when needed.
2. Corporate site and visual language
We saw two main goals of our corporate site:Getting new leadsHelping to convert lead into clients, mainly when at the step of gathering information before demo or after the demo when they make a decision
When I joined the company, DataMilk had a one-pager with basic design, and my task was to develop a complex structured website to communicate our complex product and create a visual identity of a modern tech product and young cool team.
This is the current website project plan with progress, with a structure that communicates product’s complex structure and shows competitive advantages.
We had small traffic so it’s impossible to check hypothethis via classic a/b tests, so I decided to use two metrics:
1. Feedback from our sales and customers;
2. Time people read our pages and how deep they read it.
1. Feedback from our sales and customers;
2. Time people read our pages and how deep they read it.
I tried several approaches with a visual style:
In our 1st iteration, our home page followed the structure of the company's sales deck, communicate the key points from the sales pitch to potential clients. The structure reads from top to bottom, guiding the user's attention and talks about why they need our product rather than what the product is.
I checked metrics and that our users don’t scroll down the site and quickly leave the site.
I checked metrics and that our users don’t scroll down the site and quickly leave the site.
Session Duration:
0.35 min
User behaviour:
Users don’t scroll down the page
Hypothesis:
People don’t understand what product is presented and bounce.
People don’t understand what product is presented and bounce.
To quickly check the hypothesis, we first changed the headline only, saw the difference in people’s behaviour and then expanded the test to change the entire page from a pitch structure to a clear product offering.
Session Duration:
1.76 min
User behaviour:
More clicks on other site sections and down the page
Outcome:
We saw a significant increase in conversion, session duration, and effectiveness after making these changes and confirmed the hypothesis that as it is a mature market, our audience knows the connection between experience optimization and increased sales and are looking for a solution of the kind, so we need to focus on clarity and showing competitive advantages.
We saw a significant increase in conversion, session duration, and effectiveness after making these changes and confirmed the hypothesis that as it is a mature market, our audience knows the connection between experience optimization and increased sales and are looking for a solution of the kind, so we need to focus on clarity and showing competitive advantages.
Design-wise, we decided to remove the tech-y connotation and imply with visuals that we speak with everyone, not only engineers.
Session Duration:
2.93 min
User behaviour:
More cross-links
As the result of this development, we now have a complex but clear communication of our product with three main pages that communicate the competitive advantages of our product, that we also use as landing page for various ad campaigns.
Final designs
Results
More cases: