Услуги

  • Сайты

  • Контент

  • Продвижение

  • Битрикс24

Все услуги
Все услуги

Поиск

  • Разработка интернет-магазина под ключ
  • Разработка сайтов
  • Разработка леднигов
  • Разработка на битрикс24
  • Разработка на Вордпресс

Редизайн интернет-магазина на Shop-Script

О проекте

Наше сотрудничество с интернет-магазином «Билка» — лидером по продаже аксессуаров для мобильных телефонов и планшетов в Украине — длится уже довольно долго. Сайт систематически поддерживается и развивается с помощью команды Вебнавтов.  Проводится SEO-оптимизация, а также реализуется множество функциональных доработок, без которых сложно продвигаться в современной е-коммерции. Несколько лет назад сайт удачно «переехал» на более новую систему управления контентом (CMS) с открытым исходным кодом — Shop-Script 7.

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

Общая идея и редизайн главной страницы

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

Вот так стала выглядеть главная страница после обновления:

Сайт визуально упростили, сделали прозрачнее, убрали из верхней части нагроможденные конструкции, состоящие из реквизитов, адресов и телефонов магазина. Вместо этого всю необходимую информацию вынесли одной строкой в шапке (верхней части сайта) и создали отдельную страницу: Меню=>Контакты:

Также эту информацию продублировали и в футере — нижней части сайта:

Страницы с товарами в выбранной категории

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

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

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

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

Страницы — карточки товара

Страницы с изображением выбранного товара также получили больше места. Это дало возможность уместить максимальное количество информации о продукте на странице. Логично вписался в концепцию небольшой блок с информацией о наличии товара, ценой, кнопкой «Добавить в корзину» и предложением «Оплата частями».

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

Добавление товара в корзину

Благодаря яркой и заметной кнопке «Добавить в корзину», стало намного проще сделать заказ. Она удобно расположена и призывает покупателя к действию.

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

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

Оформление заказа

Чтобы покупателю не пришлось заполнять большое количество полей, внося о себе информацию, страницу оформления заказа максимально упростили:

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

01

/ 02

Оформление блога

Блог в разделе «Новости» облегчили для восприятия, разделив контент на разделы: «Все новости», «В помощь потребителю», «Новости брендов», «Телефоны, смартфоны, характеристики». Так пользователю будет проще сориентироваться во всем многообразии контента.

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

01

/ 02

Адаптивный веб-дизайн

Так как мобильный трафик сегодня значительно превышает количество десктопных посещений, современный сайт должен корректно отображаться на различных устройствах. Сайт bilka.com.ua также наделен адаптивными свойствами. Легко и быстро он динамически подстраивается под мобильную версию. Понятное и лёгкое в использовании меню дублирует основную версию сайта.

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

01

/ 03

Обновление версии Shop-Script (с 7 до 8)

Поскольку изменения в дизайне затронули не только визуальную, но и функциональную часть, мы выполнили обновление платформы с Shop-Script 7 до Shop-Script 8. Чтобы после всех внесенных изменений сайт работал безупречно, поправили возникшие проблемы совместимости кода. Теперь владельцы и администраторы интернет-магазина bilka.com.ua развивают свой бизнес с помощью новейших функций, которые сегодня предлагает Шоп Скрипт.

Заключение

Благодаря комплексному подходу наших специалистов к редизайну, сайт bilka.com.ua получился стильным и современным. Лёгкий и быстрый, логически понятный пользователю, он стал эффективным инструментом в е-коммерции.

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

Хотите заказать редизайн интернет-магазина на Shop Script 7 / 8 (Webasyst)?

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