web
New compose for Yandex.Mail
scroll ↓
About the project
Yandex is the largest and the most innovative tech company in Russia, often referred to as Russian Google. I worked on its email service, Yandex.Mail, used by over 20 million people daily (source). It is a very old service initially launched in 2006. It had a lot of legacy and needed a redesign. We started from the most important part — composing emails. Compose is now live and available for all customers.
I was the only designer working on this project responsible both for UX and UI (there was no defined design system in place).
Starting point
Writing an email on Yandex.Mail had many pain points. UI was outdated and cluttered. It was hard to find necessary features. People did not use some features at all and found others confusing, especially in this line of ambiguous icons above the writing area.
Research
✍️ Data analysis. Analyse data and user feedback to the old compose. I was lucky to work on this project with the product manager who gathered a lot of data for each feature and collected all comments relevant to writing emails from customer support.
✍️ Competitor analysis. I analysed both mail clients and messengers that are winning over email in the communication domain.
✍️ User testing. I created multiple prototypes for different features and tested them with my colleagues at Yandex outside of Yandex.Mail team. When I had a final design of the whole compose, my product manager and I brought the full prototype to the UX laboratory at Yandex. The UX researcher tested it with customers from different backgrounds, not only tech professionals I had access to at Yandex.
Link to prototype (sorry, in Russian!)
✍️ Side-by-side. We have an internal tool at Yandex that helps get feedback from a crowd. There is a large pool of people enrolled in this program as testers. I used this tool to test many things: compare new compose with competitors, check if icon metaphors are clear and so on.
✍️ Re-engineering. In parallel, our developer started to code the new architecture. It was necessary to speed up the process — a 20-year-old service has so much legacy.
More flexibility with sizing options
New compose can be shrunk to a smaller size. It allows people to type several messages at once and manage their focus. We were asked to do it long ago, on top of that all the competitors have this pattern so it is by now an industry standard. Also previously the CTA went below the fold when you resize the window, so it was also fixed.
Writing without clutter
I took inspiration from Medium and Paper. They let you focus on writing without distractions. My product manager was very much on board.
✍️ Informed by data and research, I reorganised features according to their priority and moved some outside of that massive line of icons above the writing area.
✍️ I also convinced my manager to remove some unnecessary features, e.g. offering tons of text styles while people used only a few.
✍️ Similarly, we cut the number of emojis and font families we offer.
Refreshing UI
Yandex.Mail still used the old design system created at Yandex a few years back. Since then, the company moved in the direction where services are allowed to experiment and have some flexibility. So I had a chance to come up with some UI solution. It is still based on the newer design system used by the core team at Yandex — Yandex.Search, so that Yandex.Mail looks like it belongs to the larger family of services.
I created icons, chose font sizes (we use YS Text, the company’s font), button styles, corner radius, shadows and so on. I designed all UI elements myself, using feedback from the art director.
Beyond the MVP scope
This redesign was the first step in making email writing work nicely at Yandex. We wanted to fix obvious problems and establish a good foundation first, and then innovate from there. However, both I and the product manager I worked with left the company before the full release. Some features for the next iteration were designed, such as inline attachments with flexible resizing (did not exist) and another take on threads (rethought).
Result
New compose is now public. I joined Revolut shortly after I handed over the final mocks to the developers. The product manager who I worked with left as well. Unfortunately I did not get a chance to do design QA and give developers my feedback, so it is not in the perfect shape in terms of UI, but the functionality remains the same and it is still live 😺
✅ The interface was released for everyone after beta — without changes
✅ 1/3 customers of Yandex.Mail use compose daily
