Презентация к докладу "Проектирование интернет-проектов" на конференции IBC Russia 2013

1. Проектирование
интернет-проектов
© 2013 Интернет-агентство Redsoft
+7 (495) 518 4067
info@redsoft.ru

2. Автора!
Шишкин Алексей
Основатель интернет-агентства Redsoft
разработка и поддержка интернет-проектов
Основатель UX-Design
независимое проектирование интернет-проектов и
мобильных приложений
Руководитель проекта Joomla.ru
портал русского сообщества CMS Joomla!

3. Цель проектирования
Главная цель проектирования - не потерять суть проекта
Суть проекта - дать благо потребителю
●
Синхронизировать понимание заказчика и разработчиков о сути
проекта
●
Уменьшить погрешность в оценке сроков и стоимости разработки
●
Ввести контроль за бюджетом проекта до начала разработки
Спрашивайте себя каждый день:
Для чего мы это делаем?

4. 1. СБОР ИНФОРМАЦИИ
И СОЗДАНИЕ КОНЦЕПЦИИ

5. 1.1. Сбор требований клиента, видение проекта
●
Целевая аудитория (социально-демографические, психологические характеристики и
географическое положение)
●
Конкуренты: прямые и непрямые, зарубежные аналоги (список и SWOT-анализ)
●
Цели и задачи сайта и цели бизнеса (SMART)
●
Пожелания и требования клиента к сайту (дизайн, структура и информация, функционал,
администрирование, CMS, технологии, платформы, верстка, интеграция с системами,
языки и т.п.)
●
Какие имеются материалы, кто их готовит и когда будут готовы (если еще нет)
●
Кто отвечает за проект со стороны клиента, кто принимает финальное решение (ЛПР) со
стороны клиента

6. 1.2. Анализ сайта и бизнеса клиента и конкурентов
●
Определить УТП клиента
●
Выводы из анализа конкурентов (возможности на рынке, извлеченные идеи и т.д.)
●
Определить недостатки и достоинства сайтов конкурентов
●
Определить недостатки и достоинства существующего сайта (если есть сайт)
●
Анализ ЦА
- мотивы (потребность),
- ожидания от использования,
- цели,
- область знания.

7. 1.3. Создание концепции (на основе пп. 1.1, 1.2)
Концепция сайта:
●
Цели и задачи сайта
●
Целевая аудитория
●
Цели пользователей
●
Описание концепции:
"<Название продукта/проекта> это <категория продукта> для
<целевая аудитория> который <основная задача> посредством
<уникальность>"

8. 2. АНАЛИЗ UX

9. 2.1. Персонажи и User Stories
●
Создать описания персонажей (ключевые представители основных групп ЦА)
- имя и фотография,
- цели,
- социальное положение,
- уровень подготовки,
- описание условий взаимодействия с сайтом,
- цели и проблемы
●
Составить User Stories - карточки со списками или таблицу "Цель - Проблема - Решение"
- Выписать цели пользователей (из карточек персонажей)
- Определить проблемы пользователей
- Решение проблемы (определить что необходимо для решения проблемы - информация, функционал и т.п.)
●
Расставить приоритеты по пользователям и их целям
●
Отобрать пользователей, наиболее важных для проекта.

10. 2.1.1. Описание персонажа: пример
Проект: электронная библиотека

11. 2.1.2. User stories: Задача-Проблема-Решение
Проект: социальная сеть владельцев домашних животных

12. 2.1.3. User stories: Пример
Проект: социальная сеть владельцев домашних животных.
Цель: выбрать собаку
Проблема: Почти ничего не знает о собаках, не знает что именно хочет
Сценарий: заходит на главную страницу,
- находит раздел Зоопедия,
- переходит на главную страницу раздела с рубрикатором по животным и породам, а также
специальным разделом с общей информацией,
- переходит в раздел с общей информацией, где на видном месте есть ссылка на статью о
выборе животного,
- переходит в статью и читает её, в конце статьи видит блок «Читайте также», в котором
видит еще несколько статей с более углубленной информацией,
- делает предварительный выбор из 3х пород собак,
- переходит на главную Зоопедии и открывает страницы с подробной информацией о
выбранных породах, на каждой из страниц он видит ссылки на продавцов этой породы,
окончательно определяется с выбором и
- переходит в магазин.
При написании этого сценария были придуманы идеи: рубрикатор в Зоопедии, блок
«Читайте также», ссылки на продавцов со страницы определенной породы.

