Операции с наличностью Sigma Cloud

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

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

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

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

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

Знаки валют были вынесены в заголовок столбца, что позволило избежать излишнего повторения и улучшить восприятие данных. Для столбца «Комментарий» были прописаны правила: если в ячейке две строки текста, то остальные ячейки выравниваются по первой строке, обеспечивая чистоту и читаемость данных.

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

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

Таблица растягивается на всю высоту экрана — так работать с данными комфортнее. Фильтры специально не закреплены: при каждом изменении происходит полная перезагрузка таблицы, и если бы фильтры оставались на месте, это вызывало бы неприятные скачки и мешало бы пользователю. Зато фиксированная шапка таблицы остаётся на виду при скролле — так проще ориентироваться, особенно когда данных много.

Ранее у раздела не было мобильной версии, и пользователи испытывали серьёзные трудности. По данным метрики, он стабильно входил в топ-5 самых посещаемых в «Облаке» — несмотря на неудобство.

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

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

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

Работа с данными.