Разработка Web-приложения – сервис объявлений об автотранспорте

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

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

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

Доступ в администрирование.

Для входа в административный интерфейс необходимо набрать в браузере: http://reston-center.ru/shop/access_admin.php

Вход в администрирование осуществляется с помощью следующей формы (см. рис. 2.4.).

Рисунок 2.4. Вход в администрирование

В этой форме указываем логин и пароль администратора, который был введен в процессе установки магазина. Если вы авторизованы как администратор, в пользовательской части магазина вам будет доступна ссылка

>> АДМИНИСТРИРОВАНИЕ <<

по которой вы сможете попасть в административный интерфейс.

Изменить логин и пароль администратора возможно в разделе администрирования «Настройки», далее «Доступ в администрирование».

Восстановление логина и пароля администратора.

Если вы забыли логин и/или пароль для входа в администрирование, возможно указать новые с помощью утилиты forgot_password.php. Этот файл находится в папке extra архива Shop Script FREE. Скопируйте forgot_password.php из этой папки в директорию, в которую установлен Shop Script, и затем запустите его.

Для этого наберите в браузере

http://<адрес_магазина_ShopScript>/forgot_password.php).

Рисунок 2.5. Форма смены пароля

С помощью появившейся формы (см. рис. 2.5.) вы сможете задать новые логин и пароль администратора. После того, как данные для входа в администрирование восстановлены, необходимо удалить forgot_password.php из корневой папки магазина. Если не сделать этого, кто-либо другой сможет получить доступ к администрированию магазина!

Пользовательская часть.

Каталог товаров.

В пользовательской части магазина представлен каталог товаров магазина. Пользовательская часть позволяет клиентам перемещаться по сайту и оформлять заказы. Товары сгруппированы по категориям «оргтехника» и «товары для здоровья».

Ниже представлен интерфейс главной страницы магазина (см. рис. 2.6.).

Доступ к категориям осуществляется двумя способами:

переходом по ссылкам в центре главной страницы;

через список категорий.

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

Рисунок 2.6. Интерфейс главной страницы интернет-магазина

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

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

Когда посетитель магазина заходит в какую-либо товарную категорию, ему будет показан список товаров данной категории, разбитый по страницам. Просматривая список товаров (в категории и т.д.), кликнув на название товара, посетитель перейдет на страницу с полным описанием товара (см. рис. 2.7.).

Детализированная страница товара позволяет клиенту не только добавить товар в корзину, но и увидеть увеличенное изображение товара, проголосовать.

Кнопка «Добавить в корзину» показывается для товара, если выполняются все следующие условия:

цена товара положительна (строго больше, чем ноль);

если товар имеется на складе (для товара включена галочка «На складе»);

Если цена товара равна нулю (0) или отрицательная (<0), кнопка «Добавить в корзину» и цена не отображаются (режим просмотра товаров).

Данные особенности кнопки «Добавить в корзину» позволяют отключить функцию размещения заказа на определенный товар.

Рисунок 2.7. Страница товара

Если необходимо полностью отключить систему размещения заказов, можно сделать это в администрировании в разделе настроек, отключив галочку «Показывать кнопку «Добавить в корзину».

При помощи формы «Оценить товар» на странице с подробной информацией о товаре (см. рис. 2.7.) посетитель может повлиять на рейтинг товара.

Параметры оценки от 0 до 5 отображаются под названием товара, где 0 окрашенных звезд означает самый низкий рейтинг, 5 окрашенных звезд означает самый высокий уровень популярности. Все посетители могут проголосовать за товар (даже если они не зарегистрированы или не приобретали данный товар). За одну сессию (за один раз захода в интернет-магазин) посетитель может проголосовать за определенный товар только один раз. Если посетитель нажимает кнопку «Проголосовать» более одного раза, то учитывается только первый голос, остальные - игнорируются.

Корзина.

Добавление товаров в корзину происходит очень просто - одним нажатием на кнопку «Добавить в корзину». Эта кнопка находится напротив каждого товара в списке (при просмотре товаров внутри категории, результатов поиска, на странице с подробной информацией о товаре).

После нажатия кнопки «Добавить в корзину» или «купить», пользователю открывается страница корзины (см. рис. 2.8.). На странице корзины клиент видит заказанные товары, может выбрать и удалить товары, которые он передумал покупать, или очистить корзину. Состояние корзины отображается каждый раз, когда клиент добавляет товар в корзину. С этой страницы клиент может либо перейти на страницу оформления заказа, либо вернуться обратно к списку товаров. По умолчанию выбор опции «Вернуться к покупкам» отправляет клиента на главную страницу магазина.

