Концепт новой почты от TIMEWEB!

Всем привет!

С момента анонса нашего вебмейла ^[1] прошло полгода. В том посте комментарии хабросообщества дали нам отличную почву для размышлений =) и раздумий о том, как правильно сделать современный крутой и стильный интерфейс для работы с почтой.

Мы решили разработать новый интерфейс в лучших традициях современного веба: лаконичный дизайн, спокойные цвета, крупные шрифты, адаптивная вёрстка и многое другое, и хотим поделиться с вами тем, что у нас получилось (все изображения кликабельны).

^[2]

Стилистика

Мы разрабатывали наш новый интерфейс, опираясь на современные тенденции: больше отступы, больше размеры элементов и расстояния между ними, больше воздуха, но в то же время лаконичность, лёгкость и сосредоточение на важном. Цветовые акценты на основном: новое письмо, аватары пользователей, письма.

Новый интерфейс избавлен от градиентов, лишних разделителей и фонов. Было резко сокращено количество цветов. Для десктопов будут весьма кстати реакции на наведение почти на все эелементы. Интерфейс таким образом становится живее, ближе к посетителю. Мы стремились сделать как можно проще, но не перешагнуть черту, за которой уже слишком просто.

^[3]

Никаких лишних страниц

Прежде, для таких действий как написание нового письма, создание фильтров, мы открывали новые страницы. Теперь всё делается во всплывающих окнах без отрыва от контекста. Это открывает совершенно новые возможности, недоступные ранее. Например, вы можете писать письмо и одновременно просматривать другие цепочки, что позволяет, например, собирать информацию из других писем и копировать в новое письмо.

^[4]

Создание фильтра теперь не мешает отображению списка фильтров:

^[5]

Планшеты

Как мы рассказывали прежде, у нас есть 3 варианта отображения, каждый из которых использует своя категория пользователей. Например, первый вид (обычный список писем) чаcто используют на планшетах. Второй вид (список писем сверху, тело письма снизу) — пользователи, перешедшие с настольных почтовых клиентов, а третим видом (список слева, тело письма — справа) пользуются обладатели больших мониторов. Все варианты отображения почты было необходимо пересмотреть, учитывая предпочтения пользователей.

Расскажем, как мы это делали на примере первого вида. Как показала статистика — 8% наших пользователей используют мобильные устройства для работы с почтой. И все они используют первый вид для отображения почты.

Для улучшения юзабилити при работе с планшетами мы увеличили высоту писем в списке, увеличивая вероятность попадания пальцем. Кроме того, общее увеличение размеров шрифтов, кнопок, межстрочных расстояний сыграло на руку. Учитывая современные планшеты, мы провели полную ретинификацию интерфейса, что сделало интерфейс более чётким.

Работать с планшетов после этих изменений стало значительно комфортнее.

^[6]

Настройки

Изменения коснулись всех разделов, в том числе и настроек:

^[7]

Изменение настроек профиля пользователя. Подписи, импорт информации из соцсетей. И стандартные плюшки — возможность подключить ещё один ящик, импорт почты из других почтовых сервисов.

Автор: aboykov

Источник ^[8]