[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "create", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-158433683", "adfox_url": "//ads.adfox.ru/228129/getCode?p1=bxbwd&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid21=&puid22=&puid31=&fmt=1&pr=" } } ]
{ "author_name": "Alexander Lashkov", "author_type": "self", "tags": ["\u0434\u0438\u0437\u0430\u0439\u043d","\u0436\u0436","\u0440\u0435\u0434\u0438\u0437\u0430\u0439\u043d","ux","livejournal","\u0442\u0438\u043f\u043e\u0433\u0440\u0430\u0444\u0438\u043a\u0430","\u0436\u0438\u0432\u043e\u0439_\u0436\u0443\u0440\u043d\u0430\u043b"], "comments": 11, "likes": 14, "favorites": 1, "is_advertisement": false, "section_name": "default", "id": "3847" }
Alexander Lashkov
5 379

Аналитика дизайна: слабые места нового интерфейса Livejournal

В рамках рубрики «Интерфейсы» профессионалы по аналитике дизайна из компании Design Critique, которые базируются в Лондоне и Нью-Йорке, будут исследовать внешний вид популярных сайтов и сервисов, предлагая возможные улучшения. В первом выпуске — линч блог-платформы Livejournal, которая недавно представила обновленный дизайн.

Среди положительных тенденций нового дизайна прежде всего следует назвать его упрощение и «зачистку» от визуального мусора, а также частичную оптимизацию для отображения на планшетах и смартфонах (её не назвать хорошей, но это лучше, чем ничего). Кроме того, появился новый раздел — «Журнал ЖЖ», где собраны самые интересные публикации. Хотя само это название вызывает некоторые вопросы: «Журнал Живого Журнала» — звучит странновато.

 А теперь самое интересное — критика и советы по возможным улучшениям.

Что можно улучшить

В целом дизайн кажется недоработанным. Возникает впечатление, что разработчики очень спешили представить его пользователям, что оставило простор для недоработок различного масштаба. Прежде всего стоит рассмотреть критические проблемы нового интерфейса.

Одна из главнейших проблем ЖЖ — это типографика. Несмотря на то, что проведена очевидная работа по улучшению читабельности текстов, ошибок остается немало:

  • Недостаточная контрастность текстов (особенно заголовков);
  • Выбран модный шрифт (Proxima Nova), однако он не является универсальным и его нельзя использовать одновременно и для текстов, и для заголовков, кнопок и элементов интерфейса;
  • Неоправданно много текстовых элементов набраны прописными буквами;
  • Формат даты неудобен для восприятия. 

Чтение главной страницы не доставляет удовольствия:

Не очень хорошо дела обстоят и с шириной дизайна, модульной сеткой и отступами:

  • Многие элементы «пляшут» — иконки ЖЖ-пользователей, кнопки интерфейса и т.д. 
  • Ширина блока комментариев составляет 100%. На больших мониторах читать такой текст очень сложно; 
  • Сделаны отступы там, где не нужно, и не сделаны там, где они были бы кстати. 

Все это затрудняет чтение поста и ухудшает общее восприятия дизайна.

Есть и не такие масштабные, но все же довольно серьезные недочеты:

  • Плохая реализация адаптивного дизайна. Это выражается в наличии только «резиновой» ширины и появляющегося бокового меню с рубриками. При этом не учтены такие важные аспекты, как изменения размера шрифта и отступов на различных устройствах. Очевидно, что разработчики «по старинке» делали обычный резиновый сайт с претензией на Responsive Design; 
  • Отображение комментариев оставили без изменений. При этом предыдущий вариант нельзя назвать удобным: слишком большие аватары (хотя, юзерпики,  можно считать и «фишкой» ЖЖ), огромные пространства для даты и ника, информационный мусор (отображение «без темы» в свернутых комментариях) и т.д. Здесь необходимо делать все с нуля — проектировать, учитывая привычки пользователей и особенности самого ЖЖ;
  • Хорошая идея — появление возможности при наведении отмечать материал, как прочитанный, однако необходимо корректно реализовать данную функцию на устройствах с тач-скрином; 
  • Боковое меню выглядит тяжеловатым и перетягивает на себя внимание пользователя; 
  • Поиск запрятан слишком далеко.

К числу неприятных мелочей относится и тот факт, что привычная ЖЖ-иконка рядом с именем пользователя в многих местах нового интерфейса отсутствует. Это решение выглядит странно, ведь эта иконка является одной из главных узнаваемых графических элементов платформы, некоторых пользователей можно узнать только взглянув на нее. 

Лента постов выглядит однообразно — глазу не за что зацепиться. Кроме того, встречающиеся в постах изображения зачастую некорректно обрезаются.

Еще одна ошибка — на главной странице размещен подвал с элементами управления, добраться до которых невозможно из-за бесконечной прокрутки.

Странно реализован и выбор языка интерфейса — украинский обозначен как UK, а белорусский — BE, что не соответствует общепринятым сокращениям.

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

Как можно улучшить

Учитывая описанные выше недостатки нового дизайна «Живого Журнала», специалисты Design Critique разработали так называемый "facelift", который мог бы помочь пользователям во взаимодействии с контентом платформы. Вот как выглядела страница поста (для примера взята очень короткая запись):

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

Точно так же можно улучшить главную страницу. Так она выглядит сейчас:

После изменений главная страница обновленного «Живого Журнала» может выглядеть так (картинка в полном размере):

В заключение стоит отметить, что 90% дизайна «Живого Журнала» — это работа с контентом. Главная сложность при этом заключается в том, что этот контент создают авторы блогов, большинство из которых слабо представляют, что такое типографика, форматирование текста или оптимизиция изображений. Поэтому интерфейс, как бэк-энд, так и фронт-энд, должен учитывать все возможные состояния контента в блогах, а также уметь автоматически приводить посты в приемлемый для чтения вид. 

Самое простое и возможно правильное решение проблемы — наложение ограничений на возможность форматирования текстов пользователями. Например, оставить им возможность загружать картинки при добавлении записи, отключив загрузку изображений с других серверов. Параллельно с введением подобных ограничений стоит также разработать новые стили для самих блогов, потому что сейчас почти все ЖЖ-блоги выглядят устаревшими как минимум на десять лет. 

Что касается пользователей, то недовольные есть всегда. Поэтому при редизайне не стоит бояться изменений, лучше сделать полностью измененный интерфейс, который затем прослужит десять лет, чем каждый год собирать множество негативных отзывов при каждом легком рестайлинге. 

#Интерфейсы #ЖЖ #редизайн #UX #livejournal #типографика #интерфейсы #Живой_Журнал

Статьи по теме
Настоящая причина редизайна Facebook — он был слишком хорошим
Почему пользователи вводят меньше данных, если в форме есть обязательные поля
Популярные материалы
Показать еще
{ "is_needs_advanced_access": false }

Комментарии Комм.

0 новых

Популярные

По порядку

Прямой эфир

Команда калифорнийского проекта
оказалась нейронной сетью
Подписаться на push-уведомления