Курси підвищення кваліфікації.   

Візуальний контент-маркетинг.

Формати цифрових зображень. Формати цифрового відео

Чим відрізняється хороший веб-ресурс від поганого? І взагалі, що таке хороший веб-ресурс, а що таке поганий?

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

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

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

У маркетингу навіть з'явився окремий напрямок - контент-маркетинг, а у зв'язку з нарощуванням візуалізації контенту, ми вже говоримо не просто про контент-маркетинг, а про візуальний контент-маркетинг.

Ми живемо в світі візуалізації даних. Колись слово візуалізація описувало процес створення уявного образу. Сьогодні воно означає графічне представлення інформації.

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

Якщо людина чує інформацію, то через три дні вона зазвичай пам'ятає тільки 10% цієї інформації. Однак, якщо додати візуальний супровід - за цей же період запам'ятовування зростає до 65%. Людський мозок обробляє візуальну інформацію в 60 тисяч разів швидше, ніж текст. Крім того, 40% людей сприймають візуальну інформацію набагато краще, ніж текстову.

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

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

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

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

Ми маємо (на 2017р) 1,2 трильйона цифрових фотографій, розміщених в мережі Інтернет. Тобто, приблизно по 160 знімків на кожного з 7,5 мільярда людей, що населяють планету Земля!

Навряд чи це пандемія марнославства. Швидше за все, це результат того, що понад мільярд людей постійно носять з собою пристрій, який дублює цифрову фотокамеру, а як відомо, якщо на стіні висить рушниця, то вона обов'язково має вистрілити :) Відомий фотограф Чейз Джарвіс одного разу сказав, що «найкраща камера - та , що з тобою ». І він мав рацію. За оцінками InfoTrends, більше 85 відсотків всіх знімків, що розміщуються в мережі, зроблені саме смартфонами.

Навіть на платформах обміну фотографіями Flickr, яку полюбляють не тільки захоплені фотолюбителі, а й професійні фотографи, більше 50 відсотків всіх завантажених фотографій зроблені смартфонами. А дев'ять з десяти найпопулярніших камер, що представлені на Flickr, - це різні моделі iPhone ...

На мій погляд, сьогодні ми спостерігаємо підвищений рівень візуального-шуму, через який треба пробиватися не тільки маркетологам, що просувають цікавий і корисний контент, але і митців, які займаються візуальним артом (фотографи, графіки, художники і т.д.). Їм все складніше і складніше просувати своє мистецтво в мережі Інтернет. Для того, щоб креативний арт-проект був помічений, співвідношення «сигнал / шум» у нього повинно бути достатньо великим. І будь-який креативний проект може бути успішним, якщо він зможе перевищити рівень «паразитного арт-шуму».

Цими питаннями теж займається візуальний контент-маркетинг і на сьогоднішній день це основна складова архітектури цифрових комунікацій.

Торішні дослідження показали, що понад 60% маркетологів у всьому світі планували збільшувати інвестиції в візуальний контент-маркетинг. Більше 74% SMM-фахівців використовують візуальні ресурси в стратегіях просування соціальних мереж.

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

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

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

Види навчальної діяльності, на яких доцільно використовувати відео в навчальному процесі

(за матеріалами досліджень київського університету імені Бориса Грінченка)

Існують дві різновидності форматів зображення -  формат зберігання графічної інформації та формат подання візуальної інформації .

Формати зберігання графічної інформації базуються на алгоритмах представлення зображень у цифровому вигляді.

Основні формати зберігання графічної інформації.

Формат GIF (Graphics Interchange Format) – найбільш компактний графічний формат

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

Цей формат підтримує тільки індексовані зображення і використовується тільки для веб-дизайну.

Формат JPEG (Joint Photogragic Experts Group)

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

Цей формат використовується у цифровій фотографії та веб-дізайні. Для високоякісної поліграфії його бажано не використовувати.

Формат PNG (Portable Network Graphics) – растровий формат зберігання графічної інформації , що використовує стиснення без втрат.

PNG був створений як вілький формат для заміни GIF, тому в Інтернеті з’явився рекурсивний акронім «PNG is not GIF»

WebP - новий формат зображення, що був розроблений компанією Google в 2010 році.

Формат дозволяє користувачам зберігати зображення з втратами або без втрат якості.

Google підтверджує ефективність стиснення формату і заявляє, що файл у цьому форматі на 25-35% менше, ніж еквівалентний JPEG або PNG файл. Це зменшує розміри сторінок і підвищує продуктивність браузера.

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

YouTube виявив, що перемикання на мініатюри WebP призвело до збільшення швидкості завантаження сторінок на 10%.

Програмісти Facebook відзначили 25-35% економії FileSize для JPEGs і 80% економії FileSize для PNG файлів, коли вони перейшли на використання WebP.

