Разработка мобильного приложения для информирования обучающихся образовательной организации об изменениях в расписании

СОДЕРЖАНИЕ

ВВЕДЕНИЕ………………………………………………………...…………………4

1 ПОСТАНОВКА ЗАДАЧИ СОЗДАНИЯ ИНСТРУМЕНТАЛЬНЫХ СРЕДСТВ МОБИЛЬНОГО ПРИЛОЖЕНИЯ ДЛЯ ИНФОРМИРОВАНИЯ ОБУЧАЮЩИХСЯ ОБ ИЗМЕНЕНИЯХ В РАСПИСАНИИ………….…………..6

2 АНАЛИЗ UI / UX РЕШЕНИЙ И ФУНКЦИОНАЛЬНЫХ ВОЗМОЖНОСТЕЙ АНАЛОГОВ ПРИЛОЖЕНИЯ…………………………….…………….…………..9

2.1 Важность дизайна UI/UX………………………………………………………..9

2.2 Приложение «Class Register»…………………….……………………………..12

2.3 Приложение «Easy Attendance»………………………………………………..18

2.4 Приложение «Attendance taker»………………………….…………………….23

Выводы по разделу 2………………………………………………………………..25

3 НАБОР ИНСТРУМЕНТОВ ДЛЯ СОЗДАНИЯ UI «FLUTTER И FIREBASE BAAS………………………………………….……………………………………..27

3.1 Flutter………………….…………………………………………………………27

3.2 Dart……………………………………………………………………………….30

3.3 Firebase………………………………………………………………………...…33

Выводы по разделу 3………………………………………………………………..37

4 ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ……………………………………………..38

4.1 Структура программы…………………………………………………………..38

4.2 Описание разработанных алгоритмов…………………………………………41

4.3 Руководство пользователя……………………….……………………………..45

Выводы по разделу 4……………………………………………………………….720

Заключение……………………………………………………….…………………73

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ………………………………75

ВВЕДЕНИЕ

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

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

Стоит отметить, что ненадежность, порой, может привести к неприятным

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

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

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

Использование мобильных приложений среди пользователей мобильных устройств становится все более популярным. Согласно исследованию, AppAnnie в 2020 году, количество загрузок приложений увеличилась на 60%, потребительские расходы выросли более чем вдвое, а время, потраченное на приложение каждым пользователем, составляло около 43 дней в году [1].

Мобильные приложения играют все более важную роль в области образования, и при правильном проектировании и интеграции они могут обеспечить много преимуществ. AppAnie также прогнозирует рост на 270% рынка мобильных приложений до 2025 года [1].

Для решения проблемы недостаточно надежного и не удобного способа организации информации об учебном процессе были созданы следующие аналоги: "Class Register”, “Easy Attendance”, “Attendance Taker”. Однако, проблема остается не решенной, ведь аналоги имеют неудобный интерфейс и сложный опыт пользователя (UX) или недостаточные функциональные возможности.

Целью данной дипломной работы является создание мобильного приложения для информирования обучающихся об изменениях в расписании на примере Московского Университета имени С.Ю.Витте с интуитивным UI и легким UX и сохранением данных в облачном хранилище.

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

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

Задачами данной дипломной работы будут являться:

- изучение базовых подходов к проектированию мобильных приложений;

- анализ существующих критериев и показателей качества интерфейсов мобильных приложений;

- разработка порядка проектирования мобильного приложения для информирования обучающихся об изменениях в расписании;

- тестирование мобильного приложения на предмет работы.

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

1 ПОСТАНОВКА ЗАДАЧИ СОЗДАНИЯ ИНСТРУМЕНТАЛЬНЫХ СРЕДСТВ МОБИЛЬНОГО ПРИЛОЖЕНИЯ ДЛЯ ИНФОРМИРОВАНИЯ ОБУЧАЮЩИХСЯ ОБ ИЗМЕНЕНИЯХ В РАСПИСАНИИ

В соответствии с поставленной целью данной дипломной работы, как создание мобильного приложения для информирования обучающихся об изменениях в расписании на примере Московского Университета имени С.Ю.Витте с интуитивным UI и легким UX и сохранением данных в облачном хранилище, сформированы следующие подробные задачи:

1. Провести исследование современных цифровых методов информирования обучающихся об изменениях в расписании.

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

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

4. Создать концепт-диаграмму пользовательского опыта (UX) и определить дизайн пользовательского интерфейса (UI).

5. Спроектировать модель классов.

6. Выбрать технологии для реализации мобильного приложения.

7. Настроить систему Firebase, в качестве back-end части и интегрировать ее в мобильное приложение для получения доступа к облачному хранилищу.

8. Разработать необходимые виджеты приложения и объединить их.

9. Разработать функциональные возможности мобильного приложения.

10.Имплементировать запланированный дизайн приложения.

11.Объединить все составляющие программного обеспечения, в качестве финального программного продукта.

12. Протестировать мобильное приложение и исправить возможные ошибки и улучшить проблемные функциональные возможности.

Требования к разрабатываемому программному средству:

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

2. Инструментальные средства должны состоять из четырех подсистем:

- Система аутентификации.

- Система создания групп и предметов.

- Система контроля проведения лекций и практик.

- Система информирования учащихся об изменении в расписании.

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

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

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

6. Выходными данными системы создания групп и предметов должны быть изменения в расписании групп и предметов.

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

8. Выходными данными системы информирования обучающихся об изменениях в расписании должны быть сохранены входные данные.

9. Имеется возможность атворизации и регистрации.

10. Имеется возможность авторизации с помощью аккаунта Google.

11. Имеется возможность восстановления пароля к существующему аккаунту.

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

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

14. Имеется возможность создания групп, предметов с классификацией лекции и практики.

15.Имеется возможность изменения названия группы и занятий, а также удаление наименований из списка.

16.Имеется возможность удаления предметных практик или лекций.

17. Имеется возможность автоматического названия и нумерации уроков лекций и практик каждого предмета.

18. Имеется возможность изменения названия или удаления урока лекции или практики.

19. Имеется возможность автоматической привязки даты к уроку при его создании.

20. Имеется возможность изменения имени или удаления студента в пределах одного предмета.

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

Для разработки программного приложения был выбран язык программирования Dart и набор инструментов для создания пользовательского интерфейса Flutter.

Разработка будет происходить в среде программирования Microsoft Visual Studio Code. В качестве back end части был использован сервис Firebase, а именно Authentication Serviсe для создание расширенных возможностей авторизации и Cloud Firestore в качестве системы управление базами данных.

