Перейти до вмісту

LTE Socks

Кабінет клієнта й адміністративна платформа

Клієнт
Socks Expert · проксі-сервіс SOCKS5 через мобільні мережі
Роль
Єдиний дизайнер: UX, UI, інформаційна архітектура, дизайн-система
Монітор на світлому столі з кабінетом LTE Socks у світлій темі: розділ «Proxies» — картки мобільних проксі з портом, адресою, тарифом і залишком трафіку

Задача

Продукт роками не оновлювався: мобільної версії не було, а навігацію ніхто не міг утримати в голові.

LTE Socks — сервіс проксі через мобільні мережі. У кабінеті клієнт керує своїми проксі, поповнює рахунок і веде реферальну програму. Я переробив кабінет клієнта й адміністративну платформу: структуру, інтерфейс і дизайн-систему під ними.

Білінг

Рахунок поповнюють на одному екрані: сума, спосіб оплати — і одразу видно, скільки спишеться.

Платіжні системи стоять картками поруч: комісія й підсумкова сума написані на кожній, найшвидший спосіб позначено. Картки й криптовалюта — двома групами, кожну можна згорнути.

Монітор із розділом «Billing» кабінету LTE Socks: сума поповнення і картки платіжних систем із комісією та підсумковою сумою, одна позначена «Fastest»

Світла й темна теми

Кабінет має світлу й темну теми, і в обох він той самий.

Обидві теми тримаються на одній дизайн-системі з токенів і змінних: міняється колір, а розташування й компоненти — ні. Цю систему команда розробки взяла в роботу.

Монітор на світлому блоці з реферальною програмою LTE Socks у світлій темі: три лічильники й таблиця реферальних посилань
Монітор на темному блоці з реферальною програмою LTE Socks у темній темі: три лічильники й таблиця реферальних посилань

Мобільна версія

Мобільної версії не було зовсім — тепер у телефоні доступний увесь кабінет.

Ті самі розділи, що на десктопі: проксі, білінг, реферальна програма, статистика й логи. Навігація переїхала вниз, під великий палець.

Три телефони з мобільною версією кабінету LTE Socks: картка проксі, поповнення рахунку й реферальна програма; навігація внизу екрана

Адмінплатформа

Друга половина продукту — платформа, у якій команда сервісу веде клієнтів.

Список клієнтів показує статус, проксі, залишок трафіку й баланс, а картка поруч — усе про одного клієнта, без переходу на іншу сторінку. Адмінка зібрана на тій самій дизайн-системі, що й кабінет.

Монітор на темному столі з адмінплатформою LTE Socks: таблиця клієнтів зі статусом, проксі, трафіком і балансом, праворуч картка одного клієнта

Результат

Команда розробки зібрала продукт на цій дизайн-системі й працює з нею далі.

Продукт живий — my.ltesocks.io.

Наступний проєкт

MusConv

Мобільний застосунок для перенесення музики

Читати кейс

Розкажіть про задачу.