Проектирование интернет-проектов

28
Проектирование интернет-проектов © 2013 Интернет-агентство Redsoft +7 (495) 518 4067 [email protected]

Upload: alex-shishkin

Post on 04-Jun-2015

929 views

Category:

Marketing


1 download

DESCRIPTION

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

TRANSCRIPT

Page 1: Проектирование интернет-проектов

Проектированиеинтернет-проектов

© 2013 Интернет-агентство Redsoft +7 (495) 518 [email protected]

Page 2: Проектирование интернет-проектов

Автора!

Шишкин Алексей

Основатель интернет-агентства Redsoft разработка и поддержка интернет-проектов

Основатель UX-Designнезависимое проектирование интернет-проектов и мобильных приложений

Руководитель проекта Joomla.ruпортал русского сообщества CMS Joomla!

Page 3: Проектирование интернет-проектов

Цель проектирования

Главная цель проектирования - не потерять суть проекта

Суть проекта - дать благо потребителю

● Синхронизировать понимание заказчика и разработчиков о сути проекта

● Уменьшить погрешность в оценке сроков и стоимости разработки● Ввести контроль за бюджетом проекта до начала разработки

Спрашивайте себя каждый день:

Для чего мы это делаем?

Page 4: Проектирование интернет-проектов

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

Page 5: Проектирование интернет-проектов

● Целевая аудитория (социально-демографические, психологические характеристики и

географическое положение)

● Конкуренты: прямые и непрямые, зарубежные аналоги (список и SWOT-анализ)

● Цели и задачи сайта и цели бизнеса (SMART)

● Пожелания и требования клиента к сайту (дизайн, структура и информация, функционал,

администрирование, CMS, технологии, платформы, верстка, интеграция с системами,

языки и т.п.)

● Какие имеются материалы, кто их готовит и когда будут готовы (если еще нет)

● Кто отвечает за проект со стороны клиента, кто принимает финальное решение (ЛПР) со

стороны клиента

1.1. Сбор требований клиента, видение проекта

Page 6: Проектирование интернет-проектов

● Определить УТП клиента

● Выводы из анализа конкурентов (возможности на рынке, извлеченные идеи и т.д.)

● Определить недостатки и достоинства сайтов конкурентов

● Определить недостатки и достоинства существующего сайта (если есть сайт)

● Анализ ЦА

- мотивы (потребность),

- ожидания от использования,

- цели,

- область знания.

1.2. Анализ сайта и бизнеса клиента и конкурентов

Page 7: Проектирование интернет-проектов

1.3. Создание концепции (на основе пп. 1.1, 1.2)

Концепция сайта:

● Цели и задачи сайта

● Целевая аудитория

● Цели пользователей

● Описание концепции:

"<Название продукта/проекта> это <категория продукта> для

<целевая аудитория> который <основная задача> посредством

<уникальность>"

Page 8: Проектирование интернет-проектов

2. АНАЛИЗ UX

Page 9: Проектирование интернет-проектов

2.1. Персонажи и User Stories

● Создать описания персонажей (ключевые представители основных групп ЦА)

- имя и фотография,

- цели,

- социальное положение,

- уровень подготовки,

- описание условий взаимодействия с сайтом,

- цели и проблемы

● Составить User Stories - карточки со списками или таблицу "Цель - Проблема - Решение"- Выписать цели пользователей (из карточек персонажей)

- Определить проблемы пользователей

- Решение проблемы (определить что необходимо для решения проблемы - информация, функционал и т.п.)

● Расставить приоритеты по пользователям и их целям

● Отобрать пользователей, наиболее важных для проекта.

Page 10: Проектирование интернет-проектов

2.1.1. Описание персонажа: пример

Проект: электронная библиотека

Page 11: Проектирование интернет-проектов

Проект: социальная сеть владельцев домашних животных

2.1.2. User stories: Задача-Проблема-Решение

Page 12: Проектирование интернет-проектов

Проект: социальная сеть владельцев домашних животных.

Цель: выбрать собаку

Проблема: Почти ничего не знает о собаках, не знает что именно хочет

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

При написании этого сценария были придуманы идеи: рубрикатор в Зоопедии, блок «Читайте также», ссылки на продавцов со страницы определенной породы.

2.1.3. User stories: Пример

Page 13: Проектирование интернет-проектов

2.1.4. User stories: Пример

Page 14: Проектирование интернет-проектов

2.2. Карта сайта

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

Page 15: Проектирование интернет-проектов

2.3. Карта функционала и список функционала

● На основе user stories создается карта функционала по разделам, со связями, с учетом

статуса пользователя

● Список функционала составляется для разработчиков

Page 16: Проектирование интернет-проектов

Качественный предпроектный анализ – гарантия того, что сайт будет сделан именно для целевой аудитории (ЦА), под её потребности, а не так, как придумает разработчик/клиент.

2. Результаты

Набор документов:

● Документ с карточками персонажей

● User Stories

● Карта функционала

● Список функций

● Карта сайта

● Задание на разработку контента

Page 17: Проектирование интернет-проектов

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

Page 18: Проектирование интернет-проектов

● Начать с прототипа посадочной страницы (карточка товара, страница статьи и т.п. - не всегда с главной)

● Согласовать с клиентом первую созданную страницу

● Прототипы главного меню

● Прототип шапки сайта

● Прототипы меняющихся блоков (contextual areas)

● Протестировать прототип по пользовательским сценариям

3. Создание прототипов

Результаты

Набор интерактивных прототипов (Axure), описывающих все типы страниц сайта

Page 19: Проектирование интернет-проектов

Примеры прототипов

Прототип Дизайн

Page 20: Проектирование интернет-проектов

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

Page 21: Проектирование интернет-проектов

Техническое задание должно включать:

● Результаты всех предыдущих этапов

● Описание функционала для каждого прототипа

● Информация о технических требованиях к системе

Техническое задание отличается от традиционного технического задания:

● написано языком, понятным неподготовленному пользователю (за исключением функциональных требований, предназначенных для разработчиков).

● содержит больше информации КАК будет сделана система, а не требования к ее работе

Формат документа - PDF Объем - в среднем от 100 до 300 страниц + приложения

5. Техническое задание

Page 22: Проектирование интернет-проектов

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

Page 23: Проектирование интернет-проектов

Ошибка №1

UX-Design = UI Design = дизайн интерфейсов

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

Основная задача проектирования - не прототипы, а идея проекта, которая может быть формализована как в прототипах, так и в других формах - скетчах, ТЗ и тп

Проектирование - это про дизайн

Page 24: Проектирование интернет-проектов

Ошибка №2

Проектирование - панацея!

Бессмысленно или сложно применять проектирование если:

● У заказчика нет понимания бизнеса или сути проекта ● У проекта нет идеи, которая описывается одной фразой● У заказчика денег на проектирование или проект низкобюджетный

Проектирование - на все случаи жизни

Page 25: Проектирование интернет-проектов

Ошибка №3

Прототипов - достаточно

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

Прототипы спасут мир

Page 26: Проектирование интернет-проектов

Ошибка №4

Прототипы используются в дизайне “один в один”

Арт-директор, проетировщик и руководитель проекта могут вносить изменения в проект на этапе дизайна уже после утверждения прототипов и начала проектирования

Шаг вправо, шаг влево - расстрел

Page 27: Проектирование интернет-проектов

1. Делайте мир лучше, дайте благо потребителю своим проектом.

2. Думайте как владелец проекта, думайте как его потребитель

3. Предлагайте полезные идеи заказчику. Это поможет развиваться вам самим

4. Если не принимает идеи - не спорьте, это его проект. Не причиняйте ему добро насильно

5. Сделали мир лучше? Продолжайте в том же духе!

Советы проектировщикам

Page 28: Проектирование интернет-проектов

Вопросы?

© 2013 Интернет-агентство Redsoft +7 (495) 518 [email protected]