Российские дизайнеры и представители отрасли о редизайне «ВКонтакте»01.04.2016 16:37

Работа над новым дизайном сайта велась на протяжении последних полутора лет. Обновились все разделы сайта — профили пользователей, списки друзей, новостная лента, страницы сообществ и так далее:

Олег Чулаковоснователь и арт-директор «Студии Олега Чулакова»

Стало на порядок лучше. Это колоссальная работа. Всё увеличилось, кегль шрифта увеличился (*плачет от радости*). В статье на vc.ru многие вещи рассказали, не вижу смысла повторяться.

Напишу свои предложения по улучшению.

Анимация интерфейса. В идеале — соблюдение принципа непрерывности. При переключении между разделами или страницами процесс занимает доли секунды, но пользователь должен видеть обратную реакцию и процесс изменения интерфейса. На эту тему целая статья есть и лекция.

Подчеркивание ссылок при наведении — полумера. Нужно двигаться дальше и полностью отказываться от подчеркиваний, делать цветовую идентификацию ссылок. Все интерактивные элементы — синие, это хорошее правило, можно и без подчеркиваний обойтись. Хочется, чтобы десктопная версия «ВКонтакте» стала ещё ближе к мобильной, а мобильная версия стала более прогрессивной — взаимодействия а-ля Tinder при работе с фотографиями и так далее. Более живое и человечное приложение хочется.

Help нужно менять на человеко-ботов.

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

• Не занимали место.
• Были доступны тогда, когда они нужны.

Уведомления и музыка уже так и работают. Но, например, в сообщениях, сейчас выделяешь одно сообщение и сверху в системном месте появляются кнопки: «В избранное», «Удалить», «Спам» и другие. Не очень удобно тянуться вверх на большом экране. По идее, эти функции могли бы появиться ближе.

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

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

Шире. Лучше. Функциональнее. Это действительно долгожданное событие. И пользователи, несомненно, будут вознаграждены за столь долгое ожидание. Их ждёт новый, я бы сказал, чистый дизайн.

Новый сайт «ВКонтакте» — это большой шаг как для компании, так и для пользователей. Новые возможности, новые разделы.

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

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

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

На мой взгляд, дизайн сегодняшнего «ВКонтакте» — это то, на что многие другие контентные или большие аудиторные проекты могут равняться. Я был рад участвовать в проекте редизайна «ВКонтакте» и результатом очень горжусь.

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

Шаг, на который решилась «Вконтакте», и результат, который мы все видим — практически идеальный эволюционный переход.

В целом дизайн-команду сервиса можно похвалить. В обновленной версии сайт выглядит современнее, и пользоваться им стало удобнее. При этом сотрудники «ВКонтакте» постарались сохранить преемственность между старой и новой версией, переход получился плавным, и практически наверняка не вызовет у пользователей резкого отторжения.

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

Полтора года — очень большой срок для подготовки редизайна. Ресурсы и возможности компании явно позволяли сделать это намного быстрее. В мире проектирования интерфейсов (особенно мобильных) очень короткие циклы, и то, что было остро модно и актуально, перестает быть таковым уже спустя полгода. Об этом необходимо помнить в том числе во время работы над масштабным редизайном — то есть либо делать выбор в пользу нейтральных решений, которые не устаревают так стремительно, либо рисковать и пытаться заглянуть в будущее. Хоть новый сайт и оставляет после себя приятное впечатление, не удается отделаться от ощущения, что с редизайном запоздали как раз на эти полтора года, в течение которых шла его подготовка.

«ВКонтакте» выглядит лучше, чем Facebook, но сделать качественный продукт с точки зрения интерфейса вслед за кем-то, конечно, проще, чем выпустить его первым.

Обновленный интерфейс сайта, на мой взгляд, выполнен очень удачно. Сменить дизайн «ВКонтакте» пора было уже очень давно, команда явно с этим затягивала. Новый сайт соответствует последним тенденциям в веб-дизайне и проектировании интерфейсов. Сайт стал ещё более походить на своего собрата Facebook, что в целом хорошо. Унифицирование двух основных соцсетей воспитывает общие принципы в поведении пользователя на сайте, делает интерфейсы понятными на интуитивном уровне.

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

Цветовая гамма изменилась в лучшую сторону, такой оттенок синего намного приятнее для восприятия. Переработка верхнего меню — очень правильный ход, там было слишком много дублирующих пунктов и лишнего, сейчас стало чище, функциональнее. Отдельно хочется отметить типографику на сайте: на мой взгляд, шрифт Open Sans, который сейчас используется в новой версии, имеет ряд проблем, он может себя по-разному вести на разных экранах и устройствах, сглаживание может очень сильно отличаться не в лучшую сторону. Я думаю, этот момент будет дорабатываться на процессе тестирования.

В общем, редизайн сайта выглядит очень удачным. Это правильный путь в развитии сайта. Он не слишком кардинален, чтобы испугать пользователя, но имеет очень много улучшений. Аудитория сайта быстро привыкнет и начнёт активно пользоваться всеми доработками и улучшениями.

Суперинтересные мелочи:

• Аудиоплеер занимает главенствующее место. Всем известно, за что люди любят «ВКонтакте». Интересно, какое количество пользователей слушает музыку там? Думаю, что большинство, если плеер занял такое важное место.
• На скриншотах в блоге очень правильная вещь — ссылка на раздел «Реклама» заняла удобное место слева в меню. Но почему это не сделали в интерфейсе? Она осталась в подвале. Я прямо чувствую скрежет зубов тысяч пользователей, которые пытаются «поймать» её в разделах с бесконечной прокруткой. Думаю, докрутят ещё.
• Реорганизация меню. «Новости» и «Сообщения» победили «Друзей», «Группы» и всех остальных.
• В «Новостях» вижу две надписи «Поиск». Догадываюсь, в чем отличия, но догадываться — это не очень хорошо для интерфейса.
• «Сначала интересные» — это мягкий переход к новому типу новостной ленты? Чтобы не было «Дуров, верни стену!»?
• Кнопка «Присоединиться к тестированию» нового интерфейса — очень хорошая. Очень. Я прошу вас, присоедините меня. Я сам этого хочу. Нет, вы меня не заставляете.

Классно. Как на моём iPad. Давно пора. Дальше будут к большим переменам двигаться маленькими шагами, уверен.

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

Раздел сообщений стал прекрасным, такая компоновка используется в большинстве мессенджеров. Пользователи настолько к ней «прилипли», что приходить в сознание для использования раздела совсем не нужно. В хорошем смысле слова, конечно же.

А ведь было время, что я пользовался «ВКонтакте» в первую очередь ради аудиозаписей. Полез со старым привычным паттерном действий к ним, а там почти тю-тю. Лежат в самом низу. И, похоже, скоро их не станет совсем. Хотя и такой шаг уже вполне ожидаем.

Отдельное спасибо, что по умолчанию оставили хронологическую ленту. Я-то сам себе её включу, дабы потестировать, но зато многие другие точно бы стали переживать.