Разработка интернет-магазина часов GENEVA

Сайты

Клиент

Сеть салонов Geneva является официальным дилером ведущих швейцарских часовых марок:
  1. Tissot;
  2. Certina;
  3. Hamilton;
  4. Longines;
  5. Tag Heuer;
  6. Rado;
  7. Cartier;
  8. Hublot;
  9. Ulysse Nardin;
  10. Omega.
Люксовое подразделение компании также реализует дорогие украшения и предметы интерьера.

Часовой бизнес (если мы говорим о часах, а не «распродаже конфиската, купи Tag Heuer за 5000 р. и получи Tissot в подарок») является очень традиционным и консервативным. Даже сами производители смотрят на интернет-магазины с подозрением — до сих пор у некоторых марок существует прямой запрет для дилеров продавать часы через глобальную сеть. Но против общей тенденции не пойдёшь — сейчас и дилеры и производители понимают, что надо выходить в онлайн.

Задача

Можно описать задачу, с которой к нам обратились кратко — перевести бизнес по продаже часов в интернет-магазин. Эта идея разделена на составляющие — разработка сайта, интернет-маркетинг, CRM. Начали с первого пункта.

У старого интернет-магазина было несколько серьезных проблем:
  1. Сильно устаревший дизайн;
  2. Представители часовых марок нервничали, т.к. ресурс не отвечал их требованиям;
  3. Интернет-магазин не имел адаптивности — с мобильных и планшетов пользоваться им неудобно;
  4. Каталога часов отсутствовал совсем — это минус и для покупателей и для SEO.
А у нас были (и есть, кстати):
  1. Классный дизайнер;
  2. Верстальщик, сделавший несколько десятков адаптивных сайтов со сложными js эффектами;
  3. Программист, для которого не то что электронный-каталог, а b2b личный кабинет с интеграцией с несколькими системами сделать — раз плюнуть;
  4. И скромный менеджер проекта (не буду себя хвалить).
Соревновательный дух добавляли сжатые (для разработки проекта с дизайном и адаптивной версткой и импортом каталога в несколько тысяч позиций) сроки — 3 месяца от старта, до запуска.

Решение

На что мы сделали особый упор:

Красота

Бизнес клиента — дорогие наручные часы. Это рынок, где особое значение имеет красивый, строгий дизайн. Осложняет ситуацию дюжина часовых брендов. Каждый со своей историей, стилем, алгоритмом формирования названий часов и т.д. Учесть все нюансы сложно, но мы справились. Расскажу о разработке трёх самых интересных визуальных решений на проекте.

Видео на фоне

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

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

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

Классный и умный фильтр

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

Смотрите, как мы спроектировали выбор бренда, разделив, при этом, бренды по уровню: Умный фильтр — выбор бренда Умный фильтр — выбор бренда

Естественно, весь джентльменский набор мы также реализовали:
  1. Фильтр с подгрузкой товаров по аяксу (без нажатия на «применить»);
  2. Выбор количества элементов на странице;
  3. Сортировка;
  4. Указания, сколько элементов найдено и т.д.

Лаконичная и аккуратная карточка часов

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

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

Адаптивность

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

Мы делаем адаптив хорошо — у нас хороший верстальщик, а тестирование проводится на реальных устройствах. Часто бывает, что на планшетах и мобильных работать с сайтом даже удобнее, чем на ПК.

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

Обычно товары выгружают из 1С. Но в нашем случае, этот вариант не подходил — слишком уж «страшный» вид имели названия моделей в учётке. А ни о каких характеристиках и картинках речь и вовсе не шла.

Решили, что всю информацию по ассортименту мы соберем в .csv.

Всё звучит просто, но представьте, что загрузить из .csv надо и коллекции и бренды и особенности. А это не просто свойства товара, а полноценные сущности, со своими детальными страницами и логикой работы.

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

Набор элементов для самостоятельного формирования страницы

Работать с ведущими швейцарскими часовыми брендами почётно, но нелегко. У каждого из них свои, десятилетиями, а то и веками, выработанные правила оформления. Где и как должен располагаться логотип. Как изображение часов должно сочетаться с заголовком и текстом. И сотни других правил из брендбуков Tissot, Omega, Longines, Rado, Hublot, Cartier, Ulysse Nardin…

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

