Floos

Проектирование (UX) и дизайн (UI) финтех приложения

Задача

Floos – приложение по микрокредитованию с элементами геймификации. Выполняя задания, пользователи открывают новые возможности сервиса: от увеличения суммы займа до снижения процентной ставки.

Нашей задачей было изучить аудиторию сервиса, разработать пользовательские сценарии (Customer Journey Map) и систему поощрений, создать и протестировать интерактивные прототипы, разработать дизайн приложения и элементов интерфейса, подготовить UI Kit.

Business Research

Провели исследование банковских услуг Омана, изучили конкурентов и выявили типы и потребности потенциальных пользователей приложения.
Michael Griffith
33 years old, hotel cleaner
Lives in Liverpool, England
Target
Get more money next month
What is important
To increase the loan size with ease
Context
Often uses applications: has Instagram, sometimes shoppes online
Paul Brent Ferguson
28 years old, dishwasher
Lives in Budapest, Hungary
Target
Get money to cover extra costs — buy new sneakers
What is important
Get money day in day
Context
Regular user of our application, not really skilled phone user, skilled in apps he uses every day: WatsApp, online-banking
Thomas Scott
39 years old, painter in construction company
Lives in Berlin, Germany
Target
Get money for transport to get to work
What is important
Get money quickly, without contacting a bank or friends
Context
Rarely uses applications — only for calls to relatives via WhatsApp
Составили пользовательские сценарии для нового и зарегистрированного пользователя.

Customer Journey Map

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

Проектирование (UX)

Подготовили интерактивные прототипы экранов приложения. Показали все взаимосвязи, блоки и состояния элементов.

UI и анимация

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

Стартовые экраны рассказывают о преимуществах приложения. Знакомят нового пользователя с ценностью продукта.

Анимированные иллюстрации, передающие посыл текстовой части, делают процесс знакомства более легким.

Loan screens

Первый экран, куда попадает пользователь до или после регистрации. Экран персонализирован, если пользователь прошел регистрацию.

Экраны с выбором суммы

При помощи колеса пользователь выбирает необходимую сумму. При выполнении заданий, сервис увеличивает лимиты.
Увеличение лимита
Показали анимацию колеса с выбором суммы при увеличении лимита. Сразу даем возможность поделиться приложением с друзьями и получить дополнительные бонусы.
Loan confirmation screen
На последнем шаге подробно знакомим с условиями сервиса. Рассказываем в течение какого времени будут начислены деньги и напоминаем, что начисление будет производиться на карту, указанную при регистрации аккаунта.

История

В разделе история показываем совершенные транзакции в приложении. Новому посетителю предлагаем оформить первый займ. Зарегистрированному пользователю показываем дату следующего погашения кредита с возможностью оплатить, не дожидаясь автоматического списания.

Бонусная программа

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

Всего

120
общее число UI макетов
30
экранов по регистрации и онбордингу
220
часов на дизайн и анимацию

Иконка приложения

Иконка приложения – визуальный якорь продукта. Элемент брендинга, передающий суть приложения.

Style Guide

Typography
Font family: Montserrat
COLORS
Main colors
complementary colors

UI Components

Buttons
Input
Background
ICONS

Передача проекта

Подготовили все необходимые материалы для передачи разработчикам.
У вас есть проект?
hello@lepshey.com
Здравствуйте!
Мы используем cookie-файлы. Сообщаем вам, что этот сайт использует cookie-файлы. Продолжая пользоваться сайтом lepshey.com, вы даете свое согласие на использование cookie-файлов.
Узнать больше