Concept of new mail from TIMEWEB!
Hello!
Six months have passed since the announcement of our webmail . In that post, comments from the Hub community gave us an excellent ground for reflection =) and thinking about how to properly make a modern cool and stylish interface for working with mail.
We decided to develop a new interface in the best traditions of the modern web: concise design, soothing colors, large fonts, adaptive layout and much more, and we want to share with you what we have done (all images are clickable).
')
We developed our new interface, relying on modern trends: more indents, more element sizes and distances between them, more air, but at the same time conciseness, lightness and concentration on the important. Color accents on the main: new letter, user avatars, letters.
The new interface is free from gradients, extra dividers and backgrounds. The number of flowers has been drastically reduced. For desktops, reactions to targeting almost all elements will be very useful. The interface thus becomes more alive, closer to the visitor. We tried to make it as simple as possible, but not to overstep the line, which is already too simple.
Before, for such actions as writing a new letter, creating filters, we opened new pages. Now everything is done in pop-up windows without interrupting the context. This opens up entirely new opportunities that were previously unavailable. For example, you can write a letter and simultaneously view other conversations, which allows you, for example, to collect information from other letters and copy to a new letter.
Creating a filter now does not interfere with the display of the filter list:
As we told before, we have 3 display options, each of which uses its own category of users. For example, the first type (the usual list of letters) is often used on tablets. The second type (list of letters on top, the body of the letter from below) - users who have switched from desktop email clients, and the third type (list on the left, body of the letter - on the right) is used by owners of large monitors. All options for displaying mail were necessary to review, taking into account user preferences.
Let's tell how we did it on the example of the first type. Statistics showed that 8% of our users use mobile devices to work with mail. And they all use the first view to display mail.
To improve usability when working with tablets, we increased the height of the letters in the list, increasing the likelihood of hitting with a finger. In addition, the overall increase in the size of fonts, buttons, line spacing has played into the hands. Considering modern tablets, we carried out a complete interface retinification, which made the interface clearer.
Working with tablets after these changes has become much more comfortable.
Changes affected all sections, including settings:
Change user profile settings. Signatures, import information from social networks. And standard buns - the ability to connect another box, import mail from other mail services.
Manage folders and contact groups. Now a group of contacts can be used as a recipient in order to send an email to all users of the group.
We have done a great job on changing the style and usability of the product and invite you to participate in the process of making the last strokes.
We will be very happy constructive comments =)
Six months have passed since the announcement of our webmail . In that post, comments from the Hub community gave us an excellent ground for reflection =) and thinking about how to properly make a modern cool and stylish interface for working with mail.
We decided to develop a new interface in the best traditions of the modern web: concise design, soothing colors, large fonts, adaptive layout and much more, and we want to share with you what we have done (all images are clickable).
')
Stylistics
We developed our new interface, relying on modern trends: more indents, more element sizes and distances between them, more air, but at the same time conciseness, lightness and concentration on the important. Color accents on the main: new letter, user avatars, letters.
The new interface is free from gradients, extra dividers and backgrounds. The number of flowers has been drastically reduced. For desktops, reactions to targeting almost all elements will be very useful. The interface thus becomes more alive, closer to the visitor. We tried to make it as simple as possible, but not to overstep the line, which is already too simple.
No extra pages
Before, for such actions as writing a new letter, creating filters, we opened new pages. Now everything is done in pop-up windows without interrupting the context. This opens up entirely new opportunities that were previously unavailable. For example, you can write a letter and simultaneously view other conversations, which allows you, for example, to collect information from other letters and copy to a new letter.
Creating a filter now does not interfere with the display of the filter list:
Tablets
As we told before, we have 3 display options, each of which uses its own category of users. For example, the first type (the usual list of letters) is often used on tablets. The second type (list of letters on top, the body of the letter from below) - users who have switched from desktop email clients, and the third type (list on the left, body of the letter - on the right) is used by owners of large monitors. All options for displaying mail were necessary to review, taking into account user preferences.
Let's tell how we did it on the example of the first type. Statistics showed that 8% of our users use mobile devices to work with mail. And they all use the first view to display mail.
To improve usability when working with tablets, we increased the height of the letters in the list, increasing the likelihood of hitting with a finger. In addition, the overall increase in the size of fonts, buttons, line spacing has played into the hands. Considering modern tablets, we carried out a complete interface retinification, which made the interface clearer.
Working with tablets after these changes has become much more comfortable.
Settings
Changes affected all sections, including settings:
Change user profile settings. Signatures, import information from social networks. And standard buns - the ability to connect another box, import mail from other mail services.
Manage folders and contact groups. Now a group of contacts can be used as a recipient in order to send an email to all users of the group.
Total
We have done a great job on changing the style and usability of the product and invite you to participate in the process of making the last strokes.
We will be very happy constructive comments =)
Source: https://habr.com/ru/post/180059/
All Articles