Бумажное прототипирование

Гибкое прототипированиедля гибкой разработки

AgileBaseCamp’11, Днепропетровск

Кто я?

Макс ГапоновCertified Scrum Product OwnerAgile [email protected]

О чем мы будем сегодня говорить?

Что такое прототип?

Прототип — это модель будущей системы

В каких областях используется прототипирование?

• Архитектура• Инженерное дело• Автомобилестроение• Искусство• Программное обеспечение

Даже этот доклад сначала был прототипом :)

Для чего строят прототипы?

• Получить больше данных о продукте• Получить обратную связь

• Получить информацию о возможных сложностях при производстве

• Получить возможность что-то изменить до производства

Прототип - это вид документации

• Значительно более компактный, чем текст

• Не требует много времени на ознакомление• Упрощает процесс разработки• Сокращает время разработки

Прототип - вид коммуникации

— Ну что, мы друг друга поняли?

— Да-а!!!

Что нужно для прототипирования?

Для прототипирования необходимо понять принцип использования продукта:

Как рождается продукт?

Стратегия

Набор возможностей

Структура

Компоновка

Поверхность

Место и время для прототипирования

Стратегия

Набор возможностей

Структура

Компоновка

Поверхность

Прототипы

Существуют разные способы создания прототипов

• Бумажное прототипирование• HTML

• PowerPoint/Keynote

• Axure RP Pro

• Excel

Почему бумажные прототипы?

Это просто!

Кто из вас умеет рисовать?

А кто умел рисовать в детстве?

Главное - чтобы вас поняли :)

Бумажные прототипы имеют достаточную детализацию

Бумажные прототипы можно делать вместе!

Какие инструменты необходимы?

• Бумага• Прозрачная пленка• Стикеры• Ножницы• Удаляемый скотч• Ручки, карандаши, фломастеры

Простой пример: поиск по сайту

Что сделать:

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

Как продемонстрировать:

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

Прототип поиска

Посмотрели, подумали и добавили подробностей...

Пример посложнее: фотогалереи

Что сделать:

Пользователь может создавать и редакторовать фотогалереи для того, чтобы делиться своими фотографиями с друзьями.

Как продемонстрировать:

Создание фотогалерей; загрузка фотографий; подписывание фотографий; выбор, кто из друзей будет иметь доступ к галереям; просмотр фотогалерей.

Скетчборды

Скетчборд для фотогалерей

Прототип редактирования фотогалереи

Добавляем фотографию

Фотография добавлена

Добавляем подпись к фотографии

Подпись добавлена

Настраиваем доступ к фотогалерее

Тестирование прототипов

Что нужно для тестирования?

• Целевая группа• Задания для тестирования• Помощники

Какие помощники нам нужны?

ФасилитаторСледит за тем, чтобы все было, как надо :)

КомпьютерМанипулирует прототипом, отвечая на действия

тестировщика

НаблюдательСлушает, молчит и записывает

Из чего состоят задания для тестирования?

• Цель• Входные данные• Предполагаемые шаги пользователя• Заметки

Подведение итогов тестирования

• Все ли задания выполнены успешно?

• Были ли у тестировщиков замечания?• Что записали наблюдатели?

Дорабатываем поиск после тестирования

Дорабатываем фотогалереи после тестирования

Переименование галереи

Переворот фотографий

Фотографии переворачиваются

А потом опять тестируем... и опять дорабатываем...

Прототипирование — это процесс :)

Что почитать?

• Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces, Carolyn Snyder

• Protoryping: A Practitioner’s Guide, Todd Zaki Warfel

Спасибо!

Макс ГапоновCertified Scrum Product OwnerAgile [email protected]