Ще один формат приходить на зміну PNG і JPEG. Це новий формат стиснення JPEG-2000 (розширення JPX). У цьому форматі можна включити прозорість фону, як і у форматі PNG, але при цьому файл буде значно менше.

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

Якщо формати JPEG та PNG використовуються для напівтонових зображень, тобто фотографій, то формат GIF переважно використовується для інфографіки.

Формати подання візуальної інформації.

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

Більшість веб-дизайнерів та маркетологів вважають за краще саме цей вид візуального контенту, оскільки користувачі діляться інфографікою в соціальних мережах в 3 рази більше, ніж будь-яким іншим контентом.

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

Популярність інфографіки пояснюється тим, що вона доступна, переконлива, привертає і утримує увагу і легко передає інформацію.

Інфографіка - ідеальний вид візуального контенту для Вашого сайту, якщо Ви зможете відобразити в ній цікаві дані.

Невилички приклади інфографіки (натисніть на зображення для збільшення). 

Давайте розглянемо, які ще види візуального контенту використовуються сьогодні в Веб-дизайні.

По-перше, це разновид блок-схем - інтелектуальні мапи ( майнд меп).

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

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

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

Іконейшн (iconation). Маленьки піктограми, що використовуються у веб-ресурсах.

Колажі або кліпарти (натисніть на зображення для збільшення)

Анімовані зображення можуть бути представлені як фрагментами відео ( їх називают "Гіфками"), так і сінематографікою та "лупами" - закольцованим відео (дивіться презентацію).

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

Подивіться цікаві роботи Фотографа із Лос Анжелеса Романа Лорана

Ще один цікавий розновид GIF-анімації - це "закольцоване відео" або пітльова анімація (loops).

Вот декілько работ у цьому форматі від французського митця Франсуа Берейна. Він знимав їх у Ліберії.

Серед форматів подання візуальної інформації також є популярні в мережі рекламні та агітаційні банери та меми.

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

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

За змістовної спрямованості. 

• Відеолекції – записані повністю, або сегментовані.
• Відеопрезентації – суміш слайд-шоу з аудіокоментарем та записом доповідача.
• Відеотуторіали – інструкції покрокового рішення задачі з використанням технологій скрінкасту, або «живим» відео. 

За формою подання матеріалів можна виділити:

• Звичайне «живе» відео.
• Скрінкаст.
• Відеоскрайбінг.

Живий відеозапис може представляти собою відеосупровід – відео, на якому людина сидить перед камерою і читає текст. Такий формат відео зазвичай використовують в якості доповнення до презентації PowerPoint, коли потрібно прокоментувати слайди. Або відеолекцію - відео, на якому людина проводить заняття біля дошки, або фліпчарту.

Скрінкаст - відеозапис того, що відбувається на екрані комп'ютера або ноутбука. Може супроводжуватися голосовими коментарями автора записи.

В основному скрінкасти використовується для створення покрокових відеоінструкцій (туторіалів) для роботи з програмами, додатками або комп'ютерними сервісами.

Відеоскрайбінг - ілюстративні коментарі аудіорозповідей. Тобто,  ви розповідаєте, а рука в кадрі швидко робить ілюстрації до вашої розповіді. Графічний монохромний відеоскрайбінг в стилі малюнків кульковою ручкою називають Дудл.

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

Подивиться зразки навчального фільму, де викладач разом з "живим" відеозаписом використовує інфографіку, та зразок рекламного відеоскрайбінгу.

Основні формати зберігання відеоінформації.

Найбільш поширеними відеоформатами є: mpeg-2, avi, mkv, flv, mp-4.

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

У чому полягає різниця між форматами? Змістом файлу-контейнеру і використовуваними кодеками.

Наприклад, в популярний контейнер AVI можна помістити одну відеодоріжку, дві аудіодорожки та опис. А ось в контейнер MKV - можна упакувати все, що завгодно: будь-яку кількість відео- та аудіодоріжок, анімовані і текстові субтитри, шрифти для них і багато іншого.

Якщо відео буде скачуватися та зберігатися в смартфоні, планшеті або іншому портативному гаджеті, то рекомендується використовувати формат MP-4. Він дозволяє використовувати сучасний кодек H.264, який максимально стискає кінцевий файл. При цьому якість практично не страждає, так як в процесі обробки видаляються тільки невидимі оку ефекти. Мобільні пристрої зазвичай мають невеликий екран, тому можна домогтися мінімальних розмірів відеофайлу.

Крім того, MP-4 дозволяє налаштувати співвідношення якість / розмір під певні вимоги. Він відмінно підходить для соціальних мереж, місць для розміщення відеофайлів, файлообмінників, хмарних сервісів.

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

Сухий залишок - формат відео - це валіза з щільно упакованими речами:  

Сама валіза - це файл-контейнер; одяг і взуття - це вміст (звук, відео, субтитри тощо), а те, наскільки щільно ви їх запакували - це кодек. Ну а все це в цілому - і є формат відео.

Валерій Пичко