fbpx
Зсередини

Скролітелінг як дієвий інструмент для медіа, брендів та особистих публікацій

Розбираємо поняття та переваги формату, наводимо приклади й розповідаємо, де створити власний проєкт
Коротенко Оля, 16.03.2021

Разом із креативною директоркою Oh My Look! Ніною Коробко ми розібрали поняття скролітелінгу та силу цього формату, навели приклади яскравих інтерактивних проєктів і склали список сервісів для створення власного проєкту.

Спойлер: свій проєкт можна створити, навіть якщо ви не дизайнер.

Ніна Коробко

Чи дочитаєте ви цей текст до кінця? Можливо, так, а може, й ні. І це нормально: навколо нас постійно так багато контенту, що як тільки щось починає бути хоч трохи нудним — ми перемикаємось на іншу вкладку або гортаємо стрічку далі. Як же в таких умовах тримати увагу аудиторії в діджиталі?

Одна з відповідей на це запитання — скролітелінг.

Скролітелінг (скролінг + сторітелінг) — це формат мультимедійних історій, у якому довгі текстові лонгріди перетворюються на інтерактивні динамічні історії з чималою кількістю фото, відео, аудіо, анімацій та великих заголовків.

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

Проєкт Snow Fall

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

Еру скролітелінгу розпочав проєкт Snow Fall 2012 року від The New York Times про снігову лавину в Австралії. Він став прикладом для багатьох інших медіа, викликав дуже багато обговорень та навіть отримав Пулітцерівську премію. Але скролітелінг — це хороший формат не лише для медіа, а й для лендингів брендів та особистих публікацій на кшталт портфоліо.


Ось вісім хороших проєктів, які круто розкривають потенціал скролітелінгу:

1. The Boat — 20-хвилинна адаптація історії “Човен” австралійського письменника Нама Ле. Аудіо та анімації допомагають значно сильніше заглибитися в розповідь.


2. Histography — навіть якщо вам треба розповісти дуже-дуже об’ємну тему (скажімо, всю історію людства, як у цьому випадку), завдяки скролітелінгу ви зможете подати інформацію дуже компактно та цікаво.


3. If The Moon Were Only 1 Pixel — коли думаєш про великі відстані в просторі, уявити їх досить складно. І тут дуже корисні наочні метафори: наприклад, у цьому проєкті ви зможете побачити, якими були б відстані в космосі, якби Місяць був завбільшки з один піксель.


4. Millennials Are Screwed — багато з нас зустрічали іронічні пости про міленіалів. Ця ж публікація показує інший бік та розповідає, чому на це покоління чекає найгірше фінансове майбутнє з часів Великої депресії. Цю не дуже оптимістичну тему теж розкривають у форматі скролітелінгу: з інфографікою та яскравою анімацією.


5-6. Film or Digital? та Scientific Proof that Americans are Completely Addicted to Trucks — зберігайте ці посилання, якщо вам будуть потрібні референси класної анімованої подачі інфографіки.


7. Є фотка, немає підводки — копірайтерка Юля Гуріна та графічний дизайнер Діма Музиченко створили проєкт, який повністю закриває питання “Ой, а як же підписати нову фотку для соцмереж?”.


8. Пояснити без слів: навіщо ми намалювали мігрень? — комерційний спецпроєкт медіа The Village за підтримки медичного бренду Teva про проблему мігрені. Для нього художників-ілюстраторів попросили візуалізувати відчуття хворих на малюнках: щоб наочно передати симптоми та подолати стереотип про те, що мігрень — це “просто головний біль”.


Де створювати проєкти у форматі скролітелінгу:

На щастя, сьогодні знання коду необов’язкові для створення інтерактивних проєктів. Такі програми, як Readymag, Tilda, Wix, Webflow, Setka, Squarespace, Duda дозволяють створювати будь-який інтерактив, маючи лише базові знання верстки та дизайну.

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

Tilda — сервіс для тих, кому складно зробити дизайнерський проєкт “з нуля”. Має велику кількість шаблонів, які можна комбінувати між собою. Шаблони добре поєднуються один з одним незалежно від комбінацій. Блоки можна редагувати — змінити шрифт, ширину, висоту, кольори, завантажити власні іконки. У Tilda немає такого простору для творчості та інтерактиву, як у Readymag, але створити проєкт початківцю тут буде легше.


Що по висновках?

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

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


Підтримай нас на Patreon!

 Donate

Читайте також у рубриці Зсередини
/ Амбасадори для В2В бізнесу та ефективні відносини з ними
Історія виробника обладнання для б’юті-майстрів ÜLKA
/ 10 років роботи: «Будинок “Слово”. Нескінчений роман»
Ексклюзивні деталі про шлях фільму до кінотеатрів
/ Українські традиції в дизайні приміщень та архітектурі – без шароварщини
Поради від архітекторки Катерини Ярової
Аукціони, унікальні продукти, ютуб і менторство
Які танці з бубном вигадують благодійники, щоб збирати кошти на відбудову шкіл
Як створити й провести подкаст?
Розмова зі співведучими та героями подкаст-каналу «У чому виклик?»
Інші статті за темами
Підписатися
Підпишись на нашу розсилку і будь в курсі всіх оновлень
Підпишись на нашу розсилку і будь в курсі всіх оновлень