Добридень. У цьому пості йтиметься про те, як самостійно оформити групу вконтакті. Зовсім недавно ми розглянули детально і поговорили про те, якого розміру та якості має бути зображення. Але дизайнери пішли далі і зараз можна зустріти безліч спільнот, в яких меню та аватар представляють єдине ціле. Виглядає це приголомшливо. І сьогодні ви навчитеся робити гарне оформлення для групи або пабліка своїми руками, не вдаючись до допомоги фрілансерів та професійних веб дизайнерів.

Щоб ви відразу зрозуміли про що йдеться – викладаю приклад оформленої групи:

Якщо в 2-х словах, то в графічному редакторі (тому ж едоб фотошоп) створюються в 2 картинки. Одна з них нарізається на кілька фрагментів і за допомогою вікі розмітки вконтакте проставляються посилання. Якщо не злякалися цих страшних слів – я продовжу.

Крок 1. У графічному редакторі (краще використовувати adobe photoshop) потрібно створити документ розміром 630 на 725 пікселів. Далі в першому шарі вирізаємо 2 вікна, які і будуть меню і аватаркою. Насамперед виділімо прямокутник розміром 200 на 500 пікселів і натискаємо клавішу DEL.
__________________
Відразу зазначу, що в уроках на інших сайтах ви можете знайти поради, де говорять про те, що обрізати потрібно прямокутник розміром 200*710. ЦЕ НЕ ПРАВИЛЬНО. Зараз у соціальній мережі вконтакті є обмеження на висоту ави і у разі використання висоти в 710 px - вона вийде обрізаною.

__________________

Тепер вирізаємо меню - ще один прямокутник розміром 382 на 232 і тиснемо клавішу "ділить". Прямокутники мають бути з'єднані внизу.

Заготовка готова.

Крок 2. Тепер нашу заготівлю треба обтягнути тлом. Написати текст, якщо необхідно і створити майбутні кнопки під меню. У прикладі їх 5, але ви можете зробити скільки Вам необхідно, але не варто робити їх занадто дрібними, тим самим ви знизите юзабіліті, змушуючи користувача збільшувати сторінку або жмуритися, щоб прочитати текст.

Крок 3. Правий прямокутник можна зберігати. Не забувайте про розмір 200 на 500. Це готова аватарка для вашої групи. Можете відразу завантажити її у верхньому правому кутку групи/паблік.

Що ж до прямокутника з розміченими пунктами меню, його потрібно буде нарізати кілька картинок (у разі 5). Ширина 382, ​​а ось висота розраховується індивідуально, але має бути не менше 50 пікселів.

Крок 4. Тепер потрібно 5 фото завантажити в альбом спільноти.

Як тільки справа зроблена – треба взятися за редагування блоку новин у групі. Переходимо в "свіжі новини" і тиснемо на кнопку "редагувати"

У вас у налаштуваннях групи мають бути відкритими фотоальбоми та документи. Це важливо, тому що без цього ви не зможете завантажити фото та зробити меню.

Крок 5. У вкладці "редагування" вставляємо наступний код:
[]
[]
[]
[]
[]

Починаємо його правити.
photo – подання посилання на фотографію. Відкрийте одну з 5 завантажених вами фото з меню групи і в рядку браузера побачите щось на кшталт цього –
http://vk.com/photo72120765_272239411

72120765_272239411 – і є цей необхідний код фотографії. Можна просто використати ім'я файлу.

Крок 6. Необхідно поєднати картинки від аватарки меню, якщо вони роз'їхалися. Для цього потрібно зробити 3 речі:
Назва групи має бути в один рядок
Опис в 10 рядків (тут іноді потрібен підгон)
Сайт також в один рядок.

Ось що приблизно має вийти:

Як бачите, зробити оформлення для групи вконтакті зовсім нескладно. Якщо у вас є питання - задавайте їх у коментарях, а якщо не хочете "паритися" - вам пряма дорога на фріланс.

Створення оформлення, описаного в цій статті, обійдеться Вам в 15-25 у.о.

Сьогодні кожна організація, та й більшість користувачів має свою групу в соціальній мережі Вконтакте. І серед великої кількості груп можна знайти справді красиво оформлені. Так як роблять оформлення групи Вконтакте? Відразу зазначимо, що з оформлення групи необхідно вивчити вікі розмітку.

