---
updateDate: 2026-02-05T00:00:00Z
publishDate: 2025-05-14
publishYear: 2019
name: FinexWare
title: Интерфейс онлайн-платформы для трейдеров и инвесторов
excerpt: Разработали дизайн международной платформы для заказчика из Германии.
context: Компания уже несколько лет разрабатывала платформу, но мы создали новую с нуля.
logo:
src: ~/assets/images/portfolio/finexware/logo.svg
alt: FinexWare logo
link: http://finexware.com/
image: ~/assets/images/portfolio/finexware/main.png
imageAlt: Собака Павлова • FinexWare • Интерфейс онлайн-платформы для трейдеров и инвесторов
thumbnail:
src: ~/assets/images/portfolio/cards/finexware.svg
alt: Собака Павлова • FinexWare • Интерфейс онлайн-платформы для трейдеров и инвесторов
tags:
- fin
- research
- ux-design
- mass
relatedPages:
- text: |
### Вам нужен интерфейс?
#### Заказать дизайн
Напишите нам на [we@sobakapav.ru](mailto:we@sobakapav.ru)
#### Что мы можем сделать?
[UX-исследование](/services/research) и [дизайн под ключ](/services/ux-design), как в этом кейсе, и [многое другое](/services).
collection: services
page: research
- collection: services
page: ux-design
- text: |
### Хотите сделать сами?
Научим создавать хорошие интерфейсы.
collection: promo
page: mio
- collection: promo
page: uc
- collection: promo
page: focus
relatedPages2:
- text: |
### Похожие проекты
collection: portfolio
page: qiwi
- collection: portfolio
page: alfastrah-design
- collection: portfolio
page: monetory
- collection: portfolio
page: alfa-arm
- collection: portfolio
page: cindicator
- collection: portfolio
page: sberbank
- collection: portfolio
page: tinkoff
- collection: portfolio
page: alfabank
result:
- src: ~/assets/images/portfolio/figma.svg
text: Интерактивный прототип
link: https://www.sketch.com/s/cf5783a3-cf3d-4941-9c88-4b742ff0142b
budget: ~ 1 000 000 ₽
director: Заказчик сказал, что новая платформа устроит революцию на рынке
metadata:
canonical: https://sobakapav.ru/portfolio/finexware
title: Дизайн интерфейса • Интерфейс онлайн-платформы для трейдеров и инвесторов
description: "Разработали дизайн международной платформы для заказчика из Германии."
robots:
index: true
follow: true
openGraph:
site_name: Собака Павлова
images:
- url: '~/assets/images/portfolio/finexware/main.png'
width: 1280
height: 871
---
import Image from '~/components/common/Image.astro';
import TOC from '~/components/widgets/TOC.astro';
import PhoneMockup from '~/components/widgets/PhoneMockup.astro';
<TOC>
[Вводные](#anchor1) • [Дизайн-задача](#anchor2) • [Дизайн-процесс](#anchor3) • [Заключение](#anchor4) • [Отзыв, цены, сроки](#anchor5)
</TOC>
## <a name="anchor1" />Вводные
[FinexWare](http://finexware.com/) — международная онлайн-платформа для брокеров. Офис компании находится в Германии.
FinexWare предоставляет брокерам площадку, на которой трейдеры могут находить инвесторов, а инвесторы — трейдеров. Если совсем упрощенно, это социальная сеть, в которой неопытные фондовые игроки могут подписываться на опытных, чтобы автоматически копировать их торговые сделки. Трейдеры зарабатывают на комиссии, а инвесторы — на росте стоимости финансовых инструментов. При этом все сделки проходят через торговые терминалы и отношения к FinexWare не имеют.
Брокеры арендуют у нашего заказчика площадку и настраивают полностью под себя: размещают на собственном домене, меняют цвета, логотипы и остальные брендовые атрибуты. В общем, полный White Label.
Основные пользователи платформы — трейдеры и инвесторы. Брокер — хозяин и управляющий.
К нам заказчик пришел, чтобы переделать FinexWare с нуля. Она была в каком-то виде готова, работала, но определенно не могла перевернуть рынок. А у заказчика были именно такие амбиции.
Впервые мы встретились с представителем FinexWare у нас в офисе. Борис, русскоязычный основатель компании, прилетел в Санкт-Петербург из Германии, чтобы помочь нам изучить инвестиционный рынок. Четыре часа он рисовал на доске схемы и объяснял, что такое MAM, PAMM и социальный трейдинг, как взаимодействуют между собой инвесторы и трейдеры, что делает брокер, причем там фонды и кто на чем зарабатывает. И это было только введение в тему.
<a href="/images/portfolio/finexware/1.jpg" target="_blank"></a>
_Борис рисовал на доске схемы, которые объясняли, как работает платформа_
Борис оказался очень компетентным заказчиком. Рассказывал понятно, не требовал невозможного, хорошо представлял себе финальный результат, отвечал на любые вопросы. А еще предоставил огромное количество справочных документов, которые помогали в работе. В общем, мы остались довольны знакомством и сразу взялись за дело.
<a href="/images/portfolio/finexware/2.jpg" target="_blank"></a>
_Схем было очень много_
## <a name="anchor2" />Дизайн-задача
Борис хотел сделать платформу, которая заткнет за пояс остальные брокерские площадки. В общем, устроить революцию на рынке.
Платформа FinexWare должна совместить самые распространенные инвестиционные модели, дать огромные возможности для всех типов пользователей и упростить сам принцип инвестирования до принципа «посмотрел графики, нажал кнопку „Подписаться“ и начал зарабатывать». Да, мы уже говорили: прямо как в социальных сетях, только с деньгами.
## <a name="anchor3" />Дизайн-процесс
Менеджер подготовил основные сценарии использования системы и базовые профили, описал бизнес-требования к системе. Заказчик дополнил и утвердил их.
<a href="/images/portfolio/finexware/3.png" target="_blank"></a>
_Конкурент FinexWare_
Мы изучили все документы, посмотрели конкурентов и начали укладывать всю эту информацию в голове. Трейдинг — сложная тема, с наскоку понять не получится.
Чтобы побыстрее разобраться в будущей архитектуре системы, мы решили декомпозировать функции. Взяли все функциональные ожидания, сценарии и профили и начали выписывать все возможности на стикерах. Один стикер — одна функция.
<a href="/images/portfolio/finexware/4.png" target="_blank"></a>
_Будущая функциональность платформы. Один стикер — одна функция_
Когда разобрались с возможностями системы, пошли рисовать первые интерфейсы на доске. К тому моменту представление о необходимых функциях в головах уже кое-как сложилось.
<a href="/images/portfolio/finexware/5.png" target="_blank"></a>
_Сделали наброски на доске, а потом перевели все в цифровой вид_
Мы взяли основные экраны, выделили блоки, из которых будут состоять страницы, и сразу прогнали их по списку основных требований к системе. Когда все сложилось в единую картину, перенесли наброски в Sketch.
<a href="/images/portfolio/finexware/6.png" target="_blank"></a>
_Рисовать на доске — хороший способ думать вместе_
Всех пользователей поделили по цветам — кто что мог делать со стратегиями. Сделали для себя, чтобы побыстрее понимать, у кого какие функции будут в интерфейсе.
<a href="/images/portfolio/finexware/7.png" target="_blank"></a>
_Многие экраны для всех типов пользователей выглядят одинаково, но различаются функциями. Чтобы не запутаться, мы присвоили инвесторам, трейдерам и управляющим стикеры разных цветов_
Каждый шаг мы обсуждали с клиентом — созванивались раз в неделю, рассказывали, что уже сделали и что планируем делать дальше.
Иногда обсуждения затягивались на 2−3 часа — Борис дотошно комментировал каждый экран, предлагал решения, объяснял нюансы: как ведут себя трейдеры и инвесторы, что им важно, на какие числа смотрят, какими функциями пользуются чаще.
<a href="/images/portfolio/finexware/8.png" target="_blank"></a>
_Информационная архитектура проекта_
Мы начали с MAM-стратегии — она самая большая и сложная. Две другие рассчитывали сделать позже, убрав из первой все лишнее.
После этого началась обычная дизайн-рутина: мы детализировали основные экраны, рисовали новые, согласовывали и шли дальше. Не сразу в финальной версии, но близко к ней. Брали отдельные сценарии или части интерфейсов и прорабатывали их. Например, карточку стратегии — отдельно для трейдера и инвестора, потому что они видят ее по-разному, у них разные возможности и задачи. Ну, а раз платформа поддерживает три типа инвестирования, то разрабатывать одну и ту же карточку нужно шесть раз.
<a href="/images/portfolio/finexware/9.png" target="_blank"></a>
_Карта функциональности прошлой платформы. Мы ее зафиксировали, чтобы ничего не потерять при создании новой версии_
В процессе нам приходилось решать много мелких дизайн-задач. Так, мы знали, что у нас будут пользователи из разных стран. Законодательство у них разное, и где-то неподготовленному человеку нельзя показывать даже интерфейсы подобных систем. Сперва нужно попросить его согласие.
<a href="/images/portfolio/finexware/10.png" target="_blank"></a>
_В некоторых странах закон запрещает показывать интерфейсы платформ для трейдеров без согласия пользователя_
Что делать, когда человек видит интерфейс? Предложить ему зарегистрироваться. Но уводить его на отдельный экран не стоит — он же хотел посмотреть, как тут все устроено. Поэтому мы добавили регистрацию справа на первом экране, который показываем посетителю.
<a href="/images/portfolio/finexware/11.png" target="_blank"></a>
_Отдельный экран регистрации_
С регистрацией были и другие сложности. Чтобы пользователь мог пользоваться площадкой, ему нужно открыть счет у брокера. Это отдельная процедура. Мы привязали ее к регистрации — вводишь данные, нажимаешь кнопку, и брокер создает тебе счет. Это редкая практика — обычно пользователю приходится чуть ли не в банк идти.
Что написать на кнопке в форме? «Открыть счет у брокера» или «Зарегистрироваться»? Мы остановились на втором варианте. А в форме предупредили, что одновременно откроем счет в течение двух дней.
<a href="/images/portfolio/finexware/12.png" target="_blank"></a>
_Регистрация внутри платформы_
Параллельно UX-писатель писал гайд к системе. Точнее, три гайда — отдельный для каждой стратегии. Писал на русском, позже заказчик собирался перевести его на другие языки — платформа-то международная.
<a href="/images/portfolio/finexware/13.png" target="_blank"></a>
_Что делать только что зарегистрированному пользователю? Инвесторам мы предлагаем посмотреть рейтинг стратегий, а трейдерам — почитать гайд_
Спустя полтора месяца, когда до завершения проекта оставался месяц, оказалось, что мы неверно оценили объемы работы. Анализ конкурентов и присланных документов дали примерное представление, сколько экранов мы будем отрисовывать, но ближе к финалу внезапно оказалось, что у одного из типов пользователей слишком много задач и возможностей.
<a href="/images/portfolio/finexware/14.png" target="_blank"></a>
_Дашборд активного пользователя_
Изначально мы прорабатывали интерфейсы инвестора, трейдера и администратора. Это основные пользователи системы. Но внезапно появился еще один, портфельный управляющий.
<a href="/images/portfolio/finexware/15.png" target="_blank"></a>
_Раздел портфельного управляющего_
Борис в начале проекта упоминал его мельком — считал, что тот повторяет возможности других пользователей, поэтому будет достаточно скопировать попозже уже имеющиеся интерфейсы. А оказалось, что у этого управляющего больше всего функций. И нам пришлось его аккуратно встраивать в готовое решение. Не просто сделать дизайн еще нескольких экранов, а продумать функциональность — как что будет работать.
<a href="/images/portfolio/finexware/16.png" target="_blank"></a>
_Портфельным управляющим может быть компания, которая нанимает трейдеров. Или, наоборот, специалист, которого нанял слишком занятой трейдер. Поэтому у этого пользователя так много возможностей_
С появлением портфельного управляющего увеличилось количество действий внутри системы — нам пришлось проработать новые микросценарии, которые влияли на дизайн уже существующих экранов. И при этом нужно было сохранить консистентность всей платформы. Проект увеличился на треть, сроки сдвинулись на месяц. Портфельный управляющий, хоть и абстрактный, устроил нам внезапный аврал. Да что уж там, внезапнейший! Мы от такого давно отвыкли, но ничего: закатали рукава и начали встраивать управляющего вместе с его портфелем в платформу.
<a href="/images/portfolio/finexware/17.png" target="_blank"></a>
_Экран незаполненной стратегии. Статистики по ней, разумеется, нет, поэтому мы объясняем, что здесь появится позже_
Борис планировал презентовать готовую платформу инвесторам через четыре месяца после старта проекта, а мы не успевали доделать дизайн. Поэтому начали работать параллельно с разработчиками. Доделывали часть дизайна, писали спецификацию и сразу передавали заказчику. Созваниваться стали по два раза в неделю — отдельно с Борисом и с разработчиками.
<a href="/images/portfolio/finexware/18.png" target="_blank"></a>
_Экран стратегии, по которой уже есть статистика_
Последний месяц проходил в авральном режиме. Мы доделывали дизайн, передавали макеты разработчикам, доделывали оставшееся: панель администратора, дашборды, гайдлайн. Борис оказался из тех заказчиков, которые не любят комментировать дизайн по частям и ждут финальную версию, чтобы оценить все сразу. Поэтому еще какую-то часть времени мы корректировали уже готовые макеты.
<a href="/images/portfolio/finexware/19.png" target="_blank"></a>
_К одному счету могут быть привязаны несколько стратегий. Перераспределить между ними деньги можно в одном окне_
<a href="/images/portfolio/finexware/20.png" target="_blank"></a>
_В этом же окне можно поменять настройки каждой стратегии: долю на счете, сумму инвестиций, тип аллокации и коэффициент_
## <a name="anchor4" />Смысл
Ситуация с авралом получилась рискованная. Понимаем.
Увы, без таких рисков невозможно взяться ни за один проект. Когда вводных слишком много, а тема незнакомая, запланировать работы с точным сроком крайне сложно. Как и в этом кейсе, никогда не угадаешь, что произойдет в середине работы — появятся новые вводные, изменятся бизнес-ожидания, затянется аналитика. У нас выскочил портфельный управляющий, на которого не обращал внимания и сам заказчик. Что ж, бывает.
С FinexWare у нас случилась и другая показательная история, связанная с неожиданным четвертым пользователем. Дело в том, что часто заказчик — носитель огромного объема знаний. Он разбирается в теме так хорошо, что его буквально разрывает от желания уместить все сразу в одном месте. В голове заказчика уже существует суперпродукт, который создаст новый стандарт на рынке.
В жизни же путь до идеала долог и труден. А еще ограничен временем и бюджетом. Поэтому в какой-то момент заказчика нужно останавливать, чтобы получить хоть что-то. При огромных амбициях проект грозится разрастись до невероятных размеров и занять годы разработки.
Главное — мы остановили заказчика, чтобы он получил продукт. Борису хватило бы экспертизы и видения, чтобы добавить в интерфейс еще нескольких пользователей, несколько видов стратегий, десяток-другой уникальных функций. Но и того, что мы сделали, было достаточно. Потому что готовый неидеальный продукт лучше неготового идеального. А результат, который получил FinexWare, уже превзошел его ожидания. И это за бюджет, которого на Западе хватило бы лишь на четверть того, что сделали мы.
Пройдет время, и FinexWare соберет статистику по рабочему продукту. У Бориса появятся новые идеи, примут стройный вид старые, инвесторы выделят бюджет на расширение платформы. И тогда уже можно будет браться за вторую версию продукта. Возможно, этим займемся мы. А может, и нет. Кто знает? Главное — спустя два месяца после разработки дизайна Борис запустил рабочую версию платформы. И остался ей доволен.
## <a name="anchor5" />