Но те, кто знаком с визуальными редакторами для публикации контента в вебе, знают, как это непросто. Мы решили задачу с помощью разработки так называемых сниппетов — набора элементов для самостоятельного конструирования экранов. Для клиента мы создали следующие блоки:
  1. Текст + картинка слева;
  2. Текст + картинка справа;
  3. Текст в две колонки;
  4. Текст + картинка на всю ширину;
  5. Картинки с подписями в две колонки;
  6. Важный текст.
Эти блоки могут использоваться в текстовых страницах (о компании, гарантии, сервис и т.д.), описаниях брендов и новостях.

Конечно, мы не отнимали возможность воспользоваться стандартным инструментарием визуального редактора (или вообще сверстать всё, используя html). Набор готовых элементов Набор готовых элементов

Вывод

Сейчас все понимают — сама по себе разработка интернет-магазина часов (даже такого стильного и функционального, как мы сделали:)) не принесет много пользы. Нужны комплексный маркетинг, интеграция с УС, подключение CRM, работа над визуальной составляющей продукта и т.д.

Сила ИНТЕРВОЛГИ, как веб-интегратора, как раз в том, что мы можем предложить весь спектр услуг — и сложные платформы соединить друг с другом, и над лидогенерацией поработать.

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

Однако, важно не только привести больше посетителей и покупателей на посадки. Повышение конверсии (а следовательно и прибыли) и качественная обработка продаж невозможны без CRM, поэтому в планах также внедрение Битрикс24 и интеграция её с сайтом.


Если у вас есть такая комплексная и сложная задача, а все студии берутся только за какую-либо отдельную её часть — позвоните нам — интегрируем, продвинем, сделаем.
Результат
Над проектом работали
Артём З.
Антон Колодницкий
Александр К.
Дмитрий М.

Статьи по теме

Выжимаем максимум скорости из PHPКогда дело доходит до запуска PHP-приложений, выбор подходящего веб-сервера критически важен. Цель статьи — помочь в выборе оптимального решения для своих проек...
Организация поиска на сайте: выбираем между поиском Битрикса, Sphinx и ElasticsearchВ статье разбираем популярные поисковые движки, чтобы выбрать лучший под задачи конкретного проекта. Даем советы по индексации каталога и построении «умного» фи...
Доработка системы LMS KnomaryMust have для бизнеса, где главный актив это люди, — стратегия обучения и развития персонала. Рассказываем как помогли доработать LMS-систему для компании ЕВРАЗ...
Автоматизация процесса командировки в Битрикс24: как сэкономить на деловых поездкахЕсли сотрудники часто ездят в командировки, а бюджет на них исчисляется суммой с 6-7 нулями, то можно прилично экономить, автоматизировав процесс в Битрикс24 ...
«Как раньше» больше не работает — B2B-система продаж сейчасВ этой статье хотим поговорить с чем сейчас сталкивается оптовый бизнес (множеством вызовов и изменений, которые требуют адаптации, а также оптимизации процессо...
Интеграция B2B-платформы на Битрикс с системой авторизации KeycloakВ период бурного роста компании менеджмент учетных записей сотрудников и клиентов может стать проблемой. Решение — интеграция с брокером авторизаций Keycloak ил...
Мы работаем по одному из двух форматов:
  • аренда команды (от 2 человек, не менее 3 месяцев);
  • итерации с фиксированной ценой (1-3 месяца длительностью).
ИНТЕРВОЛГА предоставляет:
  • регулярные онлайн-планерки с заказчиком;
  • квалифицированных специалистов;
  • организованную команду (находятся в одном помещении, что упрощает решение рабочих вопросов);
  • полную прозрачность и регулярность отчетов о результатах.
Ключевые услуги:
  • нагруженный интернет-магазин;
  • личный кабинет;
  • оптовые продажи — B2B-платформа;
  • маркетплейс;
  • технический аудит сайта;
  • Битрикс24 — корпоративные HR-порталы;
  • Битрикс24 — построение CRM-системы;
  • Битрикс24 — личные кабинеты сотрудников;
  • Битрикс24 — аудит портала;
  • 1С — интеграция с другими системами;
  • 1С — доработка системы;
  • маркетинг — комплексное интернет-продвижение;
  • маркетинг — продвижение для B2B.