Три акта, пирамида Фрейтага и зигзаг Дуарте

Три акта — форма истории: завязка, развитие, развязка. Пирамида Фрейтага показывает подъём и спад напряжения, зигзаг Дуарте — «как есть» и «как могло бы быть».

Зачем истории форма

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

В этом уроке три способа посмотреть на дугу и один приём, как её начать.

Три акта

Самая простая форма: у истории есть начало, середина и конец. Ещё в «Поэтике» Аристотеля это было сказано как очевидное. В кино и в книгах эту мысль оформили как три акта.

1. Первый акт, завязка. Мы знакомимся с человеком и его миром и видим, что-то нарушено или чего-то не хватает. В конце акта человек принимает решение действовать.
2. Второй акт, развитие. Он пробует, мешают препятствия, ставки растут. Это самый длинный акт, примерно половина истории.
3. Третий акт, развязка. Главное столкновение и его итог. Мир снова устроен, но уже иначе.

Пропорции «четверть, половина, четверть» принято называть для сценариев, и это лишь ориентир. Для сайта важнее порядок: сначала понять, о ком и о чём, потом поверить, что решение работает, потом сделать шаг.

Проверьте себя: какой акт самый длинный и почему?

Второй, развитие. В нём события накапливаются и растёт напряжение. Если его сократить, развязка не подействует.

Пирамида Фрейтага

Немецкий писатель Густав Фрейтаг в 1863 году разобрал устройство пятиактной драмы и нарисовал напряжение как пирамиду: оно поднимается к вершине и затем спадает. Пять ступеней:

1. Экспозиция. Знакомство: кто, где, в чём дело.
2. Подъём действия. Осложнения, препятствия, растущее напряжение.
3. Кульминация. Высшая точка, поворот.
4. Спад. Последствия поворота.
5. Развязка. Итог, новое равновесие.

Фрейтаг описывал драму своей эпохи, поэтому пирамиду не стоит считать законом для всех историй: у многих рассказов вершина одна, у многих несколько, у некоторых нет вовсе (в одном из следующих уроков вы увидите такой пример). Но как карта для главной страницы она годится. Попробуйте на схеме: подвигайте точки пирамиды и посмотрите, какая часть страницы им соответствует.

Пирамида и акты Зигзаг Дуарте С начала или с середины

Экспозиция: 2 Подъём: 5 Кульминация: 9 Спад: 5 Развязка: 1

• Экспозиция. На странице: Первый экран: кто вы и для кого.
• Подъём. На странице: Проблема посетителя растёт.
• Кульминация. На странице: Момент, когда видно решение и кнопка.
• Спад. На странице: Как это работает, доказательства.
• Развязка. На странице: Итог и приглашение к действию.

Три акта лежат поверх пирамиды: завязка (четверть), развитие (половина), развязка (четверть). Подвигайте точки: у истории без подъёма кульминации нет.

На странице эти ступени выглядят так. Экспозиция это первый экран. Подъём это проблема посетителя, которая становится заметнее. Кульминация это раздел, где он видит решение, и рядом кнопка. Спад это «как это работает» и доказательства. Развязка это призыв к действию и последняя фраза.

Проверьте себя: что на странице соответствует кульминации?

Момент, когда посетитель видит, что его беда решаема, и рядом находит главное действие.

С середины: in medias res

Латинское выражение in medias res («в самую гущу дела») придумали ещё римляне для поэмы, которая начинается не с рождения героя, а посреди событий. Приём простой: начать с самой напряжённой сцены, а предысторию дать после.

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

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

Проверьте себя: когда прямой порядок лучше приёма «с середины»?

Когда в начале стоит факт, нужный посетителю сразу: место, срок, цена, условие.

Зигзаг Дуарте

Нэнси Дуарте, специалист по публичным выступлениям, заметила, что сильные речи не идут прямой линией. Они чередуют два состояния: «как есть» (положение, которое нас не устраивает) и «как могло бы быть» (желаемое), и заканчиваются лучшим вариантом. Получается зигзаг. Разрыв между двумя линиями создаёт напряжение, а конец показывает, куда идти.

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

Проверьте себя: чем зигзаг Дуарте отличается от простого списка плюсов?

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

Практика

Возьмите главную страницу вашего проекта. Распишите её дугу в пяти строках.

• Экспозиция: что видно на первом экране.
• Подъём: какая беда или желание посетителя растёт, и как в этом участвует ваша услуга или товар (назовите её из брифа).
• Кульминация: раздел сайта, где посетитель видит решение. Назовите раздел так, как он назван у вас.
• Спад: чем вы подкрепляете решение.
• Развязка: название вашей кнопки слово в слово.

Потом ответьте на один вопрос: начнёте ли вы «с начала» или «с середины», и почему. Если выбрали «с середины», запишите, какая сцена будет первой.

Когда структура мешает

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