Содержание:
- Рынок разработки сайтов
- Как выбирать digital-продакшн
- Этапы разработки сайта
- Сколько стоит разработка сайта
- Сколько времени займёт разработка сайта
- Чем заказная web-разработка отличается от потоковой
- Почему стоит заключить договор с digital-агентством
Сайт является ядром digital-маркетинга, вместе с соцсетями и мобильными приложениями. От того, насколько он качественно сделан, будет зависеть успех маркетинга в сети. Интернет-ресурс должен стать одним из инструментов по реализации маркетинговой стратегии, работать на цели бизнеса.
Выбор подрядчика — важное решение, поскольку ошибка обойдётся в сотни тысяч рублей.
Рынок разработки сайтов
Согласно данным «Рейтинга Рунета» к середине 2022-года в России насчитывалось 6 926 digital-компаний, большая часть из которых оказывают услуги по разработке сайтов и маркетингу в Интернете. По нашим ощущениям, рейтинг охватывает около 80% рынка, так что финальная цифра еще больше.
Рынок разработки веб-сайтов уже много лет назад перешел во вторую стадию развития. Все компании давно разработали свой первый сайт и определились с пользой, которую приносит виртуальное представительство в сети.
Интернет пестрит лендингами и сайтами, сделанными под копирку по руководству «Анатомии лендинга» и прочих «умных» материалов. Как следствие, большинство сайтов стали условно одинаковыми: похожие компоновки элементов, функциональные и дизайнерские решения.
Поэтому сейчас особенно важно выбрать такого подрядчика, который сделает сайт креативным с точки зрения дизайна, функциональным и решающим задачи вашего бизнеса.
Как выбирать digital-продакшн
Давайте посмотрим, как различные компании выбирают подрядчиков на web-разработку.
Механика выбора зависит от размеров компании заказчика и бюджета проекта:
- Если мы говорим про малый и средний бизнес, то разработку сайтов заказывают не часто, и у компании нет сформированного пула потенциальных подрядчиков. Директор даёт задание маркетологу Марии найти исполнителей, соответственно, она «гуглит» фразы «разработка сайта в Москве» и обзванивает несколько компаний, сайты которых ей понравились.
- У большого бизнеса и больших бюджетов обычно уже есть пул потенциальных подрядчиков и выбор происходит между этими компаниями. Если базы данных нет, то механика выбора иная: отправляют запросы первой десятке рейтинга разработчиков и устраивают внутренний тендер.
Естественно, есть и другие механики — сарафанное радио, когда хорошего разработчика сайтов передают по цепочке, рекомендуя знакомым бизнесменам. А также переходы по копирайтам-ссылкам с понравившихся сайтов.
Формируем шорт-лист
Итак, как составить список подрядчиков, которые могут сделать ваш проект наиболее качественно?
1. Изучите отраслевые кейсы
Исследуйте сайты ваших прямых конкурентов или других компаний вашей отрасли и выберите хорошие сайты, добавляйте разработчиков этих сайтов в пул потенциальных подрядчиков.
Отраслевая экспертиза — это очень важно. В каждом направлении бизнеса — свои нюансы в маркетинге, механике презентации/продаж товаров и услуг. Накопленный разработчиком отраслевой опыт повышает гарантию, что ваш проект будет реализован на должном уровне.
2. Посмотрите рейтинговые сайты
На данный момент в России есть 3 рейтинга, которым стоит доверять: Рейтинг Рунета, Тэглайн и Ruward.
У указанных рейтингов свои методики распределения мест, основанные на разных показателях: обороте агентств, экспертном мнении участников рынка, динамике выхода новых работ, уровне клиентов, но они показывают, в целом, реалистичную картинку digital-рынка России.
Средний и крупный бизнес выбирает подрядчиков из тех, кто присутствует в рейтингах, это один из факторов, почему стоит доверять digital-продакшнам.
Pitcher agency занимает следующие места в Рейтинге Рунета:
- В ТОП-100 лучших дизайн-студий России
- 33 место: рейтинг креативных дизайн-студий России.
- 24 место: рейтинг разработчиков лэндингов.
- 4 место: разработка на фреймворке Yii2.
3. Попросите рекомендации у знакомых
Переговорите со знакомыми, связанными с digital, или с теми, кто имел удачный опыт разработки сайта и может порекомендовать надежных исполнителей для вашего проекта.
4. Запросите отзывы у клиентов разработчика
Не бойтесь попросить контакты клиентов компании, которые могут рассказать вам об опыте взаимодействия и уровне разработчика.
Выбираем победителя
Как сделать финальный выбор digital-агенства на разработку сайтов.
1. Попросите сделать концепт на пресейле
Многие разработчики готовы разработать креативный концепт будущего сайта. Это может быть составление moodboard, разработка прототипов или макета дизайна сайта. Вы сможете оценить креативный уровень и комфорт работы с подрядчиком до заключения договора.
2. Изучите и сравните сметы на разработку web-сайта
Соотнесите планируемый бюджет с предоставленными сметами, уточните детали, проверьте позиции.
Важно не просто разработать интернет-ресурс, а чтобы сайт не затерялся среди многих конкурентов и был не таким, как у всех. Креативная концепция сайта, как и техническая реализация, должна быть «на высоте».
Ниже в статье расскажем о механике оценки разработки.
3. Познакомьтесь с менеджером проекта
Комфорт личного общения — важный параметр. Вы проведете несколько месяцев в коммуникациях с менеджером проекта, пока разрабатывайте веб-сайт. И от того, насколько удачны будут эти коммуникации, зависит успех всего проекта (конечно, не на 100%).
4. Сделайте финальный выбор 😀
Этапы разработки сайта
Через какие этапы процесса разработки вы пройдете рука об руку вместе с вашим подрядчиком:
Кстати, у нас есть статья про рецепт счастливого сотрудничества, где мы рассказываем, на что стоит обратить внимание при разработке сайта.
1. Предпроектный анализ
Первым этапом всегда идет аналитика и сбор данных. Разработчик, совместно с заказчиком, заполняет бриф, выясняет задачи и собирает всю требуемую для разработки сайта информацию.
Расскажите нам:
- О ваших клиентах и маркетинговой стратегии.
- Какие сайты вам нравятся и не нравятся, чтобы дизайнеры лучше поняли, в каком направлении двигаться.
- Опишите задачи цифрового продукта.
Менеджер проекта формализует всю информацию в виде заполненного брифа на разработку сайта.
2. Проектирование
Второй важный этап в разработке — проектирование сайтов. От качества работы на данном этапе зависит успех всего проекта. Проектирование можно разделить на три этапа:
- Создание креативной концепции дизайна.
- UI/UX: прототипирование интерфейсов.
- Техническое проектирование: создание моделей данных и описание процессов.
2.1. Креативная концепция
На этапе создания креативной концепции дизайнер изучает примеры конкурентных сайтов, делает подборку лучших решений отрасли, отсматривает победителей дизайн-конкурсов. Он составляет moodboard, чтобы понять, в каком направлении будет двигаться разработка сайта.
Далее дизайнер создает прототип стартовой страницы, который проходит внутренний контроль у проектной группы и арт-директора.
После внутреннего утверждения прототипа, он анимируется — создается видеоролик, показывающий, как будет выглядеть и работать ваш будущий сайт. Создание видео очень важно, ведь заказчик сможет увидеть каким будет финальный продукт ещё до начала разработки макетов. И оценить креативность концепции.
Креативная концепция создается, в том числе, на основе фирменного стиля компании.
2.2 Интерактивные прототипы страниц
После утверждения креативной концепции у команды проекта и заказчика создаются интерактивные прототипы.
Прототипы — самая понятная часть для заказчика 🙃. Прототипы — это черновые наброски интерфейсов, они наглядно показывают КАК будет работать создаваемый продукт. Можно посмотреть все страницы, понажимать ссылки и осуществить переходы по страницам будущего сайта.
Для несложных цифровых продуктов, таких как лэндинги и корпоративные сайты, прототип — основная часть Технического задания.
2.3 Техническое задание
Далее вся собранная информация формализуется в виде Технического задания (ТЗ). Это важный документ, регламентирующий весь дальнейший процесс разработки: продакшн готовит продукт по ТЗ, а заказчик принимает по нему этапы и результат.
ТЗ должно максимально понятно и емко описать продукт, и здесь главная задача — не ввязнуть в канцелярщину.
Что включается в ТЗ:
- Технические требования.
Языки программирования, используемые фреймворки и CMS, поддерживаемые браузеры и мобильные устройства. - Структуру сайта.
Для лучшего понимания заказчиком и разработчиками, структуру желательно представиться в виде графической схемы. - Интерактивные прототипы страниц.
Прототипы, созданные на предыдущем шаге — неотъемлемая и важная часть техзадания. - Модели данных.
Например, перечень полей, которыми описывается товар в вашем каталоге или данные зарегистрированного пользователя. - Описание логики процессов.
При создании сложных систем, необходимо описывать внутреннюю логику, которую нельзя показать в виде прототипов. Например, можно использовать нотацию EPC .
3. Разработка дизайна
Дизайнер разрабатывает макеты дизайна всего сайта, основанные на прототипах страниц, выполненных в рамках проектирования, а так же в рамках креативной концепции и корпоративного стиля (айдентики) компании.
Разработанные макеты проходят этап внутреннего контроля: менеджер проекта формально проверяет все ли макеты и элементы были разработаны, арт-директор проверяет качество макетов.
На этапе разработки дизайна производятся все графические материалы, необходимые для макетов: 3D-модели, иллюстрации, фотографии, иконки, видео. Также создаются версии макетов для мобильных и широкоформатных устройств.
После внутреннего утверждения, макеты демонстрируются и утверждаются у заказчика.
4. Frontend (верстка)
На данном этапе все графические макеты переносятся в вид, с которым работает браузер: HTML/CSS-страницы.
- Верстается версия сайта для мониторов.
- Создаются версии сайта для мобильных устройств (телефоны, планшеты) и для широкоформатных экранов (Full HD и 2/4-к версии сайта). *
- Сверстанный сайт тестируется:
- проверяется готовность всех элементов.
- соответствие макетам ( pixel perfect ).
- корректность отображения на указанных в ТЗ браузерах и мобильных устройствах.
- Далее разрабатываются все заложенные в дизайне frontend-анимации.
* В случае применения подхода mobile-first процесс движется в обратном направлении: сначала верстаются макеты под мобильные устройства, далее они адаптируются для мониторов.
5. Backend (программирование)
После завершения верстки программист устанавливает CMS или фреймворк, настраивает шаблоны и программирует сложно-функционирующие разделы сайта.
Далее QA-инженеры проводят финальное тестирование сборки.
На данном этапе получается практически законченный продукт.
6. Создание контента и наполнение сайта
Создание контента — важная часть разработки сайта.
Текстовые материалы, изображения, видео, 3D должны быть хорошего качества, так как пользователь воспринимает сайт в целом, не разделяя дизайн и наполнение. Всё должно быть идеально.
Отдельно заметим, что правильные тексты на сайте — один из факторов хорошего ранжирования в поисковых системах. Важно создать хороший текстовый материал, понятный для пользователей, проверить тексты на уникальность и ошибки.
Не совершайте ошибки, экономя на создании контента для вашего сайта!
7. Первичная SEO-оптимизация
Важный этап — первичная SЕО-оптимизация сайта.
Новый сайт должен быть сразу правильно проиндексирован поисковыми системами во избежание дальнейших проблем. Для этого необходимо провести эти работы ДО публикации сайта в сети.
- Составляем семантическое ядро.
Собираем семантическое ядро, максимально исчерпывающее тематику сайта и проводим кластеризацию запросов. - Заполняем мета-данные на страницах.
Прописываем правильные заголовки (H1, TITLE), DESCRIPTION и ALT у картинок. - Устанавливаем аналитические системы.
Регистрируем сайт и устанавливаем систему сбора статистики (например Яндекс.Метрика) и панель веб-мастера.
Ваш сайт готов к публикации в Интернет.
8. Внедрение
После завершения разработки и всех подготовительных работ, сайт устанавливают на хостинг, производят финальную диагностику работы всех систем и подключают рабочий домен.
После включения домена, на сайт устанавливают различные внешние системы: аналитику, панели вебмастера и виджеты. Так осуществляется финальная настройка CMS и включение интеграции с CRM.
Для систем highload-класса проводится нагрузочное тестирование.
Ура, разработка сайта завершена! 😅
Сколько стоит разработка сайта
Давайте посмотрим, сколько в среднем стоит разработать креативный сайт, который дистанцирует вас от конкурентов, и будет работать как инструмент цифрового маркетинга.
Мы кратко расскажем как разработчики рассчитывают стоимость разработки сайтов, и приведем пример реальной сметы (в конце раздела).
Итак, как формируется стоимость заказа?
Механика оценки проектов
Все агентства и digital-продакшны рассчитывают стоимости в человеко-часах, это связано с механикой учета рентабельности в сфере разработки.
Кратко о том, как рассчитывается стоимость часа специалистов:
- Уровни заработных плат зависят от грейда специалиста.
- Рассчитывается коэффициент добавленной стоимости: все непроизводственные расходы делятся на фонд заработных плат разработчиков; здесь же закладывают коэффициент рентабельности.
- ЗП каждого специалиста умножается на этот коэффициент (непроизводственные расходы пропорционально делятся на разработчиков).
- Получившаяся ЗП разработчиков делится на месячный фонд часов и получается стоимость часа каждого специалиста.
Чтобы посчитать смету вашего проекта, составляется карта планируемых трудозатрат по каждому типу работ. Далее трудозатраты умножаются на стоимости часа специалистов.
Далее, задача продакшна выполнить ваш проект с нужным функционалом и качеством в рамках бюджета проекта.
На какой бюджет рассчитывать (пример)
Давайте посчитаем, сколько будет стоить корпоративный сайт с 3D-графикой и микро-анимациями. Предполагается презентация компании, каталог услуг и отдельный макет страницы «Контакты»:
- Проектирование:
- Креативная концепция: 60 часов / 91 400 ₽.
- Прототипы: 34 часов / 51 700 ₽.
- Техническое задание: 24 часа / 36 000 ₽.
- Макеты дизайна:
Трудоемкость: 224 часа.
Стоимость: 347 200 ₽. - Верстка и анимации:
Трудоемкость: 176 часов.
Стоимость: 264 000 ₽. - Программирование:
Трудоемкость: 72 часа.
Стоимость: 122 400 ₽.
Итого цена разработки сайта под ключ: 912 700 ₽
За адекватную сумму вы получите сайт, способный занять призовые места на отраслевых конкурсах разработчиков сайта. И он будет намного лучше сайтов конкурентов!
Вот детальный пример сметы на разработку сайта.
Если использовать nocode-подход, то разработать сайт можно дешевле. Обязательно изучите все плюсы и минусы этого подхода перед принятием решения.
Сколько времени займёт разработка сайта
1. Проектирование
Самый трудоемкий этап — это разработка креативной концепции. Дизайнеру необходимо провести анализ конкурентов и лучших практик, придумать и реализовать прототип-концепцию стартовой страницы, придумать анимации и сделать видео-презентацию. Это занимает 5–7 дней.
Далее по трудоемкости идут кликабельные прототипы. Проектирование всех интерфейсов в среднем занимает 3–4 дня (в зависимости от количества страниц — не забывайте, мы говорим про простой корпоративный сайт!).
Создание Технического задания занимает 3–4 дня.
Итого, на первый этап разработки сайтов, необходимо закладывать 11–15 дней (это 3 рабочие недели).
Не забывайте, что необходимо также обсудить результат с заказчиком, внести корректировки при необходимости, и утвердить финальный вариант.
2. Разработка макетов дизайна
В указанной смете трудоемкость макетов составляет 13 рабочих дней (это около 3 календарных недель). Параллельно, если графическая концепция подразумевает использование 3D, работает 3D-дизайнер.
Этап также подразумевает демонстрацию результата заказчику и корректировки.
3. Верстка и анимации
160 часов или 20 рабочих дней длится верстка и frontend-анимации. Данная стадия демонстрируется заказчику по договоренности (иногда этот этап не утверждается отдельно).
4. Программирование
Длится 6 дней.
5. Тестирование и внедрение
Заложим с запасом 5 дней на тестирование и установку сайта на сервер.
Итого, мы получаем срок в 60-70 рабочих дней + запас на корректировки и рассмотрение результатов 10 дней.
Средний срок разработки корпоративного сайта под ключ составляет 2 месяца.
Несомненно, шаблонный сайт или nocode-решение можно получить быстрее, но сайт фестивального уровня делается, в среднем, в указанный срок.
Как мы уже писали выше, важно создавать нестандартные решения, чтобы ваше виртуальное представительство не было одним из многих похожих решений, а действительно выделялось на уровне конкурентов и решало маркетинговые задачи максимально эффективно.
Чем заказная web-разработка отличается от потоковой
Диджитал-агентства, предоставляющих услугу «Разработка сайтов», можно условно разделить на два типа:
1. Веб-студии потоковой разработки
Специфика деятельности студий потоковой разработки подразумевает работу с шаблонными решениями и экономию на масштабах (при небольшой рентабельности каждого проекта необходимо сделать много сайтов).
Отсюда вытекают минусы:
- Все решения похожи из-за использования шаблонов.
- Низкое качество креатива.
- Нет возможности сделать сложные веб-сервисы.
- Нет индивидуального подхода к клиенту и его проектам.
Выбрать веб-студию потоковой разработки резонно в случае необходимости быстро проверить гипотезу, в ситуации с сильно ограниченным бюджетом.
Заказывая проект «на потоке», не ждите уникального дизайна и реализации всех ваших «хотелок». Вы получите проект быстро, и уложитесь в небольшую сумму.
2. Креативные агентства, осуществляющие заказную разработку
Креативные продакшны ориентированы на создание эксклюзивного продукта — креативного сайта с проработанной анимацией. Для создания подобных решений необходима глубокая техническая экспертиза в моушен-дизайне и frontend-технологиях. Подобная экспертность редко встречается в агентствах, работающих на потоке.
При создании эксклюзивного решения, агентство более полно погружается в задачи бизнеса, и создает «под ключ» эффективный digital-проект.
Если есть задачи дистанцирования от конкурентов и сложной web-разработки, то лучше выбрать креативный продакшн.
Почему стоит заключить договор с digital-агентством
Разработка сайтов — сложный технологический процесс, требующий наличия в штате квалифицированных специалистов:
- Менеджера проекта.
- Аналитика.
- Арт-директора.
- Веб-дизайнера.
- UI/UX-дизайнера.
- Иллюстратора.
- Аниматора.
- 3D-дизайнера.
- Копирайтера.
- Фотографа и видеографа.
- Frontend-разработчика.
- Backend-программиста.
- QA-инженера.
- Технического писателя.
- Системного администратора.
Создать технически сложное digital-решение в заданные сроки и в рамках бюджета посильно только команде с большим опытом. Выбирая digital-агентство вы получаете гарантию качества, которую не смогут вам дать фрилансеры-одиночки или небольшие веб-студии.
Дополнительными гарантиями качества студий по разработке сайтов будут являться присутствие агентства в рейтингах, отраслевой опыт (наличие кейсов) и награды на конкурсах.
Мы много говорили о важности креативной составляющей сайта. Решения фестивального уровня могут дать вам только креативные продакшны, специализирующиеся на сайтах подобного плана, имеющие в штате специалистов по frontend-анимации и моушен-дизайнеров.
Не забывайте о необходимости продвижения сайта в Интернет: вам нужен будет трафик и SEO-оптимизация для того, чтобы сайт выполнял маркетинговые задачи. Удобнее всего получить комплекс услуг в режиме одного окна, сотрудничая с digital-агентством.
Удачи вам в ваших проектах!
Если есть вопросы, пишите нам на е-почту или оставляйте сообщения в VK-группе.
