<
  • Главная
Статьи

Створення значків передплатників для каналу Twitch - JackyFox

  1. Пошук свого стилю
  2. 18 пікселів
  3. Мозковий штурм
  4. UPD від серпня 2017
  5. висновок

В очікуванні наступного етапу програми компаньйонів від Twitch , А саме введення можливості оформлення платної підписки на канал компаньйона (можна буде «засабіца»), я вирішив заздалегідь придумати стиль і оформлення бейджіков (значків), які з'являються поруч з ніком передплатника в чаті.

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

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

В очікуванні наступного етапу   програми компаньйонів від Twitch   , А саме введення можливості оформлення платної підписки на канал компаньйона (можна буде «засабіца»), я вирішив заздалегідь придумати стиль і оформлення бейджіков (значків), які з'являються поруч з ніком передплатника в чаті

Стандартні значки передплатників Twitch

Пошук свого стилю

Подібний підхід занадто примітивний, і я хотів уникнути його використання. Вся ця тяга до золота-срібла та іншої лакшуре завжди бида вельми популярна, згадайте хоча б стиль iOS до 7 версії. Мені ж імпонували більш цікаві варіанти прогресу значка, які я зустрічав на каналах різних партнерів Twitch, - саме прогресу, зміни, а не зміни його якості.

Мені ж імпонували більш цікаві варіанти прогресу значка, які я зустрічав на каналах різних партнерів Twitch, - саме прогресу, зміни, а не зміни його якості

значки WeLoveGames

Перше, що мені спало на думку в той момент - це значки на каналі WeLoveGames. На жаль, не є фанатом творчості даного стримера, але віддаю належне графічного оформлення, яке він використовує для свого бренду. Денис обігрує логотип свого каналу в стилі старих комп'ютерних ігор: спочатку порожнє серце поступово заповнюється життєвою силою, а на 2 рік стає золотим.

Я вирішив не вигадувати велосипед, а взяти за основу свій логотип, який так само відрізняється простотою геометричних форм. По факту це лисиця, виконана в максимально абстрактному стилі трикутниками. Перед вами ілюстрація, основу якої я намалював пальцем на екрані телефону в Google Keep. Через відсутність початкової ідеї про те, як варто зобразити прогрес розвитку значка, я і сам спочатку скотився до «преміальності» благородних металів, та ще й сердечко вирішив приліпити до свого майбутнього значку =)

Через відсутність початкової ідеї про те, як варто зобразити прогрес розвитку значка, я і сам спочатку скотився до «преміальності» благородних металів, та ще й сердечко вирішив приліпити до свого майбутнього значку =)

Перший ескіз в Google Keep

18 пікселів

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

Базовий розмір бейджика передплатника встановлений сервісом в 18 на 18 пікселів, так само запитуються варіанти значків вдвічі і вчетверо більшому розмірі (квадрати 36 і 72 пікселя). Здавалося б, що складного може бути в процесі? Зменшуй великий логотип в фотошопі, щоб вона розмістилася в задані розміри - тільки й того! Але так здається, поки ти не почав щось малювати по пікселям в обмеженому просторі.

Мені в принципі не сподобалося оперувати в PhotoShop в рамках такої філігранної роботи, і я відкрив для себе piskelapp.com - онлайн сервіс для створення піксель-арту, в тому числі і анімованого. Болісні спроби отрисовать мою трикутну лисицю протягом декількох днів привели мене до дуже блякло результату. Але найголовніше, у мене як і раніше не було концепції розвитку значка.

Але найголовніше, у мене як і раніше не було концепції розвитку значка

Початковий варіант врісовкі

Мозковий штурм

Ми сиділи з друзями, я показував їм свої потуги в створенні значків для передплатників. Концепції все ще не було. Я показував хлопцям різні варіанти значків лояльності в пошуку по картинках Google. Відкрив сторінку підписки на RXNexus, з його пташеням, який вилуплюється з яйця, отримує корону і мантію. Стояв типовий тупняк ранку після попереднього гульні.

