Разработка мобильных приложений
12 октября 2017 Алексей Попов , Anvics

Мобильное приложение как основа цифровой экосистемы: кейс ИОМ РАНХиГС

В конце 2016 года, мы выпустили мобильное приложение для одного из самых популярных ВУЗов в стране: РАНХиГС занимает 11-ое место в России по качеству образования, и 5-ое место в сфере «Экономика и управление» по данным Эксперт РА. Заказчик— один из факультетов — Институт отраслевого менеджмента. Институт состоит из 25 профилей, в частности дополнительное образование и MBA. При создании мобильного приложения приходилось учитывать такую разветвленность — среди заявленных функций было создание таргетированных пуш-уведомлений по направлениям и подбор универсального решения для доставки каждому студенту расписания.

После публикации, количество скачиваний через App Store и Google Play лаконично показало, что приложение установили себе 87% студентов. Это подкрепляет тезис о переходе поколения 18-24 лет на потребление информации по принципу mobile only. Конечно, расписанием занятий и данными о кураторе твоего курса удобнее пользоваться при помощи гаджета, который под рукой, и именно в приложении, а не через мобильный сайт — приложение сокращает количество кликов до получения нужной информации в 3-4 раза. Когда нет в доступе интернета, сайт не поможет, а в приложении нужная информация сохраняется оффлайн, кэшируется.

Красноречивая цифра

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

 

«В первой реализации, мы просили найти минимально затратные по времени решения наших задач (получение от студентов заявок на справки и показ расписания), чтобы не привязываться к разработке большой IT-системы. Мы справились с желанием скорее запустить приложение — запросы студентов приходили на электронные почты администраторов, информация о парах разных групп загружалась табличным файлом эксель в CMS. С другой стороны, с эксель файлами случались ошибки человеческого фактора, а первые несколько недель справки отфильтровывались почтой в спам :) Поэтому был сделан следующий шаг к удобству этих процессов».

Аршак Абгарян, ведущий технический специалист ИОМ РАНХиГС

 

Задачи на старте

РАНХиГС хотели получить мобильное приложение, которое:

— Будет доставлять расписание занятий, не только студентам, но и преподавателям

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

— Будет мотивировать на посещаемость и повышение показателей в учебе

— Сделает учебный процесс цифровым.

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

Нам доверили разработку под iOS, Android, редизайн и web-административную панель с созданием необходимых серверных баз данных.

 

Проектирование

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

Результатом проектирования стали документы, в которых находят отражение бизнес требования заказчика: техническое задание на разработку, вайрфреймы (схема экранов с переходами), кликабельный прототип.

Мы всегда делаем проектирование, подписываем на него отдельные документы, до начала программирования. Ниже мы даём ответ, для чего это нужно:

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

Для проработки вайрфреймов и ТЗ, в ход идут составленные нами чек-листами. Например. Списки включают типичные ситуации пользования мобильными приложениями (use cases) и позволяют не забыть то, что важно. Дополняем чек-листы в ходе каждого проекта, после каждого проекта появляются новые обязательные вопросы

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

Схема получившейся цифровой экосистемы РАНХиГС

Столкнулись мы и с тем, что ИОМ существует в реалиях стандартов, как министерских, так и внутривузовских. В частности, учет новых студентов идет через электронный образовательный реестр, интегрированный с 1С для выставления счетов за обучение. Конечно, хотелось облегчить доставку информации о тысячах студентов в нашу админпанель. API у КАС не было, но был экспорт таблицы со списком учащихся. Проработав варианты, придумали решение — импорт через интерфейс базы данных списка студентов эксель файлом в формате csv.

 

Дизайн

У Академии есть фирменный стиль, с Руководством на 84 страницы, соответствовать которому должны были и мы.

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

Проговорив с заказчиком крайние случаи, мы удостоверились, что наш дизайн учитывает названия предметов и ФИО студентов предельно большой и предельно маленькой величины.

Главные мобильные дизайн-решения пришлись на разделы Расписание и Рейтинг: вернуться к текущему дню расписания можно при помощи кнопки быстрого скролла, пиктограмма календаря открывает экран с возможностью добавления учебного дня в стандартные календари iOS и Android, три самых успевающих студента награждаются медалями.

 

Программирование

iOS приложение ИОМ РАНХиГС написана на языке Swift. Разработка Android - сочетание Java и Kotlin.

 

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

С одной стороны, мы учитывали что у платформ есть свои стандарты отдельных элементов, и не пихали в Android барабан для выбора даты и времени, а в iOS для верхнего горизонтального меню создавали segmentController, а не PagerTabStrip.

Дизайн должен быть адаптирован под разные ОС

С другой стороны, со времен первой версии iOS приложения была реализована боковая навигация, типичная для Android, но не характерная для приложений Apple. Правда, и в этом правиле свои исключения, например, VK, Госуслуги или Активный гражданин. Было принято промежуточное решение оставить меню в таком виде, но на следующей итерации возможен вариант с переходом на нижнюю горизонтальную навигацию в обеих операционных системах.

 

Работы на сервере

Новая авторизация

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

Защита от перехвата данных

Авторизация интересно устроена и со стороны сервера. Мы попробовали и реализовали технологию JWT. JSON Web Token (JWT) является открытым стандартом (RFC 7519), который определяет компактный и автономный способ для безопасной передачи информации как объекта JSON. Эта информация может быть проверена, поскольку она имеет цифровую подпись. Из-за меньшего размера данных, передача выполняется быстро. Токен содержит всю необходимую информацию о пользователе, избегая необходимости запрашивать базу данных более одного раза. Детали реализации JWT заслуживают отдельного специализированного текста, который мы можем написать если увидим в этом интерес читателей.

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

1. Посещение учебных занятий (max 20 баллов)

2. Текущий контроль (max 20 баллов)

3. Творческий рейтинг (max 20 баллов)

4. Промежуточная аттестация (зачет, зачет с оценкой, экзамен) (max 40 баллов).

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

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

Итог

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

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

Спасибо, создавайте проекты с душой ♥️

anvics.ru


Перейти на сайт

Обсуждение