Telematic.Pro: северное сияние в интерфейсе и новая страница оплаты

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

Дизайн-слой «Аврора»

Раньше сайт держался на тёмном фоне с сеткой. Теперь за ним живёт полноценная «аврора»:

У светлой темы своя палитра — «Жемчуг»: пастельное небо и розово-персиковый градиент вместо простого белого фона.

Красиво, но быстро

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

Единые элементы форм

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

Новая страница пополнения баланса

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

Пасхалка в калькуляторе

На странице цен есть калькулятор, который сравнивает стоимость ведения канала вручную и с Telematic. Попробуйте указать зарплату сотрудника 0 в час — калькулятор поднимет тревогу с мигающими сигнальными лентами и радаром: «Внимание: обнаружен рабский труд».

Свежие скриншоты на всех языках

Скриншоты продукта на лендинге теперь снимаются автоматически с демо-аккаунтов и существуют на всех 7 языках и в обеих темах — посетитель видит интерфейс на своём языке. Заодно мы исправили ошибку, из-за которой очень длинные статьи не принимались через Feed API.

В цифрах

4 коммита, 137 файлов и около 880 строк нового CSS для дизайн-слоя.

Попробовать обновлённый сервис можно на telematic.pro, а подробный кейс — в нашем портфолио.

Хотите, чтобы ваш продукт выглядел так же эффектно и оставался быстрым? Расскажите нам о задаче.