Кевин Брукс - Сторителлинг в проектировании интерфейсов. Как создавать истории, улучшающие дизайн

• Он может пользоваться компьютером в любое время.

• Уютный дом представителей среднего класса.

• Наши дни.

• Западная культура.

Здесь, как и в письменных историях, вы можете с помощью изображений добавить контекст. Рис. 15.7 дает дополнительную информацию о Тэннере. Также изображение позволяет добавить элемент неожиданности. Представьте, что в качестве иллюстрации к рассказу о Тэннере приведена фотография мальчика совсем из другой культуры.

Визуальные элементы в любом случае добавляют новое измерение – не важно, используются ли они в качестве иллюстрации или история состоит только из них:

• Диалог, разрывы во времени и последовательность событий можно показать в форме комиксов.

• С помощью фотографий можно продемонстрировать контекст, место действия и культурные условия.

• Простые диаграммы – хорошая иллюстрация последовательности событий и взаимосвязей. В них также можно выделить конкретные детали.

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

Однако если вы хотите использовать видеоролик, помните: записать историю на камеру недостаточно. Большинство людей смотрят фильмы и телепередачи, поэтому имеют точное представление о том, что такое качественное видео. Простая видеозапись их не устроит.

Здесь, как и в случае выступлений на публике, используется несколько уровней передачи информации. Это диалог и повествование, объекты в кадре (на переднем и заднем плане), основные и фоновые звуки, включая музыку. Аудитория воспринимает все эти элементы в совокупности.

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

• Реклама новых продуктов Google, например Google Voice [103], обычно состоит из одной страницы. На ней размещены видео, в которых объясняется, в чем суть продукта и как его использовать.

• Инструкции для настроек мультитач в Apple OS X – видео, где показано, как с помощью пальцев можно добиться нужного результата.

• Компания Starfire (см. главу 1) создала видеосценарий, где показала, как новые технологии влияют на взаимодействие пользователей с компьютером.

• Компания Common Craft создает короткие видеоролики о том, как люди используют разные продукты. Один из них – «Twitter на разговорном английском»: www.commoncraft.com/Twitter.

Больше примеров вы найдете на YouTube: введите в поисковой строке название нового пользовательского устройства вместе со словом unboxing («распаковать»). В таких роликах показан весь процесс: пользователь получает продукт, вынимает его из коробки (вместе с комплектующими), а потом (чаще всего) настраивает и включает.

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

Ролики, в котором человек просто читает текст, чаще всего вызывают зевоту. Исключения возможны: если история невероятна интересна, а рассказчик – отличный актер. Однако большинство людей предпочитают сначала создать речь на бумаге, а потом уже записать ее на видео.

При работе над сценарием необходимо помнить о некоторых элементах языка кинематографии. О правилах съемки видео мы говорить не будем. Однако стоит задуматься о следующих составляющих ролика:

• Камера: с ее помощью создается визуальный ряд. Он включает расположение объектов в кадре, перемещения камеры, освещение объектов (чтобы они выделялись на общем фоне). В кино также важен угол съемки – он определяет эмоции и восприятие. Вспомните, какие фильмы вы смотрели и какие приемы можно из них заимствовать, чтобы создать хорошую визуальную историю.

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

• Аудио: можно просто зачитывать текст за кадром или добавить музыку, звуковые эффекты или диалоги/монологи в кадре. Требования к качеству звука в наше время высоки. Так что стоит подумать, какие аудиоэффекты вы хотите использовать и как лучше их записать.

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

Визуальный ритм – темп движения объектов на экране (например, рук при плавании или ног при ходьбе).

Звуковой ритм – темп речи, других звуков, паузы (часто именно последние становятся самым важным звуковым эффектом).

Монтаж – частота смены ракурса, точки обзора, переходы, перемещение камеры во время действия (прерывистое или непрерывное), отражающее движение во времени или пространстве.

Как и в случае устных историй, советуем вам потренироваться. Покажите кому-нибудь полную версию своего видеоролика. Тогда вы сможете понять, есть ли в нем элементы, отвлекающие от сути истории.

Не обязательно снимать видео на камеру. Есть множество графических инструментов. Они существенно облегчают задачу создания отличной истории.

Можно использовать инструмент Photo to movie ( www.lqgraphics.com/software/phototomovie.php). С его помощью можно плавно или быстро перемещать и крутить объекты, показывать увеличенное изображение мелких фрагментов. В результате получается ролик формата QuickTime. Можно вставить закадровый текст или музыку, обрабатывать ролик с помощью других программ. Если у вас есть фотографии процесса, иллюстрации к проекту или наброски прототипов, вы можете составить из них видеоролик и добавить звуковую дорожку.

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

Кевин разработал ролики для истории «Несговорчивая аудитория» (см. главу 12). На рис. 15.8 изображен один из них. В ролике показаны домашние электроприборы из прошлого; это своего рода предисловие к рассказу об использовании различных устройств в домах будущего.