Далее будет описываться проведенный анализ UI / UX решений и функицональных возможностей аналогов приложения. Затем будет продемонстрирована структура программного обеспечения и руководство пользователя к созданному мобильному приложения.

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

2 АНАЛИЗ UI / UX РЕШЕНИЙ И ФУНКЦИОНАЛЬНЫХ

ВОЗМОЖНОСТЕЙ АНАЛОГОВ ПРИЛОЖЕНИЯ

2.1 Важность дизайна UI/UX

Для успешного использования любого мобильного приложения важную роль занимает его UI / UX дизайн. Ведь, большое количество функциональных возможностей приложение всегда ограничено размером экрана мобильного устройства и «зоной большого пальца» на нем.

Чтобы понять роль дизайна UI/UX в разработке мобильных приложений, сначала нужно определить, что собой представляет и какие имеет цели UI и UX дизайн отдельно. Затем стоит понять, почему их сочетание важно, как они влияют друг на друга, и какие правила являются основными для их создания.

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

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

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

UI (пользовательский интерфейс) дизайн ответственный за визуальное представление т. е. выбор цвета, читабельность текста, удобно ли пользователю нажимать пальцем на кнопки.

Как результат, задача UI / UX дизайна-повлиять на правильный выбор пользователя через созданный интерфейс. Создание всех условий для того, чтобы пользователь придерживался определенного алгоритма действий при работе с приложением на интуитивном уровне.

Чтобы начать создание UX, важно проанализировать существующие аналоги, целевых пользователей и создать определенную бизнес-модель.

Сравнительный анализ аналогов будущего мобильного приложения позволяет:

1. Выявить слабые и сильные стороны оцениваемых объектов.

2. Расширить понимание целевой аудитории и предметной области

3. Создать собственное видение проекта и генерировать собственные идеи

Стоит отметить, что польза от изучения целевой аудитории и предоставляет большой такие преимущества при проектировании приложения:

1. Определены основные и второстепенные цели пользователей.

2. Определена мотивация пользователей.

3. Выявлены типичные проблемы пользователей.

4. Создан приоритет потребностей пользователя.

5. Сформирован портрет целевого пользователя.

UX-дизайн, оценивающий все аспекты взаимодействия пользователя с продуктом. Он сильно связан с пониманием поведения пользователя, его целями, потребностями, мотивацией и контекстом, в котором используется продукт.

UI – это связь пользователя с системой, который сильно влияет на UX. И для его успешной реализации стоит придерживаться определенных правил:

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

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

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

получение данных чем формы.

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

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

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

Приложения оцениваются по доступным функциональным возможностям и его качеством, красивым и интуитивным дизайном UI в соответствии с паттернов Material и Cupertino, и эффективным и простым UX.

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

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

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

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

Большинство приложений можно скачать с сервиса цифрового распространение "Play Market", управляемый и разработанный Google. Данный сервис доступен для всех мобильных телефонов с операционной системой Android умолчанию, при наличии активированного Google аккаунта.

2.2 Приложение «Class Register»

Приложение "Class Register" можно скачать с сервиса цифрового распространения «Play Market» и запустить на операционной системе Android.

При первом запуске приложение отображает страницу от которой предлагается перейти к авторизации и регистрации нажав единую кнопку на экране, рисунок 2.1.

Рисунок 2.1- Первая страница приложения «Class Register»

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

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

Рисунок 2.2 - Страница авторизации приложения «Class Register»

00

Для регистрации предлагается форма с полями имени, фамилии, электронной почты и пароля, рисунок 2.3.

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

Рисунок 2.3 - Страница регистрации «Class Register»

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

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

Рисунок 2.4 - Страница главного меню приложения «Class Register»

Рисунок 2.5 - Страница для информирования обучающихся об изменениях в расписании «Class Register»

Рисунок 2.6 – Модальное окно формы авторизации при переходе до этой страницы приложения «Class Register»

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

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

2.3 Приложение «Easy Attendance»

Приложение "Easy Attendance" можно скачать с сервиса цифрового распространения "App Store" и запустить на операционной системе iOS.

При запуске приложение отображает страницу авторизации, от которой также предлагается перейти к регистрации нажав кнопку «Register now» на экране, рисунок 2.7. Для авторизации предлагается стандартной формой для заполнения, а само поле электронной почты и пароль. Кроме того, есть возможность восстановить пароль через электронную почту в случае его потери.

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

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

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

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

Одна из вкладок на панели навигации называется «Add/View», рисунок 2.9, и дает возможность пользователю добавить новый курс определенного предмета, рисунок 2.10, если он нажмет кноку "Add Course".

Во вкладке контроля посещения «Take» и во вкладке «Add/View» появляется создан курс, рисунок 2.11. Если пользователь нажимает на поле с именем курса в вкладке "Add/View", появляется страница курса, где он может добавить расписание заполнив отдельную форму.

Рисунок 2.7 – Страница авторизации приложения «Easy Attendance»

Рисунок 2.8 – Страница регистрации приложения «Easy Attendance»

Рисунок 2.9 – Страница добавления курсов приложения «Easy Attendance»

Рисунок 2.10 – Страница просмотра курсов приложения «Easy Attendance»

Рисунок 2.11– Список созданных курсов приложения «Easy Attendance»

Рисунок 2.12 – Интерфейс выбора даты проведения контроля посещения

приложение «Easy Attendance»

Рисунок 2.13 – Страница контроля посещения приложения «Easy Attendance»

Если пользователь нажимает на поле с именем курса во вкладке «Take», он имеет выбрать дату, когда будет проведено занятие, рисунок 2.12.

После этого, пользователь оказывается на странице посещения и имеет возможность отметить группу, относящегося к этому курсу, рисунок 2.13.

На первый взгляд приложение «Easy Attendance» выглядит неплохо, пользовательский интерфейс не перегружен и имеет более удобный пользовательский интерфейс опыт, чем «Class Register».

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

2.4 Приложение «Attendance taker»

Приложение "Attendance taker" можно скачать с сервиса цифрового распространения «Play Market» и запустить на операционной системе Android.

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

Главная страница имеет верхнюю панель навигации по трем доступным вкладкам, что является менее удобным способом навигации, чем нижняя панель навигации, рисунок 2.14.

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

После этого, в списке курсов появляется UI виджет с названием нового курса. Если нажать на этот виджет, приложение открывает экран редакции курса и позволяет добавить расписание этого курса.

Алгоритм добавления нового расписания выбранного курса идентичен алгоритму добавления нового курса.