Зазначимо, що приблизно в двадцятих числах жовтня адміністратори Вконтакте обрізали аватарки груп, зробивши 200*500 пікселів. Тому трохи підправте урок. Або ж просто зробіть невисоке меню: 382*232 та 200*500.

Оформлення групи Вконтакте

У фотошопі створюємо новий документ білого кольору 630*725 пікселів. У шарі вирізаємо два вікна, через які буде видно графічне оформлення, а саме прямокутник 200*710 і натисніть Del і прямокутник 382*442, прямокутники з'єднуємо внизу і знову натискаємо Del.

Під цим шаром розташуємо наше графічне оформлення. Ми поклали картинку, далі текст, у лівому прямокутнику створюємо п'ять пунктів (кількість залежить від того, скільки вам потрібно).

Правий прямокутник зберігаємо окремою картинкою 200*710. Ось і готова перша картинка для оформлення. Її необхідно завантажити в блок, розташований у верхньому правому кутку групи «Завантажити фотографію». Ліву картинку нарізаємо за кількістю пунктів. У нас виходить 5 картинок 50*382.


Завантажуємо всі п'ять картинок в основний альбом сторінки групи ("Мої фотографії" - "Мої альбоми" - "Додати фотографії"). Переходимо на сторінку групи і під описом бачимо блок "Новини" (можна його перейменувати) - "Редагувати".


Так у Вконтакті відбулися деякі зміни, після попереднього пункту переходимо в закладку «Редагувати» і натискаємо кнопку праворуч «Режим вікі розмітки». У вікно, що відкрилося, поміщаємо наступний код:


Переходимо в закладку "Вихідний код" і вставляємо туди наступний код (візуальним редактором краще не користуватися, він збиває налаштування):

[]
[]
[]
[]
[]

Не забудьте в коді змінити слово photo, назву своїх файлів і вкажіть висоту файлу (ширина вже задана), а також виставте url посилань меню.

Для того щоб картинки були поєднані, назва групи має поміщатися в один рядок, опис групи в 10 рядків, а url веб сайту в 1. Клікніть по картинці, щоб побачити, як це працює.

Якщо вам допомогла або сподобалася ця стаття, не забудьте поставити свій лайкЦе допоможе іншим користувачам знайти її швидше. А я зможу дізнатися, що цікавить вас найбільше, щоб підготувати та написати ще більше цікавих та корисних статей! З повагою В'ячеслав.

Успішне оформлення групи Вконтакте має бути не лише красивим, але ще функціональним та зручним. Змусіть дизайн вирішувати ваші маркетингові завдання, щоб група залучала платоспроможну аудиторію до бренду і залишалася з ним назавжди.

5 кроків, як оформити групу у Контакті

Обкладинка

Обкладинка спільноти сьогодні – важливий інструмент оформлення групи у Контакті бренду та її просування. Завантажити її можна у розділі ”Управління спільнотою”, перейшовши у вкладку “Налаштування”. Висококласне горизонтальне зображення у самій шапці спільноти відіграє роль головного промо-банера компанії в соцмережі. Вона ставить настрій, інформує, підвищує імідж, закликає до цільових дій, продає одночасно.

1. Використовуйте ілюстрації високої якості

Обкладинка спільноти вконтакті має бути розміром 1590х400 пікселів, але краще завантажувати фото в 2-3 рази більше у форматі.png. Так пощастить уникнути неякісного відображення.

2. Адаптуйте зображення під різні пристрої

Пам'ятайте, що це зображення може відображатися по-різному з різних пристроїв – на мобільних краях обрізатимуться, тому краще всю найважливішу інформацію розміщувати ближче до центру.

3. Розмістіть слоган та УТП

Нехай вашу філософію і переваги клієнт бачить з першого екрану.

4. Відобразіть товар/послугу, процес чи результат його використання

Так потенційний замовник одразу дізнається, на чому ви спеціалізуєтесь і буде залучено до продукту.

5. Допоможіть клієнтам одразу зв'язатися з вами

Напишіть на банер телефон, e-mail, а також інші контакти компанії. Якщо для вашого бізнесу важливе територіальне розташування, наприклад, ви представляєте сферу громадського харчування або horeca, адреса теж буде не зайвою.

6. Анонсуйте події

