Denis Zolotarev
3 556

Как рассказывать истории в 2018 году

С чего начинать работу над дизайном проекта и как подавать информацию в различных форматах.

Поделиться

В избранное

В избранном

Второй материал из цикла про медиадизайн.

Иллюстрация: проект «Увидеть все»

В своей прошлой статье «Что такое медиадизайн» я попробовал разобраться в том, что же, собственно, представляет из себя медиадизайн. Сейчас я хочу в большей степени затронуть практическую сторону вопроса. Ранее, говоря про медиадизайн, я приводил в пример в основном различные издания (или частные аудиторные проекты).

Но место историй — не только в СМИ. Слово «медиа» здесь означает скорее средства коммуникаций в целом. Техники визуального сторителлинга используются сейчас всюду — от СМИ и презентаций до продуктового и web-дизайна. «Презентация» давно перестало было стыдным словом, сейчас производством «през» на заказ занимаются вполне серьёзные и крупные фирмы.

Корпорация Apple немало сделала для того, чтобы слово «презентация» перестало ассоциироваться с шаблонами Power Point

Никогда ещё наш мир не чувствовал такой потребности в том, чтобы коммуницировать не только количественно, но и качественно. Понятно, эффектно и убедительно доносить свои мысли до других людей. Итак, вы решили рассказать историю как дизайнер. С чего начать?

1. Кто наша аудитория

Я имею в виду реальная аудитория (а не та, что мы себе воображаем). В зависимости от задачи ваши читатели могут варьироваться от самого широкого круга до сверхмалых групп из сотен или даже десятков человек (если вы проектируете, например, презентацию для бизнеса).

Иногда это вообще один единственный человек. Автор участвовал в паре проектов сайтов, разрабатывавшихся под одного конкретного зрителя (и с точки зрения бизнеса это был эффективный ход).

Разберитесь — кто те люди, для которых вы создаёте историю:

  • Что они реально ждут от неё?
  • Чего они не хотят видеть?
  • Что им интересно и не интересно?
  • Каким запасом времени они располагают?
  • В каких условиях и на каких устройствах будут взаимодействовать с проектом?
  • Будут они управлять нарративом сами или слушать лектора?

И last but not least — сколько им лет. Большая часть интерфейсов и визуальных коммуникаций разрабатывается людьми 20–35 лет, которые зачастую используют размеры шрифтов, практически нечитаемые людьми старше 50. К сожалению, с возрастом зрение слабеет очень у многих. Присмотритесь к своим родителям — скорее всего, у них «увеличенный» интерфейс на смартфоне.

Хорошие примеры грамотной работы с аудиторией можно найти в двух популярных сейчас форматах: почтовых рассылках и (что очевидно) YouTube-блогах. Любой YouTube-миллионник — образец попадания в ЦА (пусть временами очень специфическую). Среди множества примеров рассылок я бы упомянул одну из самых успешных — The Skimm.

Это ежедневная рассылка для девушек-миллениалов в США, в которой кратко и доходчиво изложены основные новости. Создательницы говорят, что в качестве целевой аудитории рассматривали прежде всего молодых женщин, читающих новости по утрам. Сегодня в число подписчиков The Skimm входят, например, Мишель Обама, Опра Уинфри и Сара Джессика Паркер. Стартап привлёк уже $16 млн инвестиций.

Карли Закин (слева) и Даниэла Вайсберг — создатели The Skimm (фото отсюда)

2. Какова цель проекта

Многие поставили бы этот пункт первым, но я уверен, что аудитория первична, потому что информационный продукт всегда делается ДЛЯ кого-то. Продукт без аудитории — пустая трата ресурсов.

Проще всего выразить виды целей через виды заказчиков. Говоря про «заказчика», я не имею в виду только коммерческие или рекламные проекты. Заказчиком можете быть и вы сами. Это субъект, который определяет цель работы. Исходя из этого, можно условно выделить три основных типа проектов.

Журналистика

Чаще всего здесь заказчиком выступает какое-либо СМИ. Такие проекты не пытаются продать читателю какой-либо товар или идею (по крайней мере, в идеале) и на 100% ориентированы на пользователя.

Реклама (включая нативную)

Обычные рекламные спецпроекты постепенно теряют свои позиции на рынке (по большей части потому, что их никто не читает, а стоят они немало). Основным трендом сейчас является нативная реклама. Это способ заинтересовать читателя в товаре или услуге за счёт интересной истории, ценной самой по себе.

