Назад

Можно ли доверить разработку крипто-приложения команде без опыта в крипте

Мы в Purrweb недавно начали работать с криптовалютной индустрией — первый проект получили осенью 2021 года. В этой статье рассказываем, как мы разработали приложение-кошелек Broex: постигали тонкости криптоторговли, пытались не спалить смартфоны, и доказали, что энтузиазм команды — далеко не последний аргумент в борьбе за проект.

Время чтения: 8 минут

Содержание

    Маленький кошелек с большими планами

    Broex — лицензированный мультивалютный криптокошелек. У Broex европейская лицензия, которая гарантирует легальность и безопасность сделок. Это серьезное преимущество для такого проекта. Но как конкурировать с другими кошельками?

    Оказывается, несмотря на низкий порог входа на криптовалютный рынок, около половиныhttps://finbold.com/multi-country-study-reveals-only-1-in-10-have-no-intention-of-investing-in-cryptocurrency/ потенциальных пользователей отсеивается из-за недостатка знаний, страха стать жертвами мошенников, или просто нажать не на ту кнопку и потерять все деньги.

    Broex сфокусировались на том, чтобы помочь новичкам, предложив им самый понятный в мире кошелек, самую быструю верификацию, а также возможность хранить на счете криптовалюты.

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

    Задача «со звездочкой»

    У заказчиков была веб-версия продукта, а вот с мобильным приложением как-то не задалось. В App Store оно так и не вышло — его все время отклоняли. Это стало большой проблемой, ведь важно иметь доступ к кошельку откуда угодно, а пользоваться веб-версией с телефона неудобно.

    Нам предстояло разработать кроссплатформенное приложение для iOS и Android с нуля, не повторив при этом ошибок прошлой команды и используя бэкенд, который писали не мы.

    Мы хотели попробовать себя в разработке криптовалютных приложений, и возможные подводные камни нас не останавливали. Благодаря нашему энтузиазму мы и получили этот проект, несмотря на отсутствие опыта.

    Фёдор Большаков,

    Мне понравилась активность ребят, вовлеченность и неподдельный интерес к проекту с первых созвонов. Мне было понятно, что они не очень-то разбираются в крипте. Но они всему быстро научились: задавали глупые вопросы, не стеснялись, спрашивали, интересовались, сами копали информацию.

    Фёдор Большаков, 
    Технический директор Broex

    Почему нам было важно разобраться в теории

    Нам уже не раз приходилось разбираться в чем-то новом. Например, без русскоязычной документации мы выяснили, как работают китайские станции для зарядки и хранения павербанков EnerGO, которые теперь стоят в столичном метро. Но это была лишь часть большого проекта, а в случае с Broex нам не хватало самых основ, теоретической базы.

    Когда дело касается блокчейна и криптовалют, недостаточно просто уметь хорошо разрабатывать приложения. Важно понимать, как устроена логика покупки, обмена, перевода и вывода криптовалюты, а также округлений, подсчета баланса и формирования комиссии. Кроме того, в этой сфере много сложных терминов — монета, токен, адрес, смарт-контракт. Если их не знать, то непонятно, какие запросы приложение отправляет на бэкенд, и какие данные будут возвращаться.

    У наших разработчиков и менеджеров был опыт в финансовой индустрии: мы разработали платформу Fintarget для БКС-брокер. Но изучать криптовалюту пришлось во всех подробностях. Иначе было бы невозможно не то что обеспечить финансовую безопасность пользователей, но и в принципе работать с бэкендом заказчика.

    А пользователю «ломать голову» не нужно

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

    Фёдор Большаков,

    Абсолютно всем не важно знать историю каждой криптовалюты, знать как работает блокчейн. Им важно понимать, как зайти, обменять и вывести с минимальными затратами. И, самое главное, без страха сделать что-то не так.

    Фёдор Большаков, 
    Технический директор Broex

    Основной задачей было сделать все удобно, красиво и понятно, не нагружая пользователя лишней информацией. Тем более, что Broex ориентировался на новичков.

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

    Не даем заблудиться в экранах

    Пользователи всегда должны понимать, где они находятся, и как им решить свою основную задачу. Мы сделали так, что при реализации побочных сценариев пользователь остается на том же экране, а новый контент появляется на всплывающих снизу «шторках» — их еще называют бэкдропами. Например, просмотр списка транзакций в Broex — основной сценарий, а его сортировка — побочный.

    Бэкдроп состоит из двух частей — заднего слоя и переднего слоя

    Бэкдропы обеспечивают пользователю быстрый доступ к дополнительным функциями приложения и при этом не дают запутаться в экранах.

    Лид менеджер по дизайну

    Бэкдропы привычны для пользователей и минимизируют «вложенность приложения». «Вложенность» — это навигационная особенность, при которой пользователю приходится переключаться между несколькими экранами, все сильнее отдаляясь от исходного. Зачастую это не совсем удобно.

    Лид менеджер по дизайну 
    на Broex

    Подписываем все элементы

    В Broex на каждом экране много кнопок, полей ввода и других элементов интерфейса. Чтобы пользователю было понятно, что куда относится, мы продумали названия всех элементов, не оставили непонятных иконок и не забыли про плейсхолдеры в строках ввода.

    К строкам ввода добавили названия и подсказки, чтобы всё было понятно

    Ориентируемся на то, что привычно

    Классические финансовые приложения знакомы многим, даже новичкам в крипте. Поэтому в конкурентном анализе мы рассматривали и непрямых конкурентов, например, Тинькофф Инвестиции.

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

    Сверху — карта с балансом, ниже — история транзакций

    Мы точечно заимствовали у банковских и инвестиционных приложений поведение отдельных элементов интерфейса. Например, модуль селектора валюты обычно делают через бэкдроп — в Broex так же.

    Долой стереотипы в дизайне

    Когда Broex обратились к нам, у них еще не было полноценного дизайн-гайда. Нам дали только логотип и основной цвет — классический синий. Поэтому, прежде чем проектировать UI, мы выяснили пожелания заказчика через позитивные и негативные референсы.

    Самый распространенный стиль в дизайне криптокошельков — это киберпанк. Мы хотели избежать подобных стереотипов и поэтому обратились к классическим финансовым приложениям. Их стиль был привычнее для новичков, понятнее и визуально «чище».

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

    Разобрались в верификации

    В плане стека никаких новшеств для нас не было — для разработки мобильных приложений всегда используем React Native. А вот небольших технических нюансов оказалось много.

    К примеру, криптовалютные биржи обязаны верифицировать пользователей через процедуру KYC («know your customer» — «знай своего клиента»). Это стандарт безопасности и мера против отмывания денег.

    Мы реализовали KYC в приложении через SDK SumSub. Это решение уже использовалось на бэкенде заказчика, поэтому выбора у нас не было. Но, к счастью, SumSub — отличный сервис, и проблем с ним не возникло.

    Фронтенд-разработчик на Broex

    Главным минусом оказался встроенный UI, который нельзя кастомизировать. Зато в остальном все очень быстро и просто интегрируется, легко настраивается. Есть даже тестовая среда для проверки работоспособности

    Фронтенд-разработчик на Broex 

    Сделали свой селектор валют

    Селектор валют — базовый элемент многих финансовых приложений. Обычно это выпадающий список с валютами в алфавитном порядке. Мы перепробовали много разных селекторов, но ни один нам не подошел.

    Фронтенд-разработчик на Broex

    Каждую из них приходилось доделывать или изменять. К примеру, в них не было предусмотрено постоянное обновление родительского компонента, а у нас часто менялись курсы валют. Или нельзя было выделить выбранный элемент. А когда потребовалось добавить туда поиск, мы решили, что проще будет сделать селектор самим.

    Фронтенд-разработчик на Broex 

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

    Стандартное решение нам не подошло, и мы разработали свой селектор валют

    Непредвиденные трудности: греем смартфоны и головы

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

    Фронтенд-разработчик на Broex

    Все сложные вычислительные операции лучше выносить на бэкенд, а приложение нагружать по минимуму. Тогда и телефоны будут меньше нагреваться. А владельцы 5-х айфонов и других старых устройств вообще скажут вам спасибо

    Фронтенд-разработчик на Broex 

    К сожалению, никакие глобальные изменения на бэкенде внедрить было нельзя — тогда пришлось бы переписывать веб-фронтенд. Поэтому в большинстве случаев мы устраняли возникающие ошибки на стороне мобильного приложения.

    Решаем проблемы на стороне приложения

    В какой-то момент из-за колоссального объема данных, обновляющихся в режиме реального времени, приложение начало тормозить и сильно разогревать телефон. 

    Мы нашли компромисс между тем, какие данные нужно обновлять немедленно, а какие могут подождать. В режиме реального времени обновляется все, что связано с валютными операциями: покупка, продажа, вывод средств. А все остальное (например, курсы валют) мы решили обновлять раз в три секунды.

    Другая проблема, с которой мы столкнулись, была связана с одной из важных функций приложения — графиком цен на ту или иную валюту.

    График рисуется по точкам, содержащим две координаты — время и курс. Бэкенд формирует их в режиме реального времени. Время известно всегда, а запрос на курс валюты может и не пройти из-за внешних сбоев. Тогда нам вернутся координаты подобного вида: {x: 100, y: undefined}. Такую точку отметить на системе координат невозможно, и возникает ошибка. 

    Мы решили проблему так: фильтровали массив данных, отсеивали подобные точки, и только потом отдавали его графику. Это было вполне допустимо, ведь таких значений было немного, и они практически никогда не шли друг за другом.

    Сотрудничаем с командой бэкенда

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

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

    Не откладывали релиз в долгий ящик

    Нередко заказчики тормозят релиз, потому что хотят добавить очередную функцию. Мы были приятно удивлены, когда Broex сами предложили начать публиковать приложение с ранних версий. И с каждым релизом оно становилось все больше и функциональнее.

    Сначала мы ограничились базовыми функциями без валютных операций. Но даже на данном этапе пользователи приложения уже могли:

    • пройти регистрацию и процедуру KYC;
    • настроить меры безопасности в профиле;
    • просмотреть список своих активов и информацию о них;
    • изучить и добавить в избранное интересующие их активы.

    К декабрю добавили финансовые операции, причем сюда вошли не только получение и отправка валют по уникальному адресу кошелька, но также покупка и вывод активов на карту.

    В последний релиз мы включили биометрию для iOS: теперь авторизоваться можно по Face ID и Touch ID. Также немного дополнили профиль, и теперь в нем доступны валюта по умолчанию, интеграция с соцсетями и информация о версии приложения.

    Сейчас Broex у нас на поддержке: фиксим баги, релизим обновления. У компании много идей и планов. Например, добавить торговые сигналы на криптовалюты, чтобы привлечь еще больше пользователей-трейдеров.

    Светлое криптовалютное будущее компании Purrweb

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

    Возникшие технические сложности прокачали нас в крипторазработке. Этот опыт мы уже применяем в новых проектах: один из них связан с NFT, второй — с криптоинвестициями. Бэкенд разрабатываем сами — это не только удобнее, но и дает больше возможностей для оптимизации работы приложений.

    Насколько публикация полезна?

    Оцени эту статью!

    12 оценок, среднее 5 из 5.

    Оценок пока нет. Поставьте оценку первым.

    Так как вы нашли эту публикацию полезной...

    Подписывайтесь на нас в соцсетях!

    Поделиться