Файл: Критерии выбора средств разработки WEB-приложений(Основные понятия по разработке web-приложений).pdf

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

- возможность просмотра страницы сайта на мониторах с альбомным (горизонтальным) расположением изображения и на экранах планшетов и смартфонов с книжным (вертикальным) размещением изображения:

- наличие функции (кнопки) "Включить версию для слабовидящих";

Общие требования к пользовательскому интерфейсу

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

Основные возможности программы:

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

- Любой товар. Продавать можно любой товар, удобно классифицировав его.

- Фото товара. Для наглядности можно сохранить изображение каждого товара, захватив его с web-камеры. Оно будет отображаться также при проведении продажи.

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

- Аналоги. Достаточно ввести слово "аналог" и программа сама покажет подходящие товары в наличии.

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

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

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

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

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

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

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

2.2 Выбор средств разработки приложения

Для разработки был выбран язык программирования PHP. Отличие его от JavaScript в том, что PHP-скрипты выполняются на сервере и создают HTML, который направляется пользователю.

Ниже приведены некоторые свойственные особенности языка PHP [20]:

доступность для большинства операционных систем, охватывая: Linux, многие модификации Unix, Microsoft Windows, Mac OS X, RISC OS, и почти все иные. Также в PHP интегрированы возможности большинства современных веб-серверов, таких как Apache, IIS и множества других. Таким образом, программист получает свободу выбора операционной системы и веб-сервера, а так же выбор между процедурного или объектно-ориентированного способа программирования или же их сочетания;
способность создание не только HTML разметки. Доступно составление изображений, файлов PDF и Flash роликов в том числе. Также PHP способен создавать всевозможные текстовые данные, такие, как XHRML и иные XML-файлы. PHP имеет возможность осуществления автоматической генерации таких текстовых файлов и сохранения их в файловой системе сервера;
поддержка широкого круга баз данных – одно из главных достоинств PHP;
поддержка взаимосвязи с другими сервисами, через протоколы, такие как: LDAP, POP3, HTTP, COM (на платформах Windows) и множество других. Дополнительной возможностью является управление сетевыми сокетами напрямую;
стандарт обмена данных буквально между всеми языками веб-программирования, поддержка объектов Java и возможность их применения в качестве объектов PHP.

Несмотря на схожий с C синтаксис, JavaScript по сопоставлению с языком C содержит главные отличия:

объекты, с вероятностью интроспекции (способностью определить тип и структуру объекта во время выполнения программы);
автоматическое приведение типов;
автоматическая сборка мусора (для чистки памяти от недостижимых значений в браузерах применяется автоматический сборщик мусора (Garbage collection, GC), интегрированный в интерпретатор, который отслеживает объекты и периодически удаляет недостижимые);
анонимные функции.

Языки программирования PHP и JavaScript полностью соответствуют предъявляемым требованиям для выполнения поставленных задач и были выбраны в качестве языков для разработки приложения .

3. Разработка web-приложения с использованием выбранных средств

3.1 Структура приложения

Автоматизированная система работает следующим образом: клиент, заходит на сайт, ищет необходимые товары, добавляет их в корзину, проверяет оформление заказа и отправляет заявку. После подтверждения заказа менеджером, клиент получает сообщение на e-mail.

Рисунок 1 – Диаграмма состояний. Заказ товара

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

Рисунок 2 – Диаграмма состояний. Проверка заказа

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

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

Рисунок 3 – Диаграмма деятельности.

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

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

На диаграмме последовательности объекты в основном представляю экземпляры класса или сущности, обладающие поведением. В качестве объектов могут выступать пользователи, инициирующие взаимодействие, классы, обладающие поведением в Системе или программные компоненты, а иногда и Системы в целом. Рассмотрим диаграмму последовательности на примере заказа товара на сайте (рис. 4).

Рисунок 4 – Диаграмма последовательности

3.2 Результаты разработки приложения

Логическая схема связи страниц и модулей сайта представлена на рисунке (рис.5).

Рисунок 5 – Логическая схема связи страниц и модулей сайта

В данном веб-сайте используются следующие роли: «незарегистрированный пользователь», «зарегистрированный пользователь» и «администратор». Доступ к роли администратора ограничен вводом логина и пароля. Все функции для работы с данной ролью размещены в администраторской панели. Роль зарегистрированного пользователя позволяет оформить заказ, и иметь доступ к личному кабинету. Незарегистрированный пользователь может просматривать всю информацию по товарам, новостям и к контактам. Весь необходимый функционал располагается по центру на верхней части панели сайта в виде меню. Все пункты изображены на рисунке (рис. 6).

Рисунок 6 – Основные пункты меню

Перечислим основные возможности панели данного сайта:

Пункт меню «Главная» позволяет перейти на основную станицу веб-сайта, где возможно просмотреть общую информацию и главные новости;
Пункт меню «Новости» содержит новости, информация о проводимых мероприятиях в аптеке;
Пункт меню «Товары» позволяет выбрать со всплывающего окна тип товара, после выбора которого появляется страница с товарами доступные для заказа. Около товаров имеется основная информация по товару, поле для выбора кол-ва заказываемого товара и кнопка «Заказать»;
Пункт меню «Акции» предоставляет возможность узнать клиенту информацию о скидках и акциях в ресторане;
Пункт меню «Информация» содержит помощь и информацию как сделать заказ;
Пункт меню «Личный кабинет», в нем зарегистрированный пользователь может посмотреть на заказанные товары и статистику.

Перечислим по пунктам как происходит примерный заказ товара:

Выбираем пункт меню «Товары», выбираем из всплывающего окна нужную нам категорию.
У каждого товара есть фотография и краткая информация о нем. На рисунке (рис. 7) мы можем увидеть, как это выглядит.

Рисунок 7 – Внешний вид товара

Добавляем в корзину нужные товары указывая их кол-во.
Нажимаем на кнопку «Оформить заказ», после этого мы видим выбранные нами товары и общую сумму заказа (рис.8). После этого нажимаем кнопку «Заказать» и этот заказ вступит в обработку.

Рисунок 8 – Обработка заказа

После подтверждения заказа, пользователю отправят письмо на e-mail.

Администраторская панель сайта

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

Пункт меню «Лекарства» позволяет редактировать (рис.9), удалять лекарственные препараты, а так же добавлять новые;

Рисунок 9 – Окно редактирования товаров

При нажатии кнопки «Добавить новый препарат» открывается новое окно (рис. 10), в котором мы можем добавить новый товар в базу данных.

Рисунок 11 – Окно добавления нового препарата

Выбрав пункт меню «Пользователи» администратор может изменить или удалить пользователя (рис.12).

Рисунок 12 – Окно изменения данных пользователя

Пункт меню «Заказы» имеет вкладки «Открытые заказы», «Завершенные заказы» и «Графики». Во вкладке «Открытые заказы» мы можем просмотреть невыполненные заказы за указанный период (рис. 13).

Рисунок 13 – Вкладка открытых заказов

Так же можно просмотреть уже завершенные препараты (рис. 14). Так же есть возможность увидеть детали заказа.

Рисунок 14 – Вкладка завершенных заказов