Интернет-магазин товаров
для строительства и ремонта
Сотрудничаем с 2015 года
⭐️ Как компания КрепыЖ увеличила количество продаж с сайта в 10 раз

Аннотация

Описанные здесь события происходили в 2015 - 2017 годах.

Интересный факт. Чтобы проект стал полезным, мы вышли из офиса и лично пообщались с арендаторами ЦУМа.

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

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

Сроки и стоимость. Создание похожего сайта займет 3−5 месяцев. Срок зависит от согласований и от степени готовности контента: иллюстраций, текстов, видео. Стоимость: 900 — 1490 тыс. руб. Оплата по этапам. Изготовление контента мы можем взять на себя.

Дисклеймер. Это лонгрид. Чтение займет 10−15 минут. Есть видеопрезентация.

Содержание

Кейс состоит из следующих разделов:

  1. Видеопрезентация руководителя проекта.
  2. О компании «Тюменский ЦУМ».
  3. Вводная задача от заказчика, проблематика, цели.
  4. Что мы сделали, с какими трудностями столкнулись и как их решили.
  5. Результаты.
  6. Команда проекта.
Видеопрезентация руководителя проекта

Для тех, кто не любит читать. Рассказывает и показывает Григорьев Иван, руководитель проекта, Legacy. 14 минут.

О компании «Тюменский ЦУМ»

«Тюменский ЦУМ» — это торговый комплекс в центре города площадью 35 600 кв. м. (GBA) с покупательским трафиком 5 млн человек в год. Арендный и собственный бизнес. Ассортимент товаров 250 000 SKU.

Посмотрите короткое видео, 30 секунд:

Вводная задача от заказчика, проблематика, цели

Первый шаг к преображению

У компании Крепыж был сайт и до 2014 года, но именно тогда стало ясно, что развитие невозможно без изменений на онлайн-площадке.Текущая версия не отвечала потребностям компании и плану её развития. Кроме того, требовалось запустить новый сайт в формате интернет-магазина.

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

Опыт помог Крепыжу определиться с платформой для разработки: предыдущая версия сайта была построена на «1С-Битрикс», который удовлетворял всем требованиям компании и был знаком сотрудникам, так что не пришлось тратить время на обучение. Было изначально понятно, что эта CMS отвечает всем основным требованиям проекта, для которого необходима гибкая система управления информацией и возможность интеграции с «1С:Управление торговлей». Для функционала будущего сайта также пригодились бы готовые модули «1С-Битрикс», с помощью которых можно быстро внедрить работу со службами доставки, SMS- информирование клиентов и др. А недостающие специфические функции всегда можно разработать, используя мощное API продукта.

В качестве партнера в этом процессе преображения выступило агентство Legacy. Обширное портфолио сайтов в области e-commerce красноречиво говорило о том, что компания справится со всеми поставленными задачами. Многие реализованные проекты обладают как раз теми составляющими, которые были важны для Крепыжа, — технической экспертизой для качественного результата и умением делать действительно красивые и стильные сайты. В портфолио студии есть интернет-магазины по продаже карнизов, штор и аксессуаров для оформления интерьера ARTTEX, сувениров, подарков и бижутерии из камня «ТД Шибаков и КО», адаптивная онлайн-бакалея Gromar и др.



Аналитика важна, аналитика нужна

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

  1. сделать сайт удобным для пользователей;
  2. соответствовать требованиям поисковых систем Яндекс и Гугл;
  3. обеспечить качественный рост целевого трафика;
  4. способствовать повышению лояльности к бренду через удобство пользования на любом современном устройстве.

Среди требований к проекту заказчик выделил дизайн сайта: чтобы был современный и соответствовал утвержденному бренд-буку.

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

Получив виденье проекта сотрудники агентства Legacy приступили к проектированию нового интернет-магазина.

Среди требований к проекту заказчик выделил дизайн сайта: чтобы был современный и соответствовал утвержденному бренд-буку.

Мы защитили свою концепцию перед комиссией заказчика. Предложенный нами вариант понравился.

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

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

Цена. В конкурсе участвовали иногородние компании, но они оказались дороже на 30-100%. Всё дело в себестоимости: труд, аренда офиса и услуги в регионах дешевле.


1. Обучаем сотрудников по программам крупных федеральных студий → качество как в Москве.

2. Тщательно планируем работу и не берем на себя повышенные обязательства → сдаем проекты в срок.

3. Офис в Тюмени → на 30-50% дешевле, чем в Москве.
Legacy

Что мы сделали, с какими трудностями столкнулись и как их решили

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

