Розробка UX/UI для фінансової криптоплатформи: як зробити складне доступнішим через дизайн

Яке завдання постало перед командою?

Фаундер крипто-стартапів з Пуерто-Ріко звернувся до нас з цікавим і водночас складним запитом. Необхідно було розробити інтуїтивний UI та UX дизайн для платформи, яка дозволяє використовувати прогресивні криптовалютні інструменти для створення пасивного прибутку.

Нагадаємо, DeFi додатки корисні тим, що дозволяють користувачеві розпоряджатися власними фінансами, не сплачувати комісію банку і самому вирішувати куди, скільки та на яких умовах інвестувати або переказувати кошти. Це величезна перевага. Однак, такі продукти переважно розробляються для досвідчених знавців і звичайним людям користуватися ними досить складно.

Тому разом з клієнтом було вирішено зробити зрозуміле, корисне і зручне дизайн-рішення для широкого кола користувачів (будь-якого віку, статі та рівня експертності). 

Дослідження та етапи

Щоб розробити дійсно якісний продукт, ми почали дослідження ринку. З кожним із трьох етапів з'являлась все чіткіша картина і розуміння того, яким повинен бути результат.

1. Поглиблення у криптоіндустрію

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

Отримані знання ми реалізували у кожному елементі дизайну. Розуміючи сутність “начинки”, дизайнери створювали інтерфейс таким чином, щоб водночас забезпечувати функціональність, але не перевантажувати зовнішній вигляд платформи.

2. Вивчення конкурентів

Оскільки продукт мав бути простим у використанні, було вкрай важливо знати наявні рішення конкурентів. Проаналізувавши багатьох гравців на ринку: BlockFi, Nexo, DeFiato, Celsius, команда взяла до уваги важливі аспекти. Побудову, розташування структурних елементів та більш точкові рішення: вигляд сторінок, наявні блоки, пояснення, таблиці, графіки тощо.

В результаті сформували список дизайн-рішень, які на наш погляд були ефективними. Плюс, обрали слабкі місця, внаслідок яких CashFlow стане зручнішим у порівнянні з готовими продуктами. Після внутрішнього аналізу конкурентів і брейншторму, ми мали ідеї попереднього вигляду платформи та її функціоналу.

3. Дослідження аудиторії

Інтервʼю з користувачами-початківцями (різних вікових груп) DeFi додатків показали, що люди відчувають себе перевантаженими складністю платформ. Вони говорять: “Це круто і перспективно, але надто складно для мене”.

І це дійсно так. Окрім того, що потрібно мати базові знання згаданих вище функцій, необхідно ще витрачати час на освоєння логіки додатка, перевантаженого інтерфейсу та професійної термінології на екранах.

Багато опитаних користувачів говорять, що бояться користуватися крипто-інвестиційними додатками. Все через ризик шахрайства, викрадення паролів і втрати грошей. Тому платформа має забезпечити високий рівень безпеки: багатоетапну авторизацію, верифікацію через інші ресурси, надійний захист персональних даних і тому подібне. 

Створення єдності концепту

Попередній аналіз виявив, що CashFlow мав схожий з іншими платформами функціонал. Тож постало завдання: знайти та запропонувати клієнтові особливі рішення, як зі сторони технічних характеристик, так і з точки зору дизайну.

1. Побудова основної структури сторінки

Була створена єдина структура сторінки. Таким чином у користувача з'явилась можливість легко орієнтуватися в навігації платформи й у кожному розділі окремо. Поєднавши наявні функції фармінгу, стейкінгу, позик, обміну криптовалют та інших опцій. Тим самим, допомігши користувачу безперешкодно взаємодіяти з продуктом у кожному блоці.

Однакове розташування функціонала на різних сторінках значно спростило користування платформою. Цього й очікує людина, коли користується платформою. Тому це рішення підвищило ефективність створення дизайну і зекономило левову частку бюджету клієнтові.

2. Зручність розташування елементів

Під час дослідження користувачів та конкурентів ми помітили важливу деталь: люди губляться, коли бачать надто багато інформації, статистик, різних таблиць на одному екрані. Для професіоналів це непогано і навіть корисно, але наша мета – спрощувати.

Тому дизайнери вирішили розташувати блоки послідовно, при цьому узгодивши з криптоекспертами найбільш логічний порядок. Вгорі сторінок ми залишили віджети (баланс гаманця, графіки зі статистикою операцій та інші таблиці), а решту інформації подали нижче. 

3. Акценти

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

4. Наповнення таблиць

Також було звернено увагу на побудову таблиць. А саме той аспект, що таблиці в додатках конкурентів насичені однотипною інформацією. Користувачам-початківцям потрібно докласти чималих зусиль, щоб розібратися і навчитися використовувати їх для заробітку.

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

5. Покращення безпеки

Ще одна фішка CashFlow у тому, що додаток пропонує захищене використання. Після глибокого аналізу, ми запропонували клієнтові стратегічне покращення безпеки платформи. Оскільки однією з перепон для початку інвестування у криптовалюти є шахрайство. Тому у розділ особистої безпеки була додана функція створення та розпізнавання списку пристроїв, що використовує людина. Тобто, завдяки цьому налаштуванню ніхто не зможе увійти до особистого кабінету, навіть знаючи паролі. 

Підтримка постійної комунікації

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

Також проводилиись планувальні та презентаційні дзвінки для швидкості співпраці та загальної ефективності проєкту.

Як говорить сам клієнт: “На дзвінках бізнес-аналітик та дизайн-команда завжди глибоко цікавилися, що саме певний функціонал дає бізнесу і як сервіс має працювати технічно. Потім вони презентували дизайн, який просто перевершував мої очікування!”.

Результати та отримання міжнародної премії Red Dot

Додаток CashFlow – це криптоінвестиції для кожного. Результатом роботи стали мобільний та вебдизайн додатка для формування пасивного доходу у криптовалюті CashFlow. Зрозумілий інтерфейс та єдина форма навігації у продукті значно полегшують користування додатком. Такі функції як фармінг, нове покоління стейкінгу, надання криптопозик, позичання, купівлі, обміну та виводу криптовалюти з системи стали легшим у використанні. Люди будь-якого віку і рівня знань зможуть легко розібратися у платформі та отримати додатковий дохід. 

У цифрах

Запланована робота виконана на півмісяця швидше встановлених термінів. Заощаджено близько 40% бюджету.

Як отримали міжнародну премію Red Dot?

Для Linkup номінування на премію — це перша спроба і вона одразу стала успішною.

У Red Dot вважають, що дизайнерські рішення мають змінювати життя. Ми з ними згодні, тому вклали у CashFlow весь досвід і щире бажання зробити криптоінвестиції більш доступними для нетехнічних людей. Вже чекаємо запуску проєкту, щоб поділитися подальшими результатами.