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

Текст из файла (страница 5)

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

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

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

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

2.3 Проектирование визуального интерфейса

Практически все приложения для iPhone обладают схожим графическим интерфейсом. Эта концепция поддерживается компанией Apple в iOS Human Interface Guidelines [10]. Схожесть интерфейсов облегчает процесс изучения нового приложения пользователем.

Разрабатываемое приложение является универсальным, то есть должно работать как на устройствах iPhone, так и iPad. Из-за различных размеров дисплеев у данных устройств интерфейс приложения при работе на планшете будет отличаться от интерфейса на смартфоне. Это отличие также обуславливается разницей в логической архитектуре навигации. Поэтому процесс проектирования GUI разбит на две части: проектирование для устройств iPhone и проектирование для устройств iPad.

2.3.1 Проектирование для устройств iPhone

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

Рисунок 2.2 – Основной шаблон интерфейса для iPhone

Приложение поддерживает работу с несколькими сервисами ECM-системы, для каждого сервиса разработан собственный интерфейс. Для переключения между ними используется боковое меню, вызываемое пользователем с помощью жеста смахивания [17]. На рисунке 2.3 представлен вид бокового меню.

Рисунок 2.3 – Боковое меню для iPhone

Наиболее сложным является интерфейс для работы с бизнес-процессами. Он включает в себя несколько представлений:

• окно просмотра текущих задач и бизнес-процессов;

• окно просмотра деталей задачи;

• окно просмотра деталей бизнес-процесса;

• окно создания нового бизнес-процесса.

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

Рисунок 2.4 – Макет окна просмотра задач и бизнес-процессов

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

Рисунок 2.5 – Макет окна просмотра деталей задачи

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

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

Рисунок 2.6 – Макет окна просмотра деталей бизнес-процесса

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

Рисунок 2.7 – Макет окна создания бизнес-процесса

2.3.2 Проектирование для устройств iPad

Размер экрана iPad намного превышает размер экрана смартфона, в связи с этим интерфейс для планшета спроектирован с идеей увеличения функциональных возможностей для отдельного окна. Эта задача реализована засчет использования UISplitViewController’а, который позволяет отображать два представления на экране устройства и управлять ими. Такой метод освобождает от необходимости создания уникальных представлений для планшета и обеспечивает возможность использования представлений, созданных для iPhone. Для навигации между интерфейсами различных сервисов также используется боковое меню, но в отличие от смартфона, оно более компактно. Макет интерфейса для iPad представлен на рисунке 2.8.

Рисунок 2.8 – Макет интерфейса для планшета

Макет бокового меню приведен на рисунке 2.9.

Рисунок 2.9 – Макет меню для планшета

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

3 РЕАЛИЗАЦИЯ ПРИЛОЖЕНИЯ

3.1 Реализация модуля клиента

Для разработки мобильных приложений для устройств iPad и iPhone наиболее часто применяется интегрированная среда разработки Xcode, предоставляемая компанией Apple на бесплатной основе. Xcode предоставляет разработчику все необходимые инструменты для создания приложений под Mac OS X и iOS, объединяет процессы создания визуального интерфейса, написания программного кода, тестирования и отладки. Помимо среды разработки данный продукт включает в себя компиляторы языков Swift и Objective-C, набор инструментов для анализа, симулятор iOS устройств и SDK (Software Development Kit) для OS X и iOS.

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

3.1.1 Визуальный интерфейс

Разработка визуального интерфейса произведена в модуле Interface Builder, входящем в состав IDE Xcode. Для отрисовки необходимых графических элементов, таких как иконка приложения или картинка для кнопки, использован программный продукт Adobe Illustrator, позволяющий работать с векторной графикой. На рисунке 3.1 представлен интерфейс работы с представлениями в IDE Xcode. На рисунке 3.2 приведен процесс создания иконки приложения в Adobe Illustrator.

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

На рисунке 3.2 приведен скриншот одного из этапов создания иконки приложения в Adobe Illustrator.

Рисунок 3.2 – Создание иконки приложения

В процессе работы над пользовательским интерфейсом созданы все необходимые объекты для организации комфортного взаимодействия пользователя с мобильным приложением. Наиболее распространенной задачей на данном этапе разработки является создание пользовательских строк, применяемых в таблицах приложения для отображения информации. Каждая строка должна предоставлять пользователю данные в удобочитаемом виде [16, 18].

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

Рисунок 3.3 – Прототип строки узла

Строка бизнес-процесса отражает пользователю информацию о текущих задачах и бизнес-процессах. Ее графическое представление отображает уровень приоритета. Прототип строки приведен на рисунке 3.4.

Рисунок 3.4 – Прототип строки бизнес-процесса

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

Рисунок 3.5 – Прототип строки текущей задачи

Прототип строки завершенной задачи приведен на рисунке 3.6.

Рисунок 3.6 – Прототип строки завершенной задачи

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

Рисунок 3.7 – Прототип строки комментария

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

Рисунок 3.8 – Прототип строки версии документа

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

Рисунок 3.9 – Прототип строки о пользователе

Также в приложении широко используются строки, отображающие простую текстовую информацию и строки, содержащие поля для ввода текста пользователем. Прототип строки надписи приведен на рисунке 3.10.

Рисунок 3.10 – Прототип строки надписи

Прототип строки текстового поля представлен на рисунке 3.11.

Характеристики

Список файлов ВКР