KLO App

KLO - столична автозаправна мережа, яка має 79 станцій із кафе, ресторанами, автомийками та іншими сервісами, яка обслуговує понад 2 мільйони клієнтів. За 25+ років KLO стали одним із лідерів паливного ринку в Україні. Вони відомі своїми інноваціями та екологічними ініціативами. Сьогодні KLO обслуговує понад 2 мільйони клієнтів через програму лояльності “ДякуYOU” та має 64 АЗК із кафе, ресторанами, автомийками й іншими сервісами.

В 2022 році компанія звернулася до нас із завданням повністю оновити мобільний застосунок та розробити нову веб-ідентичність, щоб відповідати сучасним потребам користувачів. Попередній додаток було розроблено на React Native, він мав проблеми з продуктивністю, функціональністю та дизайном, тому було прийнято рішення про глобальний редизайн. Ми взялися за задачу розробити новий, нативний під iOS та Android застосунок, який повинен був мати унікальний дизайн та функціонал (майже 80% всіх компонентів застосунку не нативні, а створювалися нашими розробниками з нуля)







Унікальність застосунку



Ми перейшли на нативні технології, замість React Native ми розробили два окремих застосунки для iOS та Android. Писали на Swift для iOS та Kotlin для Android. Це дозволило значно покращити стабільність, швидкість роботи та плавність інтерфейсу застосунку

Розроблено Талони - це проєкт в рамках КЛО, який має інтеграцію з 1С та реалізовує продаж паливних талонів. Талони дають змогу планувати бюджет, їх можна надсилати друзям.
Є інтеграція з корпоративним модулем так, що бізнеси можуть надавати своїм працівникам літри або гривні для заправки з відображенням у додатку.






Новий Backend


Ми замінили MSSQL на PostgreSQL, що зробило систему більш швидкою та надійною. Новий backend побудований на Nest.js, що дало можливість створити гнучку та масштабовану архітектуру. Додатково провели оптимізацію архітектури та реалізували міграцію на AWS. Це рішення дозволило знизити витрати на сервери на 70%, забезпечити стабільну роботу всіх сервісів та підвищити масштабованість застосунку.

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






Внутрішні системи


Розроблено внутрішній проєкт для КЛО, який автоматизує ключові процеси на АЗС

Прийом товарів: співробітники через мобільний застосунок сканують штрихкоди продукції, після чого вона одразу ставиться на облік. Підв'язали GPS та зчитуємо локацію користувача, додаток розуміє біля якої станції знаходиться користувач і пропонує обрати колонку, після чого можна оплатити онлайн та заправитися не стоячи в черзі на касі. Також є бонуси, якими можна ділитися з друзями, або по QR коду на бейджах працівників АЗК та залишати чайові

Додатково ми впровадили ряд інтеграцій, серед яких:


- Зовнішня система лояльності,
- Реалізували можливість аутентифікації та отримання даних користувачів через розроблені нами протоколи Auth2
- Firebase
- GoogleMaps з розставленими автозаправними станціями, з функціями "найближча заправка", прокласти маршрут. По кліку відкривається повна інформація про заправку та сервіси, що на ній доступні
- IPay, ApplePay, GooglePay







Новий дизайн та UX


Окрім технічної розробки мобільного застосунку, ми створили нову діджитал-ідентичність для KLO, UI-Kit та дизайн-систему для цифрових продуктів компанії, а також повний редизайн UX-складової для інтуїтивного та зручного використання застосунку користувачами





Як проходила робота над проєктом

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

Наступним кроком ми взялися за розробку концепції. На основі отриманих даних ми створили концепт нового додатку, орієнтуючись на потреби користувачів і бізнес-процеси компанії KLO. Після створення нового дизайну та High fidelity макетів в Figma, ми в декілька етапів затверджували дизайн з замовником. Після затвердження дизайну ми почали процеси розробки застосунку під визначені операційні системи



Запуск та підтримка

Після успішного релізу застосунку в App Store та Play Market ми продовжуємо підтримувати додаток, а також розробляємо нові функції, наприклад онлайн-запис на автомийку або покупку товарів чи кулінарії через нові блоки всередині застосунку. Також працюємо над розробкою внутрішніх систем KLO, щоб покращити зручність та підвищити продуктивність персоналу, який обслуговує АЗК KLO та впроваджує послуги для клієнтів або підрядників компанії


Результати


Як результат ми отримали продуктивність та стабільність через використання нативних технологій, зробивши додаток швидшим і плавним в роботі. Оптимізували бізнес-процеси через інтеграцію AWS і RabbitMQ, яка спростила управління ресурсами та покращила сервіс. Впровадили новий рівень користувацького досвіду – завдяки редизайну, застосунок став більш зручним та сучасним. Отримали вражаючі відгуки від користувачів – середній рейтинг 4.8 на iOS та Android, понад 65 000 позитивних відгуків.

Тепер додаток KLO легко маштабується та пропонує топовий користувацький досвід. Зі слабкого рішення він став улюбленим застосунком клієнтів мережі АЗК KLO