Перезвоните мне
ГлавнаяПортфолиоNetwork Analytics

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

Увеличили точность данных о качестве мобильной связи и в 4 раза ускорили их сбор

Отрасль

IT

Регион

Великобритания

Год

2024

Услуги
Бэкенд
Дизайн
Фронтенд
Технологии
Kotlin
Laravel
React Native
Vue.js
Сложность
Обложка Нетворк
Время разработки

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

Встроенный тест на скорость передачи данных

Специально для проекта были разработаны методы для сбора данных о сигнале и самописный SpeedTest функционал. Пользователи могут проводить тесты на скорость передачи данных, не покидая приложения.
Bluetooth интеграция Нетворк

Экран Bluetooth-интеграции

Подключение нескольких телефонов

В приложении можно одновременно подключать несколько мобильных устройств к основному. Это позволяет получать данные о связи сразу 4 мобильных операторов. Все обследования проводятся с основного (серверного) устройства. Другие устройства (клиентские) подключаются к основному через Bluetooth, служат приемниками сигнала и управляются с главной панели основного устройства. Это ускоряет сбор данных и позволяет получить полное представление о качестве мобильной связи в здании.

Возможности дашборда

Личный кабинет Нетворк

Личный кабинет пользователя

Личный кабинет

В дашборде можно залогиниться и управлять своими личными данными, данными о клиентах и проведенных обследованиях.
Темная и светлая тема Нетворк

Дизайн темной и светлой темы интерфейса

Светлая и темная тема

Мы разработали темную тему, чтобы приложение было удобно использовать в слабо освещаемых помещениях.
Вложенные списки Нетворк

Структура вложенных списков

Удобная структура данных

Для обеспечения сложной иерархической системы данных используется структура вложенных списков: 
  • клиенты; 
  • список зданий клиента; 
  • список этажей; 
  • план этажа и данные о проведенных обследованиях.
Интерактивные планы Нетворк

Интерактивные планы с данными о сигнале

Полная картина о сигнале на интерактивных планах

На основании исследования на дашборд собираются данные о четырех операторах связи. У пользователя есть возможность: 
  • получить полные данные о качестве и силе сигнала;
  • сравнить данные в каждой точке;
  • оценить качество связи, чтобы наиболее эффективно разместить оборудование.

Этапы работы

1

Дизайн

Дизайн приложения был разработан сначала на прототипах с алгоритмами действий, а затем скорректирован с цветовой гаммой, UI-китом и всеми необходимыми деталями. Дизайн дашборда собирался без прототипа уже в процессе разработки.

2

Разработка приложения

Мобильное приложение было разработано с использованием фреймворка React Native. Для сбора данных о сигнале использовали язык программирования Kotlin и методы, специфичные для платформы Android. Таким образом мы создали высокопроизводительное приложение, которое поддерживает работу на Android и обеспечивает доступ к нативным возможностям Android для более эффективного сбора данных о сигнале.

3

Создание дашборда

Дашборд был разработан с использованием фреймворка Laravel для бэкенда и Vue.js для фронтенда. Мы использовали заготовку интерфейса и методов из другого проекта. Это позволило значительно сократить время на разработку дашборда. 

Для обмена данными между мобильным приложением и дашбордом использовали базы данных. Для документирования методов и API использовали Swagger. Это решение сделало процесс разработки более прозрачным, облегчило взаимодействие между разработчиками приложения и дашборда, а также упростило интеграцию и сопровождение системы.

4

Тестирование

Для полного тестирования мы взяли несколько устройств на платформе Android и несколько сим-карт с интернетом. Сделали тесты по Bluetooth-коннекту устройств, SpeedTest-замеры, протестировали сигнал на разных типах сети (2G, 3G, 4G, 5G). В процессе тестировщики перемещались по помещению, находили зоны с плохим сигналом и фиксировали их. Потом мы протестировали все данные приложения в дашборде.

Результаты

1. Разработаны и успешно внедрены мобильное приложение и дашборд, предоставляющие возможности по сбору, анализу и мониторингу данных о качестве мобильного сигнала внутри зданий;

2. Благодаря внедрению приложения и дашборда отпала необходимость в использовании платных сторонних приложений;

3. Функционал приложения и дашборда позволил значительно упростить процесс сбора и анализа информации о качестве сигнала на объекте;

4. Мы продолжаем сотрудничество и внедряем новые функции. Сейчас в работе — создание конструктора оборудования, который позволит разместить необходимые элементы прямо на плане, соединить их кабелями.

Отзыв

Отзыв
Логотип UCtel

Евгений

Менеджер проекта со стороны заказчика

“Все ТЗ внедряются быстро и качественно”

С вами приятно работать, все ТЗ внедряются быстро и качественно, редко нужны какие-то правки. За время совместной работы мы уже «набили руку» вместе и чувствуется взаимосвязь, что очень приятно. А главное, что наш клиент доволен 🙂

Понравился кейс?

Обсудить мой проект

Ознакомьтесь с другими нашими проектами

Интернет-магазин БАДов и витаминов

Превью кейса Nature's Sunshine

Мобильное приложение спортивного издания «ПЛЕЙМЕЙКЕР»

Превью кейса Playmeyker

Сайт крупнейшей в Петербурге компании водного туризма

Превью кейса Нева Тревел

Каталог индийских фильмов Somindram

Превью кейса Somindram

Веб-конструктор для проектирования контейнеров

Превью Конструктор контейнеров

Платформа для организации свадеб Wendor

Превью Wendor

Этот сайт использует cookies.

Этот сайт использует файлы cookie для хранения информации на вашем устройстве.