Раскадровки UX - идей и исследований: зачем дизайнеру интерфейсов сториборд

Вступление
Чтобы придумать действительно хороший и "работающий" дизайн, UX-дизайнеры используют множество различных исследовательских методов, например, контекстуальные запросы, интервью и семинары. Они суммируют результаты исследований в User story и User Flow и рассказывают ход своих мыслей и решения командам с помощью таких артефактов, как персонажи и каркасы. Истории привлекают внимание, привносят ясность и вдохновляет команду на активные действия.
Но где-то во всем этом есть реальные люди, для которых разрабатываются продукты. Чтобы создавать лучшие продукты, дизайнеры должны понимать, что происходит в мире пользователя, и понимать, как их продукты могут сделать жизнь пользователя лучше. И вот тут-то на помощь приходят раскадровки.
О том для чего вообще нужен UX и чем отличается от UI можно почитать в статье "Разработка дизайна интерфейсов UI/UX"
А в этой статье мы рассмотрим сториборд, или другими словами — раскадровка сценария. Погнали!

Что Такое Раскадровка (Сторибоард)?
Раскадровка - это линейная последовательность изображений, объединенных, чтобы визуализировать историю. Как инструмент, раскадровка происходит из индустрии кино. Студии Уолта Диснея пользовалась раскадровками с 1920-х годов. Раскадровки дают возможность диснеевским аниматорам увидеть мир мультфильма еще до того, как он будет создан. Все известные режиссеры кино, также используют их в своей работе. Раскадровки используются в качестве инструмента визуального повествования, например: "Город Грехов". реж. Фрэнк Миллер, Роберт Родригес, Квентин Тарантино
Истории являются самой мощной формой передачи информации по ряду причин:
1.Визуализация. Картины дороже тысячи слов. Изображение говорит более мощно, чем просто слова, добавляя дополнительные слои смысла.
2.Запоминание. Истории в 22 раза запоминаются лучше, чем простые факты. и это Факт! Даже у Австралийских абориген не было письменности и чтобы обойтись без неё они придумывали историю, описывающую событие.
3.Эмпатия. Как человеческие существа, мы часто сопереживаем персонажам, у которых есть проблемы, подобные нашим собственным реальным. А когда дизайнеры рисуют раскадровки, они часто наполняют персонажей эмоциями.
4.Любопытство. Люди запрограммированы на то, чтобы реагировать на истории: наше чувство любопытства немедленно вовлекает нас, и мы включаемся, чтобы увидеть, что произойдет дальше.

Что такое раскадровка (сторибоард) в дизайне UX?
Раскадровка в UX - это инструмент, который визуально предсказывает и исследует опыт пользователя с продуктом. Он представляет продукт, очень похожий на фильм с точки зрения того, как люди будут его использовать. Это может помочь дизайнерам UX понять поток взаимодействия людей с продуктом с течением времени, давая четкое представление о том, что действительно важно для пользователей.
STORYTELLING MATTER.
ПОЧЕМУ РАССКАЗЫВАНИЕ ИСТОРИЙ ИМЕЕТ ЗНАЧЕНИЕ В UX?
Истории являются эффективным и недорогим способом выхватить, передать и изучить опыт в процессе проектирования. В дизайне UX эта техника имеет следующие преимущества:
  • Подход к дизайну заключается в том, что человекоцентрированные раскадровки ставят людей в центр процесса проектирования. Они наделяют аналитические данные и результаты исследований человеческим лицом.
  • Дизайнеры, думающие о User flow, могут "влезть в шкуру" своих пользователей и видеть продукты в как пользователь. Это помогает проектировщикам понять существующие сценарии взаимодействия, а также проверить гипотезы о потенциальных сценариях.
  • Раскадровки также показывают, на что вам не нужно тратить деньги. Благодаря им можно вырезать массу ненужной работы. И съэкономить бизнесу тучу денег.
  • Раскадровка - это командная деятельность, и каждый член команды может внести в нее свой вклад (не только дизайнеры). Как и в киноиндустрии, каждая сцена должна быть подвергнута критике всеми членами команды. Подход к UX с рассказыванием историй вдохновляет на сотрудничество, что приводит к более четкой картине того, что разрабатывается. Это может привести к появлению новых концепций дизайна.
  • Более простая итерационная раскадровка в значительной степени опирается на итеративный подход. Зарисовки позволяют дизайнерам экспериментировать практически без затрат и тестировать несколько концепций дизайна одновременно. Суть: никто не привязывается слишком сильно к генерируемым идеям, потому что они быстрые и грубые.
