Разработка сайтов

Зачем нужно проектирование сайта?

Проектирование сайта — это создание проекта сайта с учетом целей и задач компании, методов их достижения и итогового вида сайта.
Проще это архитектурный проект вашего дома со всеми расчетами, чертежами помещений, электрики и других элементов.
В этой статье мы постараемся доступно объяснить собственникам сайтов для чего нужно проектирование, этапы и некоторые нюансы в работе с их проектами
Автор: Владимир Завьялов
Опубликовано: 21.11.2018

Этапы проектирования сайта: от интервью до передачи всех материалов

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

1. Интервью и подготовка к проектированию сайта Формирование и проведение интервью (по тематике от 90 вопросов)
Анализ сайта (технический, оптимизация и т.д)
Анализ конкурентов (ТОП-10 конкурентов и т.д)
Анализ трафика (Трафик, источники и стратегия привлечения)
Сбор семантического ядра (ключевые слова для сайта)
Маркетинговый анализ (портреты пользователя, спрос и т.д)
Создание историй (задач) для сайта
Контент материалы для проектирования (лого, корпоративный стиль, фото, видео, цены, баннеры и т.д)
2. Проектирование Информационной архитектуры сайта (структура Создание карты страниц сайта
Создание информационной структуры сайта (с учетом семантического ядра)
3. Проектирование макетов страниц сайта Создание основных элементов Futer и Header сайта
Создание блоков страниц сайта с учетом предусмотренных функций и задач
Юзабилити (удобство использования сайта)
4. Проектирование взаимодействий на сайте Проектирование взаимодействий внутри сайта (корзина, склад и т.д)
Проектирование взаимодействие с внешними ресурсами (Bigqwery, 1С и т.д)
5. Подготовка документации Рекомендации и подготовка данных для визуального дизайнера
Рекомендации и подготовка данных для верстальщика
Рекомендации и подготовка данных для программистов
6. Презентация прототипов (макетов) сайта заказчику Презентация первоначальных макетов с целью синхронизации понимая видения сайта.
Итоговая презентация всех принятых решений
7. Передача проектирования заказчику Данные, собранные в интервью и подготовке к проектированию
Раскадровка прототипов страниц сайта
Документация к проекту







Что вам нужно знать про макеты прототипов?

Макеты могут сильно отличаться друг от друга. Это зависит от методики прототипирования, собранной информации и компетенции проектировщика. Что бы вам было понятнее поделим их на 3 типа и приведем наглядные примеры.

Общее макетирование

Общее макетирование характерно блоками без каких-либо данных. Только условные обозначения. Редко подписывают функции, которые должен выполнять блок. На практике мы ее не используем. Такие макеты имеют обычно больше вопросов чем ответов. Считаем такую форму проектирования позволительной только в случае каких-то очень общих объяснений, приведение примера или показать форму блока.  Для проектирования сайта такая форма будет не эффективна, так как детально не прорабатывает решения в проекте исходя из его целей и задач.

Пример сделали специально для этого типа макетов.

Пример общего макетирования

Детальное проектирование с интерактивными элементами макетов сайта

Детальное проектирование полная противоположность. Должна указываться и прописываться вся имеющаяся информация по проекту: категории в меню, тексты, фото, цены, преимущества и т.д. Только Визуальное оформление остается в руках дизайнера. Такой макет, отражает маркетинговые преимущества компании, архитектуру, взаимодействия и другие необходимые детали. По факту это практически ТЗ для визуального дизайнера и часть ТЗ для программиста по взаимодействию элементов. Некоторые из самых необходимые блоков могут быть интерактивными (можно покликать и посмотреть взаимодействие).

В 90% случаях мы делаем именно такие прототипы. Имеют оптимальное соотношение эффективности и цены.

Пример: страница Перфораторы в интернет-магазине SOLIT24

Пример

Детальное интерактивное проектирование макетов сайта

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

Покажем вам короткое видео с примером проектировки 2013 года.

Видео: проектирование интерактивного прототипа сайта

10 преимуществ спроектированного сайта

1. Проработка маркетинговой стратегии развития сайта

Это позволяет сделать интервью. Более 90 вопросов заставляют включиться в проект по максимум понять его преимущества и как вытащить сильные стороны проекта на первый план. Так же он находит много ошибок во взаимодействии и это дает шанс исправить их еще до старта проекта.

2. Отсутствие функций и модулей на сайте которых вы не будете использовать

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

3. Информационная архитектура сайта под ваши задачи

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

4. Поднять свой уровень понимания сайта, с которым вы собрались зарабатывать

Когда менеджер, директор, собственник понимает, как собирается зарабатывать проект это всегда идет в плюс. Главное, что бы такой человек был.

6. Использовать основные гипотезы Юзабилити в проектировке сайта

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

7. Увидеть сайт в макетной форме до его запуска и предусмотреть решения по его улучшению

Заложенная архитектура предопределит вашу конверсию, особенно на малых и средних проектах. Увидеть его заранее и внести коррективы ценно само по себе.

8. Оценить слабые места процессов компании для улучшения их взаимодействия

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

9. Точно узнать цену вашего проекта

Да, после проектирования цена проекта будет ясна на 98%. 2% оставим на дополнительные пожелания клиента.

10. Определить недостающий контент и подготовить к запуску весь нужный проект

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

Бонус: 11 преимущество

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

Всем ли сайтам нужно проектирование?

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

Исключения могут составить быстрые запуски в виде проверки товара, услуги. Состояние, определенное как "Попробовать" (хотя я крайне не поддерживаю такую форму состояния предпринимателя, она снимает ответственность и, по сути, в 99% провальная) или же осознанная проверка темы и переход к созданию полноценного проекта. Различные одностаничники, визитки, маленькие интернет-магазины, личные сайты.

В случае быстрого запуска (под ним мы понимаем запуск проекта максимум за 2 недели со старта, а лучше не более 3х дней) скорость имеет максимальную степень важности. Поэтому в таких случаях, лучше сразу зайти на сайты с готовыми шаблонами и быстро внедрить задуманное.

В любых других случаях поэтапное внедрение данных прототипа, будет более правильным решением.

Какие проблемы возникают при отсутствии проектирования?

Проблемы отсутствие проектирования могут проявиться в многих сферах развития сайта: маркетинг, техническая работы, поисковое продвижение, лидогенерация, увеличение издержек на содержание и управление сайтом, общие затраты. Этот список можно продолжить, но нужно на чем-то остановиться. Вы о них узнаете по мере роста и продвижения проекта, и большинство из них можно было бы устранить на этапе проектирования. Я взял из нашего опыта самые распространённые с которыми сталкивался при аудитах и перепроектировании проектов. Так же я буду указать какую сферу оно задевает.

1. Отсутствие семантического ядра. (SEO, структура сайта, юзабилити)

Важность сбора семантики я описывал в отдельной статье можете почитать: Семантическое ядро для сайта: зачем нужно и как использовать правильно?

2. Проблемы в структуре сайта. (Юзабилити, расширение ассортимента, SEO)

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

3. Проблемы при масштабировании проекта. (Технические работы, управление сайтом, финансы)

Когда проект растет появляются новые функции, модули, блоки, категории и другие решения, которые необходимо внедрить.

В итоге большинство таких маневров будут сложными или потребуют полной переделки.

4. Поисковое продвижение проекта. (SEO)

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

5. Создание сайта для заказчика, а не для клиентов заказчика.

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

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

Сколько стоит проектирование сайта?

Для этого нужно понять, какие переменные могут жонглировать ценой.

1. Цена зависит от типа сайта: интернет-магазин, сервисный проект, сайт услуг, информационный портал и т.д.

2. Кто задействован в проектировании? (SEO, копирайтер, проектировщик, технические сотрудники, дизайнер)

3. Размер проекта. Интернет-магазин может быть на 1000 SKU (ед. товаров), а может быть на 10000 или 100000 SKU.

4. Проектирование с нуля или уже существующего сайта.

5. Размер информационной архитектуры (структуры сайта)

6. Тематика проекта

7. Тип проектирования

8. Специальные требования заказчика

9. Предусмотренная автоматизация

10. Подход проектировщика к своей работе

Есть еще как минимум 20 причин, которые объективно влияют на цену проектирования.

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

Самое маленькое время, в которое я укладывал проектировку нового сайта это 60 часов (с учетом работы других членов команды). То есть при стоимости часа в 25$ это 1500$.

Самое долгое время работы было более 300 часов работ на проектирование интернет-магазина.

Заключение

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

 

Давайте обсудим?

Есть светлые мысли по теме? Пишите в комментариях, задавайте вопросы!

закрыть

Ваш комментарий успешно отправлен.