Просуваєте концерти, очікується надходження нової колекції або вихід продукту, проводите фестиваль/конференцію/клієнтський день? Розкажіть про це всім, хто входить до спільноти.

7. Презентуйте акції та знижки

Де як не на головному майданчику сказати аудиторії, що саме зараз вона може зробити у вас замовлення вдвічі дешевше? Головне, не забудьте змінити ілюстрацію після закінчення терміну дії пропозиції.

8. Пропонуйте вчинити цільову дію

При завантаженні обкладинки спільноти в нижньому правому куті розміщуються горизонтально дві кнопки – Написати повідомлення та Вступити до групи. Вкажіть стрілкою на них, щоб привернути увагу аудиторії. Так якщо на банері показаний товар – можна запропонувати одразу замовити його у повідомленнях. А якщо на ньому дайджест останніх новин – передплатити, щоб завжди отримувати свіжу інформацію.

Завантажте аватар і виберіть мініатюру

Окремі бренди досі не беруть на озброєння обкладинку, віддаючи перевагу старому вигляду першого екрану групи, застосовуючи як так звану “шапку” поєднання аватара із закріпленим записом. При цьому одна картинка є продовженням іншої. Найбільш ефектно при цьому виглядає, коли фото закінчується на одному рівні з аватаркою.

При використанні максимального розміру аватара 200х500 пікселів розмір картинки у закріпленому записі необхідно зробити розміром 510х308 пікселів. Відмінний прийом, що залучає, - закріплення завантаженого через плеєр соцмережі відео, яке стилістично продовжує аватар.

Якщо ж ви застосовуєте як шапку – обкладинку, аватар тоді завжди відображатиметься у вигляді мініатюри.

Правила оформлення ВК мініатюри аватара спільноти

Мініатюра – це невелике кругле зображення, яке кадрується з великого аватара, і відображається у пошуку по групах, у списку спільнот кожного користувача та зліва під обкладинкою, якщо така є. Ось кілька порад щодо її дизайну.

1. Мініатюра має бути зрозумілою аудиторії

Не варто розміщувати шматок дивної ілюстрації. Візуалізуйте те, що згодом ЦА асоціюватиметься з брендом, наприклад логотип, іконку товару/послуги, а може, головного маркетингового персонажа бренду.

2. Нехай у хід тільки якісні фотографії

Краще завантажити вихідник у 2-3 рази більше необхідного розміру, так про страшні піксельні "квадратики", які виставляють вас не в кращому світлі, можна буде забути.

3. Розробляйте власні ілюстрації

Стандартні стокові зображення виглядатимуть дешево та непрофесійно, а у користувачів стануть синонімом недовіри до бренду. Зробіть унікальні малюнки в єдиній концепції та кольорах, що решта дизайну.

4. Контрастні фону сторінки картинки – те, що потрібно

При оформленні ВК мініатюр так помітно, кругляшок виділиться в стрічці серед інших груп і не зіллється з фоном сторінки.

5. Розмістіть контакти або УТП компанії

Залежно від мети, поставленої для мініатюри, помістіть на неї контактний телефон або адресу сайту, інформацію про безкоштовну доставку, вказівку на найнижчу ціну в сегменті або акції.

6. Зробіть текст великим та читабельним

Краще не застосовувати шрифти із засічками чи курсив – вони надто “шумлять” під час перегляду з екранів ПК, мобільних пристроїв та смартфонів, засмічуючи вигляд. Простежте, щоб текст не виходив за межі кадрованої мініатюри. Це дозволить правильно та ефективно донести до користувача повідомлення.

7. Застосовуйте нестандартні форми

Наприклад, в круглий шаблон, що шукається, впишіть багатокутник або іншу геометричну фігуру на білому тлі. Створіть ефект непрочитаного повідомлення або графічну піктограму мережі.

Розробте меню

Меню – важливий елемент оформлення групи в Контакті, який полегшує навігацію користувачів по групі – людям зручніше знаходитиме потрібну їм інформацію. Кожен елемент та сторінка створюються спеціальною мовою програмування – Вікі-розміткою. За допомогою неї можна робити зображення клікабельними і верстати зручні сторінки всередині соцмережі так, якби це була сторінка сайту.

Можна використовувати як меню відкритого типу, і закритого. У першому випадку користувач відразу бачить розділи, які входять до нього, у другому – їм передує картинка прев'ю з написом “Меню”. Меню також може візуально стати продовженням аватара, якщо ви застосовуєте старий варіант оформлення спільноти.

