Разработка программного продукта
Проектирование структуры страниц
Для редактирования контента администратор сайта будет использовать интегрированную программную среду, которая представляет включенный в шаблон и стилевое оформление сайта визуальный редактор.
Структура страницы (рисунок 4.1) представляет собой размеченную динамическую страницу, элементами которой являются функциональные блоки, выполненные в виде внедренных модулей, текстового и графического контента.
Рисунок 4.1 – Структура главной страницы
Сайт имеет в своей структуре 3 меню:
- меню пользователя – предназначено для доступа к персонифицированным командам пользователя: личному кабинету, заметкам, товарам для сравнения, корзине покупок, процедуре оформления заказа;
- главное меню – содержит категории товаров, представленных на сайте;
- дополнительное меню логически разделено на 4 группы: информация, поддержка, дополнительно, личный кабинет. Данное меню предназначено для предоставления общей информации об электронном магазине, выполнения вторичных функций при продаже: обращение в службу поддержки и др. Для акцентирования внимания на товарах магазина данное меню расположено в подвале сайта.
Рекламный модуль представляет собой интерактивный рекламный баннер, привлекающий посетителей на сайт. Область рекомендуемых товаров является самой большой по площади на странице и содержит ссылки на новинки товаров.
Центральная часть сайта (рекламный модуль, информация о сайте, модуль новинок) дочерних страниц отличается по структуре от главной. Данная часть реализована по двухколоночной разметке с увеличенной правой частью. В левой части представлены категории товаров и рекламный баннер, а в правой описание товарных групп и непосредственно товаров.
Административный раздел
Администрирование содержит инструменты управления интернет – магазином и включает в себя как общие настройки магазина, так и специальные настройки интернет – магазина.
Для использования режима администратора необходимо войти в систему как администратор, при этом администратору будут доступны все функции по управлению сайтом. Административная часть является удобным интерфейсом (рисунок 4.2), функциональная структура главного меню представлена на рисунке 4.3.
Рисунок 4.2 – Интерфейс административной части
Рисунок 4.3– Функциональная структура главного меню административной части
С целью предотвращения несанкционированного доступа к административной части доступ к ней возможен только из адресной строки браузера (на примере локального размещения): http://localhost/col.ru/admin.
Административная часть располагается в отдельном дочернем каталоге основного каталога сайта («admin»). Программный код основного файла (index.php) представлен в приложении А. Программный код файла с настройками (config.php) на примере размещения на локальном хостинге представлен ниже:
<?php
// HTTP
define('HTTP_SERVER', 'http://localhost/col.ru/admin/');
define('HTTP_CATALOG', 'http://localhost/col.ru/');
define('HTTP_IMAGE', 'http://localhost/col.ru/image/');
// HTTPS
define('HTTPS_SERVER', 'http://localhost/col.ru/admin/');
define('HTTPS_CATALOG', 'http://localhost/col.ru/');
define('HTTPS_IMAGE', 'http://localhost/col.ru/image/');
// DIR
define('DIR_APPLICATION', 'Z:\home\localhost\www\col.ru/admin/');
define('DIR_SYSTEM', 'Z:\home\localhost\www\col.ru/system/');
define('DIR_DATABASE', 'Z:\home\localhost\www\col.ru/system/database/');
define('DIR_LANGUAGE', 'Z:\home\localhost\www\col.ru/admin/language/');
define('DIR_TEMPLATE', 'Z:\home\localhost\www\col.ru/admin/view/template/');
define('DIR_CONFIG', 'Z:\home\localhost\www\col.ru/system/config/');
define('DIR_IMAGE', 'Z:\home\localhost\www\col.ru/image/');
define('DIR_CACHE', 'Z:\home\localhost\www\col.ru/system/cache/');
define('DIR_DOWNLOAD', 'Z:\home\localhost\www\col.ru/download/');
define('DIR_LOGS', 'Z:\home\localhost\www\col.ru/system/logs/');
define('DIR_CATALOG', 'Z:\home\localhost\www\col.ru/catalog/');
// DB
define('DB_DRIVER', 'mysql');
define('DB_HOSTNAME', 'localhost');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_DATABASE', 'colatadcolatad');
define('DB_PREFIX', '');
?>
Клиентский раздел
В клиентской части архитектуры разрабатывается максимально удобная и доступная работа потенциального клиента на страницах интернет – магазина. Разработка интерфейса, доступные и понятные диалоговые окна, удобные системы оплаты и доставки товаров. Немаловажным фактором является обратная связь, позволяющая высказать клиенту свое мнение о том или ином товаре/услуге.
Интерфейс - в широком смысле - определенная стандартами граница между взаимодействующими независимыми объектами. Интерфейс задает параметры, процедуры и характеристики взаимодействия объектов.
Интерфейс пользователя - элементы и компоненты программы, которые способны оказывать влияние на взаимодействие пользователя с программным обеспечением.
Специфика интернет-магазина цифровых товаров состоит в том, что понятие материального товара отсутствует, и функция оплаты, предоставление информационного продукта (товара) осуществляется дистанционно через сеть интернет. А функции склада реализуются через файловые хранилища непосредственно на хостинге сайта. Для реализации данной особенности описание товара не содержит его доступное количество на складе, а в тоже время содержит пример использования в виде ссылки на сторонний ресурс.
В интернет – магазине должен быть реализован удобный и быстрый поиск необходимого пользователю товара, с тем, чтобы пользователь оперативно получал ответы, на любые вопросы по тематике сайта. Не найдя нужной информации, посетитель может просто уйти, так и не получив четкого представления о ресурсе.
Рядом с товаром, отсутствующим на складе должна отсутствовать пиктограмма добавления товара в корзину, с целью недопущения путаницы у клиента.
Навигация должна быть структурирована, заголовки быть четкими, а изображения, поясняющие каждый раздел, логически соответствовать заголовку.
Цветовая гамма будет ориентирована на красно-белые тона, привлекающие внимание пользователя. Для большего визуального эффекта цвет фона – белый, а текстовый и графический контент – оттенки красного. Логотип интернет-магазина также выполнен в красной цветовой гамме на прозрачном фоне и расположен в верхней части сайта.
Когда пользователь всемирной сети попадает в интернет – магазин, то первой он видит главную страницу (рисунок 4.4). Посетитель рассматривает витрину интернет – магазина, на которой он видит представленные товары.
Доступ к главной странице с локального хостинга осуществляется с помощью адреса http://localhost/col.ru., доступ к главной странице с хостинга сети интернет -с помощью адреса http://www.colatab.ru.
Рисунок 4.4 - Главная страница
Просмотр структуры сайта возможен с помощью меню «Карта сайта» (рисунок 4.5).
Рисунок 4.5 - Карта сайта
Информационные страницы, например «Наш магазин», представляют собой материал, редактирование которого соуществляется с помощью команды Каталог-Статьи (рисунок 4.6 – 4.7).
Рисунок 4.6 - Список статей
Рисунок 4.7 - Редактирование статьи