Когда сторибоард полезен?
Сторибоард полезен для совместного дизайна, она вовлекает все стороны: проектировщики UI и UX, разработчики, аналитики в процесс проектирования, чтобы гарантировать, что результат будет как можно лучше.
Сторибоард, который показывает, как Продукт решает проблему, в будущем уже готовый продукт будет таким же для целевой аудитории.
Это также может быть полезно во время проектных спринтов и хакатонов, когда прототип создается несколькими людьми за очень короткое время. Общение дизайнерских решений со сторибоард действительно пригодится.
Основная цель сторибоард - коммуникация
Когда вы ищете раскадровку в Интернете, они всегда выглядят очень красиво. Вы можете подумать, что для того, чтобы сделать их правильно, вы должны уметь хорошо рисовать. Хорошая новость: вам не нужно быть Великим художником как Леонардо да Винчи. Скорее, великий раскадровщик - это великий коммуникатор.
Таким образом, не имеет значения, являетесь ли вы квалифицированным иллюстратором. Что гораздо важнее, так это реальная история, которую вы хотите рассказать. Главное-четко передавать информацию. Имейте в виду, что главное умение дизайнера UX - не в Photoshop или Figma, а в умении сформулировать и описать сценарий.

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

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

  • Сцена
Это среда, в которой живет персонаж (она должна иметь реальный контекст, включающий место и людей).

  • Сюжет
Сюжет должен начинаться с определенного события (триггера) и заканчиваться либо преимуществом решения (если вы предлагаете его), либо проблемой, с которой остается персонаж (если вы используете раскадровку, чтобы выделить проблему, с которой сталкивается пользователь).

  • Повествование
Повествование в раскадровке должно быть сосредоточено на цели, которую пытается достичь персонаж. Ваша история должна быть структурирована и иметь очевидное начало, середину и конец. Большинство историй имеют повествовательную структуру, очень похожую на пирамиду — ее часто называют пирамидой Густава Фрейтага, в честь человека, который ее описал. Фрейтаг разбил рассказы на пять актов: экспозицию, восходящее действие, кульминацию, нисходящее действие (разрешение) и развязку (заключение).
Раскадровка реальной жизни, в действии
Airbnb - отличный пример того, как Сторибоард может помочь компании понять потребительский опыт и сформировать продуктовую стратегию. Чтобы сформировать будущее, генеральный директор Брайан Чески позаимствовал стратегию у аниматоров Disney, создала список эмоциональных моментов, который описывает суть пребывания в Airbnb, и построила самые важные из этих моментов в истории. Одна из первых идей, которую команда получила от раскадровки, заключается в том, что их сервис — это не веб-сайт - большая часть опыта проходит в автономном режиме, в домах и вокруг них, тех, которые перечисленны на веб-сайте. Это понимание привело команду к следующему шагу: сосредоточиться на мобильном приложении как средстве, связывающем онлайн и оффлайн.
Вывод
Дитер Рамс однажды сказал: “Вы не можете понять хороший дизайн, если не понимаете людей; дизайн создан для людей.”
Раскадровка в UX поможет вам лучше понять людей, для которых вы проектируете. Каждый бит, как каждый шаг навстречу, чтобы понять пользователя, будет очень полезен.

Оставить заявку

Оставьте контакты и наша команда свяжется с Вами в ближайшее время