Новый сайт мы создавали так:

  1. Сначала мы выполнили маркетинговый анализ клиентов и конкурентов.
  2. Далее сделали прототипы интерфейса сайта.
  3. После прототипов разработали дизайн сайта.
  4. Выполнили все технические задачи:
    • По готовому дизайну сверстали дизайн-макеты.
    • После дизайна и верстки выполнили программирование на 1С-Битрикс.
    • Далее настроили веб-аналитику.
    • Выполнили SEO-оптимизацию.
    • Наполнили сайт контентом.
  5. Запустили сайт в работу:
    • Обучили заказчика работе с сайтом.
    • Опубликовали сайт в сети Интернет.
    • Провели финальную презентациют в формате «обещали → сделали».


Реализация

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

Работа над проектом стартовала в августе 2015 года, а уже через 4 месяца новый полноценный интернет-магазин был запущен.

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

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

Всего в проекте приняли участие около 30-35 человек.
Мы разработали анкеты и самостоятельно провели очные опросы среди всех якорных и части не якорных арендаторов ЦУМа. Результат опроса позволили сделать сайт полезным для арендаторов.
1.2. Изучили сайты конкурентов
После изучения целевой аудитории сайта мы проанализировали сайты конкурентов в нескольких городах. Это позволило найти кое-какие полезные идеи для сайта.

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

2. Разработали прототипы интерфейса сайта


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

  1. разработку структуры сайта и карту пользовательских сценариев;
  2. разработку прототипов основных страниц сайта.
2.1. Разработали структуру сайта и карту пользовательских сценариев

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

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

Чтобы делать только полезные страницы, мы разработали карту пользовательских сценариев и далее на ее основе сделали структуру сайта. Мы брали выявленные ранее требования пользователей и подбирали подходящие решения. Проектировали карту путей пользователя от точки входа на сайт до решения вопроса.
2.2. Разработали прототипы основных страниц сайта
После того, как мы разработали структуру сайта, мы сделали wireframe'ы — низкодетализированные страницы сайтов. Затем из wireframe'ов мы собрали кликабельный прототип.

После того, как мы разработали структуру сайта, мы сделали wireframe'ы — низкодетализированные страницы сайтов. Затем из wireframe'ов мы собрали кликабельный прототип.
Далее мы провели внутреннее тестирование прототипа на предмет соответствия пользовательским сценариям. В результате мы нашли недочеты и доработали прототип.

В заключении, уже исправленный прототип мы защитили на рабочей встрече с заказчиком.

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

3. Разработали дизайн сайта

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

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

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

После этого мы разработали непосредственно дизайн сайта. Из особенностей проекта отметим следующие страницы: товара, магазина и акции.

3.1. Разработали дизайн страницы товара

Мы изучили поисковые запросы Яндекса и Гугла и учли все возможные способы поиска товаров в ЦУМе. Кто-то ищет товары, а кто-то — конкретные магазины.

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

3.2. Разработали дизайн страницы магазина

У каждого магазина ЦУМа теперь есть персональная страница на сайте. На ней можно ознакомиться с брендами, действующими акциями и посмотреть фото магазина.

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

У каждого магазина ЦУМа теперь есть персональная страница на сайте. На ней можно ознакомиться с брендами, действующими акциями и посмотреть фото магазина.
3.3. Разработали дизайн страницы акции

Для удобства поиска акции разбиты на категории. На сайте отображаются только идущие и будущие акции.

Пожалуй, это самая полезная для покупателей страница сайта.

Для удобства поиска акции разбиты на категории. На сайте отображаются только идущие и будущие акции.
4. Выполнили все технические задачи

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

  1. По готовому дизайну сверстали дизайн-макеты.
  2. После дизайна и верстки выполнили программирование на 1С-Битрикс.
  3. Далее настроили веб-аналитику.
  4. Выполнили SEO-оптимизацию.
  5. Наполнили сайт контентом.
Из особенностей проекта отметим следующие разделы: «План универмага», «Аренда», «О нас», «Инфокиоск».

4.1. Разработали раздел «План универмага»

Разработка плана торгового центра оказалась одновременно интересной и сложной задачей.

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

Из трудностей отметим, что сложно было обрабатывать планировки. Заказчик предоставил файлы AutoCAD, а нам пришлось переделывать их для плана из плоских в псевдо-3D.

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


4.3. Сделали версию сайта для инфокиоска

Сенсорный инфокиоск расположен на первом этаже ЦУМа. Инфокиоск выполняет роль навигатора по торговому центру.

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

На инфокиоск выводится тот же контент, что и на главный сайт. Это экономит заказчику время и деньги. Для этого мы разработали отдельную версию сайта : убрали все лишнее → изменили верстку → добавили через многосайтовость новую версию сайта → вывели на инфокиоск.
4.4. Разработали раздел «О нас»
Страницу решили сделать в виде лонгрида с отдельной навигацией. Таким образом мы знакомим пользователя с ЦУМом и его историей.

4.5. Интегрировали с Instagram
Предварительные исследования целевой аудитории указали на влияние соцсети Instagram на лояльность бренду.

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

