46
Одной из важных особенностей работы администратора интернет
магазиан является функция обслуживания каталога товаров магазина.
Каталог товаров призван отображать структуру, представленных
товаров интернет магазина, структура может меняться по мере изменения
ассортимента, в сторону увеличения или уменьшения. Каталог имеет
древовидную структуру, при этом, с учетом того что товары могут
принадлежать разным видам продукции, один и тот же товар может быть
размещен в разных ветвях дерева.
В разрабатываемой коммерческой системе для сети Интернет,
операции ввода и изменения информации о товарных единицах,
администратору приходится выполнять каждый день, поэтому необходимо
реализовать инструменты, которые значительно облегчат выполнение этих
операций и будут удобны в использовании.
Когда покупатель оформляет заказ на покупку выбранного товара,
информация о заказе сохраняется в базе данных, администратор может
просматривать список новых и текущих заказов, управлять статусом этого
заказа [30,31,36].
Основная функция по обработке заказа возлагается на систему
управления сайтом и данная функция представлена на рисунке 15.
Система управления магазином предназначена для упрощения
администрирования интернет – магазина, система управления будет
выполнять следующие операции:
проверять корректность вводимых данных при регистрации и
оформлении заказа;
формировать регистрационные данные пользователя (логин, пароль)
и отсылать на почтовый ящик;
осуществлять поддержку базы данных интернет – магазина;
иметь инструменты управления содержимым базы интернет –
магазина;
поддерживать добавление и удаление товара в корзину покупок;
47
производить автоматический расчет суммы заказа в корзине
покупок;
осуществлять автоматическую рассылку о данных заказа на
почтовый ящик пользователя и администратора;
отображать статус заказа и его историю;
вести архив заказов и статистику наиболее продаваемых товаров.
На рисунке 15 представлены функции подсистемы управления
сайтом.
генерация ключа
приглашения,
идентификация
проверка истории заказов
проверка статуса заказа
определение наиболее
продаваемого товара
определение покупателя, который
чаще всего делает заказы
определение покупателя по
оплатам
регистрация пользователя
обработка заказов
ведение статистики
ведение аналитика
система
выдача рекомендаций по
политике продажи товара
скидки, бонусы,
высокие наценки
выдача рекомендаций по
покупателям
определение группы пользователей,
бонусные программы,
предупреждения, черный список
Рисунок 15 – Функции подсистемы управления
На рисунке 16 представим состояния подсистемы управления сайтом.
Для отображения операций подсистемы используется диаграмма состояний,
которая является аналогом конечных автоматов, движение между
состояниями осуществляется при завершении всех операций состояния,
некоторые состояния имеют операции, которые должны быть выполнены.
48
операции для работы с пользователями
регистрация пользователя
entry/ форма регистрации
do/ отсылка регистрационных данных на e-mail пользователя
do/ регистрация пользователя в БД
корзина покупок
do/ добавление товара в корзину
do/ удаление товара из корзины
do/ подсчет стоимости товара в корзине
оформление заказа
entry/ форма оформления заказа
do/ проверка вводимых данных
do/ отсылка данных о заказе на почту пользователю
регистрация пользователя
entry/ форма регистрации
do/ отсылка регистрационных данных на e-mail пользователя
do/ регистрация пользователя в БД
корзина покупок
do/ добавление товара в корзину
do/ удаление товара из корзины
do/ подсчет стоимости товара в корзине
оформление заказа
entry/ форма оформления заказа
do/ проверка вводимых данных
do/ отсылка данных о заказе на почту пользователю
поддержка управления сайтом
проверки корректности
вводимых данных
поиск товара по
базе
entry/ по названию
entry/ по категории
entry/ по цене
хранение
данных в БД
проверки корректности
вводимых данных
поиск товара по
базе
entry/ по названию
entry/ по категории
entry/ по цене
хранение
данных в БД
Операции поддержки функций администратора
формы управления магазином
entry/ форма добавления товара
entry/ форма добавления категорий
entry/ форма редактирования новостей магазина
инструменты обработки заказов
do/ получить данные о заказе
do/ информация о заказчике
do/ изменение статуса заказа
ведение архива
заказов
формы управления магазином
entry/ форма добавления товара
entry/ форма добавления категорий
entry/ форма редактирования новостей магазина
инструменты обработки заказов
do/ получить данные о заказе
do/ информация о заказчике
do/ изменение статуса заказа
ведение архива
заказов
Рисунок 16 – Операции подсистемы управления магазином
49
Определив основные подсистемы и их взаимодействие представим их
последовательность работы во времени. Для этого воспользуемся
диаграммой последовательности языка UML. Последовательная диаграмма
подчеркивает временную последовательность сообщений.
Цель диаграммы последовательности - визуализировать
интерактивное поведение системы. Визуализация взаимодействия - сложная
задача. Следовательно, решение заключается в использовании различных
типов моделей для захвата различных аспектов взаимодействия.
Целью диаграммы взаимодействия является:
– представление динамического поведения системы;
– описание потока сообщений в системе;
– описание структурной организации объектов;
– описание взаимодействия между объектами [9,17].
На рисунке 17 представлено взаимодействие подсистем интернет
магазина.
На данной диаграмме отображаются объекты с временными
отрезками, на которых отображаются сообщения (операции), связь между
объектами отображается следующим образом:
1. администратор формирует каталог товаров;
2. добавляет товар в БД;
3. настраивает параметры магазина;
4. клиент просматривает каталог товаров;
5. выбирает товар;
6. Помещает товар в корзину;
7. изменяет количество товаров в корзине покупок;
8. оформить заказ;
9. формирует ключ приглашения;
10. просматривает товар;
11. входит в магазин.
50
администратор :
администратор
администратор :
администратор
система :
Система
система :
Система
клиент : клиентклиент : клиент
формирует каталог товаров( )
добавляет товар в БД( )
редактирует товары в каталоге товаров( )
изменяет параметры товара( )
настраивает параметры магазина( )
просматривает каталог товаров( )
выбирает товар( )
помещает товар в корзину( )
уменьшает количество товара из БД( )
проверяет наличие товара( )
оформить заказ( )
удаляет товары из БД( )
пользователь не зарегистрирован( )
заполнение анкетных данных( )
запрашивает ключ приглашения( )
формирует ключ приглашения( )
отсылает ключ на e-mail пользователя( )
вводит логин и пароль( )
просматривает заказы( )
пересылает товар( )
оплачивает заказ( )
ведет статистику продаж( )
Рисунок 17 – Последовательность взаимодействия между
подсистемами магазина
51
2.3 Проектирование интерфейса пользователей интернет магазина
От дизайна любого сайта зависит как будет продвигаться предприятие
или услуга в сети Интернет. Пользователям глобальной сети более приятно
посещать сайты, которые оформлены стильно, не сильно напичканы
«тяжелой» графикой или анимацией, страницы быстро загружаются и
правильно отображаются в окне браузера.
Для разработки привлекательных сайтов рекомендуется использовать
каскадные таблицы стилей (CSS), это даст возможность очистить код от
лишних тэгов, и сделать сайт более «легковесным». Верстка сайтов с
использованием CSS, позволит значительно упростить код, а также в
дальнейшем позволит столкнуться наименьшим количеством проблем при
его модификации, доработке и исправлении. Компактный оптимизированный
код значительно облегчит индексацию сайта поисковыми системами, а
малый вес позволит сократит время загрузки Web-сайта [14].
Верстка сайтов осуществляется двумя различными способами.
Первый способ – верстка осуществляется с помощью таблиц.
Табличная верстка использует элементы разметки, которые не соответствуют
той семантике, которую они несут, для получения внешних эффектов, из-за
того, что изначально таблицы не рассматривались как инструмент для
построения каркаса страниц, а выполняли свои стандартные функции -
осуществляли стандартный ввод-вывод данных. Чтобы сверстать сайт с
помощью табличной верстки, необходимо использовать большое количество
вложенных таблиц, что сильно затрудняет обработку браузером страниц,
увеличивает размер сайта, что в свою очередь очень сильно снижает скорость
загрузки файлов, и может привести к появлению ошибок в коде.
Второй способ – верстка сайта при помощи слоев (блоков), что
является более удобным и правильным инструментом верстки, с точки
зрения убеждений о разделении содержания и оформления. Блочная верстка
сайтов дает больше возможностей, позволяет сделать код компактнее, что в
свою очередь позволяет увеличить скорость загрузки веб-страницы. При
52
помощи верстки слоями можно гораздо более эффективно разработать сайт,
который будет корректно отображаться в браузерах [18].
Интерфейс пользователя должен организовать максимально простой
процесс взаимодействия пользователя и ресурса, выделяют некоторые
общепринятые приемы улучшения юзабилити:
1. Элементы интерфейса должны быть взаимосвязаны и логически
структурированы.
2. Интерфейс должен быть выполнен в едином стиле.
Выбирают самую лаконичную и понятную форму подачи
информации, ведь ее избыток сбивает пользователя с толку, а слишком
многоуровневая структура усложняет навигацию по сайту.
С помощью правильной настройки и оформления интерфейса
решаются сразу несколько задач.
Пользователь:
интуитивно понимает, как выполнить нужные действия;
получает о продукте исчерпывающую информацию;
проходит минимальный путь к целевому действию (покупке, заказу)
[19].
Структура интерфейса пользователя представлена на рисунке 18.
Рисунок 18 – Структура интерфейса пользователя
53
На рисунке 19 представлен проект регистрационной формы.
Регистрационная форма
Регистрация
Город
Имя
Фамилия
Компания
Должность
Контактный телефон
E-mail
Пароль
Подтверждение пароля
Пользовательское соглашение
Зарегистрироваться
Рисунок 19 – Регистрационная форма
При регистрации пользователь должен ввести следующие данные:
– фамилия;
– имя;
– город;
– компания;
– должность;
– контактный телефон;
– e-mail;
– пароль;
– подтверждение пароля.
54
На рисунке А.1 представлены проекты форм интерфейса
пользователя, представлены формы входа, форма главной страницы
интернет магазина и форма корзины покупок.
2.4 Проектирование структуры БД магазина
При разработке базы данных выделяются основные информационные
сущности предметной области, выявляются связи между ними. Логическая
структура базы данных определяется информационными потребностями
проекта. При ее разработке выделяются основные информационные
сущности предметной области, выявляются связи между ними. Затем,
логическая структура оптимизируется в соответствии с реализуемыми
целевыми функциями проекта. Представим описание таблиц проектируемой
БД и непосредственно структуру БД [12].
Таблица 1
Поля таблицы категорий (Categories)
Поле таблицы
Тип данных
Описание
Id
SMALLINT
Уникальный идентификатор категории
ParentCategory
SMALLINT
Категория, по отношению к которой
текущая является подкатегорией
Name
VARCHAR(32)
Название категории
Таблица 2
Поля таблицы товаров (Tovars)
Поле таблицы
Тип данных
Описание
Id
MEDIUMINT
UNSIGNED
Уникальный идентификатор товара
CategoryID
SMALLINT
UNSIGNED
Категория, к которой относится
данный товар
Name
VARCHAR(255)
Название товара
AuthorID
SMALLINT
UNSIGNED
Производитель
ISBN
CHAR(13)
Уникальный номер товара ISBN
ImageHREF
VARCHAR(255)
Путь к файлу изображения товара
Synopsis
TEXT
Краткое описание
AppearDate
DATE
Время поступления в магазин
Count
INTEGER
Количество в фонде
Price
DECIMAL(6,2)
Цена
55
Таблица 3
Поля таблицы производителей (Authors)
Поле таблицы
Тип данных
Описание
Id
SMALLINT
UNSIGNED
Уникальный идентификатор
производителя
Name
VARCHAR(255)
Наименование производителя
Text_name
TEXT
Краткая справка о производителе
Таблица 4
Поля таблицы посетителей (Users)
Поле таблицы
Тип данных
Описание
Id
MEDIUMINT
UNSIGNED
Уникальный идентификатор посетителя
Name
CHAR (127)
Имя посетителя
Surname
CHAR (127)
Фамилия посетителя
Email
VARCHAR(64)
E-Mail посетителя
Phone
VARCHAR(20)
Телефон для подтверждения заказа
IP
CHAR(14)
Текущий IP покупателя
SessionKey
INT UNSIGNED
Уникальный код для авторизации
Таблица 5
Поля таблицы корзины посетителя при покупке товара (Orders)
Поле таблицы
Тип
данных
Описание
Id
INT
UNSIGNED
Номер заказа
Amount
TINYINT
Число единиц товара, добавленных в корзину
посетителя
OrderStatusID
INTEGER
Состояние заказа
Date
DATETIME
Дата заказа
UserID
INTEGER
Покупатель
Payment
BYTE
Вид оплаты
AmountKol
CHAR(10)
Сумма заказа
Таблица 6
Поля таблицы детализации пользовательской корзинки
(OrderDetail)
Поле таблицы
Тип данных
Описание
Id
INT UNSIGNED
Номер по порядку
OrderID
INTEGER
Номер заказа
OrderStatusID
INTEGER
Состояние заказа
Quantity
DATETIME
Количество
UserID
INTEGER
Посетитель
Payment
BYTE
Вид оплаты
TovarID
CHAR(10)
Наименование товара
Таблица 7
Поля таблицы статус заказа (OrderStatus)
Поле таблицы
Тип данных
Описание
Id
INT UNSIGNED
Код состояния заказа
Stutus
INTEGER
Название состояния заказа