Інтернет-магазин для бренду Mr.Snack з реалізацією конструктора
Mr.Snack
Український бренд крафтового м’яса, який руйнує стереотипи про мʼясні снеки. Прагне стати лідером у галузі смачних подарунків, а також пропонує оптову та корпоративну співпрацю.
Завдання проєкту
- збільшити кількість продаж за допомогою нового трендового дизайну,
- створити індивідуальний дизайн сайту, який відображає ідентичність бренду,
- перенести онлайн магазин до CMS OpenCart та познайомити Клієнта з її функціоналом,
- налаштувати електронну комерції для Клієнта,
- розробити інтерактивний конструктор набору,
- інтегрувати онлайн магазин з CRM системою,
- інтегрувати онлайн магазин зі сервісами доставки Нова Пошта + Укрпошта та Email-розсилки.
- виконати адаптивну верстку,
- оптимізувати швидкість сайту.
Каталог товарів та категорії
Mr.Snack пропонує величезний асортимент м’ясних снеків. Тому категорію з продукцією «Магазин» ми поділили на три каталоги: «М’ясні снеки», «Набори» та «Ще смачненьке». Фільтр кожного каталогу з товарами має сортування за ціною, популярністю, видом м’яса, смаком снеків і вагою. Також, ми відмалювали позначки Бестселер, На подарунок, Ексклюзивна та рівень гостроти з кількістю перців на позначці. Це підштовхує користувача до покупки та робить його досвід максимально зрозумілим і приємним.
При переході до каталогу з напоями, з’являється поп-ап з підтвердженням віку відвідувача сайту.
Конструктор набору
Mr.Snack — це експерти у галузі смачних подарунків. А тому, команда піклується про спеціальний підхід до кожного клієнта. Тепер достатньо подумати про свій ідеальний пакунок снеків — і конструктор набору втілить його у реальність!
Конструктор набору — це інструмент, який дозволяє створити власний набір з улюблених снеків.
Крок 1 — обираємо кількість позицій у коробці.
Крок 2 — додаємо вподобані позиції до набору.
Крок 3 — додаємо ваш унікальний набір до кошика.
Виклики цього проєкту
У Mr.Snack є канали для продаж в соцмережах, чат-бот, але онлайн магазин був застарілим та не конвертував замовлення. Викликом для нашої команди було підібрати зручну систему керування вмістом, зробити редизайн і розробити якісні рішення для електронної комерції у індустрії їжі (конструктор набору).
Картка товару
Ми використали лаконічний вид картки товару з акцентними жовтими кольорами бренду. Картка також містить інформацію про склад продукту, енергетичну цінність, доставку та оплату. Додали слайдер «Разом з цим товаром купують» для збільшення середнього чеку.
Кошик
Кошик відображається у формі бокового меню, без переходу на окрему сторінку. Такий «передогляд» покупок зараз є найзручнішим. Також, у хедері сайту є тригер до більшого чеку: закріплена ковзаюча лінія, завдяки якій виділяється пропозиція безкоштовної доставки від 1500 грн.
За кнопкою «Оформити замовлення» у боковому меню, користувач одразу переходить до сторінки спрощеного чекауту, функціонал якого поділений на покровові блоки з полями для замовлення. Клієнт може створити персональний акаунт та зберегти свої дані, переглядати історію замовлень + отримати мінус 10% на перше замовлення при реєстрації на сайті — цю інформацію ми помістили у виникаючий поп-ап.
Адаптивний дизайн
Усі сторінки в онлайн магазині Mr.Snack адаптивні та оптимізовані для мобільних пристроїв, а також настільних комп’ютерів. Метою адаптивного дизайну є поліпшення досвіду користувача (UX) за рахунок пристосування до різних розмірів екранів, піксельної роздільності та контексту використання.
Рішення для Mr.Snack
- ми розробили онлайн магазин на CMS OpenCart,
- розробили UX/UI дизайн онлайн магазину для бренду м’ясних снеків,
- розробили окремий інструмент для персоналізації замовлень — конструктор наборів,
- підключили інтеграції з CRM, онлайн оплатами, службами доставки та Email-розсилкою,
- налаштували електронну комерції для Клієнта,
- виконали адаптивну верстку,
- оптимізували швидкість сайту.