Сторителлинг в проектировании взаимодействия

Битва мух и котлет

Антипаттерны

Дизайнер думает картинками, а не состояниями

В ходе разработки теряется консистентность (интерфейс зарастает мхом и исключениями)

Экраны не демонстрируют ценность (которую мы пытаемся создать)

Пользователь натыкается на дыры в сценарии

Проблема

Человек- Экран

Человек-Воронка

Визуальный язык: – Интерфейсные паттерны

– Сетка – Структура экрана – Визуальный стиль – Палитра приемов

Слова и цифры: – Отслеживание метрик

– Unit-экономика – Подбор ключевых фраз

Дизайнер Траффик-менеджер

Человек- Экран

фигачит экраны

Человек-Воронка

фигачит сегменты

Каждый из участников сконцентрирован

на своем фрагменте

Опыт пользователя непрерывен, а работа дискретна

Каждый из участников сконцентрирован

на своем фрагменте

Опыт пользователя непрерывен, а работа дискретна

Надо менять метафору и думать про людей

Человек-человек

UX-дизайнер

Человек- Экран

Человек-Воронка

Визуальный язык: – Интерфейсные паттерны

– Сетка – Структура экрана – Визуальный стиль – Палитра приемов

Слова и цифры: – Отслеживание метрик

– Unit-экономика – Подбор ключевых фраз

Дизайнер Траффик-менеджер

Истории людей: – Впечатления – Поступки – Обстоятельства – Состояния – Сценарий – История

Нарратив – это круто

Нарратив – это круто

Восстанавливает контекст

Заставляет говорить конкретикой

Насыщает содержанием

Дает поводы для креатива

Лечит дыры в сценарии

Перипетия

внутренняя трансформация

внешние обстоятельства

Барьер

Мечта

Проблема

Попытка

Бездействие

Неожиданная помощь

Барьер

Мечта

Проблема

Самостоятельная попытка

Наш интерфейс

Бездействие

Он хочет…

Он пытается…

Он меняется…

внутренняя трансформация

внешние обстоятельства

Gamism  игра ради победы, соревнования, достижения целей

Simulationism  игра ради процесса исследования и моделирования чего-либо

Narrativism  игра ради создания и развития красивой истории

мира / персонажа / сюжета

Нарративные игры

Задача – залезть в чужую шкуру, захотеть того, чего должен хотеть наш герой

Ситуация до: что я делал прямо перед проблемой Проблема: что плохо (осознанное или нет) Мотив: к чему я стремлюсь Барьер: что мне мешает получить желаемое прямо сейчас Осведомленность: что и откуда я знаю про предмет

Генерация персонажа

Наследник королевства

Есть белый конь

Красив

Влюблен без памяти

Хорошо танцует

Галантен

Верен

Готов прощать шалости

Будет красиво ухаживать

Игра в принцессу и принца

Наследник королевства

Есть белый конь

Красив

Влюблен без памяти

Хорошо танцует

Галантен

Верен

Готов прощать шалости

Будет красиво ухаживать

Гол как сокол

Ходит пешком

Урод

Не обращает на меня внимания

Не умеет танцевать

Хам

Кобель

Ревнивец

Не будет ухаживать

Игра в принцессу и принца

Наследник королевства

Есть белый конь

Красив

Влюблен без памяти

Хорошо танцует

Галантен

Верен

Готов прощать шалости

Будет красиво ухаживать

Гол как сокол

Ходит пешком

Урод

Не обращает на меня внимания

Не умеет танцевать

Хам

Кобель

Ревнивец

Не будет ухаживать

Игра в принцессу и принца

Разбирается в камнях

Живет в Екатеринбурге

Сразу платит

Покупает регулярно

Готов потратить больше 300000

Приведет друзей

Привык покупать в интернете

Знает чего хочет

Покупает по картинке

Ничего не понимает в камнях

Живет в другой стране

Платит через год

Купит один раз

Не готов платить

Никому не расскажет

Никогда не покупал в интернет

Не умеет выбирать

Нужно несколько визитов

Игра в принцессу и принца

На примере ювелирки

Разбирается в камнях

Живет в Екатеринбурге

Сразу платит

Покупает регулярно

Готов потратить больше 300000

Приведет друзей

Привык покупать в интернете

Знает чего хочет

Покупает по картинке

Ничего не понимает в камнях

Живет в другой стране

Платит через год

Купит один раз

Не готов платить

Никому не расскажет

Никогда не покупал в интернет

Не умеет выбирать

Нужно несколько визитов

Игра в принцессу и принца

На примере ювелирки

Микроскоп

Человечество начинает новую жизнь среди

звезд

Чужаки захватывают многочислен-ные звездные

системы

Массовое заселение

чужой сферы дайсона

Человечество угасает

изолированное и одинокое

Исследовательский корабль находит сферу дайсона

Солнечные вспышки

уничтожают человеческие поселения

События

Сцены

Эпохи

Расстроилась Конверсия в в

открытие

Кончились все памперсы

Найду в интернете

Сегодня никто не доставляет

Нашла сайт, гарантирующий

доставку в течении двух

часов

CTR

Листинг Карточка товары

Метрики

Экраны

История

Кто я такой, и что я здесь делаю?

Что он увидит?

Что он должен понять / сделать?

Что нам нужно на выходе?

Как человек попал сюда? Какой у него мотив?

Кто я такой, и что я здесь делаю?

Что он увидит?

Что он должен понять / сделать?

Что нам нужно на выходе?

Как человек попал сюда? Какой у него мотив?

Трансформация

Типовой сценарий

Типовой сценарий

Герой Обычная жизнь (бездействие)

Проблема (иногда неосознанная) Самостоятельная неудачная попытка решения

Узнает о нас (волшебная альтернатива) Пробует пользоваться

Профит! Жизнь меняется! (получается ценность) Хэппиэнд

Долго и счастливоМечта

Герой Обычная жизнь (бездействие)

Проблема (иногда неосознанная) Самостоятельная неудачная попытка решения

Узнает о нас (волшебная альтернатива) Пробует пользоваться

Профит! Жизнь меняется! (получается ценность) Хэппи-энд

Долго и счастливоМечта

Типовой сценарий

Дельта = ценность

Герой Обычная жизнь (бездействие)

Проблема (иногда неосознанная) Самостоятельная неудачная попытка решения

Узнает о нас (волшебная альтернатива) Пробует пользоваться

Профит! Жизнь меняется! (получается ценность) Хэппи-энд

Долго и счастливоМечта

Типовой сценарий

Алексей Кулаков kulakov@gmail.com

+7 912 688 81 19