Сколько стоит разработка интернет-магазина с уникальным дизайном

Рассказываем, что влияет на стоимость разработки, почему в одном агенстве запустить интернет-магазин с индивидуальным дизайном стоит 300 тысяч рублей, а в другом 1,5 млн рублей, и на чём можно сэкономить, а на чём нельзя.

Kislorod уже более восьми лет занимается веб-разработкой. Три года назад мы решили, что только узкий фокус позволит дать тот уровень качества и сервиса нашим клиентам, к которому мы стремимся. Поэтому решили не распыляться, а сфокусироваться только на разработке проектов электронной коммерции на «1С-Битрикс».

Простая математика

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

Заказчик покупает время сотрудников агентства — чем выше экспертиза сотрудника, тем выше стоимость его часа в проекте. Поэтому стоимость разработки интернет-магазина формируется по простой формуле:

Количество часов, необходимых на разработку проекта, умножаем на среднюю стоимость часа команды, тогда получим бюджет на запуск минимально жизнеспособного продукта (MVP).

Сколько часов потребуется для разработки MVP

Согласно исследованию агентского рынка (Russian Digital Profile 2018), более двух третей агентств работают в минус с коэффициентом overhead менее 3х. Это означает, что общая доля ФОТ, производящих сотрудников в таких агентствах, превышает треть общих расходов компании.

Сколько стоит разработка интернет-магазина с уникальным дизайном

А кроме этого в структуру расходов агентства входят:

  • ФОТ непроизводящих сотрудников;
  • условно-постоянные расходы;
  • налоги и бюджет на маркетинг.

Вывод простой: норма прибыли среднего игрока агентского digital-рынка остаётся весьма небольшой или стремится к нулю. Потому многие агентства по-прежнему работают в минус или не платят налоги.

На ум сразу приходят две мысли. Первая — хорошая для заказчика, вторая — плохая.

Хорошая мысль — агентство находится на том уровне своего развития, когда собственник относится к своему агентству не как к бизнесу, а как к своеобразному хобби. Тогда есть небольшая вероятность, что заказчик получит проект хорошего качества за меньшие деньги, так как студия сделает большую часть работ за свой счёт.

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

Согласитесь, что бизнесу всегда приятно работать с бизнесом, когда основа — это взаимовыгодное сотрудничество. Поэтому мы особенно трепетно относимся к своим бизнес-процессам и регулярно анализируем рентабельность своего производства.

О том, как мы это делаем, читайте в статьях:

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

Предварительная смета

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

Разработчик снижает риски, ведь нигде не указано, какая конкретно функциональность была осмечена, сколько трудозатрат заложено на её реализацию.

Бывает, что предварительная смета условно существует, но в ней не декомпозирована функциональность.

Сколько стоит разработка интернет-магазина с уникальным дизайном

Для нас в Kislorod предварительная смета — это способ обсудить, осознать и обосновать стоимость создания интернет-магазина. Чем охотнее на пресейле заказчик отвечает на наши многочисленные вопросы, тем лучше понимание и точнее предварительная смета.

Сколько стоит разработка интернет-магазина с уникальным дизайном

В нашем случае она включает восемь производственных этапов:

  1. аналитика, прототипирование и написание технического задания (ТЗ);
  2. интеграция с ERP;
  3. отрисовка дизайна;
  4. вёрстка;
  5. программирование;
  6. наполнение контентом;
  7. внутреннее техническое SEO;
  8. запуск на боевом сервере.

Фиксируем стоимость первого и последнего этапа, остальные оцениваем по верхней и нижней границе. Точную стоимость этапов (дизайн, вёрстка, программирование, наполнение контентом и техническое SEO) можно зафиксировать только после прототипа и ТЗ.

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

К общим трудозатратам добавляем:

  1. менеджмент проекта — 10%;
  2. тестирование и отладку — 20%;
  3. командная разработка (работа с Git) — 5%.

Менеджмент проекта добавляется ко всем этапам, тестирование и командная разработка — к вёрстке и программированию.

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

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

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

Во-вторых, одна из основных задач Git — обеспечение удобства командной работы над кодом. Понятно, что организация среды и процесса потребует дополнительных трудозатрат, но такой подход ускорит запуск MVP. К проекту можно подключить сразу трёх backend-разработчиков без какого-либо вреда коду.

Далее разберём нюансы рабочего процесса и трудозатраты каждого из этапов.

Предпроектный анализ

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

Результат в виде документов:

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

Работы, которые не столь важны для реализации MVP проекта, можно отложить на будущее или изменить глубину проработки. Но мы не рекомендуем пренебрегать анализом поискового спроса и конкурентов.

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

Многие агентства к этому фундаментальному этапу относятся формально либо вообще не включают в процесс разработки интернет-магазина.

Средние трудозатраты аналитика на этом этапе 48 часов.

Разработка прототипа и написание технического задания

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

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

Во-вторых, как проектировщик, так и клиент в прототипе думает в первую очередь о пользовательском опыте. Сложно удовлетворить свою субъективную точку зрения о прекрасном, перемещая черно-белые блоки. Так снижается риск недоработать логику из-за расфокусировки внимания.

Сколько стоит разработка интернет-магазина с уникальным дизайном

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

Кто-то проектирует не только функциональные страницы, но и контентные. В агентствах из сегмента low-cost прототип не делается вообще или носит формальный характер.

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

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

Согласно последним исследованиям компании Criteo, самое большое количество покупок совершается со смартфонов — доля продаж с этих устройств выросла на 79%.

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

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

Допустим, необходимо спроектировать (без интерактива и мобильных прототипов) только основные функциональные страницы:

  • главную страницу (слайдер, блок популярных товаров, блок с категориями товаров, SEO-текст);
  • каталог товаров с категориями;
  • листинг товаров с фильтром;
  • карточку товара (фото товара, блок покупки с ценами и отметкой о количестве и наличии товара, подробная информация о товаре на вкладках, блок «персональные рекомендации»);
  • корзину и одностраничный чекаут (без интеграций с платёжными системами);
  • страницы личного кабинета (мои заказы и личные данные);
  • страницы авторизации и регистрации;
  • страница результатов поиска по каталогу товаров;
  • о компании (типовая контентная страница);
  • контакты (контент, форма обратной связи, виджет «Яндекс.Карт»).

В этом случае трудозатраты проектировщика (UX-дизайнера) составят 32 часа.

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

В нашем случае ТЗ содержит от 40 до 60 страниц. В среднем написание технического задания для типового интернет-магазина займёт 25 часов.

Интеграция с ERP

Чаще всего интернет-магазин интегрируют с «1С». Большая часть CMS уже имеют готовые модули обмена с разными ERP и сервисами.

Если «1С» не дорабатывалась под задачи компании, то при наличии модуля обмена штатная интеграция на стороне сайта (обмен товарами и выгрузка заказов в «1С») занимает пять–восемь часов у разработчика. Откровенно говоря, штатная интеграция — редкость.

Если же «1С»-специалист неоднократно дорабатывал систему, то в этом случае штатной интеграцией не обойтись и трудозатраты возрастают в разы.

Чтобы приблизительно спрогнозировать трудозатраты по этому этапу предположим, что задача разработчика:

  • выгрузить товары, остатки и цены из «1С» на сайт;
  • выгрузить заказы пользователей с сайта в «1С».

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

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

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

При приёмке этих макетов от разработчика важно проверить наличие отдельного макета — UIkit (user interface kit). О нём часто забывает дизайнер, если наличие UIkit не регламентировано в производственном процессе. В нём собраны все элементы пользовательского интерфейса в разных состояниях.

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

Сколько стоит разработка интернет-магазина с уникальным дизайном

Учитывая те страницы, которые мы спроектировали выше, на выходе должно получиться минимум 35 макетов страниц под смартфон и десктоп. Займёт это суммарно 98 часов.

Вёрстка и программная сборка

Практически ни у кого не возникает мысли пойти к терапевту, если болит сердце. Но почему-то каждый второй заказчик выбирает разработчика, который пилит сайты на разных CMS.

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

Если вы считаете, что компетентность стоит дорого, то попробуйте некомпетентность — она обойдётся вам гораздо дороже.

Йохан Стаель фон Хольстайн, немецкий врач

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

Сколько стоит разработка интернет-магазина с уникальным дизайном

Из нашей практики в отдельных случаях рациональнее было отказаться от текущей сборки и сделать backend-функциональность с нуля.

Чаще всего это бывает, если программист не следует стандартам разработки на «Битрикс», а городит свои «костыли».

Поэтому, если решили разрабатывать интернет-магазин на «Битрикс», то ищите тех, кто на этой платформе «собаку съел», запустил и поддерживает ни один интернет-магазин. То же самое относится к любой другой CMS-системе.

На этих двух этапах, как говорилось ранее, наличие такого процесса как тестирование приобретает особую значимость.

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

В итоге вёрстка займёт 168 часов. Функциональная сборка — 127 часов.

Внутренняя техническая SEO-оптимизация

«Многорукий бандит» — статистический алгоритм «Яндекса», который перемешивает поисковую выдачу с целью показать пользователю ответ, полностью удовлетворяющий его запросу.

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

Как только результат удовлетворит «Яндекс» — позиции по запросам закрепляются за сайтом. Таким образом, появилась возможность у молодых сайтов уже на старте получать трафик с поиска без контекстной рекламы.

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

Чаще всего пренебрегают правильным использованием тегов "canonical", "next" и "prev", правильной иерархией тегов заголовков и так далее. Предупреждение этих ошибок на этапе создания интернет-магазина позволит сэкономить приличное количество времени и денег после запуска.

В нашем внутреннем чек-листе насчитывается свыше 100 параметров с высоким приоритетом и более 70 со средним, которые необходимо учесть и проверить прежде, чем убрать запрет на индексацию в robots.txt.

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

В среднем трудозатраты на внедрение SEO-требований в типовом интернет-магазине при условии, что структура разработана на основе семантического ядра, займёт у программиста 25 часов.

Стоимость часа команды

Согласно аналитическим данным, на момент написания статьи сложилась следующая ситуация на рынке труда в разработке:

  1. специалисты в заказной разработке в среднем хотят и получают на руки, за вычетом всех налогов, от 60 тысяч рублей до 140 тысяч рублей в зависимости от специализации и уровня квалификации;

  2. самый заметный рост предлагаемых зарплат, опубликованных работодателями, произошёл в сфере ИТ (29% в 2018 году к 2017 году);

  3. 62% агентств ощущают нехватку кадров;

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

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

Средняя выработка сотрудника производства, согласно нашим отчётам, если он не работает сверхурочно, 120 часов. Опираясь на данные по зарплатам ИТ-специалистов, можно сказать, что на руки производящий специалист среднего уровня квалификации получает 70 тысяч рублей. Выходит, что его час агентство покупает минимум за 560 рублей.

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

Как говорилось ранее, минимальный коэффициент overhead, при котором агентство работает с допустимой нормой прибыли, равен трём. Так, средняя стоимость часа при продаже клиенту составит 1700 рублей.

Этот факт подтверждают данные аналитического агентства «Тэглайн». Причём эти данные за 2015 год.

Итоговая стоимость интернет-магазина с нуля

В большинстве случаев в команду разработки типового интернет магазина входят:

  • менеджер проекта;
  • UI-, UX-дизайнер;
  • верстальщик;
  • backend-разработчик;
  • тестировщик.

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

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

Ссылка на смету.

Итак, для разработки интернет-магазина с индивидуальным дизайном потребуется 681 час, а его оправданная средняя стоимость, при ставке часа специалистов в команде в 1700 рублей, составит минимум 1 158 414 рубля.

Как можно сэкономить на разработке

Баланс времени, денег и качества в проектном треугольнике. Невозможно изменить любой из элементов, не затронув другие
Баланс времени, денег и качества в проектном треугольнике. Невозможно изменить любой из элементов, не затронув другие

Способ 1. Экономьте на типовой функциональности, если она отвечает вашим задачам

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

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

Вот пример сметы на разработку того же интернет-магазина, но собранного на готовых компонентах. Общие трудозатраты — 410 часов, стоимость сборки — 696 426 рублей.

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

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

Кстати говоря, довольно часто в разработке интернет-магазинов на «Битрикс» используют стандартный интерфейс и компоненты из коробки «1С-Битрикс». Иногда, чтобы не раздувать ценник, вообще без какой-либо стилизации. Выглядит это мягко говоря нелепо и не презентабельно.

Сколько стоит разработка интернет-магазина с уникальным дизайном

Поэтому рекомендуем уточнять, о каких готовых компонентах идёт речь.

Способ 2. Не пытаться реализовать всю желаемую функциональность на старте

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

Способ 3. Не оценивайте дизайн и интерфейс исходя из своего представления о прекрасном

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

<p>Скриншот из онлайн-курса «E-Commerce 2019: старт и масштабирование» </p> Тимофей Шиколенков. С 1997 года в электронной коммерции. Автор бестселлера: «Ваш интернет-магазин от А до Я»

Скриншот из онлайн-курса «E-Commerce 2019: старт и масштабирование»

Тимофей Шиколенков. С 1997 года в электронной коммерции. Автор бестселлера: «Ваш интернет-магазин от А до Я»

Способ 4. Закладывайте фундамент в виде правильной структуры интернет-магазина

Формируйте структуру на основе поискового спроса, только так она будет понятна пользователям и поисковым системам. Иначе рискуете получить обратное, а поймёте это тогда, когда получите техническое задание от SEO-специалистов.

И стоимость доработки и подготовки к поисковому продвижению, только что запущенного интернет-магазина, будет сравнимо больше стоимости поискового анализа на первом этапе разработки.

Способ 5. Экономьте своё время и нервы

При прочих равных выбирайте агентство, способное думать «за клиента» и предлагать идеи. Не каждый заказчик оценивает степень своей вовлечённости в проект в часах, а часы не переводит в деньги.

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

Способ 6. Запускайтесь на готовых или облачных решениях в условиях ограниченности бюджета

В большинстве случаев целесообразнее создавать интернет-магазин на готовых решениях, чем разрабатывать его с нуля в соотношении цена–качество.

Готовое решение — это готовый интернет-магазин на «1С-Битрикс». В комплекте удобный интерфейс со множеством настроек и вся необходимая функциональность, за который пришлось бы платить в случае с индивидуальной разработкой.

Подводя черту в вопросе цены и ценности

  1. Если у вас есть необходимый бюджет и перед вами стоит задача сделать редизайн работающего интернет-магазина, который накопил уже необходимые данные для этого, то выбирайте полный цикл разработки. Цель оправдывает средства.
  2. Если у вас есть необходимый бюджет и чёткое понимание, что готовое решение не решает тех задач, которые перед вами ставит бизнес, то выбирайте полный цикл разработки по правилам компетентного агентства. Цена забывается, а качество остаётся.
  3. Если у вас нет опыта, а бюджет ограничен, то не рискуйте своим временем и деньгами — запускайтесь на готовом решении или арендуйте SaaS-платформу для интернет-магазина, а оставшийся бюджет инвестируйте в процессы, контент и трафик.

1212
89 комментариев

Любой ваш уникальный дизайн собирается из шаблонов с темфорест.

14
Ответить

Уникальный дизайн на шаблонах? По-моему в контексте чувствуется противоречие.
В любом случае, если вы дочитали статью до конца, не было задачи убедить запускать интернет-магазин с уникальным дизайном или пилить на шаблонах. Скорее рассказать о нюансах разработки.

7
Ответить

Комментарий недоступен

11
Ответить

Комментарий недоступен

2
Ответить

Поделитесь ссылочками плиз, интересно

1
Ответить

Комментарий недоступен

Ответить

Уважаемый Alone-In не нашел времени нам ответить :(

Ответить