Інтернет-магазин · WooCommerce

«Американський пиріг»

Сайт доставки з нуля для луцького закладу з піцою, суші, бургерами й мексиканською кухнею. Індивідуальний дизайн, зв’язка з Poster і бонусами, вхід за SMS і Telegram для персоналу.

Клієнт
Заклад «Американський пиріг», Луцьк
Роль
Розробка під ключ і ведення дизайну
Формат
Довгострокова розробка
Рік
2025
Головна сторінка магазину доставки їжі на десктопі: слайдер акцій, меню категорій і кошик
01 Задача

Клієнту потрібен був сайт доставки з нуля: велике меню, онлайн-оплата, бонусна програма, зв’язок з обліком у Poster і дві точки самовивозу.

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

02 Що зроблено
  1. Індивідуальний дизайн: знайшов дизайнера, поставив задачу й вів роботу: клієнт спілкувався лише зі мною. Дизайн створено під бренд у Figma, файл належить клієнту.
  2. Poster і бонуси: клієнт сайту прив’язується до клієнта в Poster за номером телефону. Бонуси («пиріжки») і персональна знижка підтягуються з Poster, бонусами можна оплатити частину замовлення. Замовлення автоматично потрапляють у Poster.
  3. Карта зон доставки: три зони й 18 населених пунктів на карті: клієнт одразу бачить ціну доставки, мінімальну суму й поріг безкоштовної доставки. Ціни зон власник змінює сам у налаштуваннях.
  4. Час доставки під завантаження кухні: менеджер перемикає в Telegram рівень завантаження, і час доставки на сайті сам зсувається на 30 або 60 хвилин. Вибір «найшвидше» або на конкретну годину.
  5. Повітряні тривоги: інтеграція з державним API тривог: персонал отримує в Telegram список актуальних замовлень, клієнтам в один клік іде SMS, на сайті з’являється повідомлення.
  6. Вхід за SMS: без пароля, з автозаповненням коду на телефоні й реєстрацією за номером. У кабінеті: дані, адреса, історія замовлень, ваучери й промокоди.
  7. Оплата й чекаут: готівка, картка при отриманні або LiqPay онлайн. Самовивіз із двох точок, «решта з…», «передзвонити мені».
  8. Акції: ваучери-набори з лімітами на клієнта, купони, які менеджер створює прямо в Telegram-боті, і колесо фортуни після онлайн-оплати від заданої суми.
03 Результати Швидкість · Lighthouse
93 PageSpeed на мобільному Lighthouse
98 PageSpeed на десктопі Lighthouse
18 населених пунктів на карті доставки

Сайт, Poster і Telegram персоналу працюють як одна система. Бонуси й знижки з Poster видно прямо на чекауті, а власник сам змінює ціни зон і мінімальні суми, без програміста.

Звіт Lighthouse, головна сторінка магазину доставки їжі на мобільному: Performance 93, Accessibility 100, Best Practices 100, SEO 100
Lighthouse · мобільний
Звіт Lighthouse, головна сторінка магазину доставки їжі на десктопі: Performance 98, Accessibility 100, Best Practices 100, SEO 100
Lighthouse · десктоп
Стек
  • WordPress
  • WooCommerce (HPOS)
  • ACF Pro
  • PHP
  • JavaScript
  • REST API
  • Poster
  • LiqPay
  • SMSClub
  • Telegram Bot API
  • Leaflet
04 Екрани Десктоп + мобільна Гортайте →
Сторінка оформлення замовлення під час повітряної тривоги: червоний банер угорі та повідомлення, що замовлення приймаються, а кур’єр виїде після відбою
Повідомлення про повітряну тривогу на сайті
Оформлення замовлення: карта зон доставки з тарифами зон A, B і C, вибір дати й часу доставки та способу оплати
Оформлення із зонами доставки й часовими слотами
Вхід до кабінету на мобільному: поле номера телефону та кнопка «Отримати код»
Вхід за SMS без пароля
Кошик на мобільному: акційна піца, пакет, соуси до замовлення, сума 215 грн і кнопка «Оформити замовлення»
AJAX-кошик
Комбо-ваучери на мобільному: «Супербоул Снек» за 395 грн замість 465 грн і «Середній Захід» за 990 грн замість 1170 грн, з позначкою про завершену акцію
Комбо-ваучери
Telegram-бот керування доставкою: вибір рівня навантаження (низьке, середнє, високе), кнопка «Створити купон» і повідомлення «Купон успішно створено» зі знижкою 20%
Купони з Telegram-бота
Приймаю нові проєкти

Хочете такий результат?