Во вкладке под названием «Attendance» пользователь имеет возможность выбрать нужный курс, нажав на виджет с его названием, рисунок 2.15.

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

Рисунок 2.14 – Главная страница приложения «Attendance taker»

Рисунок 2.15 - Вкладка "Attendance" со списком существующих групп приложения «Attendance taker»

Рисунок 2.16 - Страница информирования обучающихся об изменениях в расписании выбранной группы «Attendance taker»

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

Выводы по разделу 2

В разделе рассмотрены основные UX / UI проблемы и важность различных функциональных возможностей для достижения поставленной цели.

Были рассмотрены существующие мобильные приложения, являющиеся аналогами для решения задачи. Приложения Class Register, Easy Attendance, attendance taker имеют разные методы решения проблемы.

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

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

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

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

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

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

Таким образом, определяется будет ли этот курс только лекционный, или только практическим или лекционным.

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

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

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

3 НАБОР ИНСТРУМЕНТОВ ДЛЯ СОЗДАНИЯ UI

«FLUTTER И FIREBASE BAAS

3.1 Flutter

Для выполнения поставленной задачи был использован Flutter – набор инструментов для разработки программного обеспечения с открытым кодом, созданный Google.

Flutter - это набор инструментов от Google для создания пользовательского интерфейса для создания красивых приложений, созданных для мобильных устройств, веба и настольных компьютеров из единой базы кода [3].

Главными преимуществами Flutter выделяют:

- Пользовательский интерфейс имеет быстрый цикл создания

- Возможно создание гибкого и выразительного интерфейса корисутвача

- Производительность нативных приложений операционных систем iOS и Android не выше приложений созданных с помощью Flutter

Архитектура фреймворка состоит из нескольких частей. Основные компоненты Flutter включают:

- Платформа Dart

- Двигатель Flutter

- Основная библиотека

- Виджеты, характерные для определенных дизайнов

Набор инструментов Flutter написан на языке Dart и успешно использует много усовершенствованных функциональных возможностей этого нового языка.

В Windows, macOS и Linux с официальным проектом Flutter Desktop Embedding Flutter работает в виртуальной машине Dart, которая имеет функциональный механизм исполнения.

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

Эта функция, реализованная во Flutter, получила широкую положительную оценку. Версии выпуска программ Flutter составлены с помощью досрочной (AOT) компиляции для Android и iOS, благодаря чему возможны высокие показатели работы Flutter на мобильных устройствах [4].

Движок Flutter, написанный главным образом на C ++, обеспечивает поддержку низкоуровневого визуализации с помощью графической библиотеки Skia от Google.

Кроме того, он взаимодействует с платформой, ориентированной на платформу SDK, такими, которые предоставляются Android и iOS. [4] Flutter engine-имеет портативные приложения для размещения программ Flutter. Он реализует основные библиотеки Flutter, включая анимацию и графику, ввод / вывод файлов и сетей, поддержку доступности, архитектуру плагинов и набор инструментов Dart.

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

Основная библиотека, написанная на языке программы Dart, содержит основные классы и функции, используемые для построенной программы Flutter, как API для коммуникации с движком Flutter. [4]

Набор инструментов Flutter содержит два набора сегментов, которые выполняют конкретную дизайнерскую конструкцию. Используя Material Design, разработчик явно использует паттерны дизайна от Google, если же Cupertino, то паттерны дизайна от Apple, известные под названием Apple iOS Human Interface [3].

Дизайн интерфейса во Flutter обеспечивает выполнение композиций для разработки / создания приложения с другими оттенками. Раньше в производстве было хитростью использовать то, что любые компоненты имели древовидную структуру, собранные в рамках одного метода build (), также называются одинарным воспроизведением. Более того, эти небольшие результативные виджеты состоят из еще меньших результативных виджетов, и у каждого из них есть собственный метод build (). Вот как Flutter использует компиляцию.

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

Есть виджеты, которые представляют вещи, такие, которые представляют характеристики (например, TextStyle) и даже другие, которые делают разные вещи, например, FutureBuilder или StreamBuilder.

Сложные виджеты можно создать, совместив множество более простых, и весьприложение является самым большим из всех виджетов (часто называется "MyApp"). Виджет MyApp содержит все другие виджеты, которые могут содержать еще меньшие виджеты, и вместе они составляют ваше приложение.

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

Эта способность Flutter была использована в нескольких фреймворках, таких как игровой движок с открытым кодом Flame[8].

3.2 Dart

Dart - это клиенто-оптимизированный язык программирования для создания приложений на разных платформах. Разработанная компанией Google, она используется для создание мобильных, компьютерных, серверных и веб приложений [3].

Стоит отметить, что язык Dart базируется на классах и является объектно-ориентированным языком, имеющим встроенную технологию "garbage collector" и имеющую синтаксис подобный языки C. Этот язык может компилироваться в нативный код или JavaScript. Язык программирования Dart поддерживает возможность создания интерфейсов, абстракных классов, комбинаций, расширенную шаблонизацию, и умозаключения.

Существует четыре способа выполнения кода, написанного на языке Dart:

- Скомпилирован как JavaScript

Для запуска в основных веб-браузерах Dart полагается на компилятор от источника к источнику в JavaScript.

По данным сайта проекта, Dart был разработан так, чтобы легко писать инструментарии для разработки, замечательно подходят к современной разработке приложений и способны к высокопроизводительной реализации в проектах разных масштабов [3].

При запуске кода Dart в веб браузере код предварительно компилируется в код языка JavaScript с помощью компилятор dart2js. Скомпилированный как JavaScript, Dart - код совместим со всеми основными браузерами, у которых браузеры не нуждаются в принятии Dart. Благодаря оптимизации скомпилированного вывода JavaScript, чтобы избежать дорогих проверок и операций, код, записанный на языке Dart, может в некоторых случаях работать быстрее, чем эквивалентный код, написанный вручную, используя идиомы JavaScript. [3]

- Автономность

Инструментарий разработки программного обеспечения Dart (SDK) поставляется с автономной программой Dart VM, позволяющей выполнять код языки Dart в интерфейсе командной строки. Поскольку языковые средства, включенные в SDK Dart, написанные по большей части на Dart, автономная Dart VM является важной частью SDK. Эти инструменты включают компилятор dart2js и менеджер пакетов под названием pub.

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

- Скомпилирован Ahead-of-time

Программный код языка программирования Dart можно компилировать AOT в машинный код (нативный набор инструкций). Программы, созданные с помощью Flutter, SDK для мобильных приложений, созданных с помощью языка Dart, размещаются в магазинах приложений как AOT, являющийся скомпилированным кодом Dart [5].

- Нативность

Язык программирования Dart может быть скомпилирован в нативный код для запуска мобильных приложений на устройствах с операционными системами iOS и Android через Flutter.

Дополнительные пакеты с библиотеками и утилитами распространяются через хранилище pub, которое по состоянию на весну 2015 года имеет более полутора тысяч пакетов, включая фреймворки для разработки веб-приложений AngularDart и polymer.dart [5].

Особенности языка Dart:

- знакомый и простой в изучении синтаксис, естественный для программистов в JavaScript, C и Java;

- обеспечение быстрого запуска и высокой производительности для всех современных веб-браузеров и различных типов сред, от портативных устройств к мощным серверам [10];

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

Дополнительные инструкции по типу, независимо от того, использовать статические типы или нет, зависит от разработчика. Определение типов облегчает настройка и идентификацию ошибок, делает код более понятным и читаемым, упрощает его доработку и анализ сторонними разработчиками [10].

Среди поддерживаемых типов: различные типы хэшей, массивов и списков, очередей, числовых и строчных типов, типы определения даты и времени, регулярные выражения (RegExp).

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

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

Набор готовых инструментов для поддержки развития на языке Dart, включая реализацию динамических инструментов разработки и отладки с исправлением кода на ходу ("редактирование и продолжение") [10].

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

3.3 Firebase

Firebase - это платформа для разработки мобильных и веб-приложений, разработанная Firebase, Inc. в 2011 году, затем приобретена Google в 2014 году. По состоянию на март 2021 года платформа Firebase насчитывает 19 продуктов, используемых свыше 1,5 миллиона приложений.

Сервисы Firebase включают:

- Google Analytics

- Google Analytics - это бесплатное решение для измерения приложений, которое обеспечивает понимание использования приложения и привлечение пользователей [6].

- Firebase Cloud Messaging o ранее известный как Google Cloud Messaging (GCM), Firebase Cloud Messaging (FCM) - это кросс-платформенное решение для сообщений и уведомлений для Android, iOS и веб-приложений, которое по состоянию на 2016 год можно использовать бесплатно [6].

- Firebase Authentication. Аутентификация Firebase - это услуга, которая может аутентифицировать пользователей, используя только код на стороне клиента. Он поддерживает провайдеров социальных входов Facebook, GitHub, Twitter и Google, а также других поставщиков услуг, таких как Google Play Games, Apple, Yahoo и Microsoft. Кроме того, она включает систему управления пользователем, с помощью которой разработчики могут включать аутентификацию пользователя с помощью электронной почты и входа пароля, хранящиеся с Firebase.

- Firebase Realtime Database. Firebase предоставляет базу данных в реальном времени и бэк-энд-сервис как услугу. Служба предоставляет разработчикам приложений API, который позволяет синхронизировать данные приложений между клиентами и сохранять их в облаке Firebase.

Компания предоставляет клиентские библиотеки, обеспечивают интеграцию с приложениями Android, iOS, JavaScript, Java, Objective-C, Swift и Node.js. База данных также доступна через API REST и привязки для нескольких фреймворков JavaScript, таких как AngularJS, React, Ember.js и Backbone.js. API REST использует протокол Server-Sent Events, который является API для создания HTTP-соединений для получения push-сообщений от сервера.

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

- Cloud Firestore. Cloud Firestore - это быстрая, полностью управляемая без сервера базовая база данных NoSQL, которая упрощает хранение, синхронизацию и запрос данных для мобильных приложений, Интернета и IoT в глобальном масштабе.

Клиентские библиотеки обеспечивают живую синхронизацию и поддержку в автономном режиме, в то время как его функции безопасности и интеграции с Firebase и Google Cloud Platform (GCP) ускоряют создание программ без серверов.

С помощью Cloud Firestore приложения могут обновляться почти в реальном времени, когда изменяются данные на обратном конце. Это не только удобно для создания общих многопользовательских мобильных приложений, но также означает, что есть возможность держать данные синхронизированы с отдельными пользователями, которые, возможно, хотят использовать приложение с нескольких устройств.

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

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

- Firebase Storage. Firebase Storage обеспечивает защищенную загрузку и загрузка файлов для программ Firebase, независимо от качества сети, используемые для хранения изображений, аудио, видео или другого созданного пользователем содержимого. Это поддерживается Google Cloud Storage.

- Firebase Hosting. Firebase хостинг - это статическая и динамическая веб-хостинг-служба, которая запустилась 13 мая 2014 года. Он поддерживает размещение статических файлов, таких как CSS, HTML, JavaScript и другие файлы, а также поддержку с помощью облачных функций.

Услуга доставляет файлы через сеть доставки содержимого (CDN) по с помощью HTTP Secure (HTTPS) и шифрования слоя защищенных сокетов (SSL). Firebase сотрудничает с CDN быстро, чтобы обеспечить поддержку CDN-хостинга Firebase.

Компания заявляет, что Firebase хостинг вырос из запросов клиентов; разработчики использовали Firebase для базы данных в реальном времени, но им нужно было место для размещения их содержимого [6].

- ML Kit. o ML Kit-это система обучения мобильных машин для разработчиков, запущена 8 мая 2018 года в бета-версии во время Google I / O 2018.

API ML Kit имеют разнообразные функции, включая оптическое распознавание символов, обнаружение лиц, сканирование штрих-кодов, маркировка изображений и распознавание ориентиров. Сейчас он доступен для разработчиков iOS или Android. Вы также можете импортировать собственные модели TensorFlow Lite,

Если данных API не хватает. API можно использовать на устройстве или в облаке.

- Crashlytics. Crash Reporting создает подробные отчеты об ошибках в приложении. Ошибки сгруппированы в кластеры похожих следов стека и вызываются серьезностью воздействия на пользователей приложений. Кроме автоматических отчетов, разработчик может регистрировать собственные события, чтобы помочь фиксировать шаги, ведущие к аварии [6].

- Performance. Эффективность Firebase позволяет понять эффективность программы и задержки пользователей, которые пользователи приложения.

- Firebase Test Lab. Тестовая лаборатория Firebase обеспечивает облачную инфраструктуру для тестирования приложений Android и iOS для одной операции.

Разработчики могут протестировать свои программы на широком спектре устройств и конфигураций устройств. Результаты тестов - включая журналы, видео и скриншоты доступны в консоли Firebase. Даже если разработчик не написал тестовый код для своей приложения, Test Lab может применить приложение автоматически, ища сбоев. Тестовая лаборатория для iOS в настоящее время находится в бета-версии.

- Admob. Admob - продукт Google, который интегрируется с аудиторией Firebase.

- Firebase Dynamic Links. Ссылка Dynamic Firebase - это умные URL-адреса, которые динамически изменяют свое поведение, чтобы обеспечить лучший доступный опыт на различных платформах, включая веб-браузеры для настольных ПК, iOS и Android, а также углубленные ссылки на мобильные приложения.

Динамические ссылки работают во всех установках приложений: если пользователь откроет Dynamic Link на iOS или Android, а приложение не установлено, пользователю будет предложено сначала установить приложение. После установки программа начнет работать и будет иметь доступ к ссылке.

В данной работе были использованы сервисы Firebase, имеющие название Firebase Authentication и Cloud Firestore.

Выводы по разделу 3

В этом разделе были рассмотрены использованные технологии Flutter, Dart и Firebase и их функциональные возможности.

Также было ознакомлено с основными принципами и спецификациями на которых строятся вышеуказанные технологии. Рассмотрены особенности технологий и представлены их преимущества.

Каждая из представленных технологий использует самые современные методы разработки программного обеспечения и подкрепляется Google Inc.

4 ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ

4.1 Структура программы

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

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

Клиент - серверное приложение, при использовании которого пользователь получает данные из одного из сервисов Firebase, название которого Cloud Firestore. Пользователь может получить доступ к Cloud Firestore, только если его данные провалидированы правилами сервиса, в которых указано, что только клиент получил разрешение Authentication Service, может считывать и изменять данные, связанные с его аккаунтом.

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

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

Класс Model является главным связным классом, контрлює всю систему.

Cloud Firestore - это не реляционная база данных, хранящая все необходимые данные пользователя. Диаграмма структуры базы данных демонстрирует в каком виде сохраняются данные, связанные с пользователем, рисунок 4.3.

Рисунок 4.1– Схема работы системы мобильного приложения

Рисунок 4.2 - Диаграмма классов мобильного приложения

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

Рисунок 4.3 - Структура базы данных

Используя классы сущности, а именно Student, Group, Practice, Lecture, класс Model управляет изменениями в активных данных и посылает запрос на эти изменения с помощью класса FirebaseService.

Задача класса FirebaseService-отослать определенный запрос к сервису Firebase и получить его ответ, чтобы затем отправить данные резльтата запроса на обработку классом Model.

Классы сущностей, а именно классы Student, Group, Practice, Lecture имеют две главные задачи. Первая – это представление данных в удобном виде, что позволяет строить надежное приложение и избегать ошибок, связанных с типизацией данных. Вторая – это конвертация данных json файла, что приходит в качестве результата на запрос к Cloud Firestore.

4.2 Описание разработанных алгоритмов

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

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

Прецеденты лекции и практики были декомпозированы и представлены на рисунках 4.5 и 4.6.

Из данных диаграмм можно вывести следующие алгоритмы действий пользователя для достижения своей цели.

- Чтобы войти в систему, пользователь должен:

1. Зарегистрироваться.

2. Подтвердить адрес электронной почты.

3. Авторизоваться.

Или

1. Авторизоваться, используя аккаунт Google.

- Чтобы создать новый лекционный и / или практический курс, пользователь должен:

1. Определить название курса.

2. Выбрать группы, принадлежащие к нему.

3. Выбрать тип курса для каждой из выбранных групп.

4. Подтвердить создание курса.

Рисунок 4.4 – Диаграмма прецедентов мобильного приложения

Рисунок 4.5 - Декомпозиция прецедента списка проведения лекции

- Чтобы создать новую группу, пользователь должен:

1. Определить название группы.

2. Ввести имена студентов группы, при необходимости.

3. Подтвердить создание группы.

- Чтобы провести изменение в расписании, пользователь должен:

1. Выбрать нужный лекционный курс.

2. Создать нужную сессию и, по желанию, определить ее тему

3. Описать изменение даты и времени, выбирая нужные группы или отдельных учащихся.

Рисунок 4.6- Декомпозиция прецедента списка оценки практической работы

- Чтобы провести контроль проведенного занятия, определенной группы по всем существующим сессиям выбранного курса:

1. Выбрать нужную группу из списка групп (или выбрать отдельного учащегося) избранного курса.

2. Перейти на страницу этой группы.

3. Провести отметку проведенного занятия

4.3 Руководство пользователя

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

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

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

Рисунок 4.8 - Интерфейс авторизации в систему

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

Рисунок 4.8 - Интерфейс регистрации в систему

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

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

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

Рисунок 4.10 - Интерфейс приложения на вкладке списка лекций

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

Это действие переносит пользователя на страницу создания курса, рисунок 4.10.

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

На странице создания группы, рисунок 4.11, существует два поля обязательных для заполнения. Первым полем является название группы, следующим - список имен студентов, обособленных переходом на новую строку.

Запись всех имен студентов в одно поле упрощает и ускоряет создание группы для пользователя, ведь он может просто скопировать и вставить этот список.

Рисунок 4.10 – Страница создания курса

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

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

Рисунок 4.11 – Страница создания группы

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

Это сделано, потому что лекционная сессия обычно одна для нескольких групп одновременно. А практические сессии проводятся отдельно для каждой группы.

Рисунок 4.12 – Страница создания курса в процессе настройки

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

Приложение сделает запрос подтверждения от пользователя, и в случае успеха удалит целевой курс со списка.

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

Рисунок 4.14 – Страница списка практических курсов и демонстрация удаления элемента из списка

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

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

Рисунок 4.15 - Страница расписания для отдельных групп без созданных учебных сессий

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

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

Рисунок 4.16 - Страница контроля проведения и изменения лекционных занятий

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

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

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

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

Пользователь может просмотреть страницу лекции, изменить ее имя или удалить из данного списка.

Рисунок 4.17 - Страница настроек аккаунта

Нажав на знак аккаунта в верхней панели управления, приложение прокладывает навигационный путь к странице занятия.

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

Пользователь может открыть вкладку настроек, в которой он может просматривать и управлять информацией, связанной с созданными им группами или выйти из аккаунта, рисунок 4.17.

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

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

Мобильное приложение для работы требует мобильное устройство с операционной Android версии 4.0.0 и выше или устройство с операционной системой iOS версии 8.0 и выше.

Мобильное приложение разработано с помощью языка программирования Dart с использованием инструментальных средств для создания UI – Flutter и сервиса Firebase.

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

Программа требует инсталляции и ее установочный файл для операционной системы Android можно скачать по ссылке https://drive.google.com/open?id=17KQxZ83jaEkBP2WiO_CQoK1E_q_Fz6I8.

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

Тест программы: «Мобильное приложение для информирования обучающихся об изменениях в расписании на примере Московского Университета имени С.Ю.Витте» приведен ниже:

registly.dart

// enum of tabs

enum TabItem { lecture, practice, settings }

//class of stacked navigation

class Registly extends StatefulWidget {

@override

_RegistlyState createState() => _RegistlyState();

@override

StatefulWidget get widget => null;

}

//state class of stacked navigation

class _RegistlyState extends State<Registly> {

TabItem currentTab = TabItem.lecture;

TabController tabController;

Map<TabItem, GlobalKey<NavigatorState>> navigatorKeys = {

TabItem.lecture: GlobalKey<NavigatorState>(),

TabItem.practice: GlobalKey<NavigatorState>(),

TabItem.settings: GlobalKey<NavigatorState>(),

};

@override

void initState() {

super.initState();

}

void _selectTab(TabItem tabItem) {

setState(() {

currentTab = tabItem;

});

}

@override

Widget build(BuildContext context) {

return WillPopScope(

onWillPop: () async =>

await navigatorKeys[currentTab].currentState.maybePop(),

child: Consumer<Model>(

builder: (context, model, child) {

if (model.firebase != null && model.isSignedIn) {

return Scaffold(

body: Stack(

children: <Widget>[

_buildTabNavigator(TabItem.lecture),

_buildTabNavigator(TabItem.practice),

_buildTabNavigator(TabItem.settings),

],

),

bottomNavigationBar: BottomNavigation(

currentTab: currentTab,

onSelectTab: _selectTab,

),

);

} else if (model.showLoader) {

return Scaffold(

body: Center(

child: SpinKitFadingCube(size: 75.0, color: AppColors.appBar),

),

);

} else {

model.currentUserSignIn();

return MailLogin();

}

},

),

);

}

Widget _build TabNavigator(TabItem tabItem) {

return Offstage(

offstage: current Tab != tab Item,

child: TabNavigator(

navigator Key: navigator Keys[Tab Item],

tabItem: tabItem,

),

);

}

}

model.dart

class Model with Change Notifier {

Firebase Service firebase;

List<Group> groups;

List<Lecture> lectures;

List<Practice> practices;

bool _showLoader = false;

bool _isSignedIn = false;

bool get isSignedIn => _isSignedIn;

set isSignedIn(bool isSignedIn) {

_isSignedIn = isSignedIn;

notifyListeners();

}

bool get showLoader => _showLoader;

set showLoader(bool showLoader) {

__show Loader = show Loader;

notifyListeners();

}

// will sign firebase in if user already signed in

void current User Sign In() async {

firebase = await Firebase Service.init();

if (firebase != null) {

showLoader = true;

loginUser().then((_) {

isSignedIn = true;

showLoader = false;

});

}

}

void signInAccount() async {

if (firebase == null) {

showLoader = true;

firebase = await Firebase Service.sign In With Google();

loginUser().then((_) {

isSignedIn = true;

showLoader = false;

});

}

}

Future<bool> signInEmailAccount({String email, String password}) async {

firebase = await Firebase Service.sign In With Email(email, password);

if (firebase != null) {

loginUser().then((_) {

isSignedIn = true;

});

return true;

} else

return false;

}

Future<bool> sign Up Email Account({String email, String password}) async {

if (firebase == null) {

firebase = await Firebase Service.sign Up With Email(email, password);

print(firebase);

if (firebase != null) {

return true;

} else {

return false;

}

}

return false;

}

Future<bool> recover Password({@required String email}) async {

return await Firebase Service.recover Password(email);

}

Future loginUser() async {

firebase.update UserData(firebase.firebase User);

await download Groups();

await download Lectures();

await download Practices();

notifyListeners();

}

void signOut Google() {

Firebase Service.sign Out Google();

lectures = [];

practices = [];

groups = [];

firebase = null;

showLoader = false;

isSignedIn = false;

notifyListeners();

}

////////////////////////

/* Download functions */

////////////////////////

Future download Groups() async {

var result = await firebase.getAllGroups();

groups = result.documents.map((doc) => Group.fromJSON(doc.data)).toList();

if (groups == null) groups = [];

notifyListeners();

}

Future download Lectures() async {

var result = await firebase.get All Lectures();

lectures =

result.documents.map((doc) => Lecture.fromJSON(doc.data)).toList();

if (lectures == null) lectures = [];

notifyListeners();

}

Future download Practices() async {

var result = await firebase.get All Practices();

practices =

result.documents.map((doc) => Practice.fromJSON(doc.data)).toList();

if (practices == null) practices = [];

notifyListeners();

}

////////////////////////

/* Creation functions */

////////////////////////

void addGroup(String title, List<Student> students) {

Group group = Group.by Title(title, students);

groups.add(group);

upload Group(group);

notifyListeners();

}

void addsubject(String title, List<Group Lesson> group Lessons) {

group Lessons

.where((lesson) =>

lesson.lesson Type == Lesson Type.practice ||

lesson.lesson Type == Lesson Type.lecture And Practice)

.forEach((lesson) {

Practice practice = Practice.by Title(title, lesson.group);

this.practices.add(practice);

upload Practice(practice);

});

List<Group> groups = group Lessons

.where((lesson) =>

lesson.lesson Type == Lesson Type.lecture ||

lesson.lesson Type == Lesson Type.lecture And Practice)

.map((lesson) => lesson.group)

.toList();

if (groups.is Not Empty) {

Lecture lecture = Lecture.by Title(title, groups);

this.lectures.add(lecture);

upload Lecture(lecture);

}

notifyListeners();

}

//////////////////////

/* Setter functions */

//////////////////////

void setMark(

{@{@required String practiced,

@required int studentIndex,

@required int markIndex,

@required double mark}) {

practices

..first Where((practice) => practice.id == practice Id)

.group

..student List[student Index]

..marks List[mark Index] = mark;

}

////////////////////////

/* Upload functions */

//////////////////////

void upload Group(Group group) => firebase.addGroup(group.toJSON());

void upload Practice(Practice practice) =>

firebase.add Practice(practice.toJSON());

void upload Lecture(Lecture lecture) => firebase.add Lecture(lecture.toJSON());

//////////////////////

/* Update functions */

//////////////////////

void update Lecture(String id) => firebase.update Lecture(

lectures.first Where((lecture) => lecture.id == id).toJSON(), id);

void updatePractice(String id) => firebase.updatePractice(

practices.firstWhere((practice) => practice.id == id).toJSON(), id);

void updateGroup(String id) => firebase.updateGroup(

groups.firstWhere((group) => group.id == id).toJSON(), id);

///////////////////////////////////

/* Edit functions */

///////////////////////////////////

void editLectureTitle(int index, int lectureIndex, String newTitle) {

lectures[index].lectureTitles[lectureIndex] = newTitle;

updateLecture(lectures[index].id);

notifyListeners();

}

void editPracticeTitle(int index, int practiceIndex, String newTitle) {

practices[index].practiceTitles[practiceIndex] = newTitle;

updatePractice(practices[index].id);

}

///////////////////////////////////

/* List action functions */

///////////////////////////////////

void checkStudentAttendance(

int index, int groupIndex, int studentIndex, int lectureIndex) =>

this

.lectures[index]

.groups[groupIndex]

.studentList[studentIndex]

.attendenceList[lectureIndex] =

!this

.lectures[index]

.groups[groupIndex]

.studentList[studentIndex]

.attendenceList[lectureIndex];

void editLectureStudentName(

int index, int groupIndex, int studentIndex, String name) =>

this

.lectures[index]

.groups[groupIndex]

.studentList[studentIndex]

.fullName = name;

void removeLectureStudent(int index, int groupIndex, int studentIndex) => this

.lectures[index]

.groups[groupIndex]

.studentList

.removeAt(studentIndex);

// void editPracticeStudentName(int index, int studentIndex, String name) =>

// this.practices[index].group.studentList[studentIndex].fullName = name;

void editPracticeStudentName(String id, String studentId, String name) =>

practices.where((practice) => practice.group.id == id).forEach(

(practice) => practice.group.studentList

.firstWhere((student) => student.id == studentId)

.fullName = name);

// void removePracticeStudent(int index, int studentIndex) =>

// this.practices[index].group.studentList.removeAt(studentIndex);

void removePracticeStudent(String id, String studentId) => practices

.where((practice) => practice.group.id == id)

.forEach((practice) => practice.group.studentList

.removeWhere((student) => student.id == studentId));

void edit Group Student Name(String id, String studentId, String name) {

groups

..first Where((group) => group.id == id)

..student List

..first Where((student) => student.id == student Id)

.fullName = name;

update Group(id);

////edit Practice Student Name(id, student Id, name);

}

void removeGroup Student(String id, String studentId) {

groups

..first Where((group) => group.id == id)

..student List

..remove Where((student) => student.id == student Id);

update Group(id);

}

//////////////////////

/* Remove functions */

//////////////////////

void remove Lecture Subject(int index) {

String id = lectures[index].id;

lectures.removeAt(index);

firebase.delete Lecture(id);

notifyListeners();

}

void remove Practice Subject(int index) {

String id = practices[index].id;

practices.removeAt(index);

firebase.delete Practice(id);

notifyListeners();

}

void removeGroup(int index) {

String id = groups[index].id;

groups.removeAt(index);

firebase.delete Group(id);

notifyListeners();

}

}

firebase_service.dart

class Firebase Service {

static FirebaseAuth _auth = FirebaseAuth.instance;

static Google Sign In _google Sign In = Google Sign In();

Firebase User firebase User;

static final _db = Firestore.instance;

Map<String, Collection Reference> _collection Reference;

DocumentReference _documentReference;

Firebase Service(Firebase User user) {

this.firebase User = user;

}

static Future<Firebase Service> init() async {

final currentUser = await FirebaseAuth.instance.currentUser();

if (currentUser != null)

return Firebase Service(currentUser);

else

return null;

}

static Future<Firebase Service> sign In With Google() sync {

GoogleSignInAccount google User;

if (await _googleSignIn.isSignedIn())

google User = await _google Sign In.sign In Silently();

else

google User = await _google Sign In.sign In();

final Google Sign In Authentication google Auth =

await google User.authentication;

Auth Credential credential = GoogleAuthProvider.getCredential(

access Token: google Auth.access Token, id Token: google Auth.id Token);

final Firebase User user =

((await _auth.sign In With Credential(credential)).user;

final Firebase User currentUser = await _auth.currentUser();

return Firebase Service(user);

}

static Future<Firebase Service> sign In With Email(

String email, String password) async {

AuthResult result;

try {

result = await _auth.sign In With Email And Password(

email: email, password: password);

} } on Platform Exception catch (error) {

print(error.code.toString());

} finally {

if (result != null) {

Firebase User user = result.user;

if (user != null) {

if (!user.isEmailVerified) return null;

return Firebase Service(user);

} else

return null;

}

}

}

static Future<Firebase Service> sign Up With Email(

String email, String password) async {

AuthResult result;

try {

result = await _auth.create User With Email And Password(

email: email, password: password);

} } on Platform Exception catch (error) {

print(error.code.toString());

} finally {

if (result != null) {

Firebase User user = result.user;

if (user != null) {

await user.send Email Verification();

return Firebase Service(user);

} else

return null;

}

}

}

static Future<bool> recover Password(String email) async {

bool isSent = true;

try {

await _auth.sendPasswordResetEmail(email: email);

} } on Platform Exception catch (error) {

print(error.code.toString());

isSent = false;

} finally {

return is Sent;

}

}

static sign Out Google() sync {

_auth.signOut();

__google Sign In.sign Out();

}

void updateUserData(Firebase User user) async {

__document Reference = _db.collection('users').document(user.uid);

__collection Reference = {

''groups': _document Reference.collection('groups'),

''practices': _document Reference.collection('practices'),

''lectures': _document Reference.collection('lectures'),

};

return _document Reference.set Data({

'uid': user.uid,

'email': user.email,

'photoURL': user.photoUrl,

'displayName': user.displayName,

'lastSeen': DateTime.now()

}, merge: true);

}

Future<Document Reference> add Group(Map data) =>

__collection Reference['groups'].add(data);

Future<Document Reference> add Practice(Map data) =>

collectionReference['practices'].add(data);

Future<DocumentReference> addLecture(Map data) =>

_collectionReference['lectures'].add(data);

Future<void> updateLecture(Map data, String id) =>

_collectionReference['lectures']

.where('id', isEqualTo: id)

.getDocuments()

.then((snapshot) => snapshot.documents

.forEach((doc) => doc.reference.updateData(data)));

Future<void> updatePractice(Map data, String id) =>

_collectionReference['practices']

.where('id', isEqualTo: id)

.getDocuments()

.then((snapshot) => snapshot.documents

.forEach((doc) => doc.reference.updateData(data)));

Future<void> updateGroup(Map data, String id) =>

_collectionReference['groups']

.where('id', isEqualTo: id)

.getDocuments()

.then((snapshot) => snapshot.documents

.forEach((doc) => doc.reference.updateData(data)));

Future deleteLecture(String id) => _collectionReference['lectures']

.where('id', isEqualTo: id)

.getDocuments()

.then((snapshot) =>

snapshot.documents.forEach((doc) => doc.reference.delete()));

Future deletePractice(String id) => _collectionReference['practices']

.where('id', isEqualTo: id)

..get Documents()

.then((snapshot) =>

snapshot.documents.forEach((doc) => doc.reference.delete()));

Future deleteGroup(String id) => _collection Reference['groups']

..where('id', is Equal To: id)

..get Documents()

.then((snapshot) =>

snapshot.documents.forEach((doc) => doc.reference.delete()));

Future<Query Snapshot> getAllGroups() =>

__collection Reference['groups'].get Documents();

Future<Query Snapshot> get All Practices() =>

__collection Reference['practices'].get Documents();

Future<Query Snapshot> get All Lectures() =>

__collection Reference['lectures'].get Documents();

}

Выводы по разделу 4

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

Приложение создано с интуитивным интерфейсом и удобным опытом пользователя. Основные функциональные возможности представлены максимально просто, в то время как второстепенные – скрыты от глаза пользователя, чтобы избежать перегрузки интерфейса. Чтобы использовать второстепенные функциональные возможности пользователь должен указать целевые элементы интерфейса. Руководство пользователя содержит необходимые инструкции для быстрого ознакомление со всеми функциональными возможностями системы.

Заключение

Была определена и проанализирована проблема организации мобильного приложения для информирования обучающихся об изменениях в расписании на примере Московского Университета имени С.Ю.Витте.

В ходе выполнения рассматриваемой работы было разработано программное обеспечение в виде мобильного приложения для информирования обучающихся об изменениях в расписании на примере Московского Университета имени С.Ю.Витте.

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

Создана концепт - диаграмма пользовательского опыта (UX) и определен дизайн пользовательского интерфейса. Спроектирована модель классов. Выбранные технологии Flutter и Firebase для реализации функциональных возможностей приложения.

Была настроена система Firebase, в качестве back-end части, и затем интегрирована в мобильное приложение для доступа к облачному хранилищу.

Разработаны все нужные части приложения и объединены в финальный программный продукт с спроектированным дизайном.

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

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

Мобильное приложение для работы требует мобильное устройство с операционной Android версии 4.0.0 и выше или устройство с операционной системой iOS версии 8.0 и выше.

Мобильное приложение разработано с помощью языка программирования Dart с использованием инструментальных средств для создания UI – Flutter и сервиса Firebase.

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

Программа требует инсталляции и ее установочный файл для операционной системы Android можно скачать по ссылке https://drive.google.com/open?id=17KQxZ83jaEkBP2WiO_CQoK1E_q_Fz6I8.

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

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

1. Провалов, В.С. Информационные технологии управления / В.С. Провалов. – 4-е изд., стер. – Москва : Издательство «Флинта», 2018. – 374 с. – (Экономика и управление). – Режим доступа: – URL: http://biblioclub.ru/index.php?page=book&id=69111. – ISBN 978-5-9765-0269-7. – Текст : электронный.

2. Кравченко, Ю.А. Информационные и программные технологии / Ю.А. Кравченко, Э.В. Кулиев, В.В. Марков ; Министерство образования и науки Российской Федерации, Федеральное государственное автономное образовательное учреждение высшего образования «Южный федеральный университет», Инженерно-технологическая академия. – Ростов-на-Дону ; Таганрог : Издательство Южного федерального университета, 2017. – Ч. 1. Информационные технологии. – 113 с.: ил. – Режим доступа: – URL: http://biblioclub.ru/index.php?page=book&id=499727. – Библиогр. в кн. – ISBN 978-5-9275-2495-2. – Текст : электронный

3. Парфенова М.Я., Маликов С.Н Методологические исследования эффективности информационных технологий: монография. Издательство: МУ им. С.Ю. Витте, 2017. https://online.muiv.ru/lib/pdf/117050.pdf

4. Балдин, К.В. Информационные системы в экономике / К.В. Балдин, В.Б. Уткин. – 7-е изд. – Москва : Издательско-торговая корпорация «Дашков и К°», 2017. – 395 с. : ил. – Режим доступа: по подписке. – URL: http://biblioclub.ru/index.php?page=book&id=454036 (дата обращения: 11.11.2019). – Библиогр. в кн. – ISBN 978-5-394-01449-9. – Текст : электронный.

5. Соловьев, Н.А. Введение в программную инженерию / Н.А. Соловьев, Л.А. Юркевская ; Министерство образования и науки Российской Федерации, Оренбургский Государственный Университет. – Оренбург : ОГУ, 2017. – 112 с. : схем., табл., ил. – Режим доступа: – URL: http://biblioclub.ru/index.php?page=book&id=481815 (дата обращения: 11.11.2019). – Библиогр.: с. 83. – ISBN 978-5-7410-1685-5. – Текст : электронный.

6. 2017 Retrospective: A Monumental Year for the App Economy [Электронный.ресурс]/Режим.доступа:https://www.appannie.com/en/insights/market-data/app annie-2017-retrospective/

7. 2018 - Год мобильных приложений в МФО [Электронный ресурс]/Режим

доступа:https://оказались самыми богатыми среди европейцев.com.ru/2018/01/30/32121301/

8. Beginning App Development with Flutter / Rap Payne, 2019. – 334 c.

9. Flutter-Beautiful native apps in record time [Электронный ресурс] / Режим доступа: https://flutter.dev/

10. Dart programming language [Электронный ресурс]/Режим доступа: https://dart.dev/

11. Firebase [Электронный ресурс]/Режим доступа: https://firebase.google.com/docs/

12. Cloud Firestore [Электронный ресурс] / Режим доступа: https://cloud.google.com/firestore

13. Beginning Flutter: A Hands On Guide to App Development / Marco L. Napoli, 2019. – 528 c.

14. Flutter in Action / Eric Windmill, 2019. – 368 c.

15.The Dart Programming Language / Gilad Bracha, 2020. – 224 c.