Пользователь сразу видит качественный контент и это побуждает его стать подписчиком группы ЦУМа.

Григорьев Иван, руководитель проекта, Legacy
Мы разработали специальный модуль для Битрикса, который автоматически публикует последние пять публикаций из группы Instagram на сайте. Пользователь сразу видит качественный контент и это побуждает его стать подписчиком группы ЦУМа.
4.6. Настроили веб-аналитику
Если в офлайне отслеживать поведение покупателей затруднительно, то в веб-проектах измеряется почти все: источники трафика, целевые действия пользователей на сайте, состав заказов, доход и так далее.

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

В этом проекте мы спроектировали таблицу событий, настроили отправку микро- и макро-конверсий с сайта и их прием в Яндекс.Метрике.

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

Эту рутинную работу мы взяли на себя, избавив от нее заказчика.

5. Запустили сайт в работу

Этот этап — завершающий. Мы сделали следующее:

  1. Обучили заказчика работе с сайтом.
  2. Опубликовали сайт в сети Интернет.
  3. Провели финальную презентацию в формате «обещали → сделали».
Обучили. Чтобы заказчик смог эффективно пользоваться функционалом Битрикса, мы подготовили инструкции и обучили сотрудников заказчика работе с сайтом.

Поставили на гарантию. Чтобы обеспечить гарантию от Битрикса мы прошли аудит сайта по официальной программе «Монитор качества», который включает в себя 66 тестов.

Опубликовали. После завершения всех работ мы опубликовали сайт в сети Интернет. Для размещения сайта мы подобрали подходящий хостинг, соответствующий требованиям Битрикса.

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

Результаты

В результате, мы в срок по договору сделали, что обещали:

  1. Придумали и реализовали сценарий навигации по магазинам. Старый сайт этого не позволял.
  2. Сделали сайт точкой входа для нового клиента. Теперь сайт показывает, какие бренды и товары продаются в торговом центре.
  3. Лично изучили потребности арендаторов и узнали, чем им может помочь сайт. В результате сделали сайт агрегатором спецпредложений и презентаций. Это ценно для арендаторов.
Теперь сайт ЦУМа — современный и удобный для пользователей. Дизайн выполнен по бренд-буку заказчика. Верстка адаптивная — корректно выглядит на компьютерах, планшетах и смартфонах.

Дополнительные выгоды проекта:

  1. С новым дизайном сайта можно смело давать медийную рекламу в Интернете. Это будет компенсировать отток покупателей.
  2. С помощью сайта можно корректировать размытие позиционирования торгового центра. Можно просто не публиковать информацию о некоторых арендаторах. Это создаст желаемое впечатление luxury-брендов на посетителя.
Команда проекта
Команда Legacy:

  1. Руководитель проекта — Григорьев Иван;
  2. Полевые маркетинговые исследования — Григорьев Иван, Егоров Александр;
  3. UX-проектировщик / Веб-дизайнер — Козлов Игорь;
  4. Front-end разработчик — Угриновский Назарий;
  5. Back-end разработчики: Городецкий Илья, Невтыра Константин, Егоров Иван;
  6. Редактор кейса — Колупаев Вячеслав.


Команда Тюменского ЦУМа:

  1. Генеральный директор;
  2. Руководитель отдела маркетинга — Бабусенко Светлана;
  3. Руководитель отдела ИТ.

Хотите так же?

Чтобы начать разговор, позвоните по телефону +7 (495) 118-37-35 или напишите на e-mail sales@legacystudio.ru или оставьте заявку здесь: https://legacystudio.ru/. Мы отвечаем по будним дням с 09:00 до 18:00 MSK +02:00.

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

Приходите в гости

Я — Бондаренко Сергей, директор Legacy. Приглашаю вас в гости в наш офис: познакомлю с командой проекта, расскажу, как мы делаем проекты, покажу примеры работ.
Приходите в гости по адресу г. Тюмень, ул. 50 лет Октября, 36, корп. 1, эт. 3, оф. 304 : познакомим с командой проекта, расскажем, как мы делаем проекты, покажем примеры работ.

Построить маршрут в объезд пробок можно на Яндекс.Картах.

Заявка на подготовку предложения
Что будет после отправки заявки: позвоним → соберём данные → построим прогноз → презентуем проект → старт. На этапе сбора данных потребуются доступы к аналитике и рекламе, а также информация о звонках и продажах. Готовы подписать соглашение о конфиденциальности. Процесс включает личные встречи и занимает от 3 дней до 3 недель.

Нажимая кнопку «Отправить заявку », я даю свое согласие на обработку моих персональных данных, в соответствии с Федеральным законом от 27.07.2006 года №152-ФЗ «О персональных данных», на условиях и для целей, определенных в Согласии на обработку персональных данных