Розробте вітрину товарів

Розміщуючи товари у вітрині спільноти, пам'ятайте, що користувачам завжди видно перші 3 об'єкти. Помістіть у них найпопулярніші та найбільш замовляні, завантажуючи презентаційне зображення в єдиному стилі. Опублікуйте тут однакові іконки чи фотографії самих продуктів. У товари можна розмістити послуги. У дизайні покажіть процес надання послуги чи її результат. Розмір такого зображення буде квадратним - 400х400 пікселів.

Оформлення постів

1. Використовуйте доступні розміри зображень на повну силу

Максимальна ширина картинки у стрічці – 510 пікселів. Найбільш ефектно виглядають квадратні зображення 510х510 пікселів та прямокутні – 510х300 пікселів.

2. Розробте індивідуальний стиль постів

Щоб пости виглядали індивідуально, придумайте єдиний стиль, шрифт та кольорову гаму.

3. Розташуйте короткий текст на зображенні

Наприклад, можна розділити зображення на 2 частини – текстову та графічну або написати текст, затемнивши фон. Щоб текст було видно без затемненого фону, напишіть його на підкладці (контрастний графічний блок однорідного кольору) або додайте тінь до напису. Добре виглядають фотографії із рамкою.

4. Зробіть кілька шаблонів для різних цілей

Наприклад, для цитат застосовуйте один шаблон презентації візуальної інформації, анонсу матеріалів із сайту – інший, а конкурсів третій.

Використовуйте ці стовідсоткові прийоми, і ваша компанія буде представлена ​​Вконтакте якнайкраще, а клієнтам буде зручно взаємодіяти з нею. Але не забувайте, що в усьому потрібна міра! Перегляньте ще більше свіжих ідей для оформлення спільноти ВК на сторінці послуг агентства Тесла Таргет.

Бажаєте дізнатися про те, як оформити групу в Контакті у 2018?І не просто оформити, а зробити це самому правильно та красиво! Якщо Ваша відповідь «Так», то ця стаття спеціально для Вас!

Соціальна мережа "ВКонтакте" одна з найпопулярніших. Відповідно тут можна знайти більше спілкування, однодумців та просто друзів, а також просувати свої послуги та товари. Завдяки створеним спільнотам можна швидко знайти все про цікаву подію, товар, послугу і т.п.

На сторінці управління натиснути «Завантажити» та вибрати картинку. Виглядає так: найменування групи, потім мініатюра аватара, статус.

На жаль, мобільний ще не підтримує цю функцію. Але оскільки це нововведення відбулося нещодавно, то це буде так само актуально для просування, як і все.

Для більш легкого доступу до пропонованих матеріалів можна зробити меню. А про те, як його зробити самостійно, ми розповімо наступного разу.

Закріплений пост

Секрети оформлення групи ВК

Як бонус ми ділимося секретами оформлення групи ВК та своїм особистим досвідом, які дозволять виконати оформлення відразу ж на просунутому рівні самостійно. Наприклад, можна налаштувати ось такий гарний блок із різних додатків, що підвищують залученість у кілька разів!

Безкоштовні програми.Зайдіть до керування спільнотою та перейдіть до «Програми», щоб редагувати налаштування.

Тут на вибір можна додати програму, яка стане чудовим доповненням до функціональності групи. Наприклад, як у нашій групі, яка безкоштовно створює корисний контент, є кнопочка «Підтримати спільноту», натиснувши яку можна пожертвувати на благо спільноти будь-яку суму від 100 рублів. Також це може бути магазин товарів, анкета, тести, онлайн-чат, підписка на розсилку та інше.

Інші корисні віджети та програми:

• анкети;
• випробування;
• запис на послуги;
• розсилання повідомлень;
• магазин товарів;
• і так далі.

Обговорення.Зробіть відразу кілька тем, присвячених основним питанням, які будуть цікаві клієнтам або передплатникам. Якщо це комерційна спільнота, то це відгуки, запитання, інформація про оплату, гарантії та доставку. Якщо співтовариство інформаційне, то основні галузі обговорень мають бути присвячені темам, які торкається група.

Висновок

