AI-powered email client
Discovery
Design processes
Design system
Mentoring
UX design
UI design
Animation
Graphic design
Design review
Wireframing
Testing
Presentations
User flow
Website
Mobile app
Low-end prototyping
Low-end prototyping
Hi-end prototyping
AI-driven Email Revolution
The final version 1.0.1
How did we do best email app
Our team
Vladimir
Rozhkov
CEO
IESE Alumni, Ex-PM (Digital Transformation in Private Healthcare)
Alexey
Yarkin
Principal designer
Master of Complex Interfaces and Mobile Apps Design
Heldje
Sapunov
Back-end Engineer
Ex-Team Lead Insilico Medicine (valuation around $900 million now)
Dmitro
Marinenko
Front-end Engineer
Ex-Team Lead of a Hotel Booking Management Platform
Why did we decide to establish a Noetro?
Are you familiar with the daily, tedious work involved in managing email in the office? Constant review of all incoming emails for potential relevance, both internally and externally. This is a repetitive process that occurs day after day. Each email requires careful attention to ensure that nothing important is missed. This is familiar ground for us. Through our research into the email market, we have clearly seen that the workflow in this area has not significantly changed in recent years. Most providers offer similar services.
The emergence of neural networks has the potential to disrupt this market, but for now, most email clients are using LLMs (language models) primarily for writing emails. We have also trained these models to handle incoming correspondence, alleviating cognitive stress for individuals and freeing up dozens of hours every month.
Concept and main ideas
Our primary objective is to alleviate office workers from the day-to-day chore of dealing with mail. No longer will you need to manually sort all incoming correspondence by examining the contents and determining which messages are significant and which are insignificant. LLM (Language Learning Machines) will handle this for you. However, that is not all. You will also no longer need to read essential letters in their entirety. We generate detailed summaries for each incoming communication, and if you devote 126 words and 40 seconds to reading a typical letter, we provide you with a summary of 27 words that will take only 7 seconds to read.
40
You get an email
Dear Sirs,
I trust you're navigating the semester well. I want to clarify your thesis submission as we inch closer to the final stages. It's pivotal that we're both aligned to ensure a seamless submission process.
We'll require both a digital and a printed version of your thesis. It might seem redundant, but each format serves its own purpose within the department. As for citations, they are of paramount importance. Please ensure that every reference or idea borrowed is adequately credited.
The deadline for submission has been set for December. I'm here to support and guide you every step of the way. Should you have any questions or need clarification on any aspect, do not hesitate to reach out.
Sincerely yours,
Prof. Lydia Monroe
126 words or 40s reading
We give you
Professor Lydia Monroe has sent out the final guidelines for thesis submission.
Both digital and printed copies are required.
Citation requirements highlighted.
Submission is due by December.
27 words or 9s reading
*Actually, we have now reduced this time
to around 1-2 seconds.
9
Is that all? No, we have decided to completely rethink our approach to the typical workflow for email. We provide the user with a summary of all incoming emails in one place, and when they select a particular email, we display a detailed summary of all recent messages in that thread. If there are older, already-processed messages in the thread, users can always view a summary within the thread. We have also reviewed the process for managing email threads, and your email communication will now resemble a familiar chat interface. After reviewing the detailed summary, if a user finds anything of particular importance, we suggest they immediately add it to their task list and assign it a priority level.
Development and problems
We initially wanted to skip creating a user flow for each individual feature in order to save time during development. We had been extensively discussing the functionality and rationale behind each feature, so we thought it would be possible to launch a fully functional Minimum Viable Product (MVP) without creating user flows. I wanted to work through all the scenarios quickly and discuss them with my team. I created rough layouts and built detailed prototypes based on these scenarios. During internal testing, we could make changes on the fly if needed. After analyzing all usage scenarios and noting them in my mind, I created the first drafts for our dashboard. Initially, the dashboard was the main feature of our app. However, we later added an inbox and a task section in a more traditional style. The minimum requirement for an MVP is to collect statistics and feedback to clearly understand the direction we should take and what users' real needs are. This is not based on hypotheses.
Although the layouts were preliminary, they all had real typography in order to see how things would look in real life. The main challenge for me was to accommodate all possible screen resolutions, including those of netbooks with horizontal widths of 1280 pixels and heights of 720 pixels. At the same time, it was essential to create a rich interface that would not give a new user the feeling of being at the controls of a plane for the first time, "What are these buttons all around? Let me try this one; I wonder what will happen." All actions and states must always be intuitive, simple, and ideally familiar to the user. Perhaps we were being overly cautious as we did not have accurate information about the proportion of enterprise customers whose devices would use our application. Nevertheless, I developed an adaptive design that accommodated both desktops and smaller screens. After creating initial draft layouts, I conducted internal tests on the prototypes I had created to ensure that all scripts were functioning correctly and without errors. Even at this early stage, minor issues arose, which were easily and promptly addressed on the spot. We were eagerly anticipating the launch of the MVP and receiving initial feedback for future customer improvements, when an unexpected challenge emerged.
Through a series of compromises, we found a suitable backend developer who understood our requirements immediately, quickly immersed themselves in the project and established rapport with the servers. In the process of finding backend programmers, we still needed to create user flow scenarios, both for mobile and web apps, with a detailed description of each function. This was to demonstrate the level of work involved and ensure that candidates understood what had to be done. I created detailed user flows for each individual scenario and for each function, providing a detailed description of potential user actions and all possible system responses. During the creation of these flows, some minor issues regarding interaction emerged and were promptly corrected. Following this, I compiled fully functional prototypes for each feature and a single comprehensive prototype that simulates the entire application's operation. We also recorded a video demonstrating the application for investors.
Research, interviews, and eliminating all unnecessary elements based on the
data collected
The real work began when we conducted user research, tests, and interviews, as we encountered a number of problems
Dashboard
Problem: Poor recognition of individual emails and a low click-through accuracy
The initial vision for the application was to present a user with a short, narrative summary of all their new emails, while simultaneously prompting them to add related events to a to-do list. The concept also included a dedicated dashboard where a user could manage all their email-related tasks without ever leaving the interface.
While I was drawn to the core idea of reimagining traditional email workflow, I had significant reservations about the specific proposed concept. This idea originated from the stakeholders themselves, and they were quite fond of it.
I identified four fundamental problems with the approach. To validate my assumptions and persuade the stakeholders, I convinced them to authorize user surveys and interviews with real potential users. This user-centric research was instrumental in gathering the evidence needed to pivot the concept, ultimately leading to the successful product direction we have today.
1-10 score (CES, CSAT, NPS)
How easy or difficult was it to:
Navigate the dashboard page?
Understand the content of the incoming emails?
Understand how many incoming emails you had?
Click on the intended email with your mouse on the first try?
CES
2.2 (80% 2-3)
7.06 (36.4% 6 or below)
5.75 (65.6% 5-6)
6.37 (33.3% 8-10)
CSAT 0%, NPS -100
User research promptly validated my assumptions. In response, I designed a first-iteration solution to mitigate the primary user pain points
Since the primary focus of the application is the daily digest, let's concentrate on that. Although, in addition to it, we also redesigned the section for suggested to-do tasks, added categorization, and introduced gamification with progress tracking. But for now, we are only concerned with the digest.
For the digest, I created an entity called a "digest item." This item contains a brief snapshot of the content from the email threads and conversations attached to it. At that time, we faced a problem where a single "digest item" could combine several different threads that the AI models identified as a single event. This is precisely why I had to add a tabbed interface with sender names as tab titles in the email preview.
I packaged the "digest item" itself into a separate frame, making them easily distinguishable for both development and the end-user (initially, the LLMs simply provided us with plain text containing anchors linking to the threads used for the summary).
During the period when this screenshot was relevant, we were testing a hypothesis about highlighting important emails by increasing their size. (The correct answer: it's not adequate at all.) In this approach, new important emails would replace previous ones in the list, which confused users. Plus, at that time, we couldn't get the neural networks to consistently generate the same cover text for each individual "digest item."
So, the results of the changes in numbers:
CES
6.91 (69.6% 6-7)
8.97 (72% 9-10, 93.8% 8-10)
8.06 (Over 90% of customers reported a positive experience)
9.0 (90.9% of customers are "Promoters" 9-10)
CSAT 36%, NPS -53
Even after successfully resolving the main pain points identified in surveys, users remained hesitant to recommend our app. The consensus was that it felt too complex and unfamiliar, despite praising specific features like the scalable email preview summary. This feedback led me to undertake a full-scale redesign of the UX and workflow — a decision that ultimately validated my initial intuition
Final result
A lot more work went into this after that, which I can detail in person. The final results are below. This was a collaborative team effort, and I'm thrilled that the actual data ended up having more influence than anyone's personal ideas.
CSAT 97%, NPS +100
Design system
When we had fully understood the user flow, we refined and perfected our visual design and completed the development of the design system. Why did I decide to develop a design system at this stage? Because I wanted to maintain flexibility and I recognized significant potential in our project. Additionally, I was aware that our project could grow into something significant and interesting, so I wished to save considerable time in the future. After all, it's always more convenient when each button and form is available as a reusable component with a description of its interactions and is already coded.
Let's take a closer look at the design system itself. Figma had already rolled out the variables at the beginning of our work, and it was great! It was a great decision for us. I created tokens for sizes, rounded corners, and set all the rules of typography, margins, and color palette. Where I have assigned the semantics of behavior and group membership for each individual color. In order not to get confused, I did not call the colors like “blue 800” or “bored frog on the shore of the moon beach - 900". All colors are named by the elements they are associated with, that is, each color's name is a description of the element and its behavior. Yes, some elements have the same colors, but they behave the same everywhere in the entire application. This saved me a huge amount of time to develop new color schemes. For the MVP, we decided to roll out two basic color schemes: light and dark.
With the appearance of sections in the figure and the possibility of linking each of them to certain settings from the options, it is enough for me to simply copy the section in the layouts and link it to a dark theme. And yet there are some features that need to be corrected manually and discussed with the front-end. In two places, the colors are repainted manually because the shade on a dark theme looks either not contrasting enough, or on the contrary, too contrasting. I always check the main text for contrast according to the WCGA rules, but I always work with additional shades individually and can ignore these rules if I think that the information will be perceived better this way. For 95% of the colors, I managed to find suitable colors for a dark theme right away, thanks to many years of experience as a graphic designer and illustrator and an excellent understanding of color theory.
Design, web and mobile apps
It all started with simple rock paintings and initial ideas about how it should work and look. The first low-fidelity prototypes appeared, becoming more modern and convenient with each iteration. This process is similar to that of a sculptor who takes a piece of rock and chisels away everything that is not needed. Occam's razor is always important to me when designing, and only business needs can lead me to complicate a particular element. After 3 months, we had the first high-fidelity layouts with detailed descriptions of the interactions. A month later, everything was set up and tested, except for the backend, which needed to be developed.
Unique illustrations
I felt that empty screens were too plain and uninspiring. To make the user experience more engaging, I decided to commission original illustrations. I took on full art direction for the project, guiding both the concept and execution. The illustrations were intentionally designed to be funny, playful, and full of lighthearted metaphors.
Each one adds personality to the app and makes even the “empty” moments enjoyable. Instead of users facing dull blank screens, they now encounter witty visuals that bring a smile. This not only improved the aesthetics but also strengthened the app’s unique identity. The result is a more delightful and memorable user experience.
Some interesting features
The most interesting thing about our new approach to working with email through a mobile app is the way we present the information. If you have a paid account, you see a so-called "Noetro view" in your inbox, which shows a detailed summary for each email. You can scroll through these summaries like cards, and if you want to switch back to the classic view, you can do so with just one tap.
Another interesting feature that came to mind is the link to the original email message that created the task in the To-Do list. This is available in both apps, so you can quickly see the rest of the email and possibly edit the task. Overall, Noetro is packed with interesting features, and we've tried to make interactions easier, faster, and more convenient at every step. I'll tell you more about this next time or in a private conversation.
Future plans
In the future, we plan to continue improving our app and adding new features to make it even better. We value your feedback and want to hear what you think about Noetro. Let us know if there's anything else we can do to make your experience more enjoyable. First and foremost, it's product market fit research. It's important for us to gather all the possible feedback, launch tests with new iterations, and make sure we hear everything clearly and that we are heard in return.
Here are a few ideas from our backlog:
• Automation of tasks for integrating with other platforms
• Sorting emails into different folders based on the current context
• An assistant for intelligent automatic responses (e.g., when you're out of the office)
• Smart notifications based on relevant content with short descriptions indicating important messages or those related to specific fields
• "After-vacation mode"
• Integration with keyboard shortcuts
• Expanding your to-do list to improve productivity with a calendar
• Smart search from your inbox
• Adding team collaboration features
• Integrating with additional email providers
• Ability to work with multiple email accounts
• Meeting security requirements at the enterprise level
• Improved data collection and analysis
• Automated response suggestions
I'll explain more when we meet in person. See you then!
Alexey Yarkin © 2025