13. 2.1.4. User stories: Пример

14. 2.2. Карта сайта
●
На основе карты функционала создается детальная карта сайта (схема всех разделов)

15. 2.3. Карта функционала и список функционала
●
На основе user stories создается карта функционала по разделам, со связями, с учетом
статуса пользователя
●
Список функционала составляется для разработчиков

16. 2. Результаты
Набор документов:
●
Документ с карточками персонажей
●
User Stories
●
Карта функционала
●
Список функций
●
Карта сайта
●
Задание на разработку контента
Качественный предпроектный анализ – гарантия того, что сайт будет сделан именно для
целевой аудитории (ЦА), под её потребности, а не так, как придумает разработчик/клиент.

17. 3. СОЗДАНИЕ ПРОТОТИПОВ

18. 3. Создание прототипов
●
Начать с прототипа посадочной страницы (карточка товара, страница статьи и т.п. - не
всегда с главной)
●
Согласовать с клиентом первую созданную страницу
●
Прототипы главного меню
●
Прототип шапки сайта
●
Прототипы меняющихся блоков (contextual areas)
●
Протестировать прототип по пользовательским сценариям
Результаты
Набор интерактивных прототипов (Axure), описывающих все
типы страниц сайта

19. Примеры прототипов
Прототип
Дизайн

20. 5. ТЕХНИЧЕСКОЕ ЗАДАНИЕ

21. 5. Техническое задание
Техническое задание должно включать:
●
Результаты всех предыдущих этапов
●
Описание функционала для каждого прототипа
●
Информация о технических требованиях к системе
Техническое задание отличается от традиционного технического задания:
●
написано языком, понятным неподготовленному пользователю (за исключением
функциональных требований, предназначенных для разработчиков).
●
содержит больше информации КАК будет сделана система, а не требования к ее работе
Формат документа - PDF
Объем - в среднем от 100 до 300 страниц + приложения

22. ОШИБКИ ПРИ ПРОЕКТИРОВАНИИ

23. Проектирование - это про дизайн
Ошибка №1
UX-Design = UI Design = дизайн интерфейсов
Прототипы, дизайн интерфейса системы - это промежуточные результаты
работы над созданием концепции проекта.
Основная задача проектирования - не прототипы, а идея проекта, которая
может быть формализована как в прототипах, так и в других формах скетчах, ТЗ и тп

24. Проектирование - на все случаи жизни
Ошибка №2
Проектирование - панацея!
Бессмысленно или сложно применять проектирование если:
●
У заказчика нет понимания бизнеса или сути проекта
●
У проекта нет идеи, которая описывается одной фразой
●
У заказчика денег на проектирование или проект низкобюджетный

25. Прототипы спасут мир
Ошибка №3
Прототипов - достаточно
Разработка ТЗ - обязательна для проектов стоимостью выше 200-500 тыс
(регионы/Москва). Прототипы сложно использовать как аргумент в спорах о
функционале

26. Шаг вправо, шаг влево - расстрел
Ошибка №4
Прототипы используются в дизайне “один в один”
Арт-директор, проетировщик и руководитель проекта могут вносить
изменения в проект на этапе дизайна уже после утверждения прототипов и
начала проектирования

27. Советы проектировщикам
1. Делайте мир лучше, дайте благо потребителю своим проектом.
2. Думайте как владелец проекта, думайте как его потребитель
3. Предлагайте полезные идеи заказчику.
Это поможет развиваться вам самим
4. Если не принимает идеи - не спорьте, это его проект.
Не причиняйте ему добро насильно
5. Сделали мир лучше? Продолжайте в том же духе!

28. Вопросы?
© 2013 Интернет-агентство Redsoft
+7 (495) 518 4067
info@redsoft.ru