Разработка мобильного приложения и дашборда для компании, которая улучшает мобильную связь внутри зданий
Увеличили точность данных о качестве мобильной связи и в 4 раза ускорили их сбор
IT
Великобритания
2024
Услуги
Технологии
Сложность
Время разработки
10 месяцев
Команда
1 PM, 3 Frontend, 2 Backend, 1 QA
Статус проекта
Проект продолжает развиваться и масштабироваться
О клиенте
Компания Uctel из Великобритании разрабатывает решения для улучшения мобильной связи внутри зданий.
Клиенты компании — владельцы коммерческих и корпоративных зданий (офисы, склады, торговые центры, больницы и др.). Их арендаторы, сотрудники и клиенты обращают особое внимание на качество сигнала в помещениях. Стабильная мобильная связь в зданиях — существенное конкурентное преимущество на рынке.
Чтобы правильно установить оборудование для улучшения сигнала, Uctel:
1) обследуют помещения и собирают данные о качестве сигнала в каждой точке по каждому мобильному оператору,
2) анализируют эти данные,
3) разрабатывают план расположения оборудования,
4) монтируют оборудование и запускают систему.
На момент обращения у клиента не было удобного инструмента для первых трех пунктов.
Для обследования качества сигнала клиент использовал сторонние программы и приложения. Решения были платные, а функционала не хватало для корректного сбора данных. Кроме того, данные было сложно анализировать, так как они не собирались в одном месте. Многое приходилось делать вручную.
Чтобы клиент перестал платить за неудобные сторонние решения, нужно разработать приложение с необходимыми функциями для обследования помещений и дашборд для сбора, отображения и анализа собранных данных.
Изображение проекта
Решение
Мобильное приложение
Собирает данные о качестве сигнала по разным клиентам, зданиям и этажам.
Приложение разрабатывалось на React Native. Для получения данных сигнала использовался язык Kotlin и методы Android-платформ.
Дашборд
Представляет данные из приложения в удобном формате.
Дашборд разрабатывался на Laravel + Vue.js. Для связки приложения и дашборда использовались базы данных и документация методов Swagger.
Пожалуй, один из самых интересных и комплексных проектов, над которыми мы работали. На старте проекта клиент описал только в общих словах необходимый функционал и показал референс, который он хотел повторить и улучшить. Конечно, это была только вершина айсберга, и в процессе разработки у нас появилось много сложностей в самой реализации и дополнительных задачах от клиента. Хорошо, что клиент не сильно торопил нас со сроками, был готов работать с MVP-версией приложения и весь доп. функционал отложить на 2 и 3 стадии разработки.
По мобильной разработке мы еще никогда так глубоко не копались в данных телефона по нетворку и состоянию сети. Нам нужно было найти, собрать и вывести в интерфейс все возможные данные о сигнале, при этом регулярно обновляя их значения. Также необходимо было добавить вычисление спидтеста, и собирать все эти данные с клиентских устройств на серверном. Для всего этого списка задач нужно было проресерчить большое количество библиотек и методов, с которыми мы раньше не работали, а также написать кастомные обработчики на Java и Kotlin. Из ключевых сложностей на этапе разработки кода для нетворка можно выделить недостаток нативных методов для этого у самого андроида, а также неактуальность и несопоставимость готовых библиотек. Например, для спидтеста мы так и не смогли найти совместимую библиотеку, поэтому пришлось разработать самописное решение.
Так как основной кейс использования приложения клиентом — в зданиях с плохим покрытием сигнала, отдельным циклом сложностей стала поддержка работы со слабым интернетом, с 2G, с полным оффлайном и сохранение данных при закрытии приложения. А хранить нам нужно было довольно много данных. Например, клиент мог провести без интернета несколько интерактивных планов, каждый из которых содержал по сотне точек с данными, заметками и фотографиями. По итогу могло накопиться довольно много оффлайн-данных, которые нам нужно было синхронизировать с дашбордом при появлении интернета.
При разработке дашборда сами технологии были проще, но сложностей возникло не меньше. Оказалось, что клиенту нужно не только собирать данные с приложения и выводить их на сервере, но также и создавать и редактировать их на самом дашборде. Соответственно на дашборде, как и на приложении, был разработан полный функционал для создания, редактирования и удаления данных. В том числе и для интерактивного плана.
Самыми сложными задачами на дашборде были создание интерактивного конструктора планов этажей (с соединительными кабелями, зонами покрытия и прочим), а также генерация полных отчетов по проведенным измерениям в формате PDF.
Возможности мобильного приложения
Экраны управления записями
Создание и управление записями об объекте
Пользователь может управлять записями о клиентах, зданиях, этажах и добавлять новые обследования.Варианты добавления плана этажа
Добавление плана этажа из приложения
Можно загрузить готовый план или сделать фотографию прямо на месте.Экраны сбора данных
Сбор данных о сигнале в помещении
Пользователь перемещается по помещениям на этаже и проставляет точки сбора данных в приложении. Когда точка поставлена, собираются данных со всех устройств и прописывается точка для серверного устройства. К каждой точке можно добавлять комментарий и фотографию места.Виды точек в приложении
Обозначение точек сбора данных значками
В зависимости от качества сигнала и типа соединения, каждая точка отмечается значком. Например, если у определенного оператора связи в измеряемой точке был тип соединения 3G и очень хорошее качество сигнала, точка обозначается зеленым треугольником.Нажатием кнопки можно завершить обследование и отправить данные
Отправка данных на дашборд
После того, как все данные собраны, нажимаем галочку, и обследование завершается. Данные отправятся на дашборд, где с ними можно подробно ознакомиться и управлять.Виды отображаемых параметров
Ежесекундное обновление данных
Параметры сигнала отображаются в приложении в режиме реального времени.Функционал для SpeedTest
Встроенный тест на скорость передачи данных
Специально для проекта были разработаны методы для сбора данных о сигнале и самописный SpeedTest функционал. Пользователи могут проводить тесты на скорость передачи данных, не покидая приложения.Экран Bluetooth-интеграции
Подключение нескольких телефонов
В приложении можно одновременно подключать несколько мобильных устройств к основному. Это позволяет получать данные о связи сразу 4 мобильных операторов. Все обследования проводятся с основного (серверного) устройства. Другие устройства (клиентские) подключаются к основному через Bluetooth, служат приемниками сигнала и управляются с главной панели основного устройства. Это ускоряет сбор данных и позволяет получить полное представление о качестве мобильной связи в здании.Возможности дашборда
Личный кабинет пользователя
Личный кабинет
В дашборде можно залогиниться и управлять своими личными данными, данными о клиентах и проведенных обследованиях.Дизайн темной и светлой темы интерфейса
Светлая и темная тема
Мы разработали темную тему, чтобы приложение было удобно использовать в слабо освещаемых помещениях.Структура вложенных списков
Удобная структура данных
Для обеспечения сложной иерархической системы данных используется структура вложенных списков:- клиенты;
- список зданий клиента;
- список этажей;
- план этажа и данные о проведенных обследованиях.
Интерактивные планы с данными о сигнале
Полная картина о сигнале на интерактивных планах
На основании исследования на дашборд собираются данные о четырех операторах связи. У пользователя есть возможность:- получить полные данные о качестве и силе сигнала;
- сравнить данные в каждой точке;
- оценить качество связи, чтобы наиболее эффективно разместить оборудование.
Этапы работы
Дизайн
Дизайн приложения был разработан сначала на прототипах с алгоритмами действий, а затем скорректирован с цветовой гаммой, UI-китом и всеми необходимыми деталями. Дизайн дашборда собирался без прототипа уже в процессе разработки.
Разработка приложения
Мобильное приложение было разработано с использованием фреймворка React Native. Для сбора данных о сигнале использовали язык программирования Kotlin и методы, специфичные для платформы Android. Таким образом мы создали высокопроизводительное приложение, которое поддерживает работу на Android и обеспечивает доступ к нативным возможностям Android для более эффективного сбора данных о сигнале.
Создание дашборда
Дашборд был разработан с использованием фреймворка Laravel для бэкенда и Vue.js для фронтенда. Мы использовали заготовку интерфейса и методов из другого проекта. Это позволило значительно сократить время на разработку дашборда.
Для обмена данными между мобильным приложением и дашбордом использовали базы данных. Для документирования методов и API использовали Swagger. Это решение сделало процесс разработки более прозрачным, облегчило взаимодействие между разработчиками приложения и дашборда, а также упростило интеграцию и сопровождение системы.
Тестирование
Для полного тестирования мы взяли несколько устройств на платформе Android и несколько сим-карт с интернетом. Сделали тесты по Bluetooth-коннекту устройств, SpeedTest-замеры, протестировали сигнал на разных типах сети (2G, 3G, 4G, 5G). В процессе тестировщики перемещались по помещению, находили зоны с плохим сигналом и фиксировали их. Потом мы протестировали все данные приложения в дашборде.
Результаты
1. Разработаны и успешно внедрены мобильное приложение и дашборд, предоставляющие возможности по сбору, анализу и мониторингу данных о качестве мобильного сигнала внутри зданий;
2. Благодаря внедрению приложения и дашборда отпала необходимость в использовании платных сторонних приложений;
3. Функционал приложения и дашборда позволил значительно упростить процесс сбора и анализа информации о качестве сигнала на объекте;
4. Мы продолжаем сотрудничество и внедряем новые функции. Сейчас в работе — создание конструктора оборудования, который позволит разместить необходимые элементы прямо на плане, соединить их кабелями.
Отзыв
Евгений
Менеджер проекта со стороны заказчика“Все ТЗ внедряются быстро и качественно”
С вами приятно работать, все ТЗ внедряются быстро и качественно, редко нужны какие-то правки. За время совместной работы мы уже «набили руку» вместе и чувствуется взаимосвязь, что очень приятно. А главное, что наш клиент доволен 🙂