Хорошим примером такого проекта я считаю историю холодильника, выполненную нами (Студией интерактивных проектов) для Miele.

Проект «Индустрия холода», выполненный по заказу компании Miele для продвижения новой линейки холодильников

PR и GR (то же самое, что и PR, только в сторону госструктур)

Цель подобной работы — донести до аудитории («продать») определённую мысль. Например, мысль о востребованности российских научных разработок, как в нашем проекте для Курчатовского института, рассказывающем о мегаустановках для исследования вещества и их применении в задачах бизнеса и промышленности.

Интерактивный лонгрид про синхротрон — установку для исследования вещества на субатомном уровне

3. О чём и как мы хотим рассказать

Я — не редактор, поэтому не буду погружаться в тонкости написания информативных и цепляющих текстов (для этого можно почитать, например, Ильяхова). Будем исходить из того, что текст, предпочтительно в виде сырой фактуры, вам уже предоставили.

Я против работы с готовыми, вылизанными и утверждёнными текстами по той причине, что редактор или журналист часто смещает акценты и структурирует текст исходя из того, как он лучше всего воспринимается и читается в текстовом редакторе.

В то время как тот же текст, закомпонованный в окне браузера (или на бумаге), снабжённый иллюстрациями и оформленный определённым образом будет восприниматься совершенно иначе. Итак, главный вопрос, который вы должны себе задать после изучения материала: «С чего вообще люди захотят это смотреть?»

Пользователей раздражает каждый лишний клик или переключение внимания.

Они (в 95% случаев) не будут никуда кликать и думать над вашим заковыристым интерфейсом (даже если вы напишете инструкции, особенно если вы напишете инструкции). Аудитории ваш проект либо интересен, либо нет. Поэтому первый вопрос — что мы можем дать людям? В первую очередь как дизайнеры.

Я попробовал выделить наиболее распространённые и действенные подходы.

Важная для аудитории тема, разобранная визуально

Проект про пенсионные планы от Bloomberg. Пенсия касается всех, это один из основных страхов современного человека. Калькулятор ренты от NYT. Недвижимость — ещё одна головная боль в наше время.

Данный проект помогает разобраться с тем, что выгоднее (при различных вводных) — снимать или покупать жильё. Кстати, это один из редких примеров того, как заставить пользователя потыкать в ваш интерфейс. Но для этого приходится давить на самое больное — на кошелёк.

Проект про пенсионные планы от Bloomberg

Наглядно оформленные интересные факты (подойдёт любая тема, которая хорошо переводится в картинки)

Разбор шуховской башни на «РИА Новости». Башня Шухова, во-первых, широко известный и культурно значимый, во-вторых, внешне очень характерный и узнаваемый объект. Это практически беспроигрышная тема для визуализации.

Хорошая журналистская история (стоит помнить, что для этого понадобится как минимум один хороший журналист)

Захватывающий рассказ про жизнь таксистов от «Батеньки». Такси — повседневная часть нашей жизни, но в то же время она неоднозначна. Здесь переплетаются деньги, человеческие отношения, личная безопасность и многие другие факторы.

Проект про такси от «Батеньки»

Просто красивая история (иногда можно и так, красоту любят все)

Фотопроект с коллажами (уже упоминался в прошлой статье).

4. Как строить рассказ

Лучше всего (по собственному опыту) — представить, как вы рассказали бы это своему знакомому в обычной беседе. А ещё лучше — так и сделать (для этого придётся найти жертву).

Собеседник не обязательно должен быть частью ЦА, но вы сможете за счёт него разобраться с тем, что главное и второстепенное, с какой интонацией и даже жестикуляцией вы пытаетесь осветить тему.

Чувствуете ли необходимость схватить бумагу и ручку, чтобы что-то наглядно изобразить (если да, то, скорее всего, вам потребуется инфографика)? Поискать видео в интернете? Есть люди, обладающие талантом рассказчика. Они могут живо и интересно рассказать практически про любую вещь, о которой знают хоть что-то.

Часто талант рассказчика заключается не столько в том, чтобы подавать информацию ёмко и понятно, сколько в том, чтобы делать это выразительно. Выразительное легче усваивается и прочнее запоминается. И здесь мы подходим к следующей важной мысли.