Якщо хочете успішно, то обов'язково приділіть час її правильному та красивому оформленню. Чим ґрунтовніше ви підійдете до цього питання і продумаєте всі сценарії поведінки користувача після переходу на сторінку групу, тим вище буде конверсію на підписку, а надалі на покупку.

У цій статті розберемо, як красиво та правильно оформити групу в контактіщоб вона була максимально зручною для відвідувачів.
Розглядати, як красиво і правильно оформити групу вкми будемо не з точки зору дизайну, а з точки зору цілей, які стоять перед групою.
Основна мета будь-якої групи– привернути до себе відвідувача, щоб він відразу зрозумів, про що група і захотів стати її учасником. Щоб зробити групу максимально зручною, потрібно мінімізувати кількість дій відвідувача. Тобто в ідеалі, щоб користувач зрозумів, про що група, він не повинен робити якихось додаткових кліків або прокручування сторінки.

Щоб розібратися, як правильно будуватися оформлення групи у контакті, розглянемо її структуру по основним елементам.
Я підготував спеціальну наочну схему із поясненнями.

Схема, як красиво та правильно оформити групу у ВК.

Схему ми можете подивитися наживо за посиланням.

1. Аватарка.
Основний графічний елемент групи. Його структура може бути різною залежно від тематики групи. Один із прикладів, придатний для групи, що продає, показаний на схемі. Ключові рекомендації щодо оформлення аватарки:
а) Передача суті.Основна мета аватарки – передати ключові особливості групи, розповісти про що і для кого вона. У цьому вам допоможе не лише сама картинка, а й написи текстом. Проте тексту бажано робити якнайменше.
Б) Якісне зображення.Графіка повинна бути якісною і красивою, але не більше. Аватарка не повинна надмірно відволікати від основного змісту.
в) Використовуйте весь простір.Максимальний розмір аватари на виході 200 на 449 менше робити не бажано. Якщо робите більше, зберігайте пропорції.

2. Статус групи.
Незважаючи на те, що це порівняно невеликий об'єм елемент сторінки, він досить важливий. У статусі необхідно коротко передати найзначнішу інформацію про вашу групу. Максимальний обсяг статусу 140 симв.
Намагайтеся зробити статус максимально зрозумілим та локанічним. Використовуйте іконки. Коди ікон для вставки можна знайти, наприклад, .
Приклади кодів іконок для груп, що продають:
Телефон - код: _9742;
Значок надіслати повідомлення код: _9993;
Вказівник - код: _128073; або код: _10145;

3. Опис групи з меню або закріплений пост.
Під статусом у самому центрі сторінки міститься основний вміст. Існує 2 основних варіанти, що може перебувати у вмісті. Це опис групи з меню та закріплений пост зі стіни.
Меню досить зручне в плані навігації, але вимагає додаткового кліка для розвороту, тому докладно на створенні меню групи ми зупинятися не будемо. Матеріалів на тему wiki розмітки в мережі достатньо.
Для комп'ютерної версії групи основним з погляду змістом краще зробити закріплений пост, оскільки він може зайняти всю корисну площу, досить зручний і вимагає додаткових кліків від користувача.
Загальні рекомендації щодо створення закріпленого поста:
А. Основний текст має бути максимально зручним для читання. Активно використовуйте іконки та піктограми.
Б. Загальна висота закріпленого поста - не повинна виходити за нижню межу аватарки. Досвідченим шляхом можна підібрати оптимальний обсяг текстового контенту.
В. Рекомендований розмір прикріпленої картинки 395 на 289. Ці розміри оптимальні для розміщення ключової інформації.

Окрім основних елементів, існує також інші не менш значущі, а саме: стіна групи, обговорення, альбоми, відео, документи та контакти.
Ці елементи насправді – контент групи. Контент– це основне, через що відвідувач підписується на групу. Оформлення контенту слід проводити згідно з основним стилем групи. Але не так важливо, оформлення, скільки зміст самого контету.
Якщо група порожня та крім оформлення не містить нічого цінного на неї, навряд чи хтось підпишеться. Докладно про контент ми в цій статті не писатимемо. Стаття про те, як красиво і правильно оформити групу вконтакті. Якщо вам знадобиться допомога в написанні контенту, ви можете звернутися до нас у рамках послуги “ ”
На цьому з оформлення груп на сьогодні у вас поки що все. Свої питання за статтею пишіть у коментарях нижче.
З питань замовлення послуг пишіть на icq 275129,