Продолжаем изучать экраны популярных чатов.
В предыдущей статье мы уже рассмотрели, как популярные приложения организуют экран обмена сообщениями. В этот раз мы поговорим об экранах со списком диалогов.
В нашем обзоре остались все те же популярные мессенджеры, за исключением Slack. Создатели этого чата пошли необычным путем при разработке своего мобильного приложения и отказались от привычного списка сообщений — имена и названия каналов расположены в боковом меню. Поэтому в обзоре место Slack заняло достаточно новое приложение от Google — Allo.
Рисунок 1 — Все рассмотренные интерфейсы
Начнем с общего для всех приложений — того, как выглядит блок сообщения. Аватар слева, посередине 2 строки текста и время отправки сообщения справа (только в VK может быть до трех строк). Верхняя строка с именем выделяется сильнее, нижняя с первой строчкой сообщения серая и менее заметная. Блоки идут один за одним и формируют список. Получается всем знакомый интерфейс со списком сообщений, который без особых размышлений можно брать и реализовывать в MVP. А вот дальше пойдут особенности.
Очень немногие приложения используют место рядом с аватаром для дополнительной информации. Так, Skype и VK показывают, в сети ли пользователь, Messenger — через какое приложение было отправлено сообщение, а WeChat — количество новых сообщений.
Если последнее сообщение было отправлено вами, то половина приложений даст это понять, добавив перед текстом “You” или в случае VK ваш аватар.
Рисунок 2 — Блок с сообщением у разных приложений
Увидеть, доставлено ли сообщение, не заходя в свой чат, можно только в пяти из десяти приложений: Messenger, VK, Allo, Telegram и WhatsApp. Прочитано ли сообщение — уже в шести, к предыдущему списку добавился мессенджер Yahoo.
Без сомнений, все приложения дадут вам понять, что пришло новое сообщение. А восемь из десяти даже покажут их количество. Только Facebook и Yahoo посчитали это лишним.
В прошлой статье уже говорилось о важности микровзаимодействий, в частности о пользе показывать на экране открытого чата, когда собеседник пишет сообщение. Половина из рассмотренных приложений не ограничилась только этим — уже на экране со списком диалогов Viber, VK, Allo, Telegram и WhatsApp дают пользователю понять, что ему набирают сообщение.
Material Design советует быть очень осторожными с разделительными линиями. Четыре приложения не используют их совсем между блоками с сообщениями. Остальные делают их тонкими и проводят только до аватара (кроме WeChat, там линия идет на всю ширину).
Рисунок 3 — Блок с сообщением у разных приложений
Пришло время взглянуть на экран целиком. У всех рассмотренных мобильных приложений есть поиск. Исключение только Hangouts, здесь разработчики эту функцию посчитали лишней.
Восемь приложений используют плавающую кнопку (FAB), куда помещают основные функции. При этом только три приложения скрывают эту кнопку при скролле. В остальных придется смириться с тем, что FAB видна всегда и закрывает правый нижний угол. WhatsApp и WeChat решили не мучаться с плавающей кнопкой и свои основные функции расположили сверху на навигационной панели. В остальном же интерфейсы отличаются в зависимости от особенностей приложений.
Рисунок 4 — Сводная таблица
Что из этого следует
Есть мнение, что все в дизайне уже придумано. И если ваша цель — создать удобный чат для первой версии приложения, то не стоит сильно мудрить. Лучше позаимствовать готовые решения у мессенджеров, которые завоевали огромную аудиторию. Начать с минимума, а уже дальше развивать приложение, добавляя новый функционал.
