Сумісність замість здогадок: e-commerce для Notebook Battery

У магазині батарей для ноутбуків є одна проблема, яку не вирішиш звичайним фільтром «від дешевих до дорогих». Покупцеві потрібно знати головне: чи підійде ця батарея саме до його пристрою.

Для Notebook Battery ми створили high-performance e-commerce на Drupal 11, де пошук товару побудований навколо швидкого вибору, сумісності та мінімальної кількості зайвих дій.

Платформа працює одночасно для роздрібних покупців, оптових клієнтів і сервісних центрів. Великий каталог, часті запити, мобільний трафік та інтеграції з маркетплейсами вимагали не просто функціонального магазину, а системи, яка швидко реагує на кожну дію користувача.

Тут шукають ту саму батарею

Notebook Battery працює з оригінальними, сумісними, посиленими та стандартними акумуляторами для ноутбуків та інших електронних пристроїв. Тому головний UX-сценарій сайту — не випадковий перегляд каталогу, а точний пошук потрібної моделі.

Ми сфокусували платформу на:

• швидкому пошуку та фільтрації;
• підборі батареї за параметрами сумісності;
• роботі з великим каталогом;
• миттєвій взаємодії без зайвих перезавантажень;
• зручному mobile experience;
• швидкому оформленні замовлення.

Фільтр, який не змушує чекати

Коли каталог великий, навіть кілька зайвих секунд під час фільтрації можуть перетворити пошук товару на випробування. Тому для Notebook Battery реалізували власну систему пошуку Mysearch у зв’язці з Fast Filters. Дані обробляються через API, а результати оновлюються динамічно.

Користувач може швидко звужувати вибір за характеристиками та сумісністю, не проходячи через нескінченні перезавантаження сторінок. 

Менше кліків → швидше рішення → коротший шлях до замовлення.

Швидкість починається ще до кліку

Продуктовий каталог — це не тільки дані, а й велика кількість зображень. Якщо завантажувати їх усі одразу, сторінка швидко перетворюється на важкий багаж. Тому ми оптимізували роботу з медіа за допомогою Lazy Loading, Blazy, ImageMagick та Image Effects.

Зображення завантажуються ефективніше, сторінки каталогу працюють легше, а мобільний досвід не залежить від того, наскільки швидким є інтернет у користувача. Додатково використали Page Cache, Dynamic Page Cache, Internal Page Cache та інструменти мінімізації HTML і JS.

Один магазин — різні сценарії

Notebook Battery працює не лише з кінцевими покупцями. Важливою аудиторією є сервісні центри та професіонали, яким потрібно регулярно знаходити та замовляти комплектуючі. 

Тому платформа має підтримувати різні сценарії взаємодії з каталогом — від швидкого пошуку однієї батареї до регулярної роботи з асортиментом. На рівні e-commerce за це відповідає Drupal Commerce, який забезпечує товари, ціни, кошик, доставку та обробку замовлень.

Сайт синхронізований із маркетплейсами

E-commerce не закінчується на власному сайті. Товари Notebook Battery мають бути присутні й на зовнішніх майданчиках.

Для цього створили автоматизований YML-export через кастомний модуль Myyml. Він дозволяє передавати дані про товари на зовнішні платформи та синхронізувати актуальну інформацію про асортимент і ціни. Тобто менеджерам не потрібно щоразу вручну переносити каталог у десятки місць.

Drupal 11 під навантаженням

Платформа побудована на Drupal 11.3.8 із Drupal Commerce, Search API, кастомними модулями та набором інструментів для оптимізації продуктивності. Окремі custom modules відповідають за пошук, API, логіку батарей, AJAX-взаємодію, пагінацію, рейтинги, breadcrumbs та YML-експорт.

Для SEO та індексації використали Metatag, Pathauto, Redirect, Simple XML Sitemap, Robots.txt та Google Tag. А Myrating додає до каталогу відгуки й оцінки користувачів — важливий елемент довіри, коли покупець обирає сумісний компонент і хоче переконатися у правильності вибору.

Швидкий шлях від моделі ноутбука до замовлення

У результаті Notebook Battery отримав high-performance Drupal Commerce platform, оптимізовану під складний каталог і часті користувацькі взаємодії.

Система поєднує:

• швидкий пошук і фільтрацію за сумісністю;
• AJAX-взаємодії без зайвих перезавантажень;
• оптимізовану роботу з медіа;
• кешування для high-load сценаріїв;
• mobile-friendly e-commerce;
• рейтинги та відгуки;
• автоматизований товарний export;
• SEO-інфраструктуру;
• кастомну бізнес-логіку на Drupal 11.

Ваш e-commerce теж може працювати швидше, ніж користувач встигає натиснути «оновити»

Якщо каталог уже став занадто складним для стандартного магазину, ми допоможемо перетворити його на швидку й масштабовану digital-систему — з розумним пошуком, кастомним функціоналом та архітектурою, готовою до навантажень. Не змушуйте клієнта чекати сайт. Нехай сайт встигає за клієнтом.