Корпоративная деловая сеть Linkedin совсем недавно сменила дизайн. Это было сделано уже руками нового владельца — Microsoft. Совершенно своевременный и оправданный шаг с их стороны. Старый дизайн был как устаревшим, так и полным UX-багов. Некоторые сценарии просто невозможно было воспроизвести по памяти. Сможете сейчас вспомнить как попасть в режим отзыва отосланных приглашений?
Извините, что «в лоб» спросил. Возможно, многие из Вас даже аккаунтов там не имеют.
Хорошо если вы вспомнили, однако там был полный хаос. Отсутствовала фильтрация по датам в хистори как таковая. Вдобавок подгрузка старых приглашений работала криво.
В общем я, как специалист по поиску usability багов (ну прямо как в той пословице «Слепой в чужом глазу бельмо заметит»), не смог пройти мимо этого обновления. Давайте проанилизируем то…
Как было «до»
Как стало «после»
Надо начать с того, что все мы априори будем «против». Ну так мы устроены с Вами. Примеров масса: переход iOS во flat, редизайн VK и так далее (про Кинопоиск и вспомнить страшно). Мы будем скорее всего «за», если “до” было откровенно плохо. С Linkedin такого не было: соц.сетью можно было более менее быстро пользоваться на необходимом уровне. Итак, мы держим в уме что мы «против» и я начну рассуждать:
Гайдлайны
Как-то потяжелело. Вообще-то такие интенсивные бордеры уже давно не в моде и создают много «шума». Сейчас многие визуальные разделения делаются вообще текстом. Его интенсивностью и оттенком. Лишние «палки» просто теряют смысл и дублируют смысл. Добавили тяжелых теней, которые вместе с тяжелыми рамками каждой карточки добавляют «грязи». На выходе все разделения прибавили «в весе» и отвлекают.
Пример из моего недавнего таска, когда лишние разделители лишь дублировали бы очевидное:
На снимке ниже я просто сделал принтскрин и закрасил бордеры, оставив нижнюю тень. Пример того, выглядят блоки стартовой страницы после их редизайна:
Кажется, что фокусировка на контенте возросла и глазу стало как-то “спокойнее”, после того, как я закрасил бордеры у блоков:
Профессиональный дизайнер ищет любой способ сделать дизайн интерфейса еще незаметнее, а у этих совсем другое мнение. Если рассматривать эту идеологию на примере среднестатистической карточки в дизайне, то её путь приблизительно таков:
По-моему, сейчас мы где-то посередине.
Header
Вообще потерялась логика выравнивания элементов. Панель с иконками уехала вправо. А ширина инпута для поиска, похоже, взята с потолка. Если лишь немного подвигать элементы, мне кажется становится выигрышнее. Пропаганда “Премиум” доступа будет чаще заметна глазу слева, а не ближе к блоку рекламы, куда по привычке мы уже не смотрим.
Header после их редизайна:
Я немного подвигал header:
Поиск
Этот пункт совершенно внезапно вытекает из пункта про хедер. Меня угораздило ткнуть в инпут поиска. Мде. Это что ж за “запас” свободного пространства справа от имён и аватарок? Слушайте, вот я чудак, да это же наверно вёрстка “поехала”. Возможно тестировали плохо. Исправят! А мы всё стерпим…
Вот что я получил по клику:
А вот как можно убить одним выстрелом двух зайцев:
Не дождётесь! Слышу уже голос Linkedin: «С дуба рухнул рекламу перекрывать?!»
Уведомления.
Раньше было удобно: навели мышкой на «колокольчик» и получили в попапе последний экшн. Было удобно и кликать не требовалось. Теперь же по старой привычке наводишь, а в ответ тишина. Нужен клик! И нас уносят с ленты в дополнительный раздел, где больше «А поздравьте-ка вот этого….» чем реальных уведомлений. Зачем их смешали после редизайна — мне непонятно.
Профиль
Вот и попап нашёлся! Странно. Приоритет у разделов меню одинаковый, а по клику получаем разный результат. В основном нас отправляют на новую страницу, но для профиля почему-то выскакивает попап. Я бы согласился с таким откликом, если аватарку разместить отдельно. Кстати, попав в профиль и там видим как что-то «поехало»:
Даже в старой версии таких откровенных промахов по-моему не было. Спихнём на огрехи в локализации…
«С меня хватит»
Дальше даже углубляться не хочется. Чтобы сравнивать субъективно все пользовательские сценарии “до” и после редизайна, нужно с нуля дискаверить, куда их закопали. Так как большая часть логики переделана, то на изучение понадобится немало времени.
Кстати, если у Вас есть история как именно благодаря LinkedIn’у вы выросли в профессиональном плане или продвинулись по карьерной лестнице (в Google позвали!) — рассказывайте в комментариях. Лично мне похвастаться нечем. Давненько было пару интервью с европейскими HR’ами. По факту скукота! Еще постоянно ломятся индусы в друзья, а отечественные хедхантеры прдолжают бомбить личку стандартным устаревшим спамом.
Я не смею Вас отговаривать пользоваться Linkedin’ом. Любой тотальный редизайн — это захватывающе. Наверняка сидят там и статсы рефрешат раз в минуту всем советом директоров. А еще это риск! Пусть время всё расставит на свои места. Пользователи либо привыкнут, либо уйдут.
Поскриптум
Слушайте, ну а может быть это я ничего не понимаю? Это же лидер рынка — сеть профессионалов! Там же наверняка профессионалы работают. Возможно им виднее, чем мне… Они наверняка проводили месяцы UX-тестирования на фокус-группах респондентов, сидели в коворкингах и что-то рисовали на канбан-досках, конкретно спринтуя по аджайлу!… Ну а потом «выдали»…
Извините, что опять с критикой. Надо о хороших примерах рассказывать, например, из личной практики… Кстати, тут намедни Facebook сменил дизайн десктопного мессенджера внутри сети. И там тоже есть, что обсудить.
Комментарии (18)
navion
13.01.2017 22:40+5* Запрещённый в России вебсайт.
У меня пока старый дизайн и переключателя нигде не нашел, может быть вы попали в фокус-группу? А в английской версии всё также плохо?
kamushken
13.01.2017 22:43+1я захожу иногда, поставив расширение friGate. оно позволяет обходить некоторые запреты.
и да, Linkedin не так давно был заблокировани на территории РФ.
K-o-D-e-N
13.01.2017 23:03-4Типичный дизайн Windows, с его «вырви глаз» шрифтами, бордерами, выпадающими списками и прочим.
DaturInnoxia
13.01.2017 23:51+3У меня пока не обновился дизайн, но на картинках выглядит симпатичнее, чем есть сейчас. Считаю неоправданной вкусовщиной убирание границ — «острова» не такая уже плохая концепция, которая позволяет лучше отделять смысловые блоки друг от друга. Можно, конечно, чуток посветлее сделать тень. В гуглоплюсе, фейсбуче и вконтаче думают также, полный отказ от границ считаю бессмысленным, если нет возможности разделить блоки другим образом.
В остальном, трудно говорить, но, конечно, почти наверняка есть косяки (куда без них).
P.S. На вкус и цвет фломастеры разные.
dim_s
13.01.2017 23:59+5У linkedin был сносный дизайн, этот явно лучше. А так, в общем, надоел этот ультра-флат дизайн на каждом втором сайте. Бордеры привлекают и делают моего маленького перфекциониста внутри спокойным. Может фокусировка на контенте и менее высокая если с бордерами, но наверняка есть и плюсы в таком подходе.
P.S. Перестаньте делать основной текст на сайте серым шрифтом, что за тренд такой, текст ужасно читается, если он светлый, а не черный или темно-темно серый.
dmitry_dvm
14.01.2017 14:01+3Дизайнерам лишь бы всё подвигать. Открывают сайт на своем 27" 4К и думают, что у всех так же. А программистам и верстальщикам потом додумывай, как все это дизайнерское великолепие впихнуть в адаптив или резину. На мой взгляд многие дизайнеры застряли во временах pixel perfect, которому уже давно не место в нашей мобильной реальности с зоопарком dpi, ppi и иже с ними.
Wolf4D
14.01.2017 16:08+1Я, конечно, «не настоящий сварщик», но разве же основополагающие принципы дизайна не утверждают, что информация должна быть поделена на логические блоки?
При всём уважении к автору, на рисунке «из недавного таска» подчёркнутые разделителями пункты читаются гораздо спокойнее — глаз автоматически распознаёт отдельные фрагменты, улавливает их начало и конец, цепляет низ строки и легко наводится на текст. В варианте без разделителей, если используете eye-tracker, вы увидите, что человеку приходится совершить немало микродвижений глазами, чтобы вычленить смысловые части.
То же с закрашиванием границ постов, которые бордеры.
Светло-серый не настолько контрастен, чтобы хорошо выделять посты, и их границы теряются. В итоге, глаз не улавливает сразу, где кончается один пост и начинается другой — и вместо мгновенного обнаружения законченных по смыслу фрагментов начинается раздражающее «всматривание», делающее сайт подсознательно неприятным пользователю. Вроде всё и хорошо, но быстро устаёшь — и почему-то не хочется больше открывать эту страницу.
enColereCreateur
14.01.2017 19:31+3Много текста из ничего. Я то думал Вы как раз потратили время на изучение логики работы. А Вы вместо этого рассказали всем про новые бордеры и про то как Вы их закрасили. Все эти UI-проблемы это чисто субъективные вещи, которые становятся малозначимы, когда пользователь не может выполнить целевое действие. Кинопоиск подтверждает.
damat
16.01.2017 15:05Золотые слова!
В LinkedIn гораздо больше бесит, например, то, что после добавления человека в друзья через нотификации он пропадает из нотификаций. И надо искать в своем списке, а новых далеко не всегда запоминаешь сразу.
Или окно показа отправленных приглашений — оно есть, да =)
Я уж не говорю про абсолютно непрозрачную схему настройки нотификаций. Далеко не сразу понял, как получать письма о новых постах в группах или новых комментариях. И до сих пор не понимаю, почему мне иногда приходят письма о темах, которым уже по несколько недель.
Но даже это все фигня — LinkedIn дает уникальную возможность: смотреть на размер компании. Для меня это ключевая функция, и я буду ей пользоваться в любом интерфейсе.
Valle
14.01.2017 19:33Нормальный дизайн — шрифты все контрастные, все нормально читается и находится. Надеюсь мода тонкими светло серыми шрифтами на светло-светло сером фоне все писать для красоты и чистоты дизайна совсем уйдет.
http3
14.01.2017 21:26-1Не пользуюсь, плевать. :)
am-amotion-city
16.01.2017 10:50Когда-нибудь вам может захотеться попробовать свои силы в европейской/американской лиге и вы будете жалеть о том, что не пользовались.
К сожалению, рекрутеры имеют привычку искать людей именно в линкедине; я получаю примерно 10 предложений в неделю, из которых одно-два — очень достойные, особенно если вы готовы переехать в Штаты.
http3
16.01.2017 14:171. Ну, когда захочу попробовать, учту Ваш совет :)
2. Я бы устал получать 10 мусорных предложений в неделю и деактивировал бы профиль. :)
terrakok
15.01.2017 10:50Лично я вижу, что мелкомягкие понимают: если изменить все сразу, то наше заранее готовое недовольство выйдет через край. А тут вроде UX почти тот же, а выглядит лучше + надеюсь работает быстрее.
у меня еще старый вид.
я рад что с этим убогим видом стали что-то делать
mikhaylovns
16.01.2017 11:37Я не очень понял, первые две картинки — это одна и та же страница до и после, или разные. Если просто сравнивать эти две страницы, то дизайн стал более минималистичным. На первой странице много фотографий и есть графики, на второй — два фото, причем фото профиля стало меньше, и таким образом внимание привлекает только одно фото в центре. Стиль деловой, как был, так и остался. По-моему, стало лучше.
776166
Microsoft — тоже лидер рынка. И там тоже работают профессионалы. На практике это ничего не значит.