Послуги

  • Сайти
  • Контент
  • Просування
  • Бітрікс24
  • Додатки
Усі послуги Оплата
Бітрікс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 і готові зробити Ваш майданчик більш привабливим з погляду дизайну – зі зростанням конверсії та позицій у пошукових системах. Напишіть нам сьогодні!

Над кейсом работали