Download - Hot Prototyping Rit 2008
![Page 1: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/1.jpg)
Hot Prototyping. As Hot As Possible
Артем
Мошков
![Page 2: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/2.jpg)
Причиной
горячего
прототипирования
может
стать
•
Нехватка
требований
•
Нехватка
времени
•
Нехватка
ресурсов
При
горячем
прототипировании
люди
ориентируются
на опыт, а не на методики.
Я
хочу
показать
методики
для
приобретения
опыта
![Page 3: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/3.jpg)
Система, которую
вы
создаете, это
не
proof of concept, а
рабочий
инструмент, дающий
преимущество.
Поэтому, чем
раньше
он
начнет
работать, тем
лучше.
![Page 4: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/4.jpg)
Обязательный и неизбежный сбор данных
![Page 5: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/5.jpg)
Несите
с
собой
этот
тезис:
При
разработке
ресурса
мы
отталкиваемся
от потребностей
целевого
пользователя
в
соответствии
с
бизнес-требованиями
Заказчика
![Page 6: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/6.jpg)
1. Определение
бизнес-целей
заказчика
Требуется
четко
и
конкретно
выяснить
основные
бизнес- цели
Заказчика
•
Относительно
его
деятельности
в
целом•
Относительно
предполагаемого
к
разработке
Интернет-ресурса
![Page 7: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/7.jpg)
Бизнес-требования
составляют
основу
и
авторитетный
источник для
всей
дальнейшей
разработки
Бизнес-требования
определяются
компетентными представителями
компании-Заказчика
под
чутким
контролем
Исполнителя;
Поставленные
цели
должны
соответствовать
следующим критериям:
•
сосредоточены
на
результате, а не на действиях;•
непротиворечивы;
•
конкретны;
•
измеряемы;
•
увязаны
по
времени;•
достижимы.
![Page 8: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/8.jpg)
1. Использование
данных
о
бизнес-целях заказчика
На
каждом
последующем
этапе
проектирования
мы должны
обращаться
к
поставленным
целям
и
отталкиваться
только
от
них
![Page 9: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/9.jpg)
2. Определение
целевой
аудиторииПри
анализе
каждой
целевой
группы
требуется
оценить:
−Возрастные
рамки−Пол−Предпочтения:
•
В
графическом
дизайне
•
К
стилю
изложения
информации
•
К
форматам
представления
данных
•
Интернет-ресурсам;
−Опытность, обучаемость;−Значимость
аудитории
для
компании
(в у.е.)
−Культурологические
особенности−Прочие
специфические
особенности, влияющие
на
взаимодействие
пользователя
с
ресурсом
![Page 10: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/10.jpg)
2. Использование
данных
о
целевой аудитории
Анализируем
данные, думаем.
Распределяем
ЦА
по
информационным
срезамОпределяем
важность
каждого
среза
согласно
весу
Создаем
персоны, являющиеся
отклонениями
от типовых
срезов
![Page 11: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/11.jpg)
Пример
определения
ЦАДва
среза
одного
информационного
поля
![Page 12: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/12.jpg)
3. Создание
пользовательских
сценариев
Пользовательские
сценарии
определяют
те
задачи, которые
должен
решать
пользователь
на
данном
ресурсе
Сценарии
должны
отражать
только
бизнес-задачи
и описывать
функциональные
требования
к
ресурсу.
Взаимодействие
пользователя
с
интерфейсом
на
этом этапе
не
решается, ввиду
полного
отсутствия
каких-либо
интерфейсов.
Удобно
при
разработке
сценариев
указывать
тип конечной
информации, получаемой
пользователем.
![Page 13: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/13.jpg)
3. Использование
пользовательских сценариев
По
каждой
целевой
группе
составляем
матрицу потребностей
в
одной
колонке
которой
Потребности, в
другой
–
конечная
информация.
При
больших
объемах
данных
матрицу
потребностей можно
оптимизировать
дельфийским
методом, привлекая
заинтересованных
лиц
Заказчика
и
экспертов
исполнителя
Строим
ментальную
карту
или
другим
быстрым (привычным) способом
систематизируем
требования
целевой
аудитории
![Page 14: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/14.jpg)
Пример
сценария
для
представителя
СМИ
Типовые
задачи, которые
журналист
может
решать
на сайте
–
Журналист
хочет
найти
детали
новости, известной
ему
в
общих
чертах– Журналист
ищет
информацию
о
новых
проектах
компании
–
Журналист
хочет
узнать
больше
о
компании, чтобы
понять,
стоит ли о ней писать–
Журналист
хочет
найти
специалиста, к
которому
можно
обратиться
за
комментариями
![Page 15: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/15.jpg)
Фрагмент
матрицы
потребностей
![Page 16: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/16.jpg)
Расчет
весов
информации
Ранжирование
целевых групп
по
приоритетности
Веса
информационных блоков
•Новый
клиент
- 7•Журналист
- 6•Партнер
- 5•Существующий
клиент
- 4•Соискатель
- 3•Сотрудник
- 2•Конкурент
- 1
•Примеры
работ
- 19•О компании - 15•Услуги
- 14•Контакты
- 14•Список
клиентов
- 12•Новости
- 9•Вакансии
- 5•Технологии
- 4
Расчет
веса
информационных
блоков
производится
по количеству
запросов
от
каждой
целевой
группы
с
учетом
веса
самой
группы
![Page 17: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/17.jpg)
4. Сбор
данных
для
анализаЖелательно
собрать
данные
для
проведения
аналитики, а
именно:Ресурсы, в
которых
заинтересованы
ЦА;
Интернет-ресурсы
мировых
лидеров
отрасли;
Интернет-ресурсы
отечественных
лидеров
отрасли;
Интернет-ресурсы
прямых
конкурентов;
Эти
данные
полезны
как
для
проведения предварительного
анализа
при
оценке
объемов
работ, так
и
для
более
детального
анализа, проводимого
при проектировании
Интернет-ресурса
сотрудниками
Исполнителя
![Page 18: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/18.jpg)
Определить
цели
анализируемого
ресурса
Определить
ЦА
анализируемого
ресурса
–
Делать
акцент
на
совпадающих
ЦА
−
Выписать
несовпадающие
(может
быть
что-то
упустили
ранее?)
Определить
критерии
и
сценарии
для
тестирования
Провести
Usability-тестирование
по
критериям
и
сценариям.
−
Основная
ЦЕЛЬ: найти
на
исследуемых
ресурсах
удачные решения, подходящие
для
разрабатываемого
ресурса, удовлетворяющее
выбранным
ЦА
и
составленным
кейсам.
−
НЕ
заниматься
КРИТИКОЙ
ресурса, НЕ
искать
то, что
можно
исправить
и
как.
В
результате
показать
лучшие
решения, статистику, дать
рекомендации.
Что
анализировать
![Page 19: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/19.jpg)
5. Сформировать
видение
решенияВидение
решения
должно
включать
в
себяОбщее
видение
проектаВидение
по
дизайнуВидение по структуреВидение
по
программным
модулямВидение по подаче контента
А такжеВидение
по
срокам
разработкиВидения
по
схеме
организации
ресурсов
(напр., зонтичная
схема)Видение
по
качеству
ресурсов
(уровень
реализации
версий)
Видение
решения
и
результаты
прототипирования
явятся
достаточными
артефактами
для
разработки
ресурса
![Page 20: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/20.jpg)
Непосредственно прототипирование
![Page 21: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/21.jpg)
Что
есть
прототип?Прототип
–
макет
сайта, визуальное
отображение
пользовательских
сценариев.
Прототипировать
можно
экраны
сайта. Это горизонтальное
прототипирование.
Прототипировать
можно
взаимодействие. Это вертикальное
прототипирование.
![Page 22: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/22.jpg)
Как
прототипировать?На
бумаге.На
бумаге, на
доске,
на
карточках. Это
могут
быть
скетчи
экрана
целиком, схемы
переходов, объединение кластеров, дизайн
микро-элементов.
Это
быстро
и
дешево. И не жалко.
С
помощь
case-средствДля
быстрого
прототипирования
не
всегда
удобно. У них
достаточно
емкие
протоколы, которым
нужно
следовать. Это
долго.
С
использованием
HTML
Удобно
для
click-through прототипов
и
продумывания дизайна
микроэлементов.
![Page 23: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/23.jpg)
С
чего
начать?С
обработки
имеющихся
данных
Раскадровка
работы
ЦА
Подготовка
набора
экранов, необходимых
для
решения задачи
Определение
весов
и
повторений
экранов
Принятие
решений
![Page 24: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/24.jpg)
Скетчи!При
наличии
основных
компонентов
появляется
всеми
любимая
сеткаСетка
–
это
применение
известных
паттернов
размещения
элементов
Это
также
статистика
«любимых»
и
«слепых»
мест
на
экране
Используйте
версированное
прототипированиеЭто
не
версии
в
буквальном
смысле. А
разные
уровни
детализации. Которая
наращивается
в
ходе
работы.
Помните, что
скетчи
имеют
предел
детализации. Дизайн
в
скетчах
не
присутствует.
Далее
переходим
к
микро-дизайну
совокупностей
компонент (т.н. неделимому
самодостаточному
функционалу)
![Page 25: Hot Prototyping Rit 2008](https://reader033.vdocument.in/reader033/viewer/2022052621/557f8d7fd8b42a2f198b48c9/html5/thumbnails/25.jpg)
Скетчи!