User Story as UX Method
Transcript of User Story as UX Method
![Page 1: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/1.jpg)
User Stories
UX-подход к
проектированию продукта
Наталья Мануйлова
«ПЕТЕР-СЕРВИС»
![Page 2: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/2.jpg)
User Story around
2
Agile
SCRUM
UCD
UX
Анализ требований Бизнес-анализ
User Stories
![Page 3: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/3.jpg)
User Story is
3
User Stories
Требование к системе
Пользователь Какой?
Задача Какая?
Цель Какую?
Выполняет Достигает
![Page 4: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/4.jpg)
Зачем это надо? Чтобы связать бизнес, разработчика
и пользователя.
Если бизнес диктует требования, разработчики часто не знают,
какую задачу решают.
Если разработчики делают приложение, программный код
окажется важнее задач пользователя.
Пользователь не влияет на процесс разработки. Но это он работает с приложением.
![Page 5: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/5.jpg)
Подопытный продукт Личный Кабинет провайдера интернет
Пакет услуг Triple Play
IP-телевидение Домашний интернет Телефония
Система самообслуживания
Выбор тарифных планов Оплата расходов
![Page 6: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/6.jpg)
Agenda Что делать будем?
□ Найдем пользователя
□ Напишем user stories
□ Определим критерии
□ Сложим общую картину
![Page 7: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/7.jpg)
Роль
Персона
Роль
Пользователи Персоны. Актёры. Роли.
Роль Actor
![Page 8: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/8.jpg)
Павлик больше смотрит кино с ноутбука, потому что с
ноутом можно закрыться в своей комнате.
Телевизор использует только до 7 вечера, пока не
придут предки.
Павлик - фанат игр и многие из них работают через
сервер. Но сетевые режимы интересны только в те
часы, когда на сервере собирается много игроков.
Приемам игры он учится, просматривая ролики на
Youtube и общаясь в соц. сетях.
Рефераты и другие шпаргалки обучающие материалы
активно скачиваются в конце каждой четверти.
Любимый теле-канал – 2х2.
Домашним телефоном не пользуется вообще,
оставляя его бабушке.
Павлик, 14 лет Старшеклассник
“Без друзей меня – чуть-чуть, а с друзьями – много”
Пользователи Персоны. Совсем как живые.
![Page 9: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/9.jpg)
Пользователи Актёры. Actors*.
Просмотр теле-программ
Выбор тарифного
плана
Оплата счетов
Личный кабинет
*См. UML
Actor
![Page 10: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/10.jpg)
Пользователи Actor и Use case
Просмотр теле-программ
Use case Actor
![Page 11: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/11.jpg)
Пользователи User case
Просмотр теле-программ
Use case Роль пользователя
![Page 12: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/12.jpg)
Пользователи User story
Просмотр теле-программ
Задача Роль пользователя
Цель…
![Page 13: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/13.jpg)
Пользователи User story
Роль пользователя
Цель…
Контекст использования
Задача
Просмотр теле-программ
![Page 14: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/14.jpg)
• Для чего они используют наш продукт? Цели и задачи
• Как хорошо они знают предметную область? Уровень мастерства
• Как они им пользуются? Частота и контекст использования
• Насколько хорошо они знают компьютер? Компьютерная грамотность вообще и опыт работ с аналогичными приложениями
Пользователи Атрибуты ролей.
Целевая аудитория (Гео/Демо данные)
5W (Who, Why, What, Where, When)
![Page 15: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/15.jpg)
?
? ?
Теле-зритель
Пользователи Основные роли.
Глава семьи
![Page 16: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/16.jpg)
?
Пользователи Расширенные роли.
Мама, которой важно знать,
чем был занят ребенок в его
«компьютерные часы»
Теле-зритель в пути Теле-зритель со
сложившимися
предпочтениями
?
Старики, чьи дети живут
далеко (часто звонят по
межгороду)
?
![Page 17: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/17.jpg)
Теле-зритель со сложившимися предпочтениями
Компьютер знает поверхностно, в основном
использует только браузер. Имеет десктоп и планшет.
Однако, регулярно проводит время у телевизора, не
любит пропускать любимые передачи и сериалы,
хорошо в них разбирается и смотрит на разных
каналах.
Использует Личный Кабинет чтобы всегда знать, что
будет идти, не пропускать интересные программы и
иметь полную информацию о статусе баланса и всех
своих теле-устройств.
Пользователи Профиль роли.
![Page 18: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/18.jpg)
Павлик больше смотрит кино с ноутбука, потому что с
ноутом можно закрыться в своей комнате.
Телевизор использует только до 7 вечера, пока не
придут предки.
Павлик - фанат игр и многие из них работают через
сервер. Но сетевые режимы интересны только в те
часы, когда на сервере собирается много игроков.
Приемам игры он учится, просматривая ролики на
Youtube и общаясь в соц. сетях.
Рефераты и другие шпаргалки обучающие
материалы активно скачиваются в конце каждой
четверти.
Любимый теле-канал – 2х2.
Домашним телефоном не пользуется вообще,
оставляя его бабушке.
Павлик, 14 лет Старшеклассник
«Без друзей меня – чуть-чуть, а с
друзьями - много»
Любитель игр
Сёрфер
Теле-зритель
Пользователи Роли персон.
![Page 19: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/19.jpg)
Пользователи Личного Кабинета Кто они?
![Page 20: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/20.jpg)
Пользователи Личного Кабинета Кто они?
• Мозговой штурм на бумажках
• Группировка бумажек
• Расширение ролей
• Приоритизация
![Page 21: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/21.jpg)
Agenda Поехали дальше.
Нашли пользователя
□ Напишем user stories
□ Определим критерии
□ Сложим общую картину
![Page 22: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/22.jpg)
Что за история? Формат.
Я как <роль пользователя> хочу <решить задачу>, чтобы <достичь цель>.
![Page 23: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/23.jpg)
Что за история? Процесс.
Карточки • Истории пишутся на бумажных карточках
• Карточки могут сопровождаться условиями,
заметками, рисунками и т.д.
Обсуждения
• Детали и обстоятельства историй обсуждаются в процессе.
Подтверждение
• Акт приемки основывается на описанных критериях.
![Page 24: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/24.jpg)
Как владелец счёта,
я хочу иметь полную информацию
о состоянии услуги,
чтобы принимать решения
о её использовании.
Как телезритель,
я хочу управлять каналами. Как пользователь домашнего
интернет и IP-TV,
я хочу видеть, как распределились
мои расходы между ними,
чтобы решить, посмотреть фильм
через IP-TV или обойтись youtub’ом.
Как родитель,
я хочу видеть статистику с
устройства ребенка,
чтобы знать, на какой именно
канал ушли все деньги за
прошедший период.
Как владелец счёта,
я хочу менять свои
тариф и услуги.
Что за история? Правильные примеры.
![Page 25: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/25.jpg)
Как разработчик ,
я хочу, чтобы были классы
объединения сущностей БД.
Как тестировщик ,
я хочу, чтобы был скрипт
создания структуры БД «с нуля». Как пользователь ,
я хочу убрать колонки
"Начало", "Окончание" и "Период"
в форме “Данные”.
Что за история? Неправильные примеры.
Как пользователь,
я хочу , чтобы таблица
brn_pack_data_accnt_zones
была исторической
![Page 26: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/26.jpg)
Что за история? Масштабируемость.
![Page 27: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/27.jpg)
Как телезритель,
я хочу управлять каналами.
Как владелец счёта и
телезритель, я хочу
отключать подключённые
каналы и подключать новые.
Как телезритель,
я хочу видеть программу
передач на месяц вперед,
чтобы отмечать интересные.
Что за история? Разделение на под-истории
![Page 28: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/28.jpg)
Как глава семьи и
телезритель,
я хочу отключать
подключённые каналы .
Как глава семьи и
телезритель,
я хочу подключать новые
каналы . Как родитель,
я хочу планировать смену
состояния каналов 18+.
Что за история? Разделение на под-истории
Как владелец счёта и
телезритель, я хочу
управлять подключением
каналов.
![Page 29: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/29.jpg)
Бесплатные советы
• Начните с роли\персоны и цели
• Не используйте роли «Пользователь», «Разработчик», «Заказчик»
• Составляйте простые предложения (1 глагол + 1 существительное)
• Не используйте предлоги И, ИЛИ, НО, ЕСЛИ.
• Не используйте условия КРОМЕ, ПОКА, ЕСЛИ.
• Используйте активную форму глаголов
• Не думайте в терминах интерфейса или программирования
• Пишите на обратной стороне пояснения и детали – из них будут формироваться критерии приемки
• Рассматривайте приложение как средство решить проблемы реальных людей
![Page 30: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/30.jpg)
Agenda Поехали дальше.
Нашли пользователя
Написали user stories
□ Определим критерии
□ Сложим общую картину
![Page 31: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/31.jpg)
Что за история? Критерии приёмки на обратной стороне
• Доступен предопределенный
срок (через неделю, с
определённой даты)
• Доступен выбор периода (на
месяц)
• Доступен период времени суток
• Состояние услуги сохраняется и
показывается в списке
• Услуга доступна для чтения
только пользователю с
полными правами.
Как родитель,
я хочу планировать смену
состояния каналов 18+,
чтобы мой юный сын не мог
случайно включить Playboy TV.
![Page 32: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/32.jpg)
Что за история? Критерии приёмки на обратной стороне
• Доступен предопределенный
срок (через неделю, с
определённой даты)
• Доступен выбор периода (на
месяц)
• Доступен период времени суток
• Состояние услуги сохраняется и
показывается в списке
• Услуга доступна для чтения
только пользователю с
полными правами.
Как родитель,
я хочу планировать смену
состояния каналов 18+,
чтобы мой юный сын не мог
случайно включить Playboy TV.
![Page 33: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/33.jpg)
Какой должна быть хорошая история?
• Независимая Вместо написания набора историй об оплате 3 типами банковских карт при оплате напишите одну, а типы карт пусть будут в комментариях.
• Обсуждаемая
Истории – не контракты, все детали не нужны, и могут быть добавлены позже.
• Полезная
Истории должны быть полезны для бизнеса и для конечного пользователя. Не для девелоперов. Sorry…
• Рассчитываемая
Истории используются для планирования спринтов.
• Маленькая
Большие истории сложно оценивать. Нарежьте ее на кусочки.
• Тестируемая Если историю можно протестировать, значит можно сказать что история выполнена. Сравните: Пользователь пользуется кабинетом с легкостью > Пользователь способен выполнить задачу без дополнительного обучения.
![Page 34: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/34.jpg)
Agenda Поехали дальше.
Нашли пользователя
Написали user stories
Определим критерии
□ Сложим общую картину
![Page 35: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/35.jpg)
Что мы будем с этим делать? Backlog
об
язат
ельн
ост
ь
необходимое
более
менее
последовательность
![Page 36: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/36.jpg)
об
язат
ельн
ост
ь
необходимое
более
менее
последовательность
История
Активность
Что мы будем с этим делать? Раскладывать
![Page 37: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/37.jpg)
об
язат
ельн
ост
ь
необходимое
более
менее
последовательность
Управление балансом
Пополнить баланс
Привязать банковскую
карту
Настроить авто-платеж
Увидеть платежи и расходы
Сравнить расходы на виды услуг
Узнать текущий баланс
Увидеть архив расходов
Что мы будем с этим делать?
![Page 38: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/38.jpg)
об
язат
ельн
ост
ь
необходимое
более
менее
последовательность
2 3 1 5
8 7 2
2 1
8
3
3
3
5
4
1 1 1 1 1
1
1 9 4
7 10
4
3 4 1 1 2 2 3 2
Что мы будем с этим делать? Оценивать
![Page 39: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/39.jpg)
об
язат
ельн
ост
ь
необходимое
более
менее
последовательность
2 3 1 5
8 7 2
2 1
8
3
3
3
5
4
1 1 1 1 1
1
1 9 4
7 10
4
3 4 1 1 2 2 3 2 1ый релиз - 39
2ой релиз - 34
3ий релиз - 28
Что мы будем с этим делать? И планировать
![Page 40: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/40.jpg)
об
язат
ельн
ост
ь
необходимое
более
менее
последовательность
2 3 1 5
7 2
2 1
3
5
4
1
4
3 4 1 1 2 2 3 2 1ый релиз - 39
Что мы будем с этим делать? И планировать
![Page 41: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/41.jpg)
Agenda Вроде всё.
Нашли пользователя
Написали user stories
Определим критерии
Сложили общую картину
![Page 42: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/42.jpg)
Что даёт использование user stories
• Понимание задачи
• Правильное решение
• Ясная перспектива проекта
![Page 43: User Story as UX Method](https://reader035.fdocuments.us/reader035/viewer/2022062710/55a5c6161a28abf46d8b4690/html5/thumbnails/43.jpg)
Спасибо !)
Всем хороших выходных
Наталья Мануйлова
«ПЕТЕР-СЕРВИС»