Пояснительная записка (1207236), страница 5
Текст из файла (страница 5)
Таблица 3.7 – Ассортимент
Название поля | Тип данных | Описание |
IDАссортимент | int | Уникальный номер, идентифицирующий запись в таблице |
Размер | varchar | Размер товара |
Количество | int | Количество товаров |
IDТовар | int | Уникальный номер, идентифицирующий товар |
Таблица 3.8 является таблицей справочником категорий, в ней расположены категории и подкатегории товара.
Таблица 3.8 – Категории
Название поля | Тип данных | Описание |
IDКатегория | int | Идентификатор категории |
Имя | varchar | Наименование категории |
Подкатегория | varchar | Наименование подкатегории |
В таблице 3.9 расположены относительные пути в директории приложения, по которым можно обратиться изображению товара.
Таблица 3.9 – Изображения
Название поля | Тип данных | Описание |
IDИзображение | int | Идентификатор изображения |
Путь | varchar | Путь к изображению в директории проекта |
IDТовар | int | Уникальный номер, идентифицирующий товар |
Таблица 3.10 позволяет соотнести товар и рекомендуемые к покупке товары при просмотре данного.
Таблица 3.10 – Рекомендации
Название поля | Тип данных | Описание |
IDРекомендовация | int | Идентификатор рекомендации |
Товар | int | Идентификатор рекомендованного продукта |
IDТовар | int | Уникальный номер, идентифицирующий товар |
Кроме того, таблица 3.10 хранит в себе идентификаторы товаров, которые рекомендуются пользователю, при просмотре определённого товара.
В таблице 3.11 содержится информация о наименовании скидки, её размере и товарам на каторые она распространяется.
Таблица 3.11 – Скидки
Название поля | Тип данных | Описание |
IDРекомендовация | int | Идентификатор скидки |
Товар | int | Идентификатор рекомендованного продукта |
IDТовар | int | Уникальный номер, идентифицирующий товар |
Рассмотрев структуру таблиц базы данных перейдём к построению диаграмм классов. Состав диаграммы классов аналогичен составу диаграммы классов анализа. В то же время классы анализа должны пройти процедуру строгой экспертизы на предмет их возможной декомпозиции на более мелкие и специализированные классы. При построении диаграммы окончательно должны быть определены атрибуты классов.
Центральное место в объектно-ориентированном программировании занимает разработка логической и физической моделей системы в виде диаграмм классов. Диаграмма классов служит для представления статической структуры модели системы в терминологии классов объектно-ориентированного программирования. Диаграмма классов может отражать, в частности, различные взаимосвязи между отдельными сущностями предметной области, такими как объекты и подсистемы, а также описывать их внутреннюю структуру и типы отношений.
При разработке диаграммы следует придерживаться ряда правил и рекомендаций. За основу диаграммы классов при ее разработке берется диаграмма классов анализа. Для классов должны быть определены и специфицированы все атрибуты. Их спецификация, как правило, выполняется с учетом выбранного языка программирования.
Для наглядного отображения структуры базы данных на рисунке 3.1 приведена логическая схема данных, в которой показана структура и связи между таблицами. Напраленная ассоциация в данном случае означает наличие ссылки в объекте из кторого выходит стрелка, другими словами в этой таблице содержиться идентификатор родительской таблицы, при помощи которого создаётся связь многие к одному.
Рисунок 3.1 – Логическая схема данных
Для того, чтобы представить конечную структуру базы данных на рисунке 3.2 приведена физическая схема данных, отображающпя особености выбранной СУБД.
Рисунок 3.2 – Физическая схема данных
4 Описание интерфейса и руководства пользователя
Интерфейс пользователя является неотъемлемой частью любого сайта, в том числе и интернет-магазина. Дружелюбный и удобный в использовании интерфейс является важным компонентом в продвижении сайта и удержания пользователей на его страницах в течении длительного времени
4.1 Средства навигации
Знакомство с сайтом начинается с его главной страницы, которая включает в себя панель навигации, общую для всех страниц интернет магазина. Её вид, для авторизованного пользователя приведён на рис 4.1. Для неавторизованного пользователя вместо имени, фамилии пользователя и кнопки выйти расположены кнопки для перехода к авторизации и регистрации.
Рисунок 4.1 – Панель навигации
Панель навигации обеспечивает переход к основным разделам сайта с любой страницы интернет-магазина. На ней расположены ссылки на разделы сайта:
-
каталог;
-
скидки;
-
условия доставки;
-
о компании.
Кроме того, здесь же расположена поисковая строка, для удобного поиска товаров на сайте. В правом верхнем углу панели навигации расположена пиктограмма корзины с подписью, здесь отображается количество товаров, добавленных в виртуальную корзину пользователя.
При прокрутке страницы внешний вид панели навигации становится более минималистичным, но при этом сохраняется возможность перехода между разделами сайта и осуществления поиска. Он приведён на рисунке 4.2.
Рисунок 4.2 – Вид панели навигации при прокрутке страницы
В нижней части страницы расположена область, которая называется подвалом. Она также является общей для каждой страницы интернет-магазина. На рисунке 4.3 приведён внешний вид подвала. Он состоит из трёх блоков: котнтактная информация для обратной связи с оператором интернет-магазина; ссылки на основные разделы сайта; строка для подписки на рассылку новостей от сайта и ссылки на социальные сети.
Рисунок 4.3 – Подвал сайта
Кроме того, при прокрутке страниц появляется пиктограмма в виде стрелки, при нажатии на которую страница автоматически прокручивается максимально вверх.
4.2 Главная страница сайта
Главная страница должна сразу показывать назначение сайта, поэтому сразу под панелью навигации расположен интерактивный слайдер. После него следует интерактивный блок в который выводятся товары, которые разделены по следующим параметрам:
-
новые товары;
-
товары со скидкой;
-
популярные товары.
Пользователь выбирает сам, из какой категории товар ему отобразить. При нажатии на изображение или название товара происходит переход на страницу просмотра параметров товара, где его можно добавить в корзину.
Ниже расположены элементы, ведущие в каталог товаров, в соответствующий раздел. Главная страница приведена на рисунке 4.4.
Рисунок 4.4 – Главная страница
4.3 Просмотр товаров
Каталог представляет собой страницу сайта на которой представлены все товары интернет-магазина. Существует два варианта просмотра страницы каталога, когда товары отображаются списком или плиткой. Кроме того, существует четыре варианта сортировки товаров:
-
по имени, в порядке от А до Я;
-
по имени, в порядке от Я до А;
-
по возрастанию цены;
-
по убыванию цены.
С левой стороны страницы отображены категории товаров, при щелчке на которую отображаются товары, соответствующие выбранной категории. На рисунке 4.5 отображена страница каталога при плиточном отображении товаров.
Рисунок 4.5 – Страница каталога при плиточном отображении
При отображении товаров списком пользователю выдаётся гораздо больше информации о товаре. Однако компактность подачи контента падает.
Помимо просмотра товаров посредством каталога имеется возможность поиска. Поисковый запрос вводится в специальную поисковую строку, расположенную на панели навигации после чего происходит переход на страницу, не отличающуюся от страницы каталога.
Доступ к подробной информации о товаре осуществляется посредством клика по наименованию товара или его изображению. На рисунке 4.6 представлен внешний страницы просмотра подробной информации о товаре. В левой части экрана расположены минималистичные изображения товара, по центру его презентационный формат. В правой содержатся характеристики товара: его наименование, бренд, цена, цвет, сезон и так далее. Перечёркнутой выводится старая цена товара, для наглядности скидки.
На странице отображаются доступные размеры товара, после выбора своего размера пользователь может перейти к оформлению заказа или продолжить покупки.
Рисунок 4.6 – Страница подробной информации о товаре
4.4 Оформление заказа
Оформление заказа начинается со страницы корзины, которая приведена на рисунке 4.7. На этой странице расположена таблица с товарами пользователя и итоговая стоимость всех товаров. В таблице отображается изображение товара, его наименование, цена за единицу товара, количество товаров и итоговая стоимость по наименованию. Изменение количества товаров происходит по нажатию пиктограмм “плюс” и “минус” в соответствующей строке таблицы. Для удаления всех позиций наименования нужно нажать на пиктограмму урны.
Предусмотрена кнопка для возврата к покупкам, которая возвращает пользователя на главную страницу сайта.
Рисунок 4.7 – Корзина
Переход к странице выбора адреса производится через кнопку “Продолжить” или кнопку “Адрес” расположенной в верхней части страницы. На этой странице пользователю нужно выбрать один из введённых им адресов доставки.
Для добавления нового адреса доставки или редактирования старого существует специальная страница, доступ к которой осуществляется из личного кабинета пользователя, который приведён на рисунке 4.8. Кроме того в таблицу выводятся все адреса пользователя, заполненные им.