how-to-launch-internet-store-fast_xxgh-h4 (1)
Создание интернет-магазина с нуля
08.08.2016
CS-Cart + Power Pack или Битрикс
CS-Cart + Power Pack или Битрикс
28.08.2016

Сколько стоит сделать / создать интернет магазин?

9-components-of-successful-online-store (1)

Вы задались вопросом сколько стоит создать интернет магазин? Создание интернет-магазина можно сравнить с постройкой реального торгового комплекса. Чтобы посетителям было комфортно совершать покупки, нужно тщательно продумать все детали проекта заранее, а затем выполнять все задуманное, исходя из подробно разработанного плана.

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

Итак, разработка интернет-магазина должна проходить через 5 этапов.

Я выделил зелёным цветом этапы, на которые стоит обратить особое внимание. Из моего опыта основная ошибка, которую совершают клиенты - то, что этапам составления технического задания и проектирования не уделяется должного внимания. А это в свою очередь влечет за собой сложности в реализации этапов 3, 4, и 5.

Этап 1. Составление технического задания

“...результаты исследования продуктивности деятельности свидетельствуют о том, что минута, потраченная на планирование, экономит девять минут необдуманной работы.”
Шэрон Мельник «Стрессоустойчивость. Как сохранять спокойствие и эффективность в любых ситуациях»

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

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

Техническое задание должно включать подробное описание следующих этапов:

  • проектирования;
  • разработки дизайна;
  • интеграции дизайна;
  • дополнительной разработки.

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

Этап 2. Проектирование

Настоящие результаты в юзабилити (а это высокая конверсия при том же качестве трафика) получаются только тестированием. И никак больше.
Петр Пономарев Основатель green-sales.ru

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

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

  • списке всех необходимых страниц;
  • описании каждой страницы в отдельности (если страница подразумевает дополнительную функциональность, то необходима ссылка на этап дополнительной разработки);
  • необходимости разработки прототипа страницы для разных разрешений экранов, планшетов, мобильных телефонов.

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

  • https://ninjamock.com/
  • http://www.axure.com/
  • https://wireframe.cc/

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

Проектирование бывает UI (интерфейс пользователя) и UX (взаимодействие пользователя).

UI проектирование - проектирование интерфейса интернет-магазина, т.е. замещение элементов на странице.

Как правило, этого проектирования бывает достаточно. Так как взаимодействие клиента с базовыми элементами интернет-магазина стало уже очевидным. Однако это не всегда так. Бывает, что клиенты требуют переработки системы совершения оплаты и этапы совершения сделки требуют продумывания UX.

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

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

Этап 3. Разработка дизайна

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

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

Один из них - российский магазин с “боевым” дизайном и оборотом более 20 млн. рублей в месяц.

Другой - зарубежный проект со стандартной темой, купленной на MarketPlace. Сезонный бизнес, который приносит от 10 000 долларов в сезон затишья и до 100 000 долларов в летний сезон.

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

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

Этап 4. Интеграция дизайна

Интеграция дизайна всегда производится на основе разработанных дизайн-макетов. Существует несколько способов вёрстки страниц и несколько подходов к интеграции дизайна. Как правило, подход к интеграции выбирает интегратор исходя из нарисованных макетов. Однако дизайнер уже на этапе создания макетов должен понимать то, как будет перестраиваться контент при изменении размеров окна браузера, и рисовать исходя из этого. Хороший дизайн включает в себя:

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

В техническом задании необходимо обязательно строго прописать в каких версиях браузера должен корректно отображаться сайт. Наиболее распространенным вариантом кроссбраузерности является верстка под: InternetExplorer 10+, Edge, GoogleChrome, FireFox, Safari, Opera последних версий.

Случаи, когда клиенты просят интеграцию под более ранние версии браузеров редки, но все же они периодически происходят. Целесообразность вёрстки для тех или иных браузеров необходимо оценивать исходя из статистики использования браузеров: http://www.w3schools.com/browsers/browsers_stats.asp

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

Этап 5. Дополнительная разработка

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

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

Итоги

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

Директор по развитию Cart-Power Кощеев Леонид

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>