Crazycrab - застосунок для HoReCa

Мобільний застосунок для HoReCa

Mobile App for HoReCa | Malevich Studio Portfolio

Клієнт

Crazycrab

Індустрія - HoReCa
Локація - Україна
Website for HoReCa | Malevich Studio Potrfolio

Послуги

Застосунок для Android
Застосунок для iOS
Крос-платформний застосунок
UI/UX дизайн

Технологічний стек

React Native - stack technology Malevich company
Typescript - stack technology Malevich company
GraphQL - stack technology Malevich company
Bitbucket - stack technology Malevich company

Виклик

01.
Створити повноцінний UX/UI дизайн та розробити мобільний застосунок, що відтворює ключовий функціонал сайту - включно з каталогом товарів, акціями, кошиком, доставкою та оплатою. Метою було забезпечити нативний UX для iOS та Android, гарантуючи плавну навігацію та інтуїтивно зрозумілу взаємодію. Крім того, застосунок мав підтримувати push-сповіщення та базову програму лояльності для підвищення залученості та утримання користувачів.
РішенняРішення

Ми розробили повноцінний UX/UI у Figma, починаючи з інформаційної архітектури та користувацьких сценаріїв, що охоплюють весь шлях - від онбордингу та перегляду каталогу до оформлення замовлення та відстеження статусу. Було створено масштабовану дизайн-систему з токенами, компонентами та станами взаємодії для забезпечення візуальної узгодженості та ефективності розробки. Було створено інтерактивні прототипи для перевірки зручності використання та спрощення співпраці.

 

Для розробки мобільного застосунку (iOS та Android) ми використали React Native + TypeScript для реалізації навігації, управління станом та локалізації. Застосунок інтегрується з бекендом через API для синхронізації меню, цін та акцій у реальному часі. Ключові функції включають промокоди, модифікатори товарів, перевірку зони доставки, функцію «повторити замовлення», push-сповіщення та модуль історії замовлень.

 

Фінальні білди були підготовлені для TestFlight та Play Console, разом з примітками до релізу та інструкціями з розгортання.


 

Технології:

Figma

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

React Native

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

TypeScript

Додав типову безпеку та покращив надійність коду, мінімізуючи помилки та спрощуючи співпрацю в команді розробки.

React Navigation

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

GraphQL

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

Bitbucket

Використано для контролю версій та CI/CD, оптимізуючи співпрацю між дизайнерами та розробниками, автоматизуючи білди та підтримуючи якість коду протягом усього життєвого циклу проєкту.
Mobile App HoReCa | Malevich Studio Portfolio

Результат

01.

Єдиний дизайн і розробка

Узгоджений UX/UI та повністю синхронізований мобільний застосунок і сайт.

02.

Більше повторних покупок

Функція повторного замовлення та персоналізовані push-кампанії збільшили кількість користувачів, що повертаються.

03.

Покращена залученість користувачів

Цільові нагадування та акції підвищили активність у застосунку.

04.

Оптимізовані операції

Єдина адмін-панель спростила управління каталогом, цінами та акціями.

05.

Знижені витрати та ручна робота

Централізоване управління усунуло надлишкові процеси та прискорило оновлення.

06.

Швидкі й надійні релізи

Єдина кодова база React Native та автоматизовані конвеєри забезпечили швидкі, стабільні оновлення на iOS та Android.