Эстетика — такая же важная часть послания, как вербальная.

Как мы оформим нашу историю? Какой шрифт, цвета, композицию и вёрстку (если это актуально) выберем? Используем ли мы иллюстрации и в каком стиле? Есть ли в иллюстративном ряде пространство для творчества, или он должен быть предельно нейтрален и информативен?

В качестве яркого примера того, как эстетика становится самостоятельным игроком на поле сторителлинга, можно привести уже упоминавшийся в первой статье проект: панк-брутализм от Bloomberg про 50 важнейших персон в 2016 году. А также крайне успешный с точки зрения аудиторных показателей проект «Ленты» про даркнет, целиком построенный на глитче и эстетике MS-DOS.

Часто игры с эстетикой используются в спецпроектах и нативной рекламе: спецпроект про сериал Chance для кабельной сети Hulu через напряжённую эстетику передаёт настрой фильма, основанного на истории судебного психоневролога.

Спецпроект про сериал Chance для кабельной сети Hulu

Конечно, это вовсе не означает, что каждая ваша работа должна быть выполнена «в стиле». Большая часть лучших образцов сторителлинга достаточно нейтральна (скорее потому, что все силы уходят на саму историю), но всегда стоит помнить о дополнительных выразительных возможностях.

5. В какую форму мы должны облечь нашу историю

Этап выбора формата должен идти после внимательного изучения фактуры и определения генеральной идеи проекта. Глупо говорить «окей, это будет викторина» до того, как вы узнаете все вводные и получите хотя бы примерно представление о материале (хотя часто, когда речь идёт о коммерческих проектах, заказчик требует именно этого; боритесь с этим).

Рассмотрим некоторые наиболее распространённые способы рассказать свою историю.

Классические лонгриды

Рассказ про восхождение на гору El Capitan (в честь неё была названа одна из версий macOS).

Рассказ про восхождение на гору El Capitan

Инфографика

Trump & Clinton — инфографический рассказ про американские выборы. Как объективно осветить максимально субъективную и спорную тему? Использовать инфографику! Конечно, при условии честного и беспристрастного подхода к информации. Про то, как не наврать с данными, я расскажу в следующих статьях.

Инфографический рассказ про американские выборы

Иллюстрации, мемы или комиксы

Отличным примером здесь является Кристоф Ниман, человек и пароход на стыке инфографики, иллюстрации и арта. Его работы сложно классифицировать (как, например, эту с кубиками лего), но определённая поэзия в них точно присутствует. Кстати, также рисует иллюстрации в VR и AR.

Экспериментальная 360º-иллюстрация по мотивам путешествия по границе между Северной и Южной Кореей. Полный проект можно посмотреть тут

Фото или видео 360

Могут дополняться титрами и графикой. NYT создала целый отдел для разработки подобных историй.

Виртуальная или дополненная реальность

До недавнего времени это был скорее экспериментальный формат, но технологии развиваются достаточно быстро, и недавний анонс Magic Leap (поставки обещают в этом году) вкупе с активными действиями практически всех технологических и софтверных гигинатов даёт надежду на то, что ситуация изменится в самом скором времени.

Сейчас мы имеем несколько не самых дешёвых и удобных хеадсетов для VR и AR, а также AR-киты от Apple и Google (и последние модели смартфонов, «заточенные» под AR), но уже есть весьма интересные примеры использования как AR (подборка кейсов для iOS), так и VR-технологий (подкаст-шоу в формате VR, рассказывающее про компьютерную игру через виртуальную прогулку по ней).

