QIWI: как мы ускорили разработку и успели к релизу


Автор
Татьяна
Татьяна
Руководитель front-end направления

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


 Предыстория

6 июня 2017 года в рамках программы «Финансовая грамотность с QIWI» в лагере «Артек» наш клиент QIWI, с которым мы плотно и плодотворно сотрудничаем, представил игру, направленную на повышение финансовой грамотности детей - «Финансовый абсолют».

 

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


4.gif

Форма редактирования данных зарегистрированного члена игровой семьи

В процессе работы над проектом команда разработки должна была решить ряд классических задач:

 

1) Аналитика, прототипирование

2) Дизайн

3) Верстка + Разработка

 

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

 Команде был дорог каждый день и тогда было принято решение использовать готовые визуальные компоненты, представленные в ui-kit ant-design.


Демонстрация профиля игровой семьи.gif

Демонстрация профиля игровой семьи

Что такое UI-kit?

UI-kit - это готовый набор элементов пользовательского интерфейса, то есть все то, с чем взаимодействует пользователь: ссылки, кнопки, таблицы, виджеты и т.д. Часто это пакет графики, которую использует проектировщик интерфейсов, однако есть и готовые сверстанные компоненты с базовым функционалом .


loading.gif

Компоненты кнопок ui-kit Ant-design


Почему выбранное решение помогло в реализации проекта?

   

Перед нами стояла задача получить работающий продукт в максимально короткие сроки.


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


2.gif


Почему мы выбрали Ant-design?


Это популярная библиотека готовых элементов с открытым исходным кодом, которая сегодня может использоваться как в ReactJS, так и в Angular. Имеет в своем пакете более пятидесяти готовых к использованию компонентов. Реализованные в этом пакете компоненты выглядят приятно, удобны в настройке и имеют базовый функционал.
 

Мы проверяли эффективность всех используемых библиотек. Специалисты службы обеспечения качества отработали все возможные сценарии работы с компонентами ant-design. Мы уверены в их качестве!

 

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

 Наш результат

Благодаря слаженной работе команды и использованию проверенных средств разработки проект «Финансовый абсолют» был сдан точно в срок к началу сезона в лагере. Сократив время на проектирование интерфейса за счет использования готовых компонентов Ant Design, программисты успели закончить работу в срок, передав эстафету коллегам из QA-отдела. В результате, к началу интерактивной игры, организованной QIWI, в руки юных пользователей попало отлаженное приложение, которое помогло ребятам разобраться в тонкостях финансового планирования.

 

Мы помогаем клиентам добиваться успеха! Игра была реализована не только в международном центре «Артек», но и на фестивале Молодежи и Студентов в Сочи,  на IV выездной школе директоров и педагогов, ПО игры было использовано в рамках совместного проекта с Центральным Банком РФ в рамках образовательного Форума в МДЦ "Артек". Проект по финансовой грамотности и моделированию ответственного финансового поведения у детей - "Финансовый абсолют" - признан социальной инновацией года в категории "Наука и образование" Премии «Время Инноваций-2017".

 


Почувствуйте наш подход и повторите
успех наших клиентов

Напишите нам
АЛЕКСАНДР НОСКОВ
АЛЕКСАНДР НОСКОВ
СЕРГЕЙ ИСАКОВ
СЕРГЕЙ ИСАКОВ