Мобильное приложение, планшетная версия и административная панель для системы умного дома TouchOn

О клиенте

Компания TouchOn – российский разработчик комплексной системы автоматизации инженерных систем. Предлагает программно-аппаратный комплекс по управлению всеми инженерными сетями в рамках единой централизованной системы на базе проводных технологий.

Компания обратилась к нам в феврале 2023 года с проблемами:

• Мобильное приложение визуально устарело и не соответствовало современным UX/UI стандартам.
• Планшетной версии не существовало, была только идея.
• Административная панель, которая использовалась инженерами для управления системой, имела перегруженный и устаревший интерфейс.
• Все продукты не соответствовали новому фирменному стилю и не имели единого визуального языка.

Поставленная задача

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

Мы выстроили работу на основе экспертизы в UX/UI, анализа процессов настройки и эксплуатации системы инженерами и гибкой архитектуры на серверной стороне.

Мобильное приложение

У клиента уже было мобильное приложение, которым пользовались те, кто установил систему TouchOn для управления «умным домом». Наша задача заключалась не только в редизайне, а в создании гибкой, настраиваемой и современной платформы управления умным домом.

• Начали с редизайна под новую айдентику TouchOn, разработали светлую и темную темы.

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

• Реализовали настраиваемый дашборд. Пользователь может сам выбирать, какие блоки отображаются на главном экране, и менять их порядок.

Настраиваемый дашборд

• Спроектировали интерфейс для управления устройствами. Свет, климат, шторы, котлы и другие системы теперь доступны в один клик, без лишних переходов.

Интерфейсы для управления устройствами умного дома в мобильном приложении

• Реализовали визуальные сценарии, например «Доброе утро» или «Я ушёл».

Иконки сценариев умного дома

• Обновили демо-режим презентаций и тестов для устройств без подключения к умному дому.

Демо-версия мобильного приложения

• Сделали центр уведомлений. Вся информация об ошибках, тревогах и действиях теперь в одном месте.

Центр уведомлений

• Поддержали вход по PIN-коду, Face ID, Touch ID для удобства и безопасности.

Вход по Face ID

Планшетная версия

Планшетная версия приложения разрабатывалась с нуля как отдельный продукт. Она представляет собой премиальный пульт управления, предназначенный для установки на стены в доме.

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

Интерфейс планшетной версии

• Обеспечили полноценную интеграцию со всеми ключевыми системами умного дома: управление светом, климатом, шторами, котлами и другими устройствами.

Интерфейсы для управления устройствами умного дома в планшетной версии

• Реализовали фоторежим управления. Пользователь может расположить элементы умного дома на фотографию комнаты.

Управление в фоторежиме

Административная панель

Панель была рабочая, но «сырая». Сделана разработчиками без учёта UX перегруженной и неудобной. Мы переработали интерфейс, сохранив мощный функционал, но сделав его визуально понятным.

• Переписали UI-кит и сделали акцент на удобстве инженеров: фильтры, всплывающие окна, collapsible-блоки, таблицы.
• Настроили сложные сценариев автоматизации визуально, а не через код.
• Поддержали работу с бойлерами, вентиляцией, насосами, теплым полом, чего не было ранее.
• Добавили масштабируемость и настроили 3-уровневую систему доступа: клиент / админ / суперадмин.

Клиенты TouchOn получили возможность гибко настраивать все устройства в системе через административную панель.

Серверная часть

Сервер управления ПО и приложениями TouchOn устанавливается на объекте заказчика, тем самым создается замкнутая локальная сеть. 

• Обновили PHP и добавили подключение к видеонаблюдению, датчикам движения, диммерам, термостатам и другим устройствам.
• Настроили раздел освещения и добавление контроллеров.
• Автоматизировали подключение Яндекс.Станций.

Достигнутые цели

В результате TouchOn получил современный инструмент, сочетающий актуальный UX/UI-дизайн, масштабируемую архитектуру и новый фирменный стиль.

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

Обратная связь от клиента

Юрий Плеханов, руководитель и один из основателей компании TouchOn:

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