EN UA

Наступний

Віджет мапи тривог — розробка віджету мапи повітряних тривог для робочого столу телефона

UX/UI Дизайн
розробка
SwiftUI
Kotlin
Centrifuge
Індустрія
Критичні оповіщення
Локація
Україна
Рік
2024-дотепер

Задача

Мета проєкту - віджет Мапа тривог - забезпечити користувачам легкий доступ до важливої інформації про різні види тривог прямо на робочому столі смартфону.

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

clock-arrow
clock-arrow

Рішення

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

Ми додали інтеграцію Telegram сповіщень у застосунок. Сповіщення надходять від Повітряних Сил ЗСУ та охоплюють головні події та історію тривог. У меню ви можете ввімкнути або вимкнути ці сповіщення. Вікно Telegram має кілька станів: вимкнене, повністю згорнуте, розгорнуте наполовину та розгорнуте на весь екран. Після входу в застосунок, за замовчуванням, вікно Telegram буде розгорнуте наполовину. Розгортання та згортання вікна відбувається поетапно: наприклад, знаходячись у другому стані, ви можете свайпом вгору перейти до третього стану і так далі.

clock-arrow

Дизайн

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

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

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

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

clock-arrow
clock-arrow

Розробка

Для бекенд-розробки нашого віджету ми використали PostgreSQL як основну базу даних для надійного та ефективного зберігання даних. Centrifugo було впроваджено для обміну повідомленнями в режимі реального часу та миттєвих оновлень, а Redis відповідав за кешування та управління сесіями для підвищення продуктивності.

ASP.NET забезпечив нашу внутрішню логіку та API, надаючи безпечні та ефективні RESTful-сервіси. Ми інтегрували Telegram Client Library, щоб полегшити зв'язок з API Telegram, що дозволяє отримувати прямі сповіщення користувачам. APNS доставляє push-повідомлення на пристрої iOS, а Firebase керував push-повідомленнями, оновленнями в режимі реального часу та аналітикою. Таке поєднання технологій забезпечило віджету гнучку, оперативну та масштабовану внутрішню інфраструктуру, що працює в режимі реального часу.

clock-arrow

Android

Для розробки віджетів для Android ми використовували такі ключові технології:

  • Kotlin - обрана за лаконічний синтаксис та потужну підтримку Android.

  • ViewBinding - спрощена взаємодія з користувацьким інтерфейсом за допомогою класів зв'язування з безпечним типом

  • Coroutines - ефективно обробляють асинхронні завдання, забезпечуючи безперебійну роботу.

  • Navigation Components - легке керування навігацією

  • Centrifuge - Увімкнена комунікація в режимі реального часу для миттєвих оновлень

  • Firebase - Надає внутрішні сервіси, такі як оновлення в режимі реального часу, аутентифікація та аналітика

  • OkHttp3 - слугував нашим ефективним HTTP-клієнтом для мережевих запитів

  • Retrofit2 - керує викликами API та легко інтегрувався з GSON

  • GSON - Handled JSON serialization and deserialization

  • Koin - використовується для впровадження залежностей, зменшуючи шаблонний код

Ця комбінація забезпечила надійний, ефективний та масштабований віджет для Android.

clock-arrow

iOS

Для розробки віджету для iOS ми використали набір сучасних технологій, призначених для створення адаптивного, ефективного та візуально привабливого інтерфейсу:

  • SwiftUI - створено адаптивний та динамічний інтерфейс користувача

  • WidgetKit - кероване створення та життєвий цикл віджетів

  • Combine - плавно обробляє асинхронні оновлення даних

  • SwiftCentrifuge - увімкнення зв'язку в реальному часі для миттєвого оновлення

  • Background Push Notifications - забезпечують оновлення віджету найсвіжішими даними

  • Firebase - надав бекенд-сервіси, включаючи аналітику та push-повідомлення

  • PocketSVG - рендеринг масштабованої векторної графіки для чітких візуальних ефектів

Ця комбінація дозволила нам створити візуально привабливий, високопродуктивний віджет для iOS з оновленнями в режимі реального часу.

clock-arrow

Візуальний стиль

Віджет Мапи Тривог демонструє уніфікований інтерфейс у темних тонах з використанням глибокого вугільного фону, що дозволяє яскравим кольорам (червоному, помаранчевому та жовтому) з'являтися і негайно привертати увагу до критичних регіонів. Чиста типографіка без зарубок, мінімалістична іконографія та стратегічні зелені акценти для індикаторів стану забезпечують високу контрастність і чіткість, створюючи інтерфейс, оптимізований для швидкого моніторингу в режимі реального часу.

colorcolor
typography
typography
slide
slide
slide
slide
slide
slide

Результат

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

  • 110K
    завантажень
  • 6 місяців
    тривалість проєкту
  • 4.2
    рейтинг

Команда проєкту:

Інші наші проєкти

arrow leftarrow right
Залишайте контакти і дізнайтеся вартість вашого проєкту

Бюджет

  • 10K
  • 20K
  • 50K
  • 100K
  • 150K
  • 200K