Стоит держать в голове эти возможности хотя бы для того, чтобы быть готовым в тот момент, когда технология получит взрывное распространение (главное, чтобы не получилось так, как в этом апокалиптичненьком ролике.

Ироническое видео про возможное будущее AR (смотреть до конца)

Анимация и объясняющее видео

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

Анимация вовсе не обязательно должна быть технически сложной, чтобы быть выразительной и информативной. Так в этом проекте про водное поло минималистичные гифки одновременно оживляют историю и дают новый уровень понимания. Иногда достаточно даже одной гифки, чтобы рассказать историю (здесь формат GIF совмещается с инфографикой).

Для создания эффектного видео не обязательно нужен сложный инструментарий и даже отточенный дизайн (как мы его обычно понимаем). Важнее — история и режиссура. Одним из лучших примеров объяснительной видеожурналистики нашего времени является этот широко известный ролик про историю Японии.

Игры и чат-боты

Хайп вокруг чат-ботов несколько спал и это хорошо, так как позволяет трезво оценить потенциал формата. Пока никто не смог лучше, чем Quartz выступить в этом жанре (кстати, лендинг у них тоже клёвый).

Геймификация также отличная опция. Но ей надо пользоваться с умом (а не пытаться сварганить тест или платформер на любую тему). Как на этом проекте, предлагающем стартовать быстрее, чем Усейн Болт. Также можно отметить отличный проект от NYT на тему инклюзивности в спорте. Всё завёрнуто в форму теста «угадай вид спорта по внешнему виду спортсмена».

Проект от NYT предлагает угадать вид спорта по внешнему виду спортсмена

Какой бы формат вы ни выбрали, главное — это содержание, а не оболочка. Проектируйте контент, а не интерфейс для него.

При этом помните, что формат подачи прямо зависит от того, где опубликована ваша история. Например, одна и та же (по содержанию) инфографика, скорее всего, будет выглядеть по-разному в зависимости от того, где она опубликована — на отдельном сайте, в Instagram, на Facebook и так далее.

Это обусловлено прежде всего форматом самих площадок. Скажем, в Instagram вы ограничены размером, зато можете делать бесшовное слайд-шоу, чем активно пользуется, например, приложение Pure. И здесь мы подходим к следующему важному этапу или разделу — дистрибуции созданного вами контента.

6. Как доставить нашу историю пользователям

Без грамотной дистрибуции любое медиа — просто разрозненные фрагменты контента. В то же время хорошо продуманная «доставка» превращает те же самые раскиданные по десятку соцсетей и площадок материалы и заметки в полноценное СМИ, цельный образ которого создаётся прежде всего в голове у читателей.

Многие СМИ и вовсе не имеют своей отдельной площадки, существуя только как набор социальных аккаунтов и обретая индивидуальность за счёт узнаваемой стилистики и комплексного подхода.

Ярким примером такого медиа является Now This — издание, целиком состоящее из видеороликов и с 2015 года не имевшее своего сайта (только лендинг), существуя в качестве страницы в соцсетях (например, на Facebook).

Тем не менее, пока писалась статья, Цукерберг пообещал изменения в логике выдачи материалов, в результате чего пользователи должны начать видеть меньше публикаций от медиа и больше — от друзей. В связи с этим Now This принял решение вернуть сайт (клёвый, посмотрите).

Иногда даже просто серия публикаций в одном канале (хороший пример — тематические подборки в Telegram-канале Димы Барбанеля), объединённых одной идеей, выходящих по продуманному графику и подчиняющихся определённой логике, становится своего рода онлайн-изданием.

Примеры типичных публикаций из канала Барбанеля:

Так как у меня не стоит задачи погрузить вас в теорию контент-маркетинга, сведу всю дистрибуцию к трём вопросам.

  • Где? На каких каналах вы планируете публиковаться, а через какие — продвигаться?
  • Как? Публикация сама по себе тянет на небольшой проект. Как вы анонсируете свой материал? Какую аудиторию подключите (если используете платное продвижение)?
  • Когда? Планирование графика публикаций позволит вам донести историю до большего числа читателей. Посмотрите — в какое время пользователи той или иной соцсети или ресурса наиболее активны? Если публикация состоит из нескольких частей — лучше выпустить их все сразу или по очереди? Какой временной промежуток между ними установить?

Всё вышеописанное формирует то, что один мой коллега метко назвал story experience. То есть конечный опыт, который получает отдельный пользователь.

В следующих частях я расскажу о некоторых распространённых ошибках, которые совершают дизайнеры историй, и поговорю об инструментарии медиадизайнера. Stay Tuned!

#дизайн #медиа

{ "author_name": "Denis Zolotarev", "author_type": "self", "tags": ["\u0434\u0438\u0437\u0430\u0439\u043d","\u043c\u0435\u0434\u0438\u0430"], "comments": 2, "likes": 28, "favorites": 40, "is_advertisement": false, "section_name": "default", "id": "38596", "is_wide": "" }
{ "is_needs_advanced_access": false }

Комментарии Комм.

Популярные

По порядку

0

Прямой эфир

Подписаться на push-уведомления
[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]