2. Практическая Часть

2.1 Требования к мобильному приложению

Мобильное приложение «Угреша» должно выполнять следующие функции:

-Просмотр расписания колледжа;

-Электронный портал;

-Видео, канал на Youtube, фотографии;

-Информация о колледже и сотрудниках;

-синхронизация информации через Интернет;

-Новости о коллеже.

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

2.2 Подготовка среды разработки

Для разработки приложений для ОС Ios требуется зарегистрироваться в AppArchitect. Данный сервис позволит вам с легкостью (без писания кода) создать приложение для iOS.

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

Основными функциями подсистемы программно-методического комплекса является:

-Установка всех необходимых компонентов для реализации поставленной задачи;

- Поэтапная настройка среды разработки;

- Разработка графического контента приложения;

- Разработка полноценного приложения в выбранной среде разработки;

- Тестирование приложения с помощью различных средств;

- Пример публикации приложения в магазине мобильных приложений.

Регистрация в AppArchitect

Перед тем как начать использовать AppArchitect, необходимо в нем зарегистрироваться.

Перейти на сайт AppArchitect.ru и нажать большую оранжевую кнопку с надписью «Get Started».(рис 12)

Рис. 12 Регистрация

В открывшемся окне заполните поля «E-Mail» и «Password», нажмите кнопку «Create». После этого аккаунт будет создан, можно выполнить вход в него. (рис 13)

Рис. 13 Форма регистрации

Теперь можно переходить к созданию приложения для Apple устройства.

Создание приложения в AppArchitect

В аккаунте нажмите кнопку «Create New App» для того, чтобы создать новое приложение. (рис 14)

Рис. 14 создание приложения

Далее укажите название нового приложения и выберите устройство, для которого это приложение создается, нажмите кнопку «Next». (рис 15)

Рис. 15 Выбор устройства

При создание мобильного приложения нам предлагают выбор тематики или пустой холст. (рис 16)

Рис. 16 Выбор темы

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

Работа функций приложений:

Новости - на этой вкладке представлены новости колледжа;

Видео - на этой вкладке представлено видео с YouTube;

Социальные сети - на этой вкладке представлены сайты (Instagram, twitter, vkontakte);

Расписание - Электронное расписание учащихся групп;

О нас - в этой вкладке представлено приветственное слово директора, общие сидения, администрация, контактная информация, мы на карте.

Описание интерфейса

1 - Выбор иконки и название программы.

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

3 - Панель публикации проекта.

4 - Выбор телефона, под которое будет делаться приложение.

5 - Панель создания проекта — делиться на три вкладки:

Screens - собственно, это и есть наши вкладки;

Library - библиотека элементов, из которых будем собирать наше приложение;

Properties - панель функций элементов приложения, с помощью данной панели можно задавать различные функции нашим элементам приложения. (рис 17)

Рис. 17 Интерфейс среды разработки

Панель выбор иконки и название программы - с помощью данной панели можно поставить картинки на иконку приложения и на главный экран входа. (рис 18)

Рис. 18 Панель выбора иконки и названия приложения

Создание вкладок

Для создания вкладок переходим в панели управления проектом (3) на вкладку Screens и с помощью кнопки «New Screen» создаем необходимое количество вкладок, в моем случае - пять. (рис 19)

Рис. 19 Создание вкладки

Что бы переименовать вкладку, нужно кликнуть по первой вкладке, из раскрывшегося списка выбираем пункт «Rename», пишем название вкладки, в моем случае - главная. Нажимаем кнопку «Apply». (рис 20)

Рис. 20 Переименование вкладки

Редактирование верхнего бара

Чтобы отредактировать верхний бар надо нажать на него и перейти во вкладку “Properties” . В данном окне будет предложен список редактирования:

- Текст

- Стиль текста

- Размер шрифта (max 24),

- Фон

- Возможность вставить свою текстуру

- Размер текстуры

- Кнопка с ссылкой на выбранный раздел

(рис 21)

Рис. 21 Редактирование

Оформление главной страницы.

На главной странице можно расположить:

- Картинки

- Фото галерею

- Карты и геолакацию

- Подкастное меню

- Rss новостную ленту

- Web – станицу

- Видео ролик с YouTube

- Рассказать друзьям в Twitter или Facebook

- Ссылки на кнопки и разного вида текст

(рис 22)

Рис. 22 Оформление

На главной странице мы размещаем картинку и добавляем логотип колледжа “Угреша” (рис 23)

Рис. 23 Добавление картинки

Затем нам понадобится подкастное меню (рис 24) для пользования приложением и размещение нужных разделов. При нажатие на “+ Add row” добавляется дополнительная строка в меню. В разделе “Properties” можно редактировать следующие разделы:

- Таблица (одна или 2 строчки + иконка )

- Цвет таблицы

- Стиль

- Имя строки в меню (рис 25)

- Иконка (если выбрали в разделе таблица) (рис 26)

- И переход на нужную ссылку в меню

Рис. 24 Подкастное меню

Рис. 25 Переименование ссылки на раздел

Рис. 26 Готовое меню с изменёнными иконками