«ВКонтакте» представила новый дизайн веб-версии соцсети Статьи редакции
Соцсеть «ВКонтакте» запустила в тестовом режиме на ограниченное количество пользователей новую версию дизайна сайта. Это первое крупное обновление интерфейса веб-версии сервиса за 10 лет. Редакция vc.ru в числе первых пользователей успела изучить новую версию «ВКонтакте».
По словам операционного директора «ВКонтакте» Андрея Рогозова, работа над новым дизайном сайта велась на протяжении последних полутора лет.
Главный принцип нового дизайна «ВКонтакте» — на всех устройствах он выглядит похоже и узнаваемо. Пользователю веб-сайта легко найти нужный раздел в мобильном приложении, и наоборот.
Мы увеличили ширину экрана и шрифты, избавились от лишних деталей и сделали сайт проще для восприятия. Появилось дополнительное пространство для новых полезных функций. Также мы обновили левое меню: сократили названия пунктов, добавили иконки и перенесли наверх самые востребованные разделы — «Новости» и «Сообщения».
— Андрей Рогозов, операционный директор «ВКонтакте»
Интерфейс новой версии сайта российской соцсети выполнен в концепции «островов»: основной контент страниц — записи сообществ и пользователей — находится в блоках с белым фоном. Весь сайт получил голубой фон.
«Новости»
Списки новостей теперь находятся в отдельном блоке справа — вместе с поиском и комментариями. Появился отдельный переключатель для «умной ленты новостей»:
Аватарки сообществ и пользователей стали круглыми
У предпросмотра контента прикрепленной ссылки появилась рамка, отделяющая его от текста записи
Фотографии
Описание снимка и комментарии в режиме просмотра теперь отображаются справа от фотографии. По словам Рогозова, это сделано для того, чтобы лучше задействовать пространство широкоформатных экранов — «больше не нужно прокручивать экран вниз, чтобы просматривать фотографии и одновременно видеть комментарии к ним». Похожее решение используется в Facebook.
Шапка сайта
Полностью переработана шапка сайта — она растянута на всю ширину страницы. Исчезли прежние элементы меню («Люди», «Сообщества», «Игры», «Помощь»). Теперь здесь расположены центр уведомлений, быстрый доступ к разделу «Музыка» и меню профиля.
В новом дизайне используется только международная версия логотипа «ВКонтакте» — VK
В центр уведомлений приходят сообщения о новых отметках «Мне нравится», заявках на добавление в друзья, упоминаниях, днях рождения и прочем. Кроме того, на страницах людей и сообществ теперь можно подписаться на уведомления о новых записях.
Центр уведомлений
Профиль пользователя
В дизайне профиля пользователя разработчики использовали элементы из мобильных приложений «ВКонтакте». Например, появился блок с количеством подписчиков, друзей, фотографий и видеозаписей, который позволяет сразу перейти в соответствующий раздел.
Меню профиля в шапке сайта
Создание новой записи
Сообщество
Все элементы управления сообществом теперь спрятаны в меню.
Сообщения
Список диалогов теперь отображается списком, а не табами — на одном экране отображается список последних бесед и текущий открытый чат. По словам Рогозова, раздел сообщений «переписан с нуля».
«О компании» и блог соцсети
Полностью переделан раздел «О компании». Он выполнен в виде лендинга с основными фактами о компании, ссылками на официальные сообщества и контакты представителей соцсети.
Также «ВКонтакте» анонсировала возобновление блога компании. Первая запись посвящена запуску нового дизайна сайта.
Из подвала сайта исчезла ссылка на профиль основателя соцсети Павла Дурова
Новый дизайн веб-версии «ВКонтакте» будет доступен в тестовом режиме пользователям, которые успеют нажать на кнопку «Присоединиться к тестированию». Постепенно обновленная версия появится и у остальных пользователей соцсети.
Сталкиваются как-то в туалете Дуров и Цукерберг. Стоят, писают. И тут Дуров заметил, что Цукерберг написал себе на штаны. Дуров подумал, подумал... и тоже написал себе на штаны
У фейсбука дерьмовый дизайн. Сложный и перегруженный.
А тут совсем другое дело.
Присмотритесь к главной странице, хотя бы.
От фб отличает только цвет, наличие аудио плеера сверху и отсутствие справа ленты активности друзей, в остальном разница лишь в дизайне иконок, даже расположение информационных блоков почти идентичны, слева разделы, справа уведомления, посередине лента.
В экспериментальных дизайнах вариации поинтереснее есть, имхо.
Например от Павла Григорьева (https://dribbble.com/shots/1667925-VK-concept)
Уведомления тоже были вверху?
А показ изображений тоже был с комментами справа?
И где в новом дизайне аватарка, там раньше была кнопка "Выйти".
Даже если они и взяли некоторые удачные решения из FaceBook, то в связке с современным дизайном получилось намного лучше.
1) Сообщения ужасны.
2) Круглые иконки убоги и не информативны. Не для людей точно, вот когда камеры станут делать снимки круглыми, то может.
дальше не стал смотреть
Да. Сообщения неудобны так как теперь не открыть их как раньше без перехода на страницу. Ещё когда пытаешься писать сообщение оно ищет в списке друзей, вместо того чтобы писать сообщение.
В остальном привыкнуть просто нужно.
А как отправить отзыв то ребятам? Почему раздел сообщений становится шире? А все остальные разделы одинаковой ширины, это фишка такая?
Вот это я понимаю редизайн продукта! 10 лет лучшие умы прорабатывали новый дизайн! И вот, наконец, они представили нам невероятное, в лучших традициях эппл:
– это тот же вк, только намного лучше! Ведь единственное что мы сделали, это убрали градиентик в шапке!
А вот видимо и "лучшие умы" подтянулись. Хуево быть таким серьезным, Юрий, особенно первого апреля.
Я много чего заметил, и меняющуюся ширину в разных разделах, и отсутствие адаптации картинок под размер блока в фотографиях, и много чего еще, но кому это интересно и зачем об этом говорить, или у нас тут брейндсторм стола директоров вк и мы всерьез комментируем что стало лучше, а что еще плохо и стоит проработать?
1. Ппц. На фейсбуке не сидел только по причине уебодизайна. Куда теперь податься?
2. Убогость шрифта еще переживу, но вот интерлиньяж и расстояние между абзацами...
3. Круглые иконки как крышки гвоздей в гроб нового сайта. Верните квадратные хоть на платной основе.
p.s. и да, увеличить шрифты и ширину сайта можно было и по-другому. Как вам мой вариант?
VC не даёт редактировать. Поэтому вот http://portfolio.skvsk.com/welldone/vk
на вкус и цвет, как говорится.
мне очень понравился редизайн. только непривычно.
Комментарий удален
Точно. Сначала даже не понял, а что же изменилось, пока не вспомнил, что год назад stylish поставил.
А может это и было одной из целей, сделать как у фэйсбука, только нормально. Так и пользователи оттуда безболезненно перебегут
Шрифт какой-то размытый и неудобны сообщения писать, глазами вбок приходится смотреть, т.к. справа показываются люди с которыми я переписывался
Заметил вот реально пропавшую вдруг фичу — администраторы не могут посмотреть сообщения паблику.
Верим и ждем. Просто странно, что не успели именно ее, все остальное на месте.
Так надо было сегодня и запускать, все бы подумали что это шутка и забили, а настоящая шутка будет в том что на следующей день ничего не поменяется)
Дуров, верни стену!! Хотя нет, не так, вот так, для начала: "Верните Дурова!"))
вы когда на него перешли - вам должны были сказать как) кнопочка слева снизу!
Ужас. У меня вытекли глаза от этого дизайна. Для тех, кто хочет убрать это, слева под меню есть очень бледная, почти невидимая ссылка на отмену. Ну и комментарии, которые высвечиваются при выборе причины указывают на первопрельскую шутку.
Если не понравится, просто поздравят всех с первым апреля и вернут старый дизайн
Если кто-то из ВК читает этот коммент, прошу, уберите круглые аватарки! Невозможно сколько кружочков одновременно видеть. Квадрат - законченная фигура. Круг - что-то с ним не так.
Думаю в ближайшее время появится куча плагинов / тем для Stylish, позволяющих настраивать отдельные элементы
У меня уже второе апреля. Признавайтесь, это была шутка или всё таки нет. :)
Сиди читай что такое MD: https://www.google.com/design/spec/material-design/introduction.html
А не увидев похожие селекторы ори, что вк ввел Material Design.
Спасибо но я уже прочитал ее 2 года назад.
Вот теперь пруфы:
Active effect - с gmail.com
Фильтр - https://materialdesignicons.com/icon/filter
Свич - http://www.google.com/design/spec/components/selection-controls.html#selection-controls-switch
Попробуй оспорить теперь.
Я тебе последний раз говорю. MD не в том, что элементы похожи, MD в подходе к разработке дизайна, ui/ux. И пока это ты не поймешь, буду говно дизайны с MD. Давай закроем эту тему.
Я вчера сдал дизайн, в которой селектор разделов точь-в-точь так же бегает как здесь и так же слева полосочкой обозначен. Только фиолетовой. Теперь будут думать, что у вк взял.
Как не крути, но нового ничего не изобрели
Новшества = 0
п.с. С 1 апреля.
п.с.с. Где-то видел уже этот диз)
Пиздец. Сейчас круги везде, пишут исследования почему рожи в кругах лучше, а тут "слизали с vc"
Я надеюсь на то, что многие огрехи из-за того, что это Beta, но уже нашёл как минимум две выпиленные зачем-то фишки, которые делают сайт серьезно неудобным.
Убрали вкладки в диалогах. Теперь чат занимает меньше место, за-то пол страницы отдано под ненужную в 99% времени информацию.
Новости больше не разъезжаются на ширину сайта, когда скролишь вниз.
Это только две, проблем дофига. Толку, что сделали ширину сайта больше, когда пространство стало использоваться менее рационально.
Так новости и так теперь широкие. Меня эти скачки всегда нервировали, когда читал что-то на границе двух состояний.
Кстати да, широкие по-умолчанию (хотя таки чуть уже :)). Но смотрится очень сжато.
> Новости больше не разъезжаются на ширину сайта, когда скролишь вниз.
И слава Богу. Бесило это, слушаешь видос, прокрутил вниз - и нет видоса.
Ну с диалогами +- терпимо, не сильно уменьшилось пространство, исходя из того что раньше было ~500-600px, сейчас 400 на текст сообщения. Зато вкладки сообщений в целом стали "статическими", для меня это удобно.
С новостями я вангую будет фикс, и поведение вернут на старое.
Да, я уже померил линейкой некоторые вещи. Действительно, они если и стали меньше, то не критично. Однако новое оформление даёт странный эффект — кажется, что всё занимает меньше места, всё в кучу как-будто.
Так же не понимаю, нахрена некоторые вещи фиксируют при скролле (типа альбомов на личной странице) или обсуждения в группах.
А нафига скрывается левое меню после прокрутки новостей? Сделали бы его статичным.
Arial на Open Sans зря заменили.
Мало контраста, раньше нужные элементы выделялись намного лучше
Местами слишком много бордеров (полосок), когда в других местах их нету вообще.
У фейсбука голубой фон нейтральный и не давящий, как в случае с вконтакте.
Ребята из ВК, а когда наконец увеличите поле для приложений? единственные у кого малюсенькое окошко посреди страницы
если не шутка, то это чтобы адептов фейсбука было проще переманивать привычным им дизайном? тогда как бы ВК-исты не убежали
Они сделали просто ещё один Фейсбук. Зачем мне ещё один, когда уже есть я не понимаю.
Комментарий удален
Комментарий удален
Я делал этот дизайн, когда это ещё не было модным :–) https://www.facebook.com/nickivanovru/posts/1194998607218328?pnref=story
Меня бесит что звука сообщений нету,да и ваще када оно приходит не сразу отображается..а так неплохо Но! КАК ВЕРНУТЬ СТАРУЮ ВЕРСИЮ НИКАК НАЙТИ НЕ МОГУ ТУ ССЫЛКУ!!!
Это потому что вы капсите.
На самом деле, проверьте не выключили ли вы звук.
А ссылка слева снизу.
Комментарий удален
Лучше бы синяя шапка уезжала вверх, занимает лишнее читабельное пространство.
Лайфхак для слепых (таких как я) - подкручивание в браузере масштаба до 125% делает пребывание вконтакте (что в старом, что в новом) приятнее и читабельнее. Кто ругается на шрифт - попробуйте, может быть и вам полегчает.
PS: лично у меня только к новым диалогам вопросы, остальное без боли
А у меня новый дизайн не включился((
Нажал кнопку и ничего:
" Ваша заявка принята.
Мы оповестим Вас, как только редизайн станет доступен."
Уже закрыли бета тест?
Что я делаю не так?
Я в первом миллионе пользователей, ничего не изменилось - с первым апреля!
А не, нифига не первое апреля, ща подключил себе новый дизайн, будем посмотреть
Чего вы, все кто ноет, хотели от редизайна? Это редизайн а не обновление/добавление функционала
Такое чувство что не на vc а в мдк комменты прочитал
Если от дизайна вытекают глаза и всё находится не на своих привычных местах, то это плохой дизайн.
Дизайн понравился, реально улучшили юзабилити. Вывели некоторые настройки (отображение приложение в главном меню) на нужно место и еще много разных фич. Надеюсь это не шутка и будет так и дальше.
Привыкнем
Мне больше нравиться когда не прочитанные сообщения подсвечивались другим цветом, куда стикеры пропали?
Отлично. Очень свежо и интуитивно понятно. Как будто реализовали всё чего не хватало. Спасибо )))
Не тот случай, что приятно. Здесь поменяли оформление, а не сервис А на сервис Б.
А почему все считают что это не шутка? Мол, если не просто скриншоты, с реально сделана версия, то это сразу перестает быть шуткой? Откуда такая логика?
Ёпт, потому что на прод такого релиза нужно влить кучу ресурсов — ради шуточки никто не будет рыпаться. Ну и потому что UI у вконтактика застрял в 2008-м.
Учитывая, что они наверняка давно ведут какие-то работы по редизайну, не вижу больших проблем выкатить в прод какой-то из промежуточных вариантов в качестве троллинга. Массу достаточно сложных проектов разные компании выкатывали в качестве первоапрельских шуток в прошлые годы.
Если же это не прикол, очевидно, они не совсем уверены в редизайне, и, делая релиз в такую дату, они оставляют для себя возможность включить бэкпедал и сказать "ой, мы пошутили". Вспоминается "увольнение" Паши Дурова два года назад, ага.
Иногда первое апреля — это просто дата в календаре, не более.
Текущий релиз по сложности гораздо выше первоапрельских шуток. Выкатить промежуточный билд такого плана — это абсолютно бессмысленная затея.
Если же это не прикол, очевидно, Google не совсем уверены в Gmail, и, делая релиз в такую дату, они оставляют для себя возможность включить бэкпедал и сказать "ой, мы пошутили".
Для справки: бетатест Gmail был запущен 1 апреля.
У меня, как у стороннего наблюдателя, общее впечатление от этого релиза складывается вот такое, чем я и поделился. Если вам в моей точке зрения не видно логики, ну, что поделать, я ее не навязываю. Мне тайминг такого релиза кажется сомнительным.
За историческую справку спасибо, непременно запишу себе в календарик.
"Откуда такая логика?"
Возможно из "Присоединиться к тестированию". (но я побоялась присоединяться)
косяки имеются, например если удаляешь спамбота из паблика который админишь, то раньше была удобная кнопка настроек в которой в попапе сразу можно было выбрать бан навечно. Сейчас при нажатии на эту кнопку просто криво сбоку с нарушенной версткой вылазит зачем-то список групп
В общих чертах не плохо, но шрифт,сообщения и круглые аватары раздражают.
Слизано из инсты немного,фейса и в основном весь дизайн из яблоко слизано..Старая все же лучше
это называется адаптивность, не удивительно, что моб и наст интерфейсы одинаковы, но это не из яблока слизано, а у самого же себя с моб версии. яблоко тут вообще не при делах:)
Комментарий удален
Чет так и не увидел у себя на стр. изменения. Может мне старый вид оставят?))) А вообще голубой фон напрягает, если действительно так будет.
Комментарий удален
Когда хочу посмотреть полный список тех кто поставил лайки на фото, даёт ошибку, но только на некоторых фото, на остальных вс нормально
Давайте не будем забывать, что вконтакте изначально был клоном фейсбука и пока он стойко держит свой вектор развития (следует за фб). Это в принципе будет так происходить пока все участники разработки вк не перестанут заходить на фб и смотреть что там и как работает.
на фб принципиально не сидел из-за дизайна. теперь и вк сделали подобным. БРЕД!!!!!
"Новый дизайн веб-версии «ВКонтакте» будет доступен в тестовом режиме пользователям, которые успеют нажать на кнопку «Присоединиться к тестированию». Постепенно обновленная версия появится и у остальных пользователей соцсети."
Извините, если ошибаюсь, но, ведь можно зайти по ссылке new.vk.com и всё. Под меню потом появиться ссылка с текстом вроде "постоянно пользоваться новой версией". Нажимаешь и PROFIT!!!
"Полностью переделан раздел «О компании». Он выполнен в виде лендинга с основными фактами о компании, ссылками на официальные сообщества и контакты представителей соцсети"
Омг, что я прочитал.
Лендинг - это посадочная страница, созданная для привлечения клиентов или продаж.
Вопрос: что ВК нам хочет впарить?
ни у кого нет косяка по поводу аватарки? у меня вот например она сильно вытянутая, а в новой версии, этого нельзя сделать. там ограниченная рамка....(
Да ладно вам, нормально всё с новым дизайном. Вы на Фейсбук когда в последний раз заходили? Вот там и правда слишком всё перегружено, а Вк до сих пор очень минималистичен.
Комментарий удален
Комментарий удален