Рисунок 2.8. Страница корзины

Оформление заказа. Для оформления заказа клиенту предлагается предоставить необходимую контакную информацию (имя, фамилия, адрес доставки) (см. рис. 2.9).

При нажатии на кнопку «Отправить!» система сохраняет заказ в базе данных и отправляет два электронных письма-уведомления:

клиенту сообщение с информацией о заказе;

администратору магазина уведомление о размещении заказа.

Это сообщение отправляется на адрес, указанный в настройках магазина (см. «Настройки» в административной части).

Когда заказ сохранен в базе данных и уведомления отправлены, перед клиентом открывается страница «Спасибо за ваш заказ».

Рисунок 2.9. Оформление заказа

Административная часть (администрирование). Управление каталогом товаров осуществляется в разделе администрирования «Категории и товары».

Для того чтобы добавить новую категорию/подкатегорию в список, необходимо нажать на кнопку «Добавить» в нижней части столбца Категории (см. рис. 2.10.). Появится окно с выбором опций (см. рис. 2.11.).

Рисунок 2.10. Администрирование - каталог товаров

Рисунок 2.11. Окно с выбором опций для создания новой категории

Parent: определяет родительскую категорию, куда будет помещена новая категория. Если вы выберите в качестве родительской некорневую, а уже существующую категорию, то вы создадите подкатегорию. Для создаваемой категории введите название. Также можно загрузить любое изображение, которое наилучшим образом характеризует категорию или товары в категории.

С помощью данной формы возможно загружать только графические файлы с расширениями: .jpg, .jpeg, .gif, .bmp, .png. Другие расширения не разрешены.

Описание категории (description): область, где следует написать несколько слов о категории, которую вы создаете - это будет описанием категории. Описание появляется под названием категории, как только покупатель заходит на страницу категории. Описание задается в виде html-текста.

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

Чтобы добавить новый товар, нажмите на кнопку «Добавить» в нижней части столбца Products (см. рис. 2.11.).

Появится окно с выбором опций для товара (см. рис. 2.12.).

Рисунок 2.12 - Окно с выбором опций для товара

Parent: определяет категорию/подкатегорию, в которую будет помещен товар. Корневая папка (Root) может работать как запоминающий буфер: содержание папки не отражается в пользовательской части, и посетители его не видят.

Наименование (product name): укажите название товара, который вы хотите добавить.

Внутренний код/артикул (product code): если товар маркируется, то здесь необходимо указать его код. Это поможет идентифицировать его при заказе товара клиентами. Информация, которую вы введете здесь, используется только для внутреннего использования: показывается только администратору, но не клиенту.

Цена (price): здесь указать стоимость товара в валюте, которую мы определили в разделе «Настройки» администрирования. Если указать цену как отрицательное значение или ноль, то кнопка «Добавить в корзину» будет заблокирована и клиент не сможет заказать этот продукт.

Старая цена (list price): заявленная здесь цена указывается для того, чтобы показать клиенту, что товар в вашем магазине продается дешевле, чем в других магазинах.

Например, вы можете указать в этом поле цену на данный товар в других магазинах, а затем в поле Цена (price) указать более низкую стоимость. Таким образом, внимание покупателя акцентируется на предлагаемой скидке. Система автоматически подсчитает, сколько экономит покупатель.

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

На складе (in stock): включите, если товар «есть на складе», т.е. доступен для заказа. Если вы выключите данную опцию, пользователь не сможет заказать этот товар.

Фотографии товаров (picture): здесь вы можете выбрать изображение (фотографию) товара.

Изображение можно загрузить в трех вариантах:

фотография: посетитель видит это изображение на странице с подробной информацией о товаре;

уменьшенная копия: посетитель видит это изображение, когда находится внутри категории или на странице результатов поиска;

увеличенная копия: открывается в отдельном окне.

С помощью данной формы вы можете загружать только графические файлы с расширениями: .jpg, .jpeg, .gif, .bmp, .pcx. Другие расширения не разрешены.

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

Описание (description): опишите в нескольких словах товар, который вы добавляете. Это описание появится на странице с подробной информацией о товаре в пользовательской части. Поле задается в формате HTML.

Краткое описание (brief description): это описание появится под названием товара в списке товаров (т.е. когда покупатель открывает список товаров категории, просматривает результаты поиска и т.д.). Поле задается в формате HTML.

Таблица товаров. Таблица товаров отображается в основном окне администрирования магазина. Нажав на название категории, вы уведите таблицу товаров, содержащихся в данной категории (см. рис. 2.13.).

При помощи этой формы вы можете осуществлять поиск товара по имени или по внутреннему коду.

Рисунок 2.13 - Таблица товаров категории Мониторы

Enabled: в этой колонке можно временно отключить показ товара в пользовательской части. Уберите галочку напротив товара, и покупатель не увидит его в вашем магазине.

Внутренний код (product code): если вы маркируете товар, здесь будет отображен код товара.

Наименование (product name): наименование товара, как его видят покупатели.

Рейтинг (rating): в этом поле отражается рейтинг товаров магазина. Рейтинг продуктов определяют посетители магазина. Вы можете сами увеличить или уменьшить рейтинг товара.

Цена (price): в этом поле указывается стоимость товара в рублях. Значения в этом поле является редактируемыми, вы можете изменить стоимость товара, не открывая окно редактирования товара.

На складе (in stock): здесь показывается, сколько единиц товара имеется на складе. Значение в этом поле является редактируемым, вы можете изменить его, не открывая окно модификации товара.

Фотография (picture, enlarged picture, thumbnail): указывает количество загруженных для товара изображений.

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

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

Рейтинг (rating): это поле показывает текущий рейтинг товара. Можно регулировать значение, указанное в данном поле (число может быть дробным, например, 1.345).

Специальные предложения. В нижней части главной страницы пользовательской части магазина показываются специальные предложения интернет-магазина. Можно демонстрировать новые товары, бестселлеры, товары со скидкой (см. рис. 2.14).

Рисунок 2.14 - Специальные предложения интернет-магазина

Заказы и покупатели. В разделе «New orders» вы можете осуществлять поиск заказов по их номеру или статусу (состоянию) (см. рис. 2.15.).

Чтобы удалить заказ, необходимо нажать кнопку «Удалить» напротив заказа.

Цена заказанных товаров действительна на момент размещения заказа.

Рисунок 2.15 - Раздел административной части - Заказы

Настройки магазина (Configuration). Основные настройки (General settings). В данном разделе вы можете определить основные настройки магазина (см. рис. 2.16.).

Store name - название интернет-магазина. Название появится в строке заголовка браузера (верхний левый угол) и будет включено в электронные сообщения (такие как, например, уведомление о заказе), посылаемые клиентам из магазина.

Store URL - этот URL будет публиковаться в электронных сообщениях, которые посылаются клиентам магазина. В этом поле вы можете ввести адрес, кликнув по которому пользователь попадет в интернет-магазин.

Email адрес магазина - с этого электронного адреса будут отправляться электронные сообщения вашим покупателям (например, уведомления о заказах).

Email для отправки уведомлений о заказах - электронный адрес, на который администратору будут приходить сообщения об успешно оформленных заказах.

Currency left symbol - обозначение валюты слева от суммы (цены) - обозначение валюты, которое будет выводиться слева от суммы при показе цен на товары в магазине. Например, если введем «$», то цены будут отображаться следующим образом: $531.00.

Currency right symbol - обозначение валюты справа от суммы (цены) - обозначение валюты, которое будет выводиться справа от суммы при показе цен на товары в магазине. Например, если введем “ руб.”, то цены будут отображаться следующим образом: 531.00 руб.

Currency ISO3 code - трехбуквенный код валюты ISO3 - код валюты, в которой вводятся и в которой будут отображаться цены на продукты. Поддерживается работа только с одной валютой.

Рисунок 2.16. Раздел административной части - Настройки магазина

Оформление.Оформление (Appearance) - в этом разделе вы можете выбрать цвета отображения таблиц в пользовательской части (например, таблица корзины и т.д.), максимальное количество товаров и столбцов при показе товаров на странице, а так же включить/выключить опцию показа кнопки «Добавить в корзину» (см. рис. 2.17.).

Рисунок 2.17. Раздел административной части - Оформление

Для изменения цветовой гаммы шаблонов необходимо редактировать файлы шаблонов магазина.

Maximum products count per page - максимальное количество товаров на странице - здесь можно задать, сколько товаров в пользовательской части будет отображаться на страницах результатов поиска и страницах категорий. Если количество товаров в категории или в результатах поиска превышает указанное значение, то список товаров разбивается на несколько страниц.

Maximum columns per page - количество столбцов при показе товаров на странице - необходимо ввести количество колонок в таблице продуктов в пользовательской части.

Enable shopping cart facility - включить возможность оформления заказов - если эта опция выключена, то пользователи не смогут добавлять товары в корзину и оформлять заказы: кнопка «Добавить в корзину» и раздел оформления заказа будут отключены.

Снимите этот флажок, и магазин будет работать в режиме интернет-каталога, а не интернет-магазина.

Show highest rated subcategories' products in empty categories - показывать наиболее популярные товары в пустых категориях - если в категории, в которой находится пользователь, нет ни одного товара, то:

если опция отключена, то так и будет показано - "нет товаров";

если опция включена, то из подкатегорий текущей категории будут взяты самые популярные товары (по рейтингу), и показаны покупателю как "Лучший выбор".

Доступ к администрированию. Доступ к администрированию (Admin login/password) - в этом разделе вы можете изменить логин и пароль администратора. Просто введите новый пароль и/или логин администратора наряду со старым паролем в соответствующие графы и нажмите «Сохранить».

Дополнительная информация. Дополнительная информация (Auxiliary information) - этот раздел создан с целью предоставить информацию на дополнительных страницах («Правила работы» и «Как купить»). Возможно использовать HTML-теги в полях ввода информации для дополнительной страницы.

Интерфейс интернет-магазина. В Shop Script FREE поддерживается многоязычный интерфейс с возможностью переключения языка. По умолчанию язык интерфейса содержатся в папке languages - english.php.

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

Для добавления нового языка необходимо создать php-файл, подобный тему, что уже находятся в папке includes/language. В нашем случае необходимо добавить русский язык интерфейса. Создаем файл russian.php в папке languages как копию файла english.php, и затем переводим все языковые конструкции с английского языка на русский.

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

Список языков, в которых может быть отображен интернет-магазин, определяется в файле cfg/language_list.php. И редактируем файл в текстовом редакторе.

Добавление языка интерфейса russian.php (фрагмент файла cfg/language_list.php):

$lang_list[0] = new Language();

$lang_list[0]->description = "English";

$lang_list[0]->filename = "english.php";

$lang_list[0]->template_path = "./templates/tmpl1/"; .

Необходимо добавить следующие строки:

$lang_list[1] = new Language();

$lang_list[1]->description = "German";

$lang_list[1]->filename = "russian.php";

$lang_list[1]->template_path = "./templates/tmpl1/";

$lang_list[2] = new Language();

$lang_list[2]->description = "English";

$lang_list[2]->filename = "english.php";

$lang_list[2]->template_path = "./templates/tmpl1/";.

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

Шаблоны.

Shop Script работает на основе шаблонной библиотеки Smarty (http://smarty.php.net).

Smarty - это мощный инструмент, позволяющий сделать дизайн интернет-магазина легко редактируемым и отделить его от PHP скриптов. Дизайн настраивается в шаблонах, которые представляют собой HTML файлы, расположенные во вложенной папке templates/tmpl1/ в директории, где установлен скрипт магазина.

Содержимое файлов-шаблонов представляет собой HTML-код со вставками специальных тэгов Smarty, оформленных в фигурных скобках {} - это различные условия {if}, циклы {section} и т.п.

Основной шаблон пользовательской части index.tpl.html (этот шаблон определяет внешний вид магазина). При помощи HTML редактора Macromedia Dreamweaver были внесены необходимые изменения: цветовое оформление, логотип, изменена панель навигации, и другие элементы дизайна.

ЗАКЛЮЧЕНИЕ

В ходе выполнения дипломного проекта:

сформулирована технико-экономическая характеристика предметной области;

проанализированы преимущества, которые дают современные интернет-решения для развития электронной коммерции в малых компаниях;

обоснована экономическая эффективность проекта исследованы технические, технологические, маркетинговые параметры эффективности коммерческих интернет-сайтов;

приведен обзор средств разработки;

рассчитаны показатели экономической эффективности проекта;

обоснован выбор средства разработки и языков программирования;

обсуждены общие вопросы эргономики и дизайна веб-сайта;

рассмотрены технологии оптимизации сайта и технологии привлечения посетителей;

разработана информационная структура веб-сайта и информационное наполнение его разделов;

реализовано интернет-представительство компании;

подготовлена сопроводительная документация для заказчика, обеспечивающая ему управление (пополнение, редактирование контента сайта и т.п.).

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

Приведенные расчеты показывают, что внедрение дополнительной услуги в магазине ООО «Рэстон» экономически обоснованно и помимо быстрой окупаемости проекта поможет в получении дополнительной прибыли магазина за счет:

- дополнительного круглосуточного канала сбыта товаров;

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

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

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

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

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

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

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

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

Снижение итоговых затрат на создание и поддержание сайта.

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