Шаблон не дає зробити те, що ми придумали, а кожна дрібниця — це хак у темі.
Вітрину пишемо як окремий застосунок (React). Дизайн і сценарії покупки обмежені лише задачею, а не темою. Бекенд при цьому лишається перевіреним.
Headless-магазин: швидка вітрина без обмежень шаблону
Ми відокремлюємо вітрину від «рушія» магазину (кошик, склад, замовлення) і збираємо її під ваш бренд на Shopify Hydrogen, Medusa або commercetools. Це дає свободу в дизайні, швидкість і гнучкі інтеграції.
Кошторис і строки після брифу
Кому підходить
- Магазини, які впираються в обмеження шаблонів Shopify, WooCommerce чи Хорошопа
- Бренди з нестандартним UX: конфігуратори, підбір за параметрами, складні набори
- Бізнес із кількома каналами: сайт, маркетплейси, застосунок, офлайн-точки
- Команди, яким потрібна власна логіка цін, знижок, B2B-кабінетів чи складів
Які задачі вирішуємо
Магазин повільний, а реклама й SEO приводять людей, які йдуть, не дочекавшись сторінки.
Робимо серверний рендеринг (сторінка збирається на сервері й приходить готовою), кешування та оптимізацію зображень. Вимірюємо Core Web Vitals до і після запуску.
Товари, ціни й залишки живуть у різних системах, і дані розходяться.
Будуємо інтеграційний шар через API: ERP або облікова система, CRM, пошта, платежі. Одне джерело правди для каталогу й замовлень.
Боїмося, що після запуску без розробника ми нічого не зможемо змінити.
Підключаємо CMS (Sanity, Contentful або вбудовану), щоб маркетолог сам міняв банери, добірки та сторінки. Усі акаунти й код — ваші за погодженими умовами.
Що входить у роботу
- Вибір платформи під ваш каталог, трафік і бюджет: Hydrogen, Medusa чи commercetools — з письмовим обґрунтуванням
- UX-прототип ключових сторінок: головна, категорія, картка товару, кошик, оформлення
- Розробка вітрини на React: Hydrogen (на Remix) або Next.js для Medusa і commercetools
- Налаштування бекенду: каталог, варіанти товарів, ціни, знижки, доставка, податки
- Платежі та доставка: підключення платіжних систем і перевізників для ваших ринків
- Пошук і фільтри: Algolia, Meilisearch або вбудований пошук платформи
- Підключення CMS для контенту, щоб редагувати без розробника
- Міграція товарів, клієнтів і історії замовлень, 301-редиректи зі старих адрес для збереження SEO
- Передача замовлень і клієнтів у CRM, налаштування розсилок та базових автоматизацій
- Аналітика (GA4, події покупки), тестування й запуск на вашому хостингу
Оберіть обсяг роботи
Пакет допомагає описати задачу. Кошторис і строки погоджуємо після брифу та уточнення вимог.
01
Hydrogen-вітрина
Магазин уже на Shopify, якому тісно в темі
- Вітрина на Shopify Hydrogen із вашим дизайном
- Головна, категорії, картка товару, кошик
- Підключення CMS і пошуку
- Міграція редиректів і базове SEO
- Розгортання на Oxygen або вашому хостингу
02
Medusa-магазин
Потрібна власна логіка й повний контроль над даними без плати за кожне замовлення
- Бекенд на Medusa (відкритий код, Node.js) на вашому сервері
- Вітрина на Next.js
- Свої модулі: ціни, B2B, склади, доставка
- Інтеграція з обліком і CRM
- Міграція даних та документація
03
Composable-платформа
Великий каталог, кілька брендів, країн чи каналів продажу
- Commercetools як API-ядро (хмарний сервіс)
- Окремі сервіси для пошуку, CMS, платежів
- Мультивалютність і кілька магазинів на одному ядрі
- Інтеграція з ERP, PIM, CRM
- План підтримки й моніторинг
Як працюємо
Бриф і вимоги
Ви описуєте задачу й поточний процес. Уточнюємо вимоги, обираємо перший етап і готуємо кошторис.
Архітектура та пілот із KPI
Обираємо платформу і збираємо пілот: одна ключова сторінка або сценарій покупки. Домовляємося про вимірювану ціль, наприклад швидкість завантаження чи кількість кроків до оплати.
Розробка спринтами
Строки визначаємо після уточнення обсягу й залежностей. Ви бачите прогрес, а не чекаєте до кінця.
Міграція й тестування
Переносимо дані, перевіряємо замовлення, оплату, доставку та редиректи. Тестуємо на реальних сценаріях покупки.
Запуск і підтримка
Запускаємо, стежимо за помилками й швидкістю перші тижні, навчаємо вашу команду. Оплата йде етапами, а доступи вже у вас.
Межі роботи
- Не обіцяємо зростання продажів: швидша вітрина прибирає перешкоди, але попит залежить від товару, ціни й реклами.
- Не радимо headless невеликим магазинам із простим каталогом: для них дешевший і розумніший звичайний магазин.
- Не обіцяємо, що всі застосунки Shopify запрацюють у Hydrogen: частину доведеться замінити чи підключити через API, і ми скажемо про це наперед.
Часті питання
Що таке headless-комерція простими словами?
Це коли «обличчя» магазину (сайт чи застосунок) і «мозок» (товари, ціни, замовлення) — окремі частини. Вони спілкуються через API (канал обміну даними між програмами). Тому вітрину можна зробити будь-якою, а бекенд не чіпати.
Чим відрізняються Hydrogen, Medusa і commercetools?
Hydrogen — вітрина для Shopify: швидкий старт, але ви лишаєтесь на платформі й її тарифах. Medusa — відкритий код, ви розміщуєте її самі й маєте повний контроль, але самі відповідаєте за сервер. commercetools — хмарний сервіс для великих каталогів із вищою вартістю ліцензії.
Чи зберу я SEO-позиції після переходу?
Ми переносимо адреси, мета-теги й структуру, ставимо 301-редиректи (постійні перенаправлення зі старих адрес). Невеликі коливання позицій одразу після запуску можливі, гарантувати збереження ми не можемо. Але робимо все, щоб ризик був мінімальним.
Які платежі й доставка доступні в Україні?
Порядок оплати погоджуємо разом із кошторисом до старту. Якщо проєкт має кілька етапів, описуємо результат і умови приймання для кожного. Підтримку та зовнішні сервіси враховуємо окремо.
Що від мене потрібно?
Доступ до поточного магазину й облікових систем, вигрузка товарів, бренд-матеріали й людина, яка приймає рішення на вашому боці. Решту ми зберемо самі. Усі акаунти (хостинг, домен, платформа) оформлюємо на вас.
Скільки це коштує насправді?
Кошторис готуємо після брифу й уточнення вимог. Для першого етапу можемо взяти такий обсяг: вітрина на Shopify Hydrogen із вашим дизайном; Головна, категорії, картка товару, кошик. Склад робіт, оплату й строки погоджуємо до старту.
Почнемо з вашої задачі
Опишіть бізнес, бажаний результат і поточний процес. Після брифу уточнимо вимоги та підготуємо кошторис.