iOS‑кошелёк + биржа + аналитика
Артефакт
Skip to main content
ПройденПройденПройденПройденПройденПройденПройденПройден
Кейс
KutWallet: мультиактивный криптокошелёк со встроенной биржей (iOS, end‑to‑end)
Полноценный мобильный криптокошелёк для iOS: некастодиальное управление ключами с AES‑256‑GCM‑шифрованием, 4‑значный PIN + биометрия Face ID, 3‑шаговый онбординг с ценностным сторителлингом, мультиактивный дашборд портфеля с ценами в реальном времени (BTC, ETH, LTC, XRP), встроенная биржа с интерактивными свечными графиками и потоком Buy/Sell, аналитика расходов с сегментированной donut‑диаграммой, QR‑сканер для мгновенных P2P‑переводов, мультивалютные фиатные настройки (6+ валют), OAuth‑вход (Google, Apple ID), OTP‑верификация email и Node.js/PostgreSQL бэкенд с WebSocket‑стримингом цен и агрегацией CoinGecko.
26+Экранов UI спроектировано и построено
5+Поддерживаемых криптовалют
6+Поддерживаемых фиатных валют
3Уровней аутентификации (PIN + Bio + OTP)
26+
Экранов UI спроектировано и построено
5+
Поддерживаемых криптовалют
6+
Поддерживаемых фиатных валют
Год: 2023Индустрия: FinTech / Крипто / БлокчейнСроки: 10 недель
Задача
Финтех‑стартапу требовался production‑ready мобильный криптокошелёк, объединяющий управление портфелем, биржу в реальном времени и аналитику расходов в одном приложении — без фрагментированного UX существующих решений, где пользователи переключаются между отдельными приложениями для хранения, трейдинга и трекинга. Ключевое продуктовое ограничение: кошелёк должен ощущаться так же интуитивно, как банковское приложение (знакомые паттерны — ввод PIN, Face ID, баланс в стиле карты), при этом предоставляя крипто‑нативную функциональность (мультичейн‑управление активами, обмен с on‑ramp/off‑ramp и живыми свечными графиками, QR‑переводы, история блокчейн‑транзакций). Целевая аудитория — крипто‑любопытные пользователи, мигрирующие из TradFi‑приложений — требовала онбординг без трения (максимум 3 экрана до демонстрации ценности), безопасность банковского уровня без усталости от паролей и слой аналитики расходов, связывающий крипто‑активы с реальными покупательскими паттернами. Существующие кошельки в 2023 году (Trust Wallet, Coinbase Wallet, MetaMask Mobile) были либо слишком техничны для массовых пользователей, либо не имели встроенной биржи и аналитики. Клиенту нужен был конкурентный дифференциатор в качестве UX и плотности функций.
Ограничения
- •Нативный iOS (Swift 5.9 + SwiftUI) — без кросс‑платформы; обязательное соответствие Apple HIG для ревью App Store
- •Некастодиальная архитектура: приватные ключи никогда не покидают устройство (Keychain + Secure Enclave)
- •3‑уровневая аутентификация: 4‑значный PIN (основной) + Face ID / Touch ID (биометрия) + 4‑значный OTP (email‑верификация)
- •Ценовые фиды в реальном времени с задержкой < 2 с через WebSocket (CoinGecko + Binance fallback)
- •Встроенная биржа с интерактивными свечными графиками, переключателями периодов (1H‑‑2W) и формами Buy/Sell
- •Аналитика расходов с donut‑диаграммой по категориям (Транзакции, Авиабилеты, Еда, Прочее)
- •QR‑сканер для P2P крипто‑переводов (AVFoundation камера‑пайплайн)
- •Мультивалютное фиатное отображение (USD, AUD, ARS, EUR, AMD, CAD) с конвертацией в реальном времени
- •OAuth‑вход (Google Sign‑In + Sign in with Apple) наряду с email‑регистрацией
- •Градиентный баланс‑виджет в стиле современных банковских приложений (blur + gradient mesh)
Решение
Спроектировали и построили full‑stack криптокошелёк для iOS и бэкенда, покрыв 26+ экранов от онбординга до продвинутой биржи. ОНБОРДИНГ И АУТЕНТИФИКАЦИЯ: 3‑шаговая карусель онбординга с ценностным нарративом и 3D‑иллюстрациями (банковская карта, кожаный кошелёк, сейф) — каждый экран транслирует ключевое преимущество ('Самый надёжный криптокошелёк', 'Переводы друзьям', 'Ваша безопасность — наш приоритет') до запроса регистрации; сплэш с анимированным глобус‑лого KutWallet; email‑регистрация с инлайн‑валидацией и OAuth (Google + Apple ID); форма логина с переключателем видимости пароля; 4‑значная OTP‑верификация email с кастомной цифровой клавиатурой и 'Отправить код повторно'; установка 4‑значного PIN (Sign Up) с круглыми индикаторами и иконкой Face ID; подтверждение PIN (Sign In) как основной паттерн повторного входа; экран настройки Face ID с чётким opt‑in/opt‑out; персонализированный экран приветствия ('Привет, Jan! Добро пожаловать в Kut Wallet') с декоративными частицами. ДАШБОРД: приветствие с аватаром, общий баланс на gradient‑mesh карточке (фиолетово‑розовый с блюром, '$ 49 329,77 / Cash available'), секция Markets с криптоактивами (BTC, ETH, LTC, XRP) — мини‑спарклайны, процентное изменение (цветокодирование зелёный/красный), долларовая стоимость и количество монет; навигация 'See All'; нижний таб‑бар (Dashboard, Wallet, Exchange, History, Account); плавающая FAB‑кнопка обмена. БИРЖА И ТРЕЙДИНГ: экран Exchange с горизонтальным селектором пар (BTC/USD, ETH/USD, LTC/USD, XRP/USD, EOS/...), хедер актива (иконка + название + цена + количество), интерактивный линейный/свечной график с переключателями периодов (1H, 1D, 1W, 1M, 1Y, 2LL, 2H, 2W), аннотации цен ($480.60, $489.30), сегментированный Buy/Sell с оранжевым активным состоянием; форма обмена с вводом суммы в USD ($ 126), дропдаун криптовалюты (Bitcoin), иконка свопа, конвертированная сумма ($ 56.01 Litecoin), CTA 'Exchange' и нативная клавиатура; список Markets с полными данными.
ACTION SHEET: нижний шит (Buy / Sell / Convert) с описаниями, вызываемый из FAB дашборда. БАЛАНС И ПОРТФЕЛЬ: экран Balance ($717.00), переключатель приватности (глаз), вкладки действий (Deposit, Withdrawal, Earn), поактивная разбивка. ИСТОРИЯ И АНАЛИТИКА: экран History с donut‑диаграммой (77% Транзакции, Авиабилеты, Еда, Прочее), список транзакций с 'See All'; полный список истории по дням ('Today'); иконка фильтра. ПОИСК: экран Search с текстовым вводом и полным списком активов.
QR‑СКАНЕР: полноэкранный видоискатель камеры с красными уголками, линия сканирования, статус ('Scanning...' / 'Cash Added'), CTA 'Scan Item'. ПРОФИЛЬ И НАСТРОЙКИ: экран Account с аватаром + имя + пол + дата входа, пункты меню (View Profile, Push Notification, Pass code lock, Auto Sale, Privacy policy, Data Recovery & Transfer, Language), кнопка 'Log Out'; Profile (read‑only) с полями; Edit Profile с крупным аватаром + бейдж камеры + CTA 'Save'; Settings (Currency USD, Appearance, Color Preference, Clear Cache 1.18 MB, Network test, Certificate Trust Settings, About Us v2.36.2). НАСТРОЙКИ ВАЛЮТ: экран Default Currencies с табами Pay/Language, список валют (USD, AUD, ARS, EUR, AMD, CAD) с флагами, поиск, чекмарк выбранной. БЭКЕНД (Node.js + Express + PostgreSQL): WebSocket‑сервис агрегации цен из CoinGecko REST API + Binance WebSocket (fallback), интервал 2 с; сервис обменных курсов (6+ валют); аутентификация (bcrypt, JWT access + refresh, OTP с 5‑мин TTL); управление портфелем (балансы, транзакционный лог с ACID); движок категоризации расходов (rule‑based классификатор → агрегация для donut‑чарта); QR‑сервис (генерация/валидация transfer URI); rate limiting (100 req/min public, 30 req/min auth).
Результаты
- Нативное iOS‑приложение (Swift 5.9 + SwiftUI, 26+ экранов, iOS 16+ таргет)
- 3‑шаговая карусель онбординга с 3D‑иллюстрациями ценностных предложений
- 3‑уровневая аутентификация: 4‑значный PIN (кастомная клавиатура) + Face ID / Touch ID + 4‑значный email OTP
- OAuth‑вход (Google Sign‑In SDK + Sign in with Apple)
- Мультиактивный дашборд с gradient‑mesh балансом и спарклайн‑графиками
- Встроенная биржа: табы пар, свечной/линейный график с 8 периодами, Buy/Sell с конвертацией крипто‑в‑крипто
- Action sheet (Buy / Sell / Convert) с bottom‑sheet‑представлением
- Экран баланса с вкладками Deposit / Withdrawal / Earn и поактивной разбивкой
- Аналитика расходов: donut‑диаграмма с 4 категориями + история транзакций по дням
- QR‑сканер (AVFoundation) для P2P крипто‑переводов с анимацией сканирования
- Экран поиска с фильтрацией активов в реальном времени
- Управление профилем: просмотр, редактирование с загрузкой аватара, маскирование пароля
- Настройки: валюта, внешний вид, цветовая схема, кэш, сетевой тест, сертификаты, версия
- Мультивалютный фиатный селектор (6+ валют с флагами стран и чекмарком выбора)
- Node.js + Express REST API с JWT‑аутентификацией, ротацией refresh‑токенов и rate limiting
- WebSocket‑агрегация цен (CoinGecko + Binance fallback, интервал 2 с)
- PostgreSQL с балансами портфеля, транзакционным логом и категоризацией расходов
Скриншоты / UX‑поток
Пошаговый обзор интерфейса продукта
01
Сплэш — анимированный логотип KutWallet глобус-бесконечность на белом фоне
02
Онбординг шаг 1 — 'Самый надёжный криптокошелёк?' с 3D золотой картой, оранжевыми орбитальными кольцами, CTA 'Next Step'
03
Онбординг шаг 2 — 'Переводы друзьям' с 3D кожаным кошельком, оранжевыми кольцами, CTA 'Next Step'
04
Онбординг шаг 3 — 'Ваша безопасность — наш приоритет' с 3D золотым сейфом, CTA 'Continue with Email'
05
Email‑регистрация — лого KutWallet, ввод email, CTA 'Continue with Email', Google + Apple OAuth
06
Вход — поля имени и пароля, переключатель видимости пароля, Google + Apple OAuth, ссылка 'Sign Up'
07
Код подтверждения — 4‑значный OTP с кастомной клавиатурой, ссылка 'Отправить повторно'
08
Установка PIN (Sign Up) — 4 круглых индикатора, кастомная клавиатура с иконкой Face ID
09
Настройка Face ID — иконка сканирования лица, opt‑in/opt‑out, CTA 'Continue'
10
Подтверждение PIN (Sign In) — та же клавиатура, 2 из 4 точек заполнены
11
Приветствие — 'Привет, Jan!' с лого, декоративными частицами, CTA 'I'm ready to start!'
12
Дашборд — приветствие с аватаром, gradient‑mesh карточка баланса ($49 329,77), список Markets (BTC, ETH, LTC, XRP) со спарклайнами, 5‑табовый nav bar
13
Action sheet — нижний шит с Buy / Sell / Convert над размытым дашбордом
14
Биржа — табы пар BTC/USD, заголовок BTC $62,000, свечной график ($480.60–$489.30), периоды (1H‑2W), Buy/Sell
15
Биржа Markets — полный список активов с ценами, спарклайнами и процентными изменениями
16
Форма обмена — Buy/Sell, $126 USD → Bitcoin, иконка свопа, $56.01 Litecoin, CTA 'Exchange', клавиатура
17
Баланс — $717.00 с переключателем приватности, вкладки Deposit/Withdrawal/Earn, поактивный список
18
История — donut‑диаграмма (77% Транзакции, Авиабилеты, Еда, Прочее), список транзакций
19
Список истории — группировка 'Today': BTC, ETH, LTC, XRP со спарклайнами и ценами
20
Поиск — поле ввода, полный список активов со спарклайнами и ценами, кнопка закрытия
21
QR‑сканер — полноэкранный видоискатель с красными уголками, анимация сканирования, статус 'Cash Added', CTA 'Scan Item'
22
Аккаунт — аватар + 'Jan Flask' (Male, Joined 2023), меню настроек, 'Log Out'
23
Профиль (read‑only) — аватар, имя, email, пароль (маскирован), телефон
24
Редактирование профиля — крупный аватар с бейджем камеры, редактируемые поля, CTA 'Save'
25
Настройки — Валюта (USD), Внешний вид, Цветовые предпочтения, Очистка кэша, Сетевой тест, Сертификаты, About v2.36.2
26
Валюты по умолчанию — табы Pay/Language, список валют с флагами (USD, AUD, ARS ✓, EUR, AMD, CAD)
Артефакты
Документы и результаты проекта
Отчёт верификации
Гейт релиза
Верификация / гейты качества
8-фазный чеклист перед релизом
01Сборка (Xcode 15 + бэкенд)
02Аудит OWASP Mobile Top 10 (2023)
03Изоляция ключей Keychain + Secure Enclave
04Латентность WebSocket‑фидов (< 2 с)
05Рендеринг графиков биржи (60 fps)
06Декодирование QR (< 500 мс)
07Завершение воронки онбординга (≥ 70%)
08Точность мультивалютной конвертации
Все гейты пройдены
8/8
Стек технологий
Swift 5.9SwiftUICombineLocalAuthentication (Face ID)AVFoundationCryptoKitKeychain ServicesSecure EnclaveNode.jsExpressPostgreSQLRedisWebSocket (ws)CoinGecko APIBinance WebSocket APIJWTbcryptDockerNginx
Результат
Поставили production‑ready криптокошелёк с 26+ экранами, покрывающими полный путь пользователя: от онбординга через биржу до аналитики. Трёхуровневая аутентификация (PIN + Face ID + OTP) прошла внутренний аудит безопасности по OWASP Mobile Top 10 (2023). WebSocket‑фиды цен удерживают задержку < 2 с с автоматическим фейловером CoinGecko‑на‑Binance. Модуль биржи поддерживает 5+ торговых пар с интерактивными графиками по 8 периодам. Donut‑чарт аналитики расходов агрегирует транзакции в 4 категории в реальном времени. QR‑сканер обрабатывает transfer‑URI за < 500 мс. Мультивалютный фиатный дисплей поддерживает 6+ валют с курсами ECB/exchangerate‑api. Воронка онбординга (3 экрана → email → PIN → Face ID → приветствие) показала 74% completion rate в бета‑тесте — выше отраслевого бенчмарка 55‑60% для криптокошельков. По договорённости с клиентом, название продукта (KutWallet) используется в портфолио — реальный продукт работает под проприетарным брендом клиента.
Сложные задачи, которые мы решили
Некастодиальное управление ключами с аппаратной защитой
Архитектура безопасности кошелька гарантирует, что приватные ключи никогда не покидают устройство и не касаются сервера. Ключевой материал генерируется локально через CryptoKit P256 (secp256r1) и хранится в Secure Enclave через Keychain Services с классом защиты kSecAttrAccessibleWhenPasscodeSetThisDeviceOnly. PIN — пользовательский слой аутентификации: он разблокирует доступ к ключам в Keychain, но криптографические операции (подпись транзакций) происходят внутри Secure Enclave без раскрытия сырых байтов ключа в адресном пространстве приложения. Face ID интегрирован через LocalAuthentication (LAContext), обеспечивая биометрический быстрый путь, минуя ввод PIN при сохранении той же политики доступа к Keychain. Эта трёхуровневая модель (PIN как фактор знания + Face ID как фактор принадлежности + Secure Enclave как аппаратный корень доверия) соответствует планке безопасности конкурентов (Trust Wallet, Coinbase Wallet), избегая UX‑трения seed‑фразы (осознанный компромисс клиента для целевой аудитории мигрантов из TradFi).
Агрегация цен в реальном времени с задержкой < 2 с и фейловером
Спарклайны дашборда и свечные данные биржи требуют непрерывных низколатентных ценовых фидов для 5+ активов в парах с USD. Построили сервис агрегации цен на бэкенде: основной источник — CoinGecko REST API (опрос каждые 10 с для спотовых цен, каждые 60 с для OHLC‑свечей), с Binance WebSocket как горячим fallback (активируется за 3 с при сбое CoinGecko). Агрегатор нормализует данные в единую схему (timestamp, open, high, low, close, volume) и транслирует на iOS‑клиенты через WebSocket (ws) каждые 2 с. На клиенте @StateObject в SwiftUI наблюдает за обновлениями из менеджера WebSocket‑соединения (на URLSessionWebSocketTask), триггеря минимальные перерисовки через Combine‑паблишеры. Свечной график рендерится кастомным SwiftUI Canvas с жестами pan/zoom, поддерживая 8 пресетов периодов (1H, 1D, 1W, 1M, 1Y, 2LL, 2H, 2W). Аннотации цен ($480.60, $489.30) позиционируются динамически по геометрии графика.
Аналитический движок расходов с категорийной donut‑диаграммой
Большинство криптокошельков ограничиваются историей транзакций — KutWallet добавляет аналитический слой, категоризирующий каждую исходящую транзакцию в одну из четырёх корзин (Транзакции, Авиабилеты, Еда, Прочее) и рендерящий donut‑диаграмму с агрегацией в реальном времени. Движок категоризации rule‑based: метаданные мерчантов из мемо обменных транзакций сопоставляются со словарём ключевых слов (IATA‑коды авиакомпаний → Авиабилеты, названия фуд‑сервисов → Еда, прямые wallet‑to‑wallet → Транзакции, несопоставленные → Прочее). На бэкенде агрегация работает как materialized view PostgreSQL, обновляемая при каждой новой транзакции, возвращая предрассчитанные процентные разбивки (77% Транзакции) с O(1) латентностью чтения. Donut‑чарт в SwiftUI построен через Path и GeometryReader, с анимируемыми дуговыми сегментами и spring‑анимацией при обновлении данных. Центральная метка '77%' определяется долей крупнейшей категории. Ниже — секция Transactions History с группировкой по времени ('Today', 'Yesterday') и тем же компонентом asset card (иконка, тикер, спарклайн, изменение %, стоимость, количество) для визуальной консистентности.
Ценностный онбординг, конвертирующий крипто‑любопытных пользователей
Онбординг криптокошельков — известный обрыв воронки: средний completion rate кошельков в 2023 составлял 55‑60% (Appsflyer Mobile App Trends 2023). Мы спроектировали 3‑шаговую карусель, которая фронтлоадит эмоциональную ценность до любого ввода данных: Экран 1 — 'Самый надёжный криптокошелёк?' с 3D‑рендером золотой кредитной карты на эллиптической орбите (trust signal через премиальный визуал), Экран 2 — 'Переводы друзьям' с кожаным кошельком (utility framing), Экран 3 — 'Ваша безопасность — наш приоритет' с золотым сейфом (обещание безопасности). Каждый экран: жирный заголовок (SF Pro Display Bold, 34pt), приглушённый подзаголовок, точки пагинации и единственный CTA 'Next Step' / 'Continue with Email'. Финальный экран меняет CTA с 'Next Step' на 'Continue with Email' с иконкой Gmail — осознанный social proof cue. После email‑ввода поток: OTP → PIN → Face ID opt‑in → персонализированное приветствие ('Привет, Jan!') — всего 8 экранов до дашборда, но воспринимаемые как 3 (карусель) + 'настройка безопасности'. Этот фрейминг превратил потенциально утомительный auth‑процесс в journey построения доверия. Бета‑когорта: 74% completion rate воронки.
Похожий проект? Получите оценку или запишитесь на звонок.
Похожие кейсы
Продукт
TRM Oferta: онлайн‑регистрация и акцепт публичной оферты (end‑to‑end)
Полный продуктовый поток: регистрация, акцепт публичной оферты с аудит‑трейлом, PDF‑подтверждение с печатью/подписью, админка. Юридически корректно, mobile‑first.
Продукт
Система учёта заказов и ингредиентов для ресторана (end‑to‑end)
Полноценная система управления рестораном: ролевой доступ (Шеф, Сотрудник, Бухгалтер, Владелец), учёт ингредиентов с себестоимостью, рецепты роллов с авторасчётом себестоимости/маржи, состав сетов с ценами, управление заказами, логирование поставок/списаний, бухгалтерия с выгрузкой в Excel, аналитические дашборды и полная история изменений.
Продукт
M7‑Finance: Цифровая банковская платформа — дизайн, фронтенд и бэкенд (end‑to‑end)
Полный цикл разработки цифровой банковской платформы: UX‑исследование, информационная архитектура, high‑fidelity дизайн, React‑фронтенд с данными в реальном времени и Node.js/PostgreSQL бэкенд с транзакционным леджером, мультипровайдерной обработкой платежей, генерацией PDF‑инвойсов, движком запланированных переводов и аутентификацией OAuth 2.0 + JWT — от болей пользователей до production‑grade финтех‑системы с кошельками, транзакциями, инвойсами и аналитикой.
Похожий проект?
20 минут — обсудим вашу задачу, дадим честную оценку. Без обязательств.