Новый дизайн «ВКонтакте»



    Впервые с момента своего открытия в октябре 2006 года социальная сеть «ВКонтакте» обновила дизайн. Вёрстка сайта адаптирована на самое популярное разрешение экрана 1366х768 точек вместо прежнего 800х600. Изменилась шапка сайта и оформление абсолютно всех разделов.

    Бета-версия нового интерфейса пока запущена в стадии бета-тестирования, её по желанию можно активировать с этой страницы (потом есть возможность откатиться назад).

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


    Главный принцип нового дизайна ВКонтакте — на всех устройствах он выглядит похоже

    К изменениям готовились долго и тщательно, изучая и продумывая каждый элемент. Конкурс на обновлённый интерфейс объявили ещё в июле 2014 года. Работа продолжалась полтора года.

    Сообщения


    Непрочитанные сообщения помечаются синей точкой, которая исчезает после прочтения, а статус онлайн — зелёной точкой.



    Уведомления


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



    Фотографии


    Фотографии стали крупнее, а просмотр организован в горизонтальной вёрстке.



    Павел Дуров


    Из подвала сайта убрали ссылку на основателя проекта.



    Постепенно новый дизайн выкатят для всех пользователей социальной сети.

    См. также:
    Что не так с редизайном «ВКонтакте»

    Similar posts

    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More
    Ads

    Comments 97

      +1
      Многое в их дизайне заимствовано.
        +6
        По моему, так сейчас большинство сайтов когда рапортуют о редизайне, показывают по сути один и тот-же стандартный "унисекс" (в смысле, что адаптированный под планшеты и десктопы одновременно) дизайн с небольшой адаптацией под "корпоративные цвета" и т.п.
        Может, конечно, я ничего в дизайне не понимаю..../
          0
          Соглашусь. Фотографии как будто на Я.Фотки смотрю.
            0
            О господи, а что, надо было делать все не так как привыкли пользователи и в разрез с их уже накопленным опытом?
            Может вы и на выход авто новых реагируете так, дескать фигня какая — руль и 4 колеса, я это уже видел!
              0
              Ну так они же и сделали всё не так, как привыкли пользователи и в разрез накопленного опыта. О чем ваш вопрос?
              А касательно аналогии с автомобилями, то вы должны понимать, что у вазовских жигулей и ролл-ройс двери и руль находятся в одном и том же месте, но дизайн разный. К тому же я нигде не сказал, что их заимствование это плохо, я только константировал факт. В 2006 году эту социальную сеть вдохновлял фейсбук и в 2016 ничего не изменилось. Хотя с их бюджетом и командой, они могут творить такое, что сделает их лучшими не только в России, но и в целом мире.
            +1
            Опять 1 апреля? Рутрекер вон тоже шуточки шутит всякие.
              –1
              Не уверен. В мобильных клиентах аватарки давно круглые уже сделали. И в целом очень похоже на приложение как мобильное, так и вин10 десктопное.
                –3
                Нет, это не первоапрельская шутка. Уже не в первый раз ВКонтакте вводит новый функционал именно в эту дату.
                  0
                  Граница квартала же просто
                  0
                  Столько человекочасов и килобаксов ради шутки? Не думаю.
                  +3
                  Как-то очень скайпоподобно выглядит.
                    +4
                    А разве не копия Facebook?
                      0
                      Очень похоже, правда
                        0
                        От инстаграма тоже досталось, хотя это фэйсбучное.
                      +28
                      Из подвала сайта убрали ссылку на основателя проекта.

                      Стена, верни Дурова
                      • UFO just landed and posted this here
                          +5
                          Сообщения блин вылитый телеграмм теперь.
                            0
                            Вы так говорите как будто это что-то плохое
                              +1
                              Если бы. В телеграме отличная система из двойных галочек. Отправлено и прочитано. А тут странный синий кружок, который непонятно что значит и совершенно не интуитивен.
                                +1
                                Вы видимо совсем не заглядывали в веб-версию Телеграма.
                              +7
                              Какая-то помесь Фейсбука с Гуглоплюсом. Но в целом ничего.

                              P.S. Даже жаль, что я им не пользуюсь.
                              P.P.S. Да, я буду держать вас в курсе.
                                +3
                                Они умудрились совмести две вещи, которые я больше всего ненавижу — «плоский» дизайн и алгоритмическую ленту. А недоразрешение 1366х768 наверное переживет и меня. А главное — я сбегают от всего этого из ФБ в ВК, а теперь бежать некуда.
                                  +1
                                  Не стоит переживать из-за непонятных вам алгоритмов в ленте новостей. Справа есть переключатель, который отключит интересные новости и будет показывать записи в хронологическом порядке, от новых к старым, как вы привыкли.
                                    0
                                    Это «недоразрешение» совершенно внезапно оказывается едва ли не самым популярным сейчас.
                                    +5
                                    Раньше сообщения были по центру экрана, а сейчас их сдвинули вправо. Неудобно стало переписываться...
                                      +1
                                      Как теперь скриншотить переписку, чтоб остальные чатики в скриншот не попадали и при этом не заниматься телодвижением по обрезанию скриншота? :-(
                                        0
                                        Использовать Lightshot.
                                          +1
                                          Или puush(.me)
                                            0
                                            Яндекс (диск) сегодня выкатили обновление, где сразу предлагают сделать скриншот области
                                              +6
                                              Приложение "Ножницы"
                                                +1
                                                Ещё могут посоветовать пару дистрибутивов, где выделение области снимка экрана есть нативно.
                                                  0
                                                  ShareX
                                                    0
                                                    ShareX попробуйте.
                                                      0
                                                      OS X — cmd+shift+4
                                                      –3
                                                      "… самое популярное разрешение экрана 1366х768"
                                                      2016-й год… Facepalm.
                                                        +5
                                                        Вы думаете, у всех уже должны быть 4К мониторы?
                                                          –1
                                                          Ну хотя бы под FullHD..
                                                            –2
                                                            FHD — прерогатива геймеров, киноманов и прочих "кому это надо". Большинство девайсов — ноутбуки и прочие "мелкашки" где FHD не такой уж и частый гость. Особенно в соцсетях.
                                                              +2
                                                              FHD — это адекватное разрешение для мониторов 13"+, а 1366х768 популярен только из-за жадности производителей ноутбуков.
                                                                0
                                                                Дело не только в "жадности производителей" (да и не столько) — в FHD достаточно мелко на 13\15' экранах что-то смотреть (а если такой экран ещё и сенсорный — под Win это превращается в пытку). И это сильно дороже не для производителя, но для потребителя выходит. Особенно когда большинство использует интегрированное видео, где FHD равно снижению производительности.
                                                                  0
                                                                  Я один не понимаю, как так в ноутбуках 13/15' FHD мелко, а вот в телефонах/планшетах 3,5 — 7' FHD и выше — в самый раз и надо! Может потому и мелко в ноутбуках, что качества экрана и точек не хватает.
                                                                  p.S. не один прочитал ниже комменты.
                                                                    0
                                                                    Проблема, очевидно, в умении "масштабировать" элементы UI ОС. И как все мы прекрасно знаем работы над этой проблемой только-только начались в Win10, более ранние версии вообще "за проблему это не считают".
                                                                    0
                                                                    Мелко — это когда ОС не умеет масштабировать интерфейс
                                                                      0
                                                                      Замечу что "умеет масштабировать" из десктопных-популярных ноль целых н-десятых. Win10 не смотря на заверения справляется весьма слабо, про более поздние версии молчу. Так что тут прямая зависимость и ожидание подвижек в этом направлении, а пока что планшет с 8' и 1280х800 мельчит некисло и приходится ставить 125% масштаба, хоть это даже не 1366х768 о котором споры — FHD 10' ещё больше страдают от этого.
                                                                      Плюс — нет смысла ориентироваться на высокое разрешение. Когда в "моде" был 1024х768 всегда ориентировались на "шаг ниже", т.е. 800х600 или даже 640х480, так что не вижу смысла в споре — пока в каждом дешёвом устройстве не будет FHD, а в "адекватном топе" 8к — жаловаться смысла не будет.
                                                            +3
                                                            1366*768 стандартное разрешение для 15 и 13 дюймовых ноутбуков в диапазоне 15-30 тысяч рублей на данный момент.
                                                              +3
                                                              Извините, но сейчас половина современных бюджетных ведроидов (смартов и планшей) имеет разрешение близкое к HD, т.е. 1280х720, а во все ноутбуки дешевле 450 баксов повально ставят 1366х768 (да и в половину буков из диапазона 450-550 тоже, кстати). Не говоря уже о том, что многие имеют далеко не геймерские FullHD\2k\4k у себя дома.
                                                              Не говоря уже о тех, кто пользуется техникой годичной давности и старее. Меня, например, вполне устраивает бук 2007 года выпуска в качестве средства просмотра киношек, не мешая остальным домочадцам, а так же для всяких офисов и посиделок в интернете. Если запилить дизайн под FullHD, мне перманентно придется сидеть с зумом процентов на 150 и терпеть жуткое мыло и поплывший стиль.
                                                                0
                                                                Э-эм. Я не пытаюсь спорить, как, похоже, многим показалось.
                                                                Я прочел статью и посмотрел статистику. Я ей верю. Это меня и огорчает.

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

                                                                Даже подбирая себе рабочий ноут, сталкиваюсь с тем, что 90% предложений приходится отметать из-за матрицы с мизерным разрешением. Это с учетом того, что я смотрю ноутбуки от 1000$.

                                                                Разрешения 800х600 — из эпохи Windows 95. 1024x768 — Windows 2000.
                                                                В телефон почему-то можно воткнуть матрицу FullHD+.
                                                                  +1
                                                                  Просто не всегда нужно иметь фуллхд в бюджетной железке, которая работает на встроенном видео предпредпоследнего поколения и используется исключительно для социалочек, косынки, киношек и пакета майкрософт офис. При прочих равных такой бук будет стоить баксов на 30-40 дороже… А эффект в принципе себя не оправдает, даже при условии что система будет поддерживать высокую плотность DPI, ведь на бук обычно смотрят примерно с полуметра, а на экран монитора и того дальше, сантиметров 50-80.
                                                                  И сделать матрицу на 5" совсем не то же самое, что сделать матрицу на 15-20" — шанс на дефект гораздо выше, стоимость, соответственно, тоже.
                                                                  Хотя FullHD уже практически освоен производителями буков и мониторов во всех сегментах и даже плавно съезжает к бюджетному уровню, пройдет еще года 3, а то и все 5, пока хотя бы 51% пользователей всех прослоек переедет на этот стандарт.
                                                                    0
                                                                    В дебри полезли…

                                                                    Дело в том, что про адаптивный дизайн, похоже знают все, кроме группы ВК.

                                                                    Ширина всего содержимого ВК вписана в 960px (а ширина ленты из-за доп. меню справа стала 795px!!! 795, КАРЛ!!!). Этот формат стал модным(читай «стандартом»), когда 1024*768 стало в большинстве своём минимальным разрешением, а пользователей интернетов с меньшим разрешением экрана стало настолько мало, что на них все решили забить (в конце концов «ваш монитор давно пора выкинуть на помойку, потому что он вредит вашему зрению»).
                                                                    И даже если принять за истину то, что сейчас мало кто сидит в ВК за большим монитором, а разрешение экранов в среднем по больнице 1366*768, то почему бы не увеличить общую ширину страницы на эти 400 пикселей? В конце концов можно и статистику пособирать, не?

                                                                    И ещё основное меню… зачем оно прячется? В чём смысл? Ну ладно, если бы лента расширилась, когда менюха спряталась. Но нет!
                                                                    0
                                                                    Извините, но у вас маркетинг головного мозга :)

                                                                    Большинство людей не заморачиваются разрешением вообще. Буквы видно и ладно. Красный от зелёного можно отличить — вообще зашибись. И для этого разрешения 1366*768 более чем достаточно.

                                                                    А вот желание иметь разрешение 4к в наручных часах — это и есть маркетинг головного мозга.
                                                                      0
                                                                      Только не надо переходить на личности и ругать чужой мозг. И приписывать странные желания.

                                                                      Ну, а так, возможно, вы и правы. Если предположить, что только 5% владельцев компьютеров (к примеру) используют компьютер для работы (и, соответственно, вероятнее всего используют нормальный монитор), то такой расклад возможен.

                                                                +1
                                                                А ещё в групповых чатах (где 4 и больше человек) иконки скруглили, и теперь аватарок вообще не видно
                                                                  0
                                                                  Они и так там лишние, все равно не разглядеть. Стоит сразу генерить аватарки чатам самим. Лично я во всех чатах стараюсь ставить аватарки вручную.
                                                                  +3
                                                                  Очень плоский дизайн, блоки сливаются со светлым фоном. Добавил тень к блокам — стало выглядеть лучше.
                                                                  joxi.ru/L21zjzQF6q9daA
                                                                    –1
                                                                    Поверьте, всегда найдутся те, кому нравится и те, кому нет. Юзерстили не запрещали, вроде :)
                                                                      +1
                                                                      Похоже на Google Material.
                                                                        0
                                                                        Ваш вариант заставил смахнуть меня слезу ностальгии по Windows ME. Но она быстро высохла.
                                                                        +3
                                                                        С первого взгляда показалось, что это фейсбук.
                                                                          +1
                                                                          И опять забыли про широкие экраны.
                                                                          «Дырки» по краям, на моем 1920x1080 совсем не радуют.
                                                                            +3
                                                                            На моём 3840x2160 не радуют ещё больше :(
                                                                              +2
                                                                              Будьте добры, скиньте скрин старого и нового дизайна на 4к мониторе. Уж больно интересно, как оно будет выглядеть.
                                                                                0
                                                                                Ха, а я его включить не могу, оказывается. По кнопочке внизу страницы получаю лишь это:
                                                                                image
                                                                                0
                                                                                На моём 7680×4320 вообще всё плохо (((
                                                                              0
                                                                              В глаза бросаются баги:
                                                                              иногда при нажатии каких-либо кнопок вылазят ругательства на различные модули
                                                                              лента подтягивает автоматом новые посты через раз
                                                                              гифки иногда при разворачивании вылазят за рамки развернутого поста
                                                                              и прочее…
                                                                                +1
                                                                                Очень не хватает опции сжатия интерфейса как в gmail:
                                                                                image
                                                                                У меня люди поделены по спискам и теперь для добавления человека в список нужно прокручивать до трёх экранов. Раньше хватало одного экрана.
                                                                                  +11
                                                                                  Всё затевалось, чтобы ссылку на Дурова убрать
                                                                                  0
                                                                                  Так похоже на Фейсбук, что я искренне решил, что это тонкая первоапрельская шутка. Завтра, видимо, узнаю, прав ли я.
                                                                                    +2
                                                                                    Дороговатый розыгрыш бы вышел.
                                                                                    0
                                                                                    Вот интересно, что за "интересные записи", "интересные новости". Это по какому критерию они будут такие? Набрали больше всего лайков и репостов — стали интересными? Так же, как на youtube "популярные" видео? Это ж как теперь будут сладко потирать руки многочисленные "оптимизаторы", "пикчеры", "паблишеры", занимающиеся накруткой раскруткой очередного клона мдк?
                                                                                      +3
                                                                                      Сайт, который приятно отличался от прочих своим дизайном, удобством и неповторимостью, теперь выглядит как скайп. Good job.
                                                                                        –1
                                                                                        Приятно отличался дизайном и удобством 10 летней давности?
                                                                                        0
                                                                                        Очень круто сделали, лично для меня только два крупных минуса: сдвинутый вправо чатик и сильно уменьшенные фотки из-за комментариев справа. Не очень понимаю, почему в статье про это пишут "Фотографии стали крупнее".
                                                                                          –1
                                                                                            0
                                                                                            Лично мне неудобно что индикаторы онлайна и статуса отправленных/полученных мессаг замельчили.
                                                                                            –5
                                                                                            А я вот хочу, чтобы ВК закрылся вместе с ФБ. И все вернулось к ламповому ЖЖ, RSS, сайтам знакомств(туда согнать всех кто полюбил соцсети), аське и миллиону форумов. Никаких тебе инстаграммов с суши, твиттеров ни о чем, +100500 в ютубе и не дай боже ивангая или как там это зовется, крч дом2 из ютуберов, перисокопов 90% ни про что, даже скайп можно убрать, аська была загадочнее, о а чаты еще живы? Я бы променял планшет с 3гигами озу на нокию с вап и 4096 цветами экрана, и сидел по безумно дорогому трафику выискивая миди файлики… Теперь люди даже стандартные мелодии не меняют, а раньше… человек еще не достал телефон, а уже ясно дорогой или нет, моно, поли или о, боже мп3 играет!
                                                                                            Минутка ностальгии.
                                                                                              +1
                                                                                              Да, да, раньше было небо ярче и трава зеленее, а ваши чатики rss и даже нокла с асечкой никуда не исчезли. И WAP трафик точно такой же дорогой.
                                                                                                –2
                                                                                                самоирония ваще-то, а вот про соцсети правда. одно из самых бесполезных мест, кроме как для мх владельцев и рекламщиков.
                                                                                                  +1
                                                                                                  Ну так просто не ходите в соцсети.
                                                                                                    0
                                                                                                    Отличное место для общения, для анонсов мероприятий (для меня, как для организатора концертов это очень вижно), для обменом музыкой, картинками, видеороликами да чем угодно!

                                                                                                    ЖЖ живее всех живых, нормальные форумы тоже. Хотя много форумов умерло, и их реально жалко — они удобнее нитевидных обсуждений в ВК.
                                                                                                      0
                                                                                                      Эх, а что же вы тут делаете тогда? ГТ так то тоже во многом соцсеть.
                                                                                                    • UFO just landed and posted this here
                                                                                                    0
                                                                                                    Я вот по привычке навел курсор мышки на колокольчик, думал менюшка раскроется и покажет какие уведомления пришли. Оказалось это не работает, а ведь чего проще то :(
                                                                                                      0
                                                                                                      А лично мне очень не нравятся меню реагирующие так. Это неудобно имхо. Редко где они сделаны правильно, где-то была статья, что для удобства там надо писать прямо геометрический алгоритм хороший.
                                                                                                        0
                                                                                                          0
                                                                                                          Да, именно оно
                                                                                                          0
                                                                                                          В моем случае, я делаю это тогда, когда надо быстро посмотреть есть ли что-то важное, чтобы остальное разгрести потом, оставив непрочтенными часть уведомлений. Я так думаю ВК сможет нанять специалистов которым это под силу, было бы желание.
                                                                                                        –1
                                                                                                        У меня почему-то пишет "Мы оповестим Вас, как только редизайн станет доступен.", хотя, судя по комментам, у людей обновляется дизайн сразу. Правда уже второе апреля. Неужели таки розыгрыш?
                                                                                                          0
                                                                                                          Видимо первый миллион тестеров уже набрался и те, кто не успел попасть в их число, будут ждать своей очереди на обновление
                                                                                                          0
                                                                                                          Как вы смогли подвал увидеть? Он же как горизонт — удаляется по мере приближения к нему, из-за подгрузки ленты.
                                                                                                          Ладно, это сарказм, есть же еще страницы фиксированного размера (настройки, и т.п.). Но как же заколебал подобный принцип на куче сайтов — делать подгружаемую ленту (даже на страницах конкретных статей — дочитал до конца, на тебе сразу следующую статью) и при этом размещать инфу в подвале, который в принципе получается недоступен.
                                                                                                          Алсо, у меня дизайн отображается старый и сегодня, и вчера тоже был — и Дуров в подвале на месте. И никаких анонсов
                                                                                                          Мне неачинает мерещиться, что первоапрельская шутка — не само изменение дизайна а вот эта вот статья?
                                                                                                            0
                                                                                                            Неужели, только мне не нравятся эти вездесущие круглые аватары?
                                                                                                            Особенно на мобильнике, где они и так маленькие…
                                                                                                              0
                                                                                                              А мне очень нравится открыть на iMac 27 окошко браузера под ширину VK и полную высоту. Теперь места остается меньше.
                                                                                                                0
                                                                                                                Верхней панели диалогов очень не хватает.
                                                                                                                Раньше можно было открыть несколько и быстро между ними переключаться, а теперь надо каждый раз искать среди всех.
                                                                                                                А ещё в шрифте, который теперь используется в диалогах, тильда не изогнута. Просто прямая палка. Это нервирует.
                                                                                                                  0
                                                                                                                  Единственный вопрос: зачем?
                                                                                                                    0
                                                                                                                    Есть три вещи в этом дизайне, которые я не понял.
                                                                                                                    1) На /im два скроллинг блока. Ожидалось, что
                                                                                                                    а) можно скроллить левый блок с друзьями, когда курсор левее этого блока
                                                                                                                    б) можно скроллить правый блок с историей переписки, когда курсор правее этого блока
                                                                                                                    Сейчас для перематывания надо наводить курсор на каждый из них.
                                                                                                                    2) Почему из apps?act=apps пропали неопубликованные приложения (закрытые беты) и почему в меню слева может быть только пять приложений?
                                                                                                                    3) Зачем вся синяя шапка целиком приклеена к верху страницы, если все, что от нее нужно — показывать уведомления? Отвлекает и мозолит глаз.
                                                                                                                    Остальное, в принципе, не так важно, поскольку легко фиксится stylish/greasemonkey/whatever
                                                                                                                      0
                                                                                                                      Уберите правое меню туда, где оно не будет урезать ширину основного контента.
                                                                                                                      Ну ужасно же.
                                                                                                                        0
                                                                                                                        А я думаю, что очень даже неплохо. Привыкания особого не требует, прежний вектор сохранён. Именно отсутствие радикальных изменений с обновлённым видом и делает редизайн как минимум не провальным, на мой взгляд. Ну а заимствования были всегда, и если они были применены удачно, то и ладно.

                                                                                                                        Only users with full accounts can post comments. Log in, please.