Проектирование — этот, возможно, ключевой этап создания интернет-сайта, отвечает нам на следующие вопросы:
  1. Каковы наши цели — зачем мы делаем сайт? Как мы реализуем поставленные цели?
  2. Как сайт будет выглядеть и работать?

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


Проектирование даёт сайту очень много:
  1. Сильно повышает гарантию достижения результата.
    Только четко сформулировав задачи, определив целевую аудиторию сайта и её потребности, смоделировав взаимодействие сайта и его пользователей, мы можем быть уверены — мы получим то, что нужно.
  2. Экономит время и деньги.
    Исправить ошибку на этапе проектирования довольно просто: меняем несколько кусков текста и схем. Сделать это на этапе разработки дизайна или вёрстки будет уже дороже. Если ошибка обнаруживается на этапе программирования, её исправление может стоить многие тысячи (десятки, сотни тысяч) рублей и занять месяцы, а то и годы.
  3. Позволяет эффективно разделять работу.
    Проектное задание — это вполне самодостаточный документ. Получив его, клиент может сделать сайт своими силами или нанять другую команду, которая, по его мнению, лучше справится с непосредственно разработкой (у нас есть такой опыт, когда мы выполняли только проектирование, а клиент разрабатывал сайт своими силами).
Я бы не рекомендовал пренебрегать проектированием даже для самых маленьких сайтов; для самой распоследней одностраничной визитки это будет исключительно полезно. Потратьте хотя бы несколько дней — не пожалеете.

Исключение, пожалуй, составляют недорогие сайты — с бюджетом 5-15 тысяч рублей — где проектирование становится нерентабельным, увы.

Как проектировать сайт


Проектирование можно условно разбить на четыре основные части:
  1. Целеполагание,
  2. Исследование контекста,
  3. Создание концепции,
  4. Моделирование.

Целеполагание


Целеполагание необходимо для определения того, зачем мы делаем сайт и каких именно результатов хотим достичь. Это служит ориентиром для всей дальнейшей работы: что бы мы ни делали — будь то моделирование, создание интерфейсов, добавление новых функций или изменение старых — всё это должно соответствовать целям.

В будущем они же помогают оценить успешность проекта.

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

Исследование ко��текста


Исследование необходимо для получения информации, которую мы будем называть контекстом сайта. Под контекстом мы понимаем различные обстоятельства, окружающие сайт и способные оказать влияние на его работу. К таким обстоятельствам относятся:
  • Целевая аудитория и её потребности,
  • Характеристика и тенденции области,
  • Конкуренты и их деятельность,
  • Опыт других проектов,
  • Законодательные или иные ограничения,
  • Другие факторы влияния, в зависимости от тематики проекта.
Польза исследования контекста

Контекст проекта помогает нам понять целевую аудиторию и то, каким нужно сделать сайт: как его позиционировать, какая информация на нём должна быть и на каком языке он должен говорить с ЦА (это называют коммуникативной стратегией), как он будет отличаться от конкурентов (естественно, в выгодную сторону).

Кроме того, исследование погружает команду проекта в тему, позволяет где-то даже на подсознательном уровне видеть/принимать правильные решения.

Лучше всего, конечно, исследование помогает понять аудиторию:
  • Как с ней общаться: какие слова использовать в «разговоре» с ней, как называть свой продукт или услугу (возможно, нужно использовать профессиональный сленг, или наоборот, нарочито упрощённую терминологию), обращаться ли к ней на «вы» или на «ты».
  • Каковы её потребности: что приоритетно, что необязательно, но желаемо, что нельзя делать ни в коем случае.
Где брать данные

В идеале, данные о контексте мы должны получить от клиента, но если таких данных у клиента нет, то исследование контекста предстоит провести самим.

Для исследования я советую использовать два метода, которые лучше всего зарекомендовали себя на всех без исключения проектах, которые мы делали:
  • Исследование доступных источников — литература, Интернет-ресурсы и так далее.
  • Интервью с ключевыми действующими лицами — пользователями, экспертами.
Предвижу комментарии: дескать, самостоятельное исследование рядом не стояло с профессиональными маркетинговыми исследованиями — так зачем тратить время и ресурсы? На то есть несколько причин:
  • Без данных о контексте ваши шансы сделать хорошо пользователю стремятся к нулю.
  • Даже самостоятельное исследование даёт полезную информацию, пусть и в меньшем объёме, нежели профессиональное.
  • И даже если вы настолько неумело проводите исследование (что маловероятно), что не можете получить ответы на вышеобозначенные вопросы, вы всё равно погружатаетесь в контекст проекта и хотя бы подсознательно улавливаете что-то полезное.
Могу сказать по собственному опыту: нам исследование помогало всегда, в любом проекте.

Создание концепции сайта


Отлично: цели поставлены, данные о контексте получены. Пора облачить всю имеющуюся информацию в концепцию (аналог того, что мы сделали в видении, но более подробную). Напомню, под концепцией мы понимаем основные идеи и возможности, заложенные в проект:
  • Что и для кого мы делаем — общая идея и целевая аудитория;
  • Как сайт будет работать и какую информацию содержать;
  • Как сайт будет зарабатывать (если это проект с прямой монетизацией);
  • Каковы будут отличительные особенности сайта (от конкурентов), как он будет позиционироваться;
  • Как сайт будет развиваться после запуска.
Концепция задаёт направление проектированию и помогает, аналогично видению, ещё раз состыковать точки зрения на проект — нашу и клиента.

Моделирование сайта


Моделирование — это создание модели сайта, которая описывает функциональные возможности и информационную структуру.

Функциональная часть модели

В функциональной части модели мы описываем возможности, которые сайт предоставляет своим пользователям: например, выкладывать, группировать и комментировать фотографии (социальная сеть) или заказывать и оплачивать товар (интернет-магазин). Важно понимать, что возможности являются инструментами решения задач. Если придуманная возможность не решает ни одну из задач — это может означать, что она лишняя. В проектном задании мы описываем возможности на достаточно высоком уровне абстракции — не так детально, как мы сделаем это в «Техническом задании на программирование», поскольку здесь это просто не требуется.

Информационная структура

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

Далее, прорабатываем схему раздела — это более глубоко и детально проработанная схема (по сравнению с информационной структурой сайта), показывающая навигацию по разделу, связи и переходы между подразделами. Схема раздела в идеале включает следующие элементы:
  • Задачи — какие из ранее поставленных задач решает раздел. Например, раздел «Фотографии» в социальной сети решает задачу обмена информацией между друзьями и последующего общения;
  • Сообщения — это в буквальном смысле сообщения, которые раздел или его часть передаёт посетителю. Например, сообщение приветствия «Привет, ты на портале ХХХ! Мы рады видеть тебя здесь» или «Эй, это наш лучший товар — попробуй, закажи сейчас и убедись в этом сам!».
    Сообщения бывают разных типов; наиболее часто встречающиеся: рекламные, призывы к действию, уведомления и имиджевые сообщения.
  • Функциональные элементы — элементы интерфейса, дающие возможность посетителю выполнить какую-то операцию. Например, функциональным элементом является форма для ввода сообщения, позволяющая отправить сообщение, или кнопка в интерфейсе, сохраняющая сделанные изменения.
  • Варианты поведения посетителя — предположения о том, что посетитель сайта может или должен сделать после изучения интерфейса или отдельных его частей.
Мы обычно делаем такие схемы в виде mind maps — очень удобно, надо сказать.

Резюме


Как обычно, краткие выводы:
  1. Обязательно проектируйте любой сайт. Если не умеете, то самое время начать учиться.
  2. Проектирование полезно: оно повышает качество сайта, экономит время и деньги.
  3. Проектирование — это, прежде всего, правильная постановка задачи, а затем вытекающие из неё исследование, концептуальное и инженерное моделирование.
P.S.: Статья эта, очевидно, обзорная, для затравки, поскольку тему проектирования раскрыть в одной статье нереально. Практически любая мысль из этой статьи была неоднократно подтверждена нашим личным опытом, и обо всём мы расскажем позже, подробнее и с примерами.

Если вам эта статья показалась полезной, отпишите в комментариях, о каких этапах проектирования вы хотели бы узнать подробнее.