TSN-online

Desktop

запустили веб-сервис в соответствии с концепцией user friendly

Mobile app

разработали мобильное приложение для iOS и Android

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

TSN-online

сайт доступен только для зарегистрированных пользователей

Заказчик

Задача

Управляющая компания ТСН администрирует коттеджные поселки с помощью сайта tsn-online.ru. Всего под управлением компании находятся несколько десятков поселков.

Заказчик администрировал поселки с помощью самописного сайта на asp.net. В целом функциональность сайта устраивала, но хотелось соответствовать концепции user friendly — создать привлекательный дизайн и повысить удобство использования.

Также было необходимо дополнить веб-версию сервиса мобильным приложением под iOS и Android, чтобы жители коттеджных поселков могли взаимодействовать с управляющей компанией со смартфонов.

Решение

Мы обсуждали с заказчиком два варианта решения задачи:

Разработать новый дизайн сайта и мобильное приложение, написать под мобильное приложение REST API на движке сайта.

Написать веб-сервис с нуля на любом стеке, если это повысит юзабилити и не навредит функциональности. После этого оформить сервис в новом дизайне и разработать приложение.

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

Работа заняла 10 месяцев.

Использованные технологии

Язык разработки

Фреймворк

СУБД

Система контроля версий

Инструменты тестирования

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

Пользовательский интерфейс

Typescript

React

Javascript

Nextjs

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

Задача №1: Разработка веб-сервиса

Концептуальный дизайн

Лента новостей

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

Управляющая компания публикует новости о жизни поселка: предстоящие встречи, анонсы важных событий, отчеты о проделанной работе.

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

Расходы под контролем

Связь с управляющей компанией

Юридическая информация

Опросы и голосования

В чате с управляющей компанией можно прикреплять документы: фотографии, сканы и текстовые файлы.

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

Управляющая компания учитывает мнения жильцов, поэтому предлагает им участвовать в опросах. Каждый может отдать голос, а по завершении голосования — посмотреть детальные результаты.

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

Задача №2: Разработка приложения для iOS и Android

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

Мобильное приложение полностью дублирует функционал веб-сервиса. Путь пользователя начинается с создания аккаунта.

Автоплатежи

Адаптивный дизайн

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

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