Стоимость дизайна сайта интернет-магазина: от чего зависит, как выбрать надежное агентство, на чем можно сэкономить

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

1. От чего зависит цена дизайна сайта
2. Как мы рассчитываем стоимость дизайна для интернет-магазина
3. Этапы создания дизайна интернет-магазина
4. Стоимость дизайна интернет-магазина
5. Коротко о главном

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

Низкая цена отрисовки дизайна сайта — повод насторожиться. Скорее всего за ней стоит:

Рассмотрим каждый пункт подробно.

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

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

Если клиенты заказывают дизайн или редизайн впервые, то обычно мыслят на уровне «красивых картинок» или креативных решений, что не актуально для e-commerce проектов.

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

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

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

Если опираться не на данные, а на вкусовщину «нам кажется, что так красиво», в готовом продукте будут реализованы неудобные решения, переделать которые будет проблематично и дорого. Для менеджера проекта или e-com директора это риск слить бюджет впустую и вызвать недовольство руководства — вплоть до увольнения.

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

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

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

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

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

Клиент думает, что обеспечил агентство всей необходимой информацией и ждет адекватное ценовое предложение. Но без детальной сметы клиенту не понятно, что входит в цену дизайна для интернет-магазина у разных агентств. Например, одни делают предпроектную аналитику, прототипирование и UI-кит, отрисовывают макеты всех функциональных страниц в трёх разрешениях (десктоп, планшет и смартфон), другие — не делают и половины из перечисленного.

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

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

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

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

Пример сметы на дизайн с разбивкой по часам и задачам:

Как видите, стоимость прототипа, подготовки ТЗ и отрисовки дизайна в 3х разрешениях для интернет-магазина в нашем примере — 496 584 рублей. Разберемся, как она формируется.

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

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

Стоимость предпроектного анализа, разработки прототипа и ТЗ фиксированная. А цену на отрисовку дизайна мы определяем в формате «от» и «до». Окончательную стоимость дизайна называем после готовности прототипа и технического задания. В процессе отрисовки она может быть пересмотрена только в том случае, если появится новый функционал или макеты страниц, которые ранее не были зафиксированы в прототипе и ТЗ.

Рассмотрим, что мы включаем в каждый этап.

Этап помогает:

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

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

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

Средние затраты времени аналитика от 8 часов. Понятно, что в зависимости от перечня работ, которые входят в этот этап, трудозатраты могут меняться в большую или в меньшую сторону. Так, например, семантическое проектирование структуры добавит к смете 40 часов.

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

Принципы хорошего прототипа, которыми мы руководствуемся при его создании:

Если нужно сделать прототип основных функциональных страниц, UX-дизайнер потратит 57 часов.

В техническом задании описываются требования к дизайну — это также позволяет избежать разногласий с клиентом. Обычно написание технического задания на дизайн занимает 10-15 часов.

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

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

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

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

Также мы создаем UI-кит — документ, в котором собран набор визуальных элементов интерфейса в разных состояниях при взаимодействии с ними.

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

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

Отрисовка дизайна спроектированных страниц под три разрешения занимает 157 часов.

Дизайнер в среднем работает 120 часов в месяц. Его зарплата составляет около 72 тысяч рублей. Значит, час работы для агентства обойдется в 600 рублей. Минимальный коэффициент overhead — 3. Значит, средняя стоимость часа работы дизайнера для клиента — 1800 рублей.

В проекте задействован не только дизайнер, но и аналитик, менеджер и другие специалисты. У нас в KISLOROD стоимость часа любого члена команды — 1800 рублей. После подстановки значения в смету получается, что дизайн сайта займет 276 часов (округлённое значение) и будет стоить 496 800 рублей. Теперь вы знаете, сколько стоит разработка дизайна для интернет-магазина. Учтите, что это только ориентиры — каждый проект оценивается индивидуально.

• Разрабатывая дизайн сайта, нужно учитывать потребности пользователя и задачи бизнеса, опираясь на данные предпроектного анализа

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

• Прототипирование позволяет осознать, как будет выглядеть проект, понять логику работы с интерфейсом и функционалом

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

• Важно отрисовывать адаптив всех функциональных страниц как минимум под три разрешения
  

Рекомендуем не отказываться от важных производственных нюансов в целях экономии — доработка неудобных решений на 1С-Битрикс или кривая вёрстка в будущем сведёт экономию на нет, негативно скажется на доверии пользователей к сайту и, как следствие, на конверсии.