Aigenis. Desktop приложение по покупке акций и облигаций

З А К А З Ч И К
Компания "Айгенис" оказывает полный комплекс услуг на биржевом и внебиржевом рынках ценных бумаг в части брокерской и дилерской деятельности, включая инвестиционное консультирование, сопровождение сделок купли-продажи акций, организацию выпуска акций и облигаций, а также иные услуги.
1
ДИЗАЙНЕР
Я была одним дизайнером на проекте
4
МЕСЯЦА
Продолжительность проекта
5+
ЧЕЛОВЕК
Приблизительная численность команды
ЗАДАЧА ПРОЕКТА
Разработать архитектуру десктоп приложения на базе уже заданного функционала и архитектуры мобильного приложения, а также добавить новый расширенный функционал.

Создать актуальный визуальный стиль для приложения, также базируясь на уже разработанном стиле ранее.
БЫЛО СДЕЛАНО
Переработана и адаптированна архитектура мобильного приложения под десктоп, улучшена.

Обновлен визуальный стиль с проработкой всех возможных состояний и собран UI Kit, созданы новые контролы для десктопа.

Разработана темная тема приложения.
МОЯ РОЛЬ
User Experience & User Interface Designer.

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

— разработка UX сценариев основываясь на бизнес требованиях;

— детальное интерактивное прототипирование;

— разработка иконок;

— разработка иллюстраций.
Дизайн-процесс
1
Информационная
Архитектура
•Установочная встреча
•Разработка информационной архитектуры
•Создание wireframes
•Цифровой интерактивный прототип
2
Визуальный
Дизайн
•Мудборд
•Создание визуального концепта
•Утверждение и внесение правок
•Разработка визуального дизайна для desktop
3
Сопровождение
Разработки
•Подготовка файлов к передаче в разработку
•Разработка состояний элементов
•Создание небольшого UI Kit
•Сопровождение и контроль разработки
Читать подробнее кейс первой интерациии разработки мобильного приложения для iOS и Android
ИНФОРМАЦИОННАЯ
АРХИТЕКТУРА
•Установочная встреча
•Оценивание проекта
•Разработка информационной архитектуры
•Создание wireframes
•Цифровой интерактивный прототип
РАЗРАБОТКА АРХИТЕКТУРЫ
Архитектура десктоп приложения была разработана на базе уже существующей архитектуры для мобильного приложения под платформы iOS и Android. Однако была переработана и оптимизирована с учетом добавления нового функционала.
?
Был определен вид и стиль глобальной навигации, а также, какая информация будет постоянно отображаться в хедере и прорастать на каждой странице приложения; вынесли важные настройки и функции.
разработка прототипов
При первой итерации были разработаны бумажные wireframes основных 3 экранов. Так как большая часть сценариев уже отработаны на мобильном приложении, далее сразу началась работа над созданием высокой степени детализации цифрового интерактивного прототипа.
Э Т А П — 0 1
Видео с прототипами
ВИЗУАЛЬНЫЙ
ДИЗАЙН
•Мудборд
•Создание визуального концепта
•Утверждение и внесение правок
•Разработка визуального дизайна для desktop
СОЗДАНИЕ МУДБОРДА
Для поиска лучших визуальных решений в финансовой области приложений был создан мудборд. Многие интересные решения были найдены во время проведения конкурентного анализа. Однако мудборд позволил вдохновиться и собрать понравившиеся визуальные варианты, которые в дальнейшем легли в основу UI концепта главных экранов приложения.
Э Т А П — 0 2
От прототипа к визуальному концепту
Создание визуального концепта начиналось с детальной проработки трёх основных экранов приложения. Основа стиля приложения была выработана уже на этапе дизайна мобильного приложения.
Данный стиль был немного изменен и актуализирован для десктопа: изменен основной акцентный цвет, немного изменилась цветовая палитра иллюстраций — появились градиенты.
Проектирование таблиц и фильтрации
В рамках проекта было спроектировано ряд таблиц с различным набором фильтров и поиском. Таблицы проектировались с учетом респонсивности.
Проектирование графиков
Разработка темной темы
Видео с визуальным дизайном прототипами
СОПРОВОЖДЕНИЕ
РАЗРАБОТКИ
•Подготовка файлов к передаче в разработку
•Разработка состояний элементов
•Создание небольшого UI Kit
•Сопровождение и контроль разработки
Еще больше экранов с визуальным дизайном
Tools
Sketch, Adobe Illustrator, Invision.