Дизайн ВКонтакте. VK by design
Дизайн ВКонтакте
ВКонтакте — это множество интерфейсов для разных платформ. В этой статье Вы узнаете о том, как ВКонтакте работают над этими интерфейсами, создавая дизайн своих продуктов.
Немного о дизайнерах ВКонтакте. В команде дизайна ВКонтакте трудятся шестеро увлечённых творческих ребят от 19 до 23 лет. Они универсальны: дизайнер не прикован к одному направлению на века и может сегодня заниматься мобильной версией, а завтра — каким-то сервисом из десктопной.
Инструменты и подходы ВКонтакте
Мобильные приложения ВКонтакте состоят из более чем 500 разных экранов. Плюс полчища интерфейсов из веба, плюс m.vk.com. Нужно уметь эффективно организовывать работу со всем этим богатством.
Например, с иконками. Их действительно много. Один усидчивый дизайнер недавно перерисовал больше ста штук:
Раньше на каждом экране приложения ВКонтакте использовались свои иконки в разных цветах и размерах. Например, newsfeed_search, wall_search_gray и т.д. Теперь дизайнеры ВКонтакте сделали иконки универсальными и можем переиспользовать их. Всего одна иконка поиска вместо пяти разных.
Благодаря такому подходу создавать новые экраны ВКонтакте стало проще: не нужно каждый раз нарезать иконки, разработчик просто берёт готовые в требуемом размере и использует цвет из макета. У иконок в коллекции интуитивно понятные названия, так что найти нужную можно даже без помощи дизайнера, что порой экономит время.
Все основные компоненты для каждой платформы собираются в коллекцию — UI Kit ВКонтакте. Вот как это выглядит:
Дизайнеры ВКонтакте создали собственную дизайн-систему, которая использует одни и те же иконки, кнопки и цвета в приложениях для Android и iOS. Команда разработки дизайна старается придерживаться единого стиля на всех платформах вплоть до мелких деталей — не забывая, впрочем, об их отдельных особенностях вроде специфических контролов, теней у карточек или наличия сепараторов.
В 2015 году ВКонтакте полностью перешли с Photoshop на Sketch для проектирования своих интерфейсов. Для распределения задач используется Trello, а рабочие файлы синхронизируются в Dropbox. Прототипы создаются в Principle, Framer и Origami, постоянно пробуются новые инструменты и плагины.
Цель хорошего дизайна ВКонтакте
Цель любого хорошего дизайна состоит в том, чтобы улучшить жизнь пользователя. И процесс всегда начинается с вопроса: как её можно улучшить?
Это требует совместной работы нескольких команд ВКонтакте: изучается обратная связь, анализируются сценарии взаимодействия с продуктом и уже на основе этого происходит решение, что было бы неплохо реализовать.
Когда задача попадает к дизайнерам ВКонтакте, функциональность продукта уже определена. Дизайнеры должны решить, как сделать так, чтобы этим продуктом хотелось пользоваться, чтобы это было удобно и — в конечном счёте — чтобы это делало жизнь пользователя социальной сети лучше. Визуальная эстетичность интерфейса при этом не имеет решающего значения, несмотря на расхожее мнение, что дизайн — это только про красоту. Удобство для дизайнеров ВКонтакте на первом месте.
На примере кейсов из мобильных приложений ВКонтакте ниже будет о том, с какими проблемами и целями команда дизайна ВКонтакте сталкивается каждый день.
Навигация ВКонтакте
В мобильном приложении ВКонтакте Вы можете сделать почти всё то же, что и в полной версии сайта. С одной стороны, это прекрасно. С другой — во ВКонтакте слишком много всего. Даже самая убойная новая фича обречена остаться незамеченной в закромах бокового меню. В то же время самые востребованные разделы никак не выделяются.
Нужно упрощать навигацию в приложениях, не жертвуя функциональностью. Дизайнеры ВКонтакте сделали это с помощью таббара в нижней части экрана.
Сам по себе таббар — ни разу не новинка. Сейчас это стандартный подход к навигации на Android и iOS. Во ВКонтакте он когда-то тоже был:
Обратите внимание на 2011 год — всё довольно просто, если функциональность приложения вмещается в пять вкладок.
Тогда все фичи ВКонтакте в первую очередь внедрялись в вебе, и в лучшем случае воплощались в API заметно позже, а то и вообще никогда. Но времена менялись: всё больше пользователей обзаводились смартфонами, парадигма Mobile First набирала обороты, и приложения ВКонтакте стали уметь гораздо больше. На подходе были новые занимательные разделы и сервисы, и одной нижней панели им катастрофически не хватало.
Здесь пути разработчиков дизайна мобильных приложений ВКонтакте с таббаром разошлись. Во всех следующих версиях использовалось только боковое меню, куда вмещались все разделы. Дизайнеры тасовали пункты, перерисовывали иконки и играли с цветами, но кардинально ничего не менялось. Настало время положить этому конец.
И, снова кажется, таббар — идеальный вариант. На дворе MMXVII, табы прочно обосновались в гайдлайнах Apple и Google. Так дизайнерами ВКонтакте было решено выполнить эту задачу — вынести самое нужное на расстояние одного тапа и сохранить всё разнообразие возможностей в привычном меню.
Что ж, отлично. Осталось понять, что будет во вкладках мобильных приложений ВКонтакте. Здесь нужно отметить, что идеологически во ВКонтакте почти не практикуют A/B тестирование UX на больших выборках живых людей. Даже глобальный редизайн полной версии сайта после выкатки на часть пользователей допиливался только в отношении каких-то мелких деталей. Принципиальные вопросы вроде приоритета разделов решаются ретроспективно, планируя будущее на основе обширного опыта из прошлого.
Проанализировав множество разных статистик, разработчики дизайна ВКонтакте (без особой, впрочем, интриги) выбрали четыре основных раздела: Новости, Поиск и Рекомендации, Сообщения и Уведомления. В пятой вкладке появилось меню, где будет всё остальное.
А что же старое доброе меню? Здесь разрабы дизайна дали ВКонтакте себе волю в создании концептов:
Но, как ни заманчиво взять и поменять вообще всё, дизайнеры должны не испугать пользователей ВКонтакте и не потерять в удобстве. Классический список занимает меньше места, для всех привычен и прост в использовании. На том и порешили.
Поиск и Рекомендации ВКонтакте
Пользователям ВКонтакте нужно постоянно открывать что-то новое для себя. (Так почему-то решили разработчики ВКонтакте.) Хочется находить интересные записи, не ограничиваясь своей лентой новостей. И это должно быть максимально просто. (Ха-Ха-ха.)
Рекомендации — это обновлённый раздел ВКонтакте с большими амбициями. Теперь он не спрятан в глубине новостной ленты, а вынесен на видное место в новой навигации. Здесь предлагается контент талантливых авторов с тематиками, на которые с большей вероятностью залипнет пользователь ВКонтакте. После этого, ему можно скормить с нормальным CTR правильно подобранную рекламу. По сути, это такая залипательная штука, где можно найти что-то качественное и незнакомое с учётом скорее навязанных, а не личных предпочтений.
С точки зрения дизайна задача для разработчиков ВКонтакте стояла нетривиальная. Нужно уметь красиво отображать разные типы контента и прикрутить туда глобальный поиск по всем разделам, да так, чтобы одно другому не мешало. Дизайнеры в итоге остановились на карточках:
И вот почему. Ленту из карточек ВКонтакте удобно листать — обычно уже по превью понятно, захочет ли пользователь прочитать лонгрид полностью или нет. Теперь пользователю ВКонтакте не придётся тратить время и долго скроллить огромные посты прежде чем найдётся тот, на котором он вдруг захочет остановиться. По факту — материала пользователями ВКонтакте уже нагенерировано столько, что можно не опасаться, что кто-то однажды залипнув в Ленте ВКонтакте сможет из неё вырваться или хотя бы что-то выбрать и прочитать. По тапу на карточке публикация ВКонтакте открывается целиком (но зачем, когда впереди ещё столько «нового» и «красивого»), и при желании можно дальше листать ленту в полноразмерном режиме или вернуться к режиму превью.
С выбором иконки для этого раздела дизайнерам ВКонтакте было непросто. В конце концов победила дружба лупа: ведь рекомендации тоже представляют собой поиск, просто без конкретного запроса, а с автоматическим подсовыванием того, на чём залипнет пользователь.
Лента новостей ВКонтакте
В марте 2017 года ВКонтакте начали показывать счётчик просмотров рядом с записями. В приложениях это тоже поддержали — но только на отдельном экране с постом. В ленте новостей просмотры не отображаются, и это нужно исправить.
Но нельзя просто взять и добавить счётчик. Это новый статичный значок, и важно не запутать пользователя. Дизайнеры ВКонтакте изменили стиль иконок действий: из залитых они стали контурными. Такие иконки можно сделать контрастнее и крупнее, сохранив воздушность интерфейса — контурные значки ВКонтакте не станут визуально «тяжёлыми». Они выглядят эстетичнее, не воспринимаются неактивными и привносят элемент игры: хочется заполнить «пустую» иконку своим действием. Благодаря разным стилям предполагается, что пользователь сможет легко понять, что здесь его ждёт а что — просто информирует.
И самое главное — дизайнеры ВКонтакте покрасили лайк. Да, теперь он красный (ну почти, #FF3347), сочный и заметный. Больше никаких сомнений, лайкнули Вы эту роскошную статью или ещё только собираетесь. Первые эксперименты с цветом сердечка ВКонтакте начали ещё в 2014 году, в процессе создания нового дизайна веб-версии.
Аудиоплеер ВКонтакте
После весенней реформы аудиораздела многое поменялось — ВКонтакте появились плейлисты, обложки треков и новые подборки в рекомендациях. Сам плеер при этом остался прежним.
Если добавить на экран все контролы, которые могут понадобиться пользователю, это будет похоже на космический корабль. Но выкидывать ничего не хочется.
Нужно было придумать удобный способ отображения большого количества контента в плеере. И вот что получилось:
Дизайнеры ВКонтакте сделали экран с текущей композицией центральным, предусмотрев возможность свайпом переходить к тексту песни и к плейлисту. Благодаря этому, экраны не перегружены контролами, а пользователь может сосредоточиться именно на том, что ему сейчас нужно, например, не следить за дорогой при управлении машиной, а детально разглядеть обложку своей погребальной песни и даже начать разучивать её текст. А отдельная иконка списка не позволит запутаться в экранах — пользователь всегда знает, где искать плейлист, если всё ещё будет жив к этому времени. =)
Редактор историй ВКонтакте
Каждую неделю в историях ВКонтакте появляется несколько новых масок, и, конечно, разаботчки ВКонтакте хотят, чтобы пользователи тоже их купили (с миру по нитке на содержание всей инфраструктуры ВКонтакте). Лезть за новой маской в большой подробный список всем лень — пользователей уже приучили не утруждать себя. Кроме того, громоздкий каталог занимает почти треть экрана и закрывает часть лица.
Поэтому решено было попробовать другой распространённый подход для быстрого переключения между масками:
Анонс обновлений ВКонтакте
Над воплощением дизайна ВКонтакте в реальные методы, контролы и экраны работают самые разные люди. Всех их объединяет одно — они заверют, что верят, что делают жизнь миллионов пользователей (включая их самих) лучше, продумывая каждую иконку, каждый раздел, каждый сервис. Насколько хорошо у них это получается — оценивать позалипшим в свои телефоны пользователям.
Уже совсем скоро будут официально запущены обновлённые приложения ВКонтакте для Android и iOS, где реализованы некоторые из описанных концептов:
«Мгновенно заметить лайк от топовой тян, написать ей «привет, как дела» и тут же вернуться к мемасикам в ленте — изи как никогда.»
Муртол Лазвачев, активный пользователь ВКонтакте
По материалам:
https://vk.com/blog/by-design
Заберите ссылку на статью к себе, чтобы потом легко её найти 😉
Выберите, то, чем пользуетесь чаще всего:
Спасибо за внимание, оставайтесь на связи! Ниже ссылка на форум и обсуждение ; )
Можно ли отключить новый дизайн ВКонтакте и вернуться на старый?
Многие пользователи, зашедшие в социальную сеть ВКонтакте утром 17 августа, не сразу поняли где они оказались. Вроде бы похоже, но что-то совсем не так ). Всё дело в том, что ВКонтакте сменил дизайн.
По словам разработчиков, работа над созданием нового дизайна велась полтора года. Из них 4,5 месяца длилось публичное тестирование. Кстати возможность протестировать новый дизайн была доступна всем желающим уже начиная с апреля этого года.
Изменения затронули не только внешний вид страничек, но и архитектуру сайта: было исправлено несколько тысяч ошибок, улучшена скорость работы, стабильность. Разработчики полностью отказались от технологии Flash, которая перестала поддерживаться основными браузерами, и полностью перешли на современный HTML5.
Сильно изменилась страничка «Сообщения»для обмена личными сообщениями. Если ранее имена собеседников находились в блоке справа, освобождая при этом место для диалогов, то теперь на одном экране одновременно размещаются список последних бесед и текущий открытый чат. Переключаться между беседами и реагировать на новые сообщения в таком режиме стало проще и удобнее.
Многие пользователи очень довольны новым дизайном соц.сети: по их словам он стал более воздушным, современным, менее нагроможденным, с новыми полезными опциями. Другие же отнеслись к нововведению с большой долей иронией и даже негодованием. Уже утром 17 августа появились первые призывы к написанию петиций (например, на change.org), чтобы разработчики вернули всё как было раньше:
Так можно ли вернуть старый дизайн ВКонтакте? Есть ли какая-то кнопка, чтобы сделать всё как было раньше? К сожалению, нет… Придется привыкать к новому внешнему виду любимой соц.сети. Разработчики оставили лишь возможность переключения классического и нового вида для интерфейса сообщений. Сделать это можно, нажав на иконку шестеренки внизу экрана:
Друзья, а как Вы оцениваете новый дизайн ВКонтакте? Нравится ли он Вам или Вы тоже с удовольствием откатились бы на старый вариант? Делитесь в комментариях.
Автор статьи: Сергей Сандаков, 40 лет.
Программист, веб-мастер, опытный пользователь ПК и Интернет.
Как вернуть старый дизайн «ВКонтакте» прямо сейчас
Сегодня «ВКонтакте» объявила о принудительном переводе всех пользователей на обновлённый дизайн сайта. И не всех он устроил. Как и предполагалось, официального способа откатиться на старую версию нет.
Но решение есть, и оно достаточно простое. Расскажем, как вернуть старый дизайн социальной сети.
Что нам понадобится
И что же нужно делать
Шаг 1. Установить расширение Stylish. Перезагрузился браузер.
Шаг 2. Открой специальную страницу по выбору стиля для VK. Нажми кнопку «Install with Stylish». Расширение попросит подтвердить установку дополнения. Соглашаемся.
Шаг 3. Обнови свою страничку в социальной сети.
…
PROFIT!
Внимание: в данном стиле имеются небольшие баги, вроде лёгких «пролагиваний» страниц и изредка сбивающихся цветов. В целом, надстройка работает нормально. Разработчики обещают исправить недоработки в ближайшее время.
🤓 Хочешь больше? Подпишись на наш Telegram. … и не забывай читать наш Facebook и Twitter 🍒 В закладки iPhones.ru Возвращаем дизайн в три простых шага.Артём Баусов
@DralkerГлавный по новостям, кликбейту и опечаткам. Люблю электротехнику и занимаюсь огненной магией. Telegram: @TemaBausov
- До ←
Почему iPhone 7 Plus просто обязан работать с Apple Pencil
- После →
iPhone 7 пророчат 256 ГБ встроенной памяти
«ВКонтакте» обновил дизайн: пропал Дуров, появился Гарольд
+ A —
Поначалу новый вид будет доступен миллиону пользователей
Социальная сеть «ВКонтакте» сменила дизайн, напомнив, что это стало первым его глобальным обновлением за минувшие 10 лет. В первое время новый дизайн сможет опробовать миллион подавших заявки пользователей.
В обращении к пользователям соцсеть указала на основные отличия нового дизайна от прежнего. Так, была увеличена ширина экрана и шрифты, наверх перенесены разделы «Новости» и «Сообщения», а также унифицировано отображение портала на всех типах устройств.
Записи в ленте, как утверждает ВК, стали заметнее, раздел сообщений «переписан с нуля», непрочитанные сообщения в нем теперь отображаются синей точкой, а присутствующие в Сети собеседники — зеленой.
Также более крупно и в «красивой журнальной верстке» теперь показываются фотографии, а все уведомления собираются в новом разделе.
Все изменения на сайте анонсирует всплывающий рисованный герой интернет-мемов Гарольд, пришедший на смену другому мему — Ничоси.
Вадим Васильев, ведущий социальный сетей MK.ru, прокомментировал новый дизайн так: «Очень непривычный дизайн, это всё-таки самое большое обновление за всю историю ВК. Позаимствовали у Facebook широту размаха и несколько проверенных временем фич, вроде ленты новостей и уведомлений. Виден потенциал для большего количества таргетированной рекламы, монетизировать популярность сайта станут по полной программе. Отмечу удобство новых разделов аудиозаписей и диалогов, с которыми стало легче управляться. Дизайн, вероятно, ещё сильно изменится, а пока жду большой ругани пользователей в духе «Верните стену!».
Реакция пользователей ожидаемо разделилась: от восторженной до резко негативной. Одни владельцы аккаунтов отмечают неудобство новых шрифтов, другие — приближение дизайна «ВКонтакте» к Facebook, третьи пока и вовсе не спешат переходит на новый внешний вид.
Господи, зачем я подключила новый дизайн #вконтакте. Он такой ущербный. Хочу обратно старый.
— Анна Уракова (@UrakovaAnna) 1 апреля 2016 г.
#Вконтакте обновил дизайн. Браво! нравится
— Андрей Горохов (@andrew_gorohov) 1 апреля 2016 г.
Загадала на Новый Год больших перемен в жизни. Изменился дизайн ВКонтакте.
— Les (@AlesyaSheer) 1 апреля 2016 г.
Ну спасибо, че, свое получила
Впрочем, одним из самых отмечаемых пользователями изменений стала даже не смена дизайна, а исчезновение из подвала сайта упоминания создателя социальной сети Павла Дурова.
Як поверните старый дизайн Вконтакте
Ниже приведен текст о тех, кто украшен (как на люстрации)
Вконтакте (теперь также виды как vK.com) для тысяч пользователей, ставших основными или для навигации по единому сайту, они проводят свои часы в сети. Деяких диста аскетичный (эль более стильный) бело-голубой дизайн сайта, а зловоние осуществляется на рекламу, яка пропоны розфарбувати ровный вид вконтакте для справки команда оформление .
Почему вы не уверены в дизайне?
Якшо для установки тех у вас не просят введите пароль, отправьте смс, установите неопознанную программу — навсегда. CSS текстовый код i фоновое изображение Плюс инструкции, зоротная направленная вище, — называйте меня так вглядє безопасной темой для сайта.
Деяки те, впрочем, шкодити могут твои зору, перестраховывайтесь;)
Несколько дней на Facebook? Багато друзья и лайки?
Сколько еще платить за интернет в ближайший месяц!
Вперед в будущее! Частково займет у вас час!
Додаткова профессия востребована.
- Пришли с теми | Rakontu al la aliaj:
Дизайн сайта ВКонтакте ранний и ясный. Це сильно влияет на восприятие информации користувачем, благодаря чему она становится более важной, чем чтение и письмо. Жалко, что администрация ВКонтакте еще не разогнала такую возможность, как установку путем вырезания дизайна.
Вы можете установить новый дизайн для ВКонтакте, не влияя на официальную доступность нового дизайна для ВКонтакте; Для ЦО это важно, вам не нужно давать мне особую информацию.
Изменить стандартный дизайн ВКонтакте можно без особых проблем, как только вы увидите поющий ланцет для використовувати, при этом только довирены способами. Уважайте, когда у вас есть изменение дизайна, полагайтесь на уважение к самому дизайну, тобто, квартирам и частично элементам roztashuvannya.
Сменить тему можно на сайте Vikoristovuvati:
- специальный браузер; Расширение
- для браузеров.
На этот год много способов Индивидуальное украшение борта по нормативам только для тюльки.Так же и с вариантами варто и користуватися, так як таким образом вам гарантированно откажут:
- Даних не пеку; Швидкод
- для роботов с формализованной стороной;
- Возможность выбора из великолепного каталога или отдельно стоящих;
- безкоштовне використання.
У детей есть VIP-система. При такой раздаче установка певческих тем жаждет финансовых витратов.
У большинства пользователей ВКонтакте вроде бы много проблем. Вам нужно лишить вас вибрати, чтобы вы смогли получить стиль.
Метод 1: Победа браузера Orbitum
Весь способ установки тем для ВКонтакте за один раз потребует наименьшего количества выпивки, чтобы установить весь браузер Orbitum, который перед этим нужно добавить. В то же время положительный фактор для любителей Chromium, Yandex и Operi, тех, кто основан на Chromium.
Рис нестандартный, купюры интернет-опроса проблем с производительностью нет. В то же время, выиграть нада скин користувачев абсолютно безрамочно, отличный каталог разной тематики, рассчитанный на детские социальные ранты, включая ВКонтакте.
Чтобы поставить тему ВК в такой ранг, нужно следовать простой инструкции.
Так же можно самостоятельно настроить тему оформления без коштовно.
Для установки теми, у кого ваш скин новый вход в социальную сеть Вконтакте через датский веб-браузер, вы сделаете резервную копию дизайна, замените стандартный.
По причинам, по которым вы хотите превратить стандартный дизайн ВКонтакте в полноценный Интернет-браузер, процесс также необходим для инструкций по пению.
Способ 2: команда конструкторов для ВКонтакте VKMOD
Даний Спосиб поменять дизайн во ВКонтакте уже не vimag в браузерной среде, так як ВКМОД — это более широкий спектр. Предоставляются дополнительные обновления еженедельно в Интернете при просмотре Google Chrome.
С роботами с заданными расширениями в большинстве случаев проблем не возникает.Однако нехватка голов VKMOD вот-вот устареет, и проблема в том, что есть только один-единственный веб-браузер, я хочу быть самым популярным.
Варто уродливое увагу, щодан расширенный було сфатку разобран для раннего оформления ВКонтакте. В таком ранге они могут показаться неправильными.
В будущем расширение будет мелодично стабилизировано и адаптировано под новый дизайн.
Метод 3: Get-Style
Расширение Get-Style проводится на такое количество дополнительно, так как предполагается, что оно будет идти в ногу с часом.Это связано воедино, поэтому в датское время дизайн ВКонтакте динамично меняется — появляются новинки, или они меняются там же, даже в Get-Style, а также для публикации раньше.
Ну вот, боюсь этого расширения — куплю старый дизайн ВК, ну и совсем новый. В то же время очень много багов в случае получения обновлений Style.
В связи с кардинальными изменениями ВКонтакте рекомендуется выбирать лучшие приемы оформления.Ваша сторона будет великолепной и привлекательной.
Dane extension є мы сокращаем весь Интернет, поэтому yak nadaє koristuvacham:
- интеграция расширения в Chrome, Opera, Яндекс и Firefox;
- отличный каталог тем;
- Властный конструктор; Установка
- безштовну тем.
Вы можете установить и получать дополнительные обновления, если посмотрите инструкцию к отчету.
Все приложения могут быть запущены до установки расширения.
Обовьязково обновить сторону перша, ніж установить тему.
Остается, що переполнено зробити — это изменение стандартной темы ВКонтакте. Сражаться легко.
Большинство обновлений отображаются автоматически.
Дана расширилась без скромности, добавив больше цвета в середину всего, чтобы вписаться в стиль социального дизайна ВКонтакте. В то же время, увидев себя, вы сможете вырасти минимум своими руками.
В рейтингах осуществляется один из административных ресурсов. С этим званием, можно совершенно без коштовно распознать еще больше возможностей.
При выборе способа регистрации во ВКонтакте рекомендуется враховувати все за и против. Так, в некоторых случаях, например, если вы використовите систему только для введения какой-то социальной фантазии, лучше всего вибрирует Орбитум. Ale for witness Яндекс, Opera, Firefox или Chrome — это не только для социальных сетей — лучший способ получить максимально стабильное расширение.
Счо в сумке вибрируй — virishuєte tilki vi. Удачи вам в выборе тех для ВКонтакте.
Privit, шановні чтение блога на сайте. Як приколол, можно узнать по ряду причин. Самый популярный випадок — це потеря доступа (Забыли пароль, потеряли телефон, до чего была привязана ссылка при восстановлении и теперь не заходят в ВК). А также есть варианты, если сторона мяча по негласным причинам заблокирована .
- https://vk.com/restore- какой аккаунт buv привязки к номеру телефона.
- https://vk.com/restore?act=return_page — если не пришла привязка стороны к номеру телефона, либо номер больше не был доступен.
Как вы его раньше обновляли со страницы ВКонтакте?
Как только вы увидели свою сторону, но потом все они передумали, ибо если увидели за вас того, кто несанкционированный доступ к вашему профилю, то можно продолжать обновлять в течение 7 месяцев … Для более того, мало зайти на сайт Вконтакте со своим логином и паролем, а если у вас есть кто-то на экране, вам стоит попробовать «обновить свой сайт»:
Однако, если вы уже прошли 7 месяцев в день, потом у вас будет шанс обратиться в службу техподдержки (написать лист на Email [Email protected]) О новостях о продлении партии, а не о том, что вонь может вам помочь , если вы хотите иметь шанс на успех, все будут спасены.Есть возможность донести свои права до всей партии и проверить в течение часа, узнать из архивов и остаточного продления.
Удачи вам! Перед беглым обзором по сторонам блога сайт
Вы можете быть цикаво
Identity — так це еще и как подтвердить личность Як розблокувати телефон
Вы можете посмотреть страничку Вконтакте, а также привыкнуть к старым страницам в Друзьях
Как добавить свой номер телефона на страницу Вконтакте? Госслужащие: вход в спецкабинет разными способами и обновление пароля. Як увидит экран post i Post на почте.ru, Яндекс и Gmail Як видят вашу сторону в Одноклассниках Аккаунт Яндекса Вы можете увидеть его или включить на своей стороне Facebook ежечасно
Восстановление и вход на вашу сторону в Контакти — не заходите в ВК.
Социальная фантазия «ВКонтакте» провела первое масштабное изменение дизайна. Как бы то ни было, они допустили много любителей, разработчики сосредоточились на Material Design, максимально приблизив дизайн десктопной версии к разновидности социальных сетей в приложениях на Android и iOS.
«Главный принцип нового дизайна ВКонтакте — он похож и знаком всем хозяйственным постройкам.Веб-сайту легко узнать необходимую раздачу в мобильном приложении «і навпаки», — означает операционный директор социальных служб.
Новый дизайн при запуске в тестовом режиме для аудита. Вы можете попробовать Yogo, нажав кнопку «Приходите на тест».
Голова обновленного «ВКонтакте», мабут, конец больших полей со сторон. До тех пор, пока все элементы социальной защиты не распространились по центру экрана, они не имели никакого шума.Особенно приветствовали Володаров широкоформатных экранов.
Примерно через час с середины посещения ВКонтакте нашлось много популярных «тех», кто мог найти дополнительные расширения для браузеров. В центре «темы» были популярные музыканты, актеры или любимые писатели и певцы. В большинстве случаев аудитория выглядела жаждущей и заинтригованной функциями социального обеспечения.
Самое главное место проживания багатых користувачев «ВКонтакте» — «Новини» — претерпело значительные изменения.Списки новинок сразу с шумом и комментариями были перенесены в блок окремия.
Окремому «вогнику» отведена функция включения «новых» новинок. Вон в соцсетях заканчивает самую часовую практику по принципу вибрации наиболее актуальной для клерка информации, хотя и одновременно, на странице Facebook, показывая все сообщения.
Самым кардинальным преображением стал раздел «Повидомлення».Теперь вы можете общаться в чате и перечислять все сообщения. Як я в приложениях, статус спонсора «онлайн» обозначен зеленым пятнышком.
Все, как и до всей були, были частью раздачи «Новини», перенесены на следующую точку в шапке сайта. Появилась возможность подписаться на новости о новых рекордах групп и спортивных товаров: «дзиночок», чтобы проконсультировать о нововведении, а также о днях народа и заявках на доплату от друзей.
Фотографии приобрели вид Facebook: изменены комментарии к правой стороне изображения, а фотографии стали крупнее. Программа просмотра фотографий также приспособлена для осмотра с широкой оправой.
Чувствительные к редизайну социальных сетей обходили границу уже не один рик. В последнюю неделю 2014 года «ВКонтакте» стимулировало разработчиков принять участие в конкурсе на новый дизайн: в конкурсе приняли участие 500 человек.Среди сотен роботов було видит пятырка блогеров, победителям хулигана MacBook Pro были вручены ноутбуки в самой полной комплектации, более четырех забрали призы с бдения iPad Air .
Неважно для тех, чо конкурс будет масштабным, в соцсетях не озвучили конкретные даты и не уточнили, кто станет победителями роботов-участников в случае смены последнего вигляд сайта.
Курс на «плоский» дизайн уже давно взяли росробники — раздаются разработчики ВК для масштабных изменений швидше був, аналогичные версии сайта для додатки и вже використав вильне по краям для знаков.
Poki «ВКонтакте» будет предлагать тестовую версию не на постоянной основе — она станет необходимой в новом дизайне; Кроме того, социальная мера показала возможность увидеть его раньше старой версии сайта.
В случае с ВК редизайн вряд ли будет успешным среди соцсетей, подготовка к масштабным изменениям велась все больше и больше, и сайт явно требовал разработки версий для дополнительных версий. Значимые поля и остаточный перенос на имя ВК отвечают за употребление социалистических напитков за корицу.
Как поменять дизайн ВКонтакте на старый. Как вернуть старый дизайн ВКонтакте. Новый дизайн ВК не включается, что делать
На днях социальной сети Вконтакте исполнилось 10 лет, конечно, в честь такого события разработчики не могли усидеть на месте и пару месяцев назад организовали новый дизайн для Вконтакте, чего многие, к сожалению, не сделали. нравиться.
В августе 2016 года дизайн ВК изменился и стал показываться абсолютно всем, а не только пользователям, участвовавшим в тестировании.Те, в свою очередь, еще могли нажать заветную кнопку «Вернуться к старому дизайну», но теперь ее больше нет. И что делать? Как вернуть старый дизайн ВК?
На этот случай я нашел несколько вариантов, которые вернут дизайн. Думаю, долго такая функция работать не будет и рано или поздно придется переходить на новый дизайн.
Внимание! Покопавшись в интернете, я обнаружил различные скрипты, ярлыки и т. Д., Которые якобы помогут перейти на старый дизайн.Действительно, раньше было, но сейчас эти методы уже устарели и не работают на 100%, так что даже пробовать не приходится. Метод, который я привел ниже, немного сыроват, но позволяет до некоторой степени использовать старый дизайн, который нам когда-то нравился.
Старый дизайн ВК, как на него перейти?
Итак, один очень хороший разработчик создал плагин для браузера, который позволяет вам переключиться на старый дизайн. Чтобы установить это расширение, перейдите по этой ссылке.
Когда вы окажетесь на сайте, нажмите ссылку Install Stylish , после этого вам будет предложено установить расширение Stylish.
Включите расширение в панели браузера и перейдите на сайт Вконтакте.
Нажмите на значок плагина и выберите там пункт «Найти другие стили для этого сайта» , вы будете перенаправлены на тот же сайт, где вам нужно выбрать первую ссылку «Старый дизайн ВК» .
Вы будете перенаправлены на страницу, где нужно нажать зеленую кнопку. Установить со стильным … Подтвердить установку надстройки для расширения.
Заходим на сайт ВК и нажимаем на иконку расширения и ставим галочку «Старый дизайн ВК» … Нижняя галочка «Отключить все стили, убрать» … Обновляем страницу и вуаля, имеем старый дизайн ВКонтакте.
Выход
Мне новый дизайн пришелся по вкусу, хотя и не был привычным, для кого-то был ужасен. На данный момент этот способ перехода на старый дизайн — единственный, так как больше не работают скрипты и ярлыки.Минус этого расширения в том, что оно еще не доработано. Вы увидите много недоработок, но в целом Вконтакте будет похож на тот, что был раньше. Наслаждайтесь переходом.
По привычке многие отвергли новый дизайн и стали устраивать на своих страницах единичные онлайн-манифестации с требованием вернуть старый «ВК». Даже Павел Дуров предъявил семь претензий к редизайну.
Исходя из собственного опыта, мы отмечаем, что зависимость возникает после двух недель использования нового интерфейса.После этого не было желания возвращаться к былому дизайну.
Рассказываем всем олдскулам, неофобам и любителям ретро, как включить предыдущий вид «ВК».
Как вернуть старый дизайн ВК
1. Сначала установите в браузере расширение Stylish (с его помощью можно менять дизайн сайтов на своей стороне):
— для Chrome и Яндекс.Браузера
— для Firefox
— для Safari
— для Opera
2. Теперь перейдите на страницу со стилями старого дизайна и нажмите зеленую кнопку «+ Установить со стильным».
3. Заходим на сайт «ВКонтакте» и видим знакомый интерфейс. Да, авторам стиля костыль пока не удалось воссоздать аккуратную копию старого дизайна, но это единственный рабочий способ вернуть старый ВК.
Вы можете переключаться между дизайнами, установив / сняв флажок в настройках расширения.
В связи с полным обновлением дизайна популярной социальной сети ВКонтакте у многих пользователей возникает вопрос, как вернуть старую версию ВКонтакте.Разберем процесс выполнения этой задачи на компьютере и смартфоне / планшете.
1. Возвращение в прошлое на компьютере
Чтобы вернуться к старой версии ВК на ПК или ноутбуке, достаточно воспользоваться настройками.
Делается это так:
- Перейти в любой диалог. Это может быть даже чат с несколькими друзьями. Внизу найдите значок в виде шестеренки и нажмите на него.
- Появится подменю.Выберите в нем пункт «Перейти на классический интерфейс».
К сожалению, на этом возможности пользователей ПК и ноутбуков заканчиваются. К сожалению, полностью перейти на старую конструкцию у них не получится.
2. Почему это происходит?
Сами сотрудники ВКонтакте считают, что поработали над ошибками, поэтому в старой версии уже нет смысла. Это подтверждается приведенным ниже скриншотом звонка в службу поддержки.
Интересно: Сначала, когда обновление дизайна только происходило, в обычных настройках была кнопка, которая возвращала старый вид.Потом сняли.
Итак, мы разобрались, как вернуть старую версию ВК на компьютер хоть на какую-то долю. Теперь поговорим о том, что вы можете сделать для пользователей мультимедийных устройств.
3. На смартфоне / планшете все намного проще
Короче для Android нужно установить старую версию как приложение и убедиться, что устройство нельзя обновлять.
Пошаговый процесс выглядит следующим образом:
- Откройте Play Market и выберите «Параметры» (три горизонтальные полосы), затем «Настройки».
- Тапаем по надписи «Автообновление приложений» и в появившемся меню выбираем вариант «Никогда».
- Теперь перейдите в обычные настройки вашего устройства, там найдите список приложений (в последних версиях Android для этого нужно открыть меню «Приложения», затем «Диспетчер приложений»). Там откройте страницу приложения ВКонтакте, которое вы уже используете для доступа к этой социальной сети.
- На странице приложения нажмите кнопку «Удалить» и выберите «ОК» в появившемся запросе.Программа будет удалена.
Процедура «смены дизайна» на iPhone практически такая же. На видео ниже наглядно показано, как все это делается. Если возникнут вопросы, обязательно напишите нам!
Долгое время дизайн Вконтакте детально менялся, радуя пользователей добавлением новых функций или разочаровывая удалением старых. Достаточно вспомнить момент, когда местная «валюта» — голоса — внезапно перестала существовать. Но все эти изменения были мелочами по сравнению с недавним обновлением.
С 17 августа 2016 года сайт социальной сети «Вконтакте» насильственно и уже безвозвратно перешел на новый дизайн. До этого момента пользователям предлагалось переключаться между новым и старым дизайном в тестовом режиме, и некоторые пользователи сохранили эту функцию, но у большинства из них нет желанной ссылки «переключиться на старый дизайн» в настройках. Конечно, кому-то новый дизайн удобнее, он больше оптимизирован для просмотра через мобильные устройства, что упрощает простому обывателю, но во многих отношениях оказывается менее практичным для специалистов.Тем более раздражение от принудительного перехода на него, при отсутствии выбора. Поэтому пользователи ищут способы перейти на старый дизайн, а некоторые даже создают свои собственные плагины. Гораздо более простой способ, позволяющий любому вернуть старый дизайн ВКонтакте, — это установить стандартное расширение браузера, позволяющее изменять стиль отображения необходимых страниц.
Простой и надежный способ вернуть старый дизайн ВКонтакте
Этот метод требует от пользователя выполнения нескольких простых операций, которые сводятся к загрузке и настройке соответствующего расширения, модификации которого существуют для Google Chrome, Mozilla Firefox и других браузеров .Stylish — одно из таких расширений. Рассмотрим вариант с Google Chrome, как наиболее распространенный браузер:
О более простых способах возврата старой версии ВКонтакте
К сожалению, более простых способов «вернуть старый дизайн ВКонтакте» не существует. Ссылка «перейти к старому дизайну», которая раньше была надежно скрыта в новом дизайне, теперь отсутствует как класс. Самостоятельное написание скриптов даже опытному программисту займет больше времени, чем установка расширения + стиля.Таким образом, любое простое решение проблемы будет вариацией вышеупомянутого метода.
Stylish — одно из многих расширений, которое позволяет использовать пользовательские скрипты для изменения визуальной стороны дизайна вашего веб-сайта. Для работы расширения в браузере должен быть включен Javascript. Стильные сценарии пишут люди, поэтому в некоторых случаях полученный таким образом результат будет далек от идеала. Однако при своевременном обновлении стиля рано или поздно наступит момент, когда его автор пропишет все необходимые параметры.Также среди доступных стилей можно выбрать промежуточные варианты оформления, которые будут иметь преимущества старого и нового.
Полностью вернуть старый дизайн ВК не получится, но можно максимально приблизиться к старому стилю визуального оформления. Если вам не нравятся параметры скрипта Stylish, ближайшей альтернативой является расширение Tampermonkey. Несмотря на то, что (а точнее, из-за …), оба расширения служат одной цели, параллельно они могут работать некорректно.Поэтому перед установкой второго лучше удалить или отключить первый, и наоборот.
Чтение 5 мин. Просмотров 2к. Опубликовано 26.10.2017
Несмотря на то, что разработчики стремятся к идеалу, новое обновление привычного приложения не всегда доставляет удовольствие пользователю. Хотя это скорее привычка. Однако многие люди хотят оставить приложение таким, каким оно было до внесения изменений, и ищут информацию о том, как это сделать.
Стоит отметить, что «ВКонтакте» осенью 2017 года полностью обновила мобильное приложение… Это одно из самых ощутимых изменений, которое интерфейс программы претерпел за последнее время, до этого подобное обновление разработчики представили в апреле прошлого года. Изменилось практически все, от новых возможностей пользователя до общей организации рабочего пространства. И даже «лайки» теперь красные.
Несмотря на то, что оптимизация довольно хороша, а само приложение стало удобнее, многие (как, впрочем, и в прошлый раз) хотят и дальше использовать старую, более привычную версию.
Вся проблема в PlayMarket
Всем пользователям Android хорошо известен сервис по загрузке и установке новых приложений PlayMarket. В зависимости от настроек, установленных в этом приложении, программы, установленные на устройстве пользователя, будут обновляться в двух доступных режимах:
- Вручную — когда PlayMarket просто предлагает и рекомендует доступные обновления, а владелец гаджета решает, какое из них установить и какой из них игнорировать.
- Автоматически — как только новое обновление появляется в Device Market, установленная программа автоматически принимает его и обновляет.В этом случае пользователь входит в приложение и видит новый дизайн и интерфейс (как это происходит с ВКонтакте).
В связи с этим, первое, что должен сделать приверженец старого ПО для ВКонтакте — отключить автообновление приложений и перевести его в ручной режим.
Для этого зайдите в меню приложения PlayMarket, для этого нажмите на «бутерброд» в левом верхнем углу, в появившемся меню спуститесь вниз и найдите раздел «Настройки». В группе общих настроек находим пункт «Автообновление приложений» и из трех предложенных настроек выбираем «Никогда».
На этом настройка завершена. Это был первый шаг в решении вопроса, как вернуть старую версию ВК на Android. Теперь PlayMarket не будет автоматически обновлять установленные программы, и пользователь может спокойно использовать программу старого стиля, не опасаясь автокоррекции. При необходимости получить новую версию программы, достаточно самостоятельно перейти в раздел установленных приложений и проверить наличие обновлений, а также, при необходимости, запустить обновление.
После внешних настроек, влияющих на версию установленного обновления, можно начинать работу с программой на самом устройстве.если Маркет уже не обновляет приложения автоматически? В этом случае все достаточно просто, процесс разделен на два шага, которые предполагают удаление обновленной программы и установку необходимой версии.
Удаление обновленного приложения
Этот шаг чрезвычайно прост и понятен, вам просто нужно полностью удалить существующее. Если вы неопытный пользователь и беспокоитесь о потере информации или доступе к своей учетной записи, то это необоснованные опасения.Старая версия будет содержать все, что сейчас есть на вашей странице, это не зависит от использования программного обеспечения.
Удалить установленное приложение можно несколькими способами:
После обновленной версии можно дополнительно очистить кеш и удалить ненужные файлы на телефоне. Процедура не обязательна, но лишней не будет.
Установить нужную версию
После того, как память смартфона была очищена от остатков предыдущей версии программы, пора сделать последний шаг в решении вопроса, как вернуть старую версию ВК на Android.
Главный вопрос этого этапа — где взять дистрибутив предыдущей версии ВКонтакте. Сегодня в Интернете можно найти массу предложений скачать и установить любую программу, а не только ВКонтакте. Прежде чем обращаться к какому-либо источнику, следует сначала проверить его надежность. Установка программного обеспечения для мобильного доступа к личной странице ВК со стороннего ресурса может быть чревата неприятными последствиями, да и сам ВК предыдущих версий не распространяет приложения.
Перед тем, как скачать пакет файлов и установить их на свой телефон, следует поискать отзывы об источнике.Сегодня старые версии ВК можно найти на TrashBox или UpToDown.
Перед скачиванием раздачи нужно выставить настройки на гаджете. Для обеспечения большей безопасности устройства по умолчанию имеют предварительно настроенные параметры, запрещающие загрузку и установку приложений со сторонних ресурсов. Чтобы установить старую версию, вам необходимо изменить эти настройки. Обычно при попытке установить нужную программу выскакивает всплывающее окно. Предупреждение о несанкционированных действиях и предложение запретить или разрешить процесс.
Разрешаем установку и ждем завершения процесса. В результате пользователь вернет старую версию ВК на Android и продолжит использовать приложение в старом интерфейсе. При необходимости вы всегда можете обновиться с PlayMarket. Все-таки обновления часто меняют приложение в лучшую сторону, нужно просто привыкнуть к изменениям.
Оформление группы в ВК с активными меню. Дизайн группы Вконтакте: полное руководство по дизайну
Думаю, каждый, кто активно пользуется социальной сетью Вконтакте, уже встречал красиво оформленные группы и паблики.Многие из них, помимо меню, также имеют множество стилизованных вложенных страниц, каталогов и так далее, что фактически создает небольшой сайт прямо внутри социальной сети.
Вот несколько примеров, чтобы каждый понял, о чем идет речь.
Такие группы позволяют выделиться среди конкурентов и привлечь больше пользователей. Тем более, если контент тоже интересный 🙂
В рамках этой статьи мы поговорим о том, как это делается.Чтобы более подробно все разобрать и вникнуть во все тонкости, возьмем конкретный пример. Будет небольшой мастер-класс по групповому дизайну.
Самый первый этап нашей работы — это идея. Нам нужно понимать, что мы хотим сказать и кому. В контакте существует несколько форматов сообщества и выбирать стоит исходя из поставленных задач. Хотя в будущем группу можно преобразовать в публичный формат и наоборот.
Объясняю на пальцах. Public — это с чем сравнить блог. Лента новостей. Другими словами, мы рассказываем нашим подписчикам о некоторых вещах, и они не смогут написать на стене нашего сообщества. Максимум комментировать.
Группа позволяет создать сообщество, более открытое для разговоров и обсуждений, где люди могут публиковать сообщения в ленте от своего имени. Вы также можете добавлять в него друзей из своего списка. Публично такой возможности нет. Кроме того, у группы есть еще немного возможностей для интеграции вики-разметки (есть раздел «Новости», в который можно интегрировать меню).
Глобально можно рассуждать так: если нам нужно создать сообщество для магазина, то я бы выбрал «публичный» формат. Если речь идет, например, об энтузиастах рыбалки, то лучше брать «группу». Хотя каждый волен поступать так, как считает нужным. Ведь формат можно изменить в любой момент. Однако имейте в виду, что Вконтакте вводит ограничение на повторное изменение формата сообщества и после первого раза вам нужно будет подождать несколько дней, прежде чем вы сможете вернуть все обратно в случае необходимости.Поэтому лучше проверить работоспособность до того, как группа начнет наполняться контентом.
В рамках этого мастер-класса я возьму игру «Безумный Макс» по мотивам одноименного фильма, вышедшего всего пару недель назад, как отправную точку и создам сообщество для игроков с различными материалами по этому поводу. игра. Основная цель — снизить посещаемость вашего игрового сайта.
Формат будет «Групповой», так как вам нужно создать естественный поток аудитории и максимизировать общение внутри сообщества.Сразу уточню, что буду использовать универсальную методику, которую можно применять как в групповом формате, так и в публичном. Работает везде.
Контента очень много, начинаем воплощать идею в жизнь!
Создание группы
Для создания группы зайдите в «Мои группы» в правом меню своей учетной записи Вконтакте и нажмите на синюю кнопку вверху «Создать сообщество».
Должно появиться это окно, в котором мы вводим название нашей группы и выбираем формат.
После ввода необходимой информации перед нами открывается панель управления нашим сообществом. В моем случае это выглядит так.
Как видите, я добавил несколько параметров: включил видео, аудиозаписи, обсуждения и ряд других функций, которые мне пригодятся в дальнейшей работе при сборе контента. Все это в дальнейшем можно изменять без каких-либо ограничений. Я также зарегистрировал адрес своего сайта. Если у вас нет сайта или его тема не соответствует формату сообщества (они о разных вещах и никак не связаны друг с другом), то эту строку можно оставить пустой.
В данном случае я установил возрастные ограничения от 18, по аналогии с теми, которые разработчики выставили для игры. Хотя почти не сомневаюсь, что дети тоже играют.
Все. Группа создана!
Теперь вы можете приступить к его проектированию.
Дизайн группы Вконтакте
Этот этап можно разделить на 2 части: графическую и техническую. Для работы нам понадобится шаблон для создания группового аватара и меню, а также немного фантазии и базовые знания Photoshop (он же Adobe Photoshop).
Шаблон разметки
Что такое шаблон и что это вообще такое? Шаблон — это своего рода заготовка. В данном случае в формате * .psd мы отметили области для изображения под меню и аватаров группы.
Как вы можете видеть во втором примере в начале этой статьи, мы можем сделать дизайн в том же стиле для аватара и изображения меню. При этом визуально разрезает его на 2 части. Таким образом, шаблон позволяет сформировать изображение таким образом, чтобы исключить смещение графики и максимально подогнать изображения к одному уровню.
Для наглядности приведу пример.
Мы видим, что по обеим сторонам картины есть полоса с видом на жилую зону. Сделать ровно с первого раза без шаблона практически невозможно. Вам нужно будет скорректировать изображения, измерив расхождения до 1 пикселя. Тогда как при использовании шаблона мы просто добавляем к нему графику в разметке и сразу получаем желаемый результат.
Хочу отметить, что этот шаблон рассчитан на 1 строчку в пояснении.На скриншоте примера есть телефоны. Если появится вторая строка, то вам нужно будет использовать другой шаблон или исправить дизайн вручную.
А пока переходим непосредственно к графическому оформлению нашей новой группы. Здесь я выбираю путь наименьшего сопротивления и захожу в Google Images, чтобы найти элементы дизайна. Вы также можете использовать Яндекс. Кому что больше нравится.
Дизайнерского образования у меня нет, поэтому подробно останавливаться на подборе шрифтов и прочих мелочах не будем.После некоторого волшебства в фотошопе я получил следующий результат.
На левом фрагменте (там, где надпись «Меню») также можно добавить несколько триггеров. В этом случае я решил обойтись без них. Все. Дизайн аватара готов. Нажмите горячие клавиши Shift + Ctrl + Alt + S в Photoshop и сохраните наши фрагменты в папку на жестком диске.
Завершен первый этап работы с графикой. Возвращаемся к контакту.
Установка аватара и меню для группы
Нажимаем на два типа вместо авы нашей группы и загружаем туда наше изображение.Вот эти ребята, под ними тоже написано «Загрузить фото».
Добавьте изображение. Укажите поля и выберите эскиз. Здесь все просто и проблем быть не должно.
Как мы видим, вам нужно знать идентификатор сообщества. Узнать это очень легко. Находим меню в нашей группе (прямо под аватаркой) и открываем «Статистика сообщества». В этом случае в адресной строке браузера появится нечто похожее (цифры будут другими).
Эти числа после «? Gid =» являются идентификатором желаемой группы. Вставляем полученное значение в форму скрипта и пишем имя страницы, которую хотим создать. В этом случае я вбиваю «Меню».
Следует отметить, что страница будет создана только в том случае, если на соседней вкладке открыто окно с группой. Проще говоря, вы должны быть авторизованы в ВК в том же браузере. Действительно, доступ к таким манипуляциям имеют только администратор группы и назначенные им люди.Случайный прохожий не может легко взять и изменить настройки группы, в админке которой у него нет доступа.
Если все сделано правильно, откроется эта страница.
Это то самое окно, в котором мы позже сделаем разметку вики и создадим внутреннее меню для нашей группы. А пока нам достаточно написать что-нибудь здесь. Затем нажмите синюю кнопку «Сохранить страницу» и вверху нажмите ссылку «Вернуться на страницу».
Написал себе «Меню» и моя страничка после сохранения стала выглядеть вот так.
Дизайна еще нет, но теперь нам нужна только ссылка на эту страницу. Поднимаем его в адресной строке браузера и возвращаемся на главную страницу нашей группы. В ленту.
Здесь мы создаем пост со следующим содержанием: вставляем туда картинку и ссылку на страницу меню для группы.
Щелкните «Отправить». Затем мы нажимаем на время отправки сообщения и выбираем пункт «Закрепить» среди всех вариантов. Обновляем страницу (клавиша F5 на клавиатуре) и, если все сделано правильно, получаем первый результат: группа обзавелась аватаркой и ссылкой для перехода в раздел меню.
Wiki-разметка меню группы Вконтакте
Теперь приступим к проектированию самого меню. Вернитесь в Photoshop и создайте дизайн для нашего меню. При разработке интерфейса нужно помнить о тех людях, которые будут заходить в ВК через приложение с мобильных телефонов. Другими словами, у нас не должно быть мелких элементов, а кроме того, мы должны постараться сделать все максимально понятным. Чтобы не приходилось гадать, как здесь все устроено и где нужно щелкнуть… а просто ткните в нужную точку и изучите нужную информацию.
Сейчас не буду подробно останавливаться на том, как именно собрал меню. Вот что я сделал.
Минимум полей. Вертикальная планировка. Идеальный формат для гибких меню. То есть на мобилках ничего никуда не денется. Все будет в точности как на экранах компьютеров и планшетов. Я беру ширину 500 пикселей, чтобы потом ничего не сжалось и не потеряло качество изображения вдвое.Высота не важна.
Разрежьте изображение на фрагменты и сохраните их.
Все. Пора для финального аккорда — собираем меню уже в самой группе.
Для этого мы возвращаемся на главную страницу группы (где находится лента и наша ссылка-картинка, ведущая в меню). Щелкаем мышью по изображению меню и попадаем на ту же страницу, которую мы создали ранее для меню.
Если вы являетесь администратором или создателем группы (в нашем случае это так), то вверху страницы будет ссылка «Редактировать».Щелкаем по нему.
Далее переходим в режим вики-разметки (под кнопкой закрытия в правом верхнем углу страницы такой фрейм рисуется внутри). Когда желаемый режим активирован, эта кнопка выделяется серым контуром.
Потом тыкаем в иконку камеры и добавляем сразу все фрагменты нашего меню. В режиме вики мы не увидим сами картинки, а только код этих изображений с размерами и параметрами.
Я хочу расположить меню по центру, чтобы между фрагментами не было промежутков.Поэтому мы оборачиваем каждый из элементов в тег
и к уже вложенному параметру «noborder» добавляю второй параметр «nopadding». Первый отключает обводку фрагментов и границ ячеек таблицы. Второй убирает отступ с края.Первый и последний пункты меню не должны быть кнопками — на моем рисунке это просто графический элемент без ссылки на внутреннюю страницу, поэтому мы добавляем к ним параметр «nolink». Это уберет возможность щелкнуть по этому элементу, чтобы открыть часть изображения в отдельном окне.Теперь по щелчку мыши ничего не произойдет. Это нормальный фон страницы. Неактивный.
В моем случае код меню выглядит так.
Отдельно хочу отметить тот факт, что после импорта изображений в ВК встроенная система иногда некорректно указывает размер изображений. Поэтому нужно внимательно следить за этим и выставлять именно те, которые мы планировали еще на этапе проектирования дизайна. Иначе все может пойти не так, и головоломка в итоге не получится.
Когда мы написали код и выровняли все элементы, сохраняем страницу и видим то же, что и в Photoshop.
Остается последний штрих — нужно создать те самые страницы, куда наше меню будет отправлять людей. Для этого снова обратимся к скрипту генерации вики-страниц и на этот раз заказываем сразу три страницы. В этом случае также нужно что-то написать на каждом и не забыть где-то сохранить их адреса из адресной строки браузера.
Затем мы вставляем ссылки на новые страницы в вики-код меню в виде page-102302049_51013384, где первое число — это идентификатор группы, а второе — номер страницы. Хотя, это вообще не важно. В конце концов, нам просто нужно скопировать этот фрагмент URL-адреса и вставить его в разметку.
В результате код меню принимает следующий вид.
Внешне ничего не изменилось. Но когда мы нажимаем на пункты меню, мы видим, что теперь это работает!
Что касается самой разметки и правил, по которым написан код, советую прочитать специально посвященную этому делу группу Вконтакте.Ребята описали все ключевые моменты, и в их каталоге вы легко найдете нужный элемент и придумаете, как добавить его на свою вики-страницу.
Хотите узнать, как оформить группу во ВКонтакте в 2018 году? И не просто оформить, а сделать самому правильно и красиво! Если ваш ответ «Да», то эта статья специально для вас!
Социальная сеть ВКонтакте — одна из самых популярных. Соответственно, здесь можно найти больше общения, единомышленников и просто друзей, а также продвигать свои услуги и товары.Благодаря созданным сообществам можно быстро найти все об интересующем мероприятии, продукте, услуге и т. Д.
На странице управления нажмите «Загрузить» и выберите изображение. Выглядит это так: название группы, затем миниатюра аватара, статус.
К сожалению, мобильный телефон пока не поддерживает эту функцию. Но поскольку это нововведение произошло не так давно, для продвижения оно будет актуально как и все остальное.
Для более удобного доступа к предлагаемым материалам можно составить меню.А о том, как это сделать самому, мы расскажем в следующий раз.
Прикрепленный пост
Секреты оформления группы ВК
В качестве бонуса мы делимся секретами создания группы ВКонтакте и нашим личным опытом, что позволит вам сразу же завершить дизайн на продвинутом уровне самостоятельно. Например, вы можете настроить такой красивый блок из различных приложений, который повысит вовлеченность в несколько раз!
Бесплатные приложения. Перейдите в Управление сообществом и перейдите в Приложения, чтобы изменить свои настройки.
Здесь вы можете добавить приложение на выбор, которое станет отличным дополнением к функционалу группы. Например, как и в нашей группе, которая бесплатно создает полезный контент, есть кнопка «Поддержи сообщество», нажав на которую можно пожертвовать в пользу сообщества любую сумму от 100 рублей. Это также может быть продуктовый магазин, анкета, тесты, онлайн-чат, подписка на рассылку новостей и многое другое.
Другие полезные виджеты и приложения:
- анкеты;
- тестов;
- регистрация на услуги;
- отправка сообщений;
- магазин товаров;
- и т. Д.
Обсуждения. Сделайте сразу несколько тем, посвященных основным вопросам, которые будут интересны клиентам или подписчикам. Если это коммерческое сообщество, то это отзывы, часто задаваемые вопросы, информация по оплате, гарантиям и доставке.Если сообщество носит информационный характер, то основные темы обсуждения должны быть посвящены темам, которые затрагивает группа.
Заключение
Если вы хотите добиться успеха, то обязательно найдите время, чтобы оформить его правильно и красиво. Чем тщательнее вы подойдете к этому вопросу и продумаете все сценарии поведения пользователей после перехода на страницу группы, тем выше будет переход на подписку, а затем и на покупку.
Прежде всего, нужно красиво оформить.Ведь мы, как известно, все оцениваем «по одежде». Эта статья поможет вам красиво оформить группу Вконтакте самостоятельно.
Как оформить название группы Вконтакте?
Первое, на что нужно обратить внимание при создании группы Вконтакте — это заголовок … При выборе имени нужно учитывать три основных параметра:
Поиск социальной сети Вконтакте работает следующим образом: есть две группы с названиями «Работа в Интернете» и «Работа в Интернете без вложений».«Когда пользователь Вконтакте вводит запрос« работа в Интернете », то группа с соответствующим названием будет выше, даже если количество подписчиков будет равным или вторая группа немного перевесит».
Подведем итог: владельцам известного интернет-магазина Ali Express, создавая для него группу, необязательно указывать его тематику в названии, большинство людей это уже знают. Для менее популярного сайта, интернет-магазина, форума при создании группы лучше указать тему в заголовке, как мы это сделали выше..
Как оформить статус группе Вконтакте?
Статус группы Вконтакте менее важен, чем ее название, но на него стоит обратить внимание. Давайте разберемся, как правильно сделать , выдать статус для группы Вконтакте ? Главное, не перегружать его, он должен содержать только самую важную информацию:
Если на данный момент вы не знаете, как прописать статус группы Вконтакте, то лучше отложите это.Вы не должны ничего класть в него. Отсутствие статуса не повредит оформлению вашей группы, а бессмысленная информация в нем может сбить с толку посетителей. Кстати, для публичных страниц важнее статус , так как он появляется в меню «Интересующие страницы» в качестве описания.
Как оформить описание группы Вконтакте?
Сейчас разберемся как заполнить описание группы Вконтакте , а точнее текст, который можно ввести в настройках сообщества.Для этого есть несколько решений:
Кроме того, ВКонтакте имеет ограничение на размер текста в описании группы, который будет отображаться без сворачивания — 600 знаков с пробелами. После превышения этого лимита описание будет свернуто, что сделает его неэстетичным. Вы можете увидеть эту ситуацию на картинке ниже.
В связи с этим рекомендую при заполнении описания группы Вконтакте использовать фиксированные сообщения в шапке, создать для них картинку с описанием, смайликами, текстом и даже меню.Все это добавит красок вашему сообществу.
Как сделать аватарку для группы Вконтакте?
Теперь попробуем разобраться в одном из важнейших аспектов дизайна группы Вконтакте — как сделать аватарку? Для тех, у кого есть свои деньги, вы можете зарегистрироваться на бирже фрилансеров и заказать аватарку и другие элементы для группы (баннер, меню и т. Д.) У опытного веб-дизайнера. Но можно пойти другим путем, сделайте аватарку для группы Вконтакте сами .
В первую очередь нужно определиться, какого размера вам потребуется для создания аватара для группы Вконтакте. Максимальная ширина группового аватара составляет 200 букв (далее просто пикселей), а максимальная высота — 500 пикселей. Большие аватары будут уменьшены, чтобы соответствовать указанным пропорциям. Аватары, размер которых меньше указанного, напротив, будут увеличиваться и искажаться на экране. Поэтому создайте аватар для группы Вконтакте шириной 200 пикселей и высотой от 200 до 500 пикселей.
Создавая аватарку для группы Вконтакте, помните о его миниатюре, которая составляет 200 пикселей по ширине и высоте. Так что основную информативную нагрузку аватара (название или описание группы, девиз, призыв к действию и т. Д.) Необходимо разместить в одной области, которая будет соответствовать заданным размерам.
Самый простой способ сделать аватарку для группы Вконтакте в фотошопе … И совсем не обязательно знать и уметь пользоваться всеми функциями. Достаточно научиться пользоваться основными инструментами (выделение элементов, работа со слоями и т. Д.).). Ниже вы можете увидеть пример аватара, который я сделал для группы Вконтакте.
Этот аватар состоит из двух комбинированных изображений, текстового элемента и фона. На его создание ушло не так уж много времени и сил. С подобной задачей при желании сможет справиться каждый владелец группы.
А если вы хотите создать сложные и красивых аватарок для групп Вконтакте , прорисовывая каждую деталь с нуля, то изучите Photoshop, научитесь пользоваться им профессионально. Это можно сделать несколькими способами:
- Попробуйте все сами методом проб и ошибок.
- Прочтите статьи об этой программе и посмотрите видео.
- Прочтите книгу или посмотрите учебное пособие.
Первый вариант малоэффективен, так как мало у кого хватит терпения добиться результата таким способом. Второй вариант имеет место. В Интернете есть множество сайтов и каналов YouTube, посвященных изучению Photoshop.
Однако структурировать полученную информацию таким образом будет сложно. К тому же постоянный поиск информации займет много времени.Но это бесплатно, как и первый способ.
Самым простым способом освоить Photoshop будет видеокурс. Так как в нем вся информация будет представлена от простого к сложному, подробно описывая и обучая всем основам работы с программой. И могу порекомендовать вам аналогичный видеокурс.
«» — обучающий видеокурс для начинающих пользователей. С его помощью в любое удобное для вас время, дома за компьютером, вы можете приступить к изучению Photoshop.
В этом курсе вы подробно узнаете, как использовать все возможности Photoshop.Тогда вы сможете легко создавать аватарки с нуля и красиво оформлять группы Вконтакте. Если вам была интересна эта статья, для того, чтобы первыми получать новую информацию.
Меня недавно озадачил дизайн моей группы ВКонтакте. Я видел много красиво оформленных групп и хотел сделать что-то подобное. После нескольких часов изучения разметки Wiki я наконец сделал для себя красивый баннер и выпадающее графическое меню , ведущее прямо на страницы моего сайта.В двух словах, как это делается. Сначала в фотошопе создаются одновременно две картинки, затем одна из них разрезается на несколько частей. Далее на страницах редактирования ВКонтакте вставляется специальный код с внешними ссылками. Ну а теперь обо всем по порядку.
Оформляю группы Вконтакте
Качественный дизайн групп ВКонтакте и пабликов, закрепленное меню, выпадающее меню, внутреннее графическое меню, каталоги, внутренняя навигация — цены и портфолио.
Внимание!
В связи с очередным обновлением ВКонтакте 31.10.2016 данная опция оформления группы стала неактуальной.Частично подобное меню можно реализовать на вкладке Свежие новости в блоке под статус-баром. Но это будет отдельное меню, а не единая композиция с аватаркой.
Шаг 1.
Создайте новый документ в Photoshop, размером около 850×700 пикселей, залейте его белым цветом. В этом примере я сразу наложил поверх интерфейса ВКонтакте для наглядности. Теперь нам нужно вырезать два окна в слое, через которые будет виден сам графический дизайн. Сначала выберите прямоугольник 200×500 пикселей и нажмите Del.Затем выделите прямоугольник 510×309 и нажмите Del.
Выровняйте прямоугольники по нижнему краю, расстояние между фигурами 50 пикселей. Этот дизайн рассчитан на одну строку названия группы, одну строку статуса и три строки описания и технической информации. Если у вас другое количество строк, отрегулируйте высоту левого изображения на месте.
Шаг 2.
Теперь мы размещаем весь наш графический дизайн под этим слоем. В данном случае я ставил картинку с основным фоном, потом писал текст, а потом в левый прямоугольник.
Шаг 3.
Теперь сразу сохраняем правый прямоугольник (аватар) как отдельную картинку размером 200×500 пикселей. Это готовая картина для украшения группы. Он загружается в блок в правом верхнем углу группы, где написано «Обновить фото». А левую картинку нужно разрезать на несколько картинок по количеству пунктов меню. В данном случае это 5 картинок шириной 510 пикселей.
Шаг 4.
На этом шаге нам нужно загрузить наши вырезанные картинки во ВКонтакте.Для этого сразу под описанием группы выберите блок «Свежие новости», на мой взгляд, именно так он называется в оригинале. Я переименовал его в «Меню». Щелкните «Редактировать». Важный! Во-первых, у вас должна быть открытая группа, а не страница. Так как на Странице такого пункта просто нет. И во-вторых, в меню «Управление сообществом»> «Информация»> «Контент» следует выбрать «Публичный».
Шаг 5.
Итак, во вкладке «Редактирование» мы щелкаем значок камеры и загружаем наши пять нарезанных изображений меню.ВКонтакте загрузит их по-своему, уменьшив размер до 400 пикселей по ширине и присвоив изображению тег noborder. На следующем этапе нам нужно немного подправить код.
Шаг 6.
А именно, устанавливаем исходные размеры изображения и меняем тег noborder на тег nopadding. Нам также нужно указать URL-адрес ссылок из каждого пункта меню. В этом случае первая ссылка ведет на внутреннюю страницу ВКонтакте, а остальные четыре ссылки ведут прямо на страницы моего сайта.
Ниже приведен исходный рабочий код моего меню. Вы можете использовать его как основу. В нем вы меняете картинки на свои, подставляете свои размеры и пишете свои ссылки. И убедитесь, что в коде нет пробелов между квадратными скобками и нет перевода строки, иначе в графическом изображении будут пробелы между картинками.
[] [] []
Шаг 7.
Повторяю еще раз, чтобы открыть это меню нужно кликнуть по надписи «Меню».И так всегда складывается. Читайте комментарии к посту, много вопросов разобрались. Что ж, присоединяйтесь к моей группе во ВКонтакте.
Сегодня мы снова вернемся к теме оформления групп ВКонтакте. Мы уже узнали ранее. Сегодня мы узнаем, как создать графическое меню с закрепленным верхним баннером и ссылкой на внутреннюю страницу с расширенными пунктами меню. В общем, любую информацию можно найти на внутренней странице. Здесь особенно удобно размещать, например, каталоги с ассортиментом товаров.И у выпадающего, и у закрепленного меню есть свои плюсы и минусы. Главный недостаток выпадающего меню в том, что по умолчанию оно закрыто. Но с другой стороны, вы можете разместить на нем сразу несколько ссылок.
Закрепленное меню выглядит более эффектно по общему впечатлению, но может иметь только одну ссылку, ведущую либо на внутреннюю страницу Вконтакте, либо на внешний сайт (при этом ссылка на внешний сайт с картинки не уйдет. , но по текстовой ссылке под картинкой).Кроме того, одним из очевидных недостатков является то, что на мобильных устройствах графическое меню отображается как обычная запись в ленте, стоящая сверху, а не как закрепленная рядом с аватаром. В целом, при выборе дизайна следует учитывать эти нюансы. Итак, давайте посмотрим, как создается закрепленное верхнее меню со ссылкой на внутреннюю страницу.
Оформляю группы Вконтакте
Качественный дизайн групп ВКонтакте и пабликов, закрепленное меню, выпадающее меню, внутреннее графическое меню, каталоги, внутренняя навигация — цены и портфолио.
Step 1
Создайте новый документ в Photoshop, размером около 900×700 пикселей, залейте его белым цветом. Теперь нам нужно вырезать два окна в слое, через которые будет виден сам графический дизайн. Сначала выделите прямоугольник (аватар) 200×500 пикселей и нажмите Del. Затем выделите прямоугольник 510×352 (выровняйте по нижней строке аватара и сделайте расстояние между фигурами 50 пикселей) и также нажмите Del.
После очередного обновления ВКонтакте дизайн (31.10.2016), размеры баннера 510х307 (не 510х352).
Step 2
Теперь под белым слоем поместите какую-нибудь отдельную картинку, которая ляжет в основу дизайна.
Step 3
После этого дополняем картинку различными элементами — логотипом, текстовыми метками и кнопкой, вызывающей клик по меню. Затем мы сохраняем на компьютере две отдельные картинки — одну аватарку (справа), второе меню с кнопкой клика (слева).
Step 4
Также в Photoshop мы создаем графическое меню, состоящее из нескольких пунктов.Ширина этого меню должна составлять 600 пикселей, высота — на усмотрение, в зависимости от количества пунктов. Используйте урок «», чтобы помочь.
Step 5
Разрезаем наше меню на несколько горизонтальных полос в соответствии с количеством пунктов меню. Сохраняем как отдельные файлы.
Step 6
Заходим в нашу группу Вконтакте, нажимаем на «Управление сообществом» (при нажатии на три точки под аватаркой открывается выпадающее меню) и проверяем правильность настроек.Группа должна быть открытой, и материалы тоже должны быть открытыми.
Step 7
Теперь загружаем новый аватар. Наведите указатель мыши на место аватара и во всплывающем меню выберите «Обновить фото». Загрузите правую фотографию из шага 3, растяните область выделения вверх и вниз до краев изображения, нажмите «Сохранить» и затем выберите область для круглого эскиза.
Step 8
Теперь нам нужно создать внутреннюю страницу. Как это сделать, подробно рассказано в уроке. Другой альтернативный способ создания внутренней страницы описан в уроке «» в шагах 5 и 6.
Step 9
После того, как мы создали внутреннюю страницу, вы можете переходить на нее. Для этого нужно нажать на выпадающее меню группы (по умолчанию этот пункт называется «Свежие новости» — я переименовал его в «Меню») и там нажать на ссылку «Меню». После этого мы перейдем на только что созданную пустую страницу.
Step 10
Теперь нам нужно создать графическое меню из пяти пунктов. Для этого мы загружаем наши пять фотографий из Шага 5 в альбом группы. Щелкаем по иконке камеры и загружаем вырезанные картинки с компьютера.Картинки будут где-то храниться на серверах ВКонтакте со ссылкой на группу, поэтому создавать отдельный альбом для нарезанных картинок не нужно. Вам необходимо загружать изображения в режимах разметки Wiki.
Шаг 11
Теперь, в режиме макета вики, мы создадим графическое меню. Очень важно создавать его в режиме вики-разметки (значок в правом верхнем углу двух треугольных скобок), а не в режиме визуального редактирования. Дополнительные сведения о создании кода в вики-разметке см. В шагах 4 и 5 урока «».Также есть шаблон для встраиваемого кода. Если все сделано правильно, у вас должно получиться готовое графическое меню, как на рисунке ниже.
Step 12
Теперь возвращаемся на главную страницу группы, берем url-адрес нашей внутренней страницы (он должен выглядеть так https://vk.com/page-78320145_49821289) и вставляем в окно, где находится новость. созданный. Окно со ссылкой на эту самую внутреннюю страницу должно быть прикреплено автоматически. После этого перемещаем курсор на метку «Прикрепить» и к записи прикрепляем фотографию, а именно нашу картинку слева из шага 3.После этого стираем строчку из url внутренней страницы, оставляя пустое место. Важный! На этом шаге нужно поставить галочку (если у вас есть такие права, в основном это касается групп с открытой стеной) в чекбоксе «От имени группы». Если этот флажок не установлен, запись не может быть закреплена. В конце нажмите «Отправить».
Шаг 13
Переместите курсор к трем точкам рядом с заголовком сообщения и выберите пункт «Закрепить» в раскрывающемся окне. Соответственно, при необходимости новость открепляется.
Step 14
Есть один нюанс. Иногда после того, как вы расстегиваете новость, она уходит далеко вниз по ленте, по дате создания, и найти ее снова довольно сложно. Поэтому лучше сразу прописать URL фиксированной новости куда-нибудь. Для этого наведите курсор на время создания новости и нажмите на ссылку.