Стояв типовий тупняк ранку після попереднього гульні

значки rxnexus

В цілому, товариші оцінювали мою роботу високо, значок в ісхоном вирішенні всім подобався. Всім, крім мене, тому що не було ідеї. Був просто логотип в кольоровому і чорно-білому пексельартном виконанні. Я кілька разів вимовив слово «цілісність», показуючи хлопцям значки WLG і Нексуса. І раптом мене осінило!

Адже в моєму значку дійсно не вистачає цілісності - ці розрізнені трикутники виглядають непогано у великій якості, на значку групи ВКонтакте або логотипі каналу Twitch, але на вирішенні 18 × 18 пікселів це все виглядає розрізнено і незакінчений. Тоді я взяв «олівець», пофарбував його в чорний колір і обвів контур. І все зійшлося!

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

Я вийшов на балкон подихати і через хвилину зрозумів - бандана! Адже я завжди проводжу ефір в чорній бандані з білими ієрогліфами. Заходжу назад в кімнату кажу:

- Саша, я придумав!

А він дивиться на мене, посміхається і відповідає:

- Я теж. Бандана.

Можливо, у дурнів думки сходяться, але головне, що концепція почала складатися, і у мене не вистачало всього одного значка для передплатника зі стажем в 6 місяців. Спочатку я зробив кольорову версію першого значка для 3-х місяців з тими ж плоскими очима, а на 6 зобразив «очі-ялинки», але вже пізніше ввечері, коли хлопці пішли, зрозумів, що так не піде.

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

Фінальна версія бейджіков

UPD від серпня 2017

Після того, як я розробив новий смайлик для $ 10-передплатників, прийшла ідея переробити і значок для передплатників зі стажем в один рік Після того, як я розробив новий смайлик для $ 10-передплатників, прийшла ідея переробити і значок для передплатників зі стажем в один рік. Солідний лисиць в казанку і з моноклем здався мені гораздно цікавіше панковатого лисиця в бандані. Він виглядає логічним перехідним етапом від самовпевненого полугодовалова лисиця. Але це все, звичайно, я пишу несерйозно. Просто бандани приходять і йдуть, а золоті монокль залишаються;)

висновок

Що характерно, я художник несправжній, все життя займався комп'ютерами і схильності до творчої діяльності за собою не помічав, хіба що люблю постійно щось заспівувати. Але в даному випадку мені захотілося зробити щось добре і красиво, щоб значки сподобалися мої майбутнім передплатникам. Щоб на канал хотів підписатися просто заради такого симпатичного значка. І я тепер з нетерпінням чекаю, коли підписка стане доступна.

PS Зверніть увагу, що права на інтелектуальну власність вступають в дію з моменту публікації об'єкта захисту авторського права. Всі права належать їх власникам.

Copyright © Євген Павлов 2017

Все це якось пов'язано

Здавалося б, що складного може бути в процесі?
Ідея з головним убором добре виглядала в плані отримання беджіки для однорічного передплатника, але що це повинна бути за шапка?


Новости
  • Виртуальный хостинг

    Виртуальный хостинг. Возможности сервера распределяются в равной мере между всеми... 
    Читать полностью

  • Редизайн сайта

    Редизайн сайта – это полное либо частичное обновление дизайна существующего сайта.... 
    Читать полностью

  • Консалтинг, услуги контент-менеджера

    Сопровождение любых интернет ресурсов;- Знание HTML и CSS- Поиск и обновление контента;-... 
    Читать полностью

  • Трафик из соцсетей

    Сравнительно дешевый способ по сравнению с поисковым и контекстным видами раскрутки... 
    Читать полностью

  • Поисковая оптимизация

    Поисковая оптимизация (англ. search engine optimization, SEO) — поднятие позиций сайта в результатах... 
    Читать полностью