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

Payvane

Концепт: рахунки постачальників у платформі витрат

Клієнт
Концепт, не комерційний проєкт. Компанію, людей і числа вигадано, правила країн справжні
Роль
Продуктовий дизайн, інформаційна архітектура, UI, дизайн-система. Прототип розроблено за допомогою Claude Code
Ноутбук на світлому бетоні, на екрані вхідні рахунки Payvane: список за терміновістю з позначками «можливий дубль», «немає відділу», «змінено банківський рахунок»

Задача

Рахунки постачальників жили поза платформою: їх передруковували, погоджували в Slack, а платежі збирали в банку вручну.

Payvane — вигадана платформа витрат для компаній у Польщі, Чехії й Німеччині: корпоративні картки, звіти про витрати, бюджети. Рахунки приходять із польської системи KSeF, PDF-файлами поштою й німецькими файлами XRechnung. Завдання — одне місце від надходження рахунку до оплати, де видно кожен крок. І щоб погоджувати з телефона було легко.

Перевірка

Проблеми рахунку видно вже в списку: можливий дубль, немає відділу, змінився банківський рахунок.

Відкритий рахунок стоїть як документ, а поруч простими словами сказано, що потребує уваги. Якщо постачальник «змінив» банківський рахунок, змінені цифри підсвічено, і заплатити не вийде, доки бухгалтер і фінансовий директор не підтвердять новий.

Рахунок у Payvane: документ ліворуч, праворуч дві перевірки — змінений банківський рахунок із підсвіченими цифрами і рахунок, якого немає в білому списку ПДВ

Погодження й оплата

Кожен бачить те, що потрібно саме йому для рішення.

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

Погодження рахунку в Payvane: бюджет відділу, хто вже погодив, хто наступний, і кнопки «Погодити», «Відхилити», «Запитати»
Пакет платежів у Payvane: погоджені рахунки в одному вікні перед плануванням оплати

На телефоні

Керівники погоджують рахунки з телефона, тож на телефоні це мало бути просто.

Внизу — панель з основними розділами, а «More» відкриває решту. Відкритий рахунок замінює панель власними діями, під великим пальцем.

Два телефони на бетоні: вхідні рахунки Payvane з панеллю розділів унизу і рахунок на погодженні з кнопками «Ask», «Reject», «Approve»

Темна тема

У темній темі та сама розкладка й ті самі компоненти — міняються лише кольори.

Контраст в обох темах перевіряють автоматичні тести, орієнтир — WCAG 2.1 AA.

Ноутбук на темному сланці, на екрані панель фінансового директора Payvane в темній темі: що чекає на нього і що прийде далі

Результат

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

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

MusConv

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

Читати кейс

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