Интернет магазин для продажи товаров

Рисунок 13 – Главная страница сайта.На главной странице пользователь может пользоваться навигацией по сайту, расположенной в шапке сайта. Также при нажатии кнопки в «В каталок» пользователь переходит на страницу каталога.Рисунок 14 – Главная страница сайта(продолжение)Во вкладке меню «магазин» администратор интернет-магазина может посмотреть имеющиеся заказы, сделать импорт/экспорт каталога товаров, общие настройки магазина. Также имеется настройка способа доставки, а именно обычная доставка, самовывоз и доставка курьером. Можно настроить работу с транспортными компаниями и почтой.2.10. Добавление товаров на сайтОстановимся подробнее на добавление товаров на сайт.При нажатии на кнопку “импорт и экспорт товаров” открывается модальное окно, в котором предлагается выбрать нужный файл и отменить необходимые для импорта колонки (рисунок 15).Рисунок 15- модальное окно импорта товаров в меню администратора.Кроме импорта нескольких товаров, возможно добавление товаров и по одному. Для этого необходимо нажать на кнопку “редактор”, после чего откроется страница, где необходимо в поле каталог нажать на кнопку «+товар» (рисунки 16-21).Рисунок 16 - страница добавления нового товараРисунок 17 - Страница заполнения данных о новом товаре(Продолжение)На рисунке 17 показано как добавить такие характеристики товара как:Производитель, тип, высота, ширина и другие параметры.Это сделано для того, чтобы посетитель веб-сайта мог производить поиск штор по заданным им критериям.Рисунок 18 -Страница заполнения данных о новом товаре(Продолжение)На этой странице также можно добавить изображение товара, его описание, артикул, вес, стоимость и многое другое. А также назначить ему категорию. Тогда он будет отображаться на странице пользователя только при выборе данной категории товаров.Далее в поле «описание товара» необходимо добавить информацию о товаре, чтобы сделать его более привлекательным для клиента. Также можно добавить SEO описание для поисковых систем, такие как «title» ,«description» и ключевые слова.Рисунок 19 -Страница заполнения данных о новом товаре(Продолжение) Страница с описанием товара представлена на рисунке 18.Далее в пункте “категории” вкладки “каталог” можно создавать категории товаров и их описания (рисунок 19), они потом отображаются на странице интернет-магазина.Рисунок 20 – Пример страницы с информацией о товареРисунок 21 - добавление категории в меню администратораВыводы по второй главеСуть описанного во второй главе разрабатываемой выпускной квалификационной работы состоит в выборе средств разработки и его обоснования.Также были рассмотрены такие понятия, как язык гипертекстовой разметки HTML, каскадные таблицы стилей CSS, язык программирования JavaScript.Из множества веб-браузеров для демонстрации работоспособности веб-сайта был выбран веб-браузер Google Chrome.Принято решение использовать конструктор сайтов Nethouse, потому что он не требует больших временных и денежных затрат на создание и поддержание. Использование более сложных и дорогих инструментов для магазина и небольшим ассортиментом и услуг было бы избыточным.Разработаны требования к создаваемому программному продукту, сайт должен содержать в себе такие разделы как: главная страница, регистрация пользователя, корзина, оформление доставки.Рассмотрен процесс создания главной страницы сайта и процесс добавления товаров на сайт веб-представительства магазина «Декостиль»ГЛАВА 3. АДМИНИСТРАТИВНАЯ ЧАСТЬ ВЕБ-САЙТА 3.1. Разделение прав доступа к сайтуВ конструкторе Nethouse реализована возможность создания новых пользователей, имеющих доступ к панели управления и редактированию ресурса. Благодаря этому можно предоставлять доступ сотрудникам, Агентам или другим специалистам доступ только к определенным разделам сайта без возможности изменения логина/пароля и просмотра информации, которую Вы не хотите показывать посторонним. В любой момент доступ можно закрыть.На сегодняшний день доступны три роли пользователей сайта:"Редактор" — имеет доступ к добавлению/редактированию информации (тексты, разделы, товары, фотографии и т.д.)."Дизайнер" — имеет доступ к добавлению/редактированию информации (тексты, разделы, товары, фотографии и т.д.), а также выбору дизайна и фона."Менеджер" — имеет доступ к заказам и экспорту заказов.Для добавления нового пользователя необходимо нажать кнопку "+", в соответствующем поле, показанном на рисунке 22.Рисунок 22 – Скриншот страницы добавления пользователя конструктора «Nethouse»Далее необходимо указать ФИО, логин, пароль, контактный емейл и выбрать роль, как показано на рисунке 23.Рисунок 23 – Форма добавления нового пользователя панелью администратора Новый пользователь получит на свою электронную почту данные для доступа к управлению сайтом.3.2. Защита персональных данныхНа рисунке 24 представлена политика конфиденциальности интернет-платформы Nethouse. Персональными данными называется информация, которая может прямо или косвенно идентифицировать человека. К персональным данным относятся такие данные как: фамилия, имя, отчество, номер телефона, данные банковской карты или IP-адрес компьютера.По умолчанию, данные об IP-адресе, телефоне и e-mail к персональным данным не относятся.Рисунок 24 – Скриншот страницы конструктора «Nethouse».GDRP — это постановление Европейского Союза №2016/679, регулирующее сбор и хранение персональных данных пользователей из ЕС и накладывающее обязательства на компании, которые ведут бизнес с гражданами Евросоюза.Nethouse прилагает все усилия для защиты ваших данных. Защита данных осуществляется с использованием физических, технических, программных и административных мероприятий, нацеленных на предотвращение риска потери, неправильного использования, несанкционированного доступа, нарушения конфиденциальности и изменения данных. Меры обеспечения безопасности включают в себя межсетевую защиту и шифрование данных, контроль физического доступа к центрам обработки данных компании, а также контроль полномочий на доступ к данным.При удалении аккаунта или сайта указанные Пользователем персональные данные автоматически удаляются без возможности восстановления.3.3. Интерфейс администратора для настройки доставки и оплатыСегодня к электронной коммерции относят электронную покупку или продажу товаров через онлайн-сервисы или через интернет, мобильную коммерцию, электронные переводы средств, управление цепочками поставок, интернет-маркетинг, онлайн-обработку транзакций, электронный обмен данными (EDI), системы управления запасами и автоматизированные системы сбора данных.Среди глобальных трендов в развитии электронной торговли стоит выделить:осознанное потребление (экологичные перерабатываемые товары в противовес одноразовым),бесшовный (омниканальный) шопинг,внедрение дополненной и виртуальной реальности,«невидимые» платежи и оплата по лицу.На сайте возможно подключить онлайн-оплату заказа(рисунок 25), но для этого необходимо заключать договор с платежным сервисом и отправить реквизиты счёта. Поскольку сайт создается в учебных целях, эта функция нецелесообразна на данный момент. Рисунок 25 – Страница с выбором подключения безналичной оплаты на сайте.Поэтому на данный момент возможна оплата только наличными или банковским переводом по реквизитам.На сайт можно подключить доставку с помощью «Почты России», «Boxberry», также доступен самовывоз и курьерская доставка.Boxberry предоставляет готовое решение для интернет-магазинов, использующих платформу Nethouse, не требующее привлечения разработчиков для установки и настройки. Используя данный модуль, можно осуществлять обмен необходимыми данными с веб-сервисами Boxberry в режиме on-line.На рисунке 26 показана страница настройки доставки.Рисунок 26 – Страница с настройкой способов доставки.Выводы по третьей главеВ третьей главе разрабатываемой выпускной квалификационной работы описаны методы защиты персональных данных в конструкторе сайтов.Принято решение используемом для создания веб-представительства, описана политика конфиденциальности, выбран наличный способ оплаты, т.к. в данный момент нет возможности интеграции с платежными системами.Рассмотрены способы доставки, настроены параметры доставки для самовывоза и курьерской доставки. Возможна интеграция с сервисами доставок таких как Boxberry и Почта России.ГЛАВА 4. ИНТЕРФЕЙС ПОЛЬЗОВАТЕЛЯ4.1. Авторизация пользователяНа рисунке 27 представлена форма входа/регистрации в личный кабинет клиента интернет-магазина. Вход достаточно простой, он осуществляется посредством входа через почтовые сервисы или регистрации с помощью эл. Адреса. Рисунок 27. Форма входа на сайт.На рисунке 28 представлен выбор из каталога готовых штор, посетитель сайта может добавить их в корзину.Рисунок 28. Товар, выбранный по критерию «готовые шторы» Далее пользователь попадает в личный кабинет, где видит все свои заказы и их статус.4.2. Оформления заказаПосле добавления товара в корзину пользователь нажимает кнопку оформить заказ и начинает оформление заказа. Страница корзины представлена на рисунке 29.Рисунок 29. Страница корзиныДалее пользователь заполняет форму со своими данными и адресом доставки, рисунок 29.Рисунок 29. Страница заполнения контактовПосле заполнения формы контактов и адреса для доставки заказ оформлен, пользователь получает сообщение об успешном оформлении, рисунок 30.Рисунок 30. Уведомление о создании заказа4.3. Обратная связьПользователь, нажав на кнопку «Обратный звонок» и «Напишите нам», открывает модальное окно (Рисунок 31), где необходимо заполнить форму с номером телефона.Рисунок 31. Форма обратной связи.Подведём итоги, создан адаптивный веб-сайт для интернет-магазина штор. Основной функционал магазина создан на платформе nethouse, а именно: регистрация, корзина, оформление заказа. Добавление, редактирование товаров производит администратор сайта при помощи весьма удобного меню.Выводы по четвертой главеВ четвертой главе разрабатываемой выпускной квалификационной работы описаны процесс авторизации пользователя, выбора товара, добавления товара в корзину, заполнения данных и оформления заказа.При завершении заказа пользователь получает уведомление на электронную почту, указанную при оформлении.ЗАКЛЮЧЕНИЕВ любой фирме как в большой, так и маленькой, возникает проблема такой организации управления данными, которая обеспечила бы наиболее эффективную работу. Исходя из задач для автоматизации приёма новых заказов и для продвижения интернет-магазина, средствами nethouse, был разработан веб-сайт, который позволяет:принимать, вводить, и редактировать информацию о поступивших от посетителей интернет-магазина;информировать пользователей о ассортименте;привлекать новых клиентов;оформлять заказ;производить оплату и доставку.В ходе выпускной квалификационной работы был сформулирован следующий вывод, гласящий о том, что веб-сайт должен налаживать более тесный контакт между самой организацией по пошиву и продаже штор и основной ее аудиторией. Такой контакт обуславливается правильной структурой и актуальным содержимым веб-сайта.Структура текста самой выпускной квалификационной работы включаетв себя четыре главы:1. Анализ бизнеса;2. Проектирование веб-представительства;3. Административная часть веб-сайта.4. Интерфейс пользователяИтогом разработки стал работоспособный веб-сайт, содержащий в себе соответствующие его разработанной структуре веб-страницы, который размещен на платформе «Nethouse» в сети Интернет для возможности посетить его путем запроса доменного имени веб-сайта, введенного в адресную строку установленного на стороне потенциального посетителя веб-браузера.Была достигнута поставленная цель: разработан корпоративный сайт для компании «Декостиль» и панель администратора.Перспектива использования объекта проектирования несет индивидуальный характер и используется только компанией «Декостиль».Веб-сайт доступен по ссылке: thebesttheatre.nethouse.ru/СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВБалашова С. А. Информатика для экономистов: Учебное пособиедля вузов / Балашова С. А. - М.: Инфра-М, 2007 - 880 с.Брюс Лоусон. Изучаем HTML5. Библиотека специалиста / Брюс Лоусон, Реми Шарп. - Питер: 2012, 304 с.Номейн. Бизнес-идея: заработок на создании сайтов / Алексей Номейн. - М.: Издательские решения, 2020. - 490 c.Снелл. Абсолютно ясно о создании Web-страниц и Web-сайтов / Снелл, Нэд. - М.: Триумф, 2019. - 224 c.Флэнаган, Дэвид. JavaScript. Карманный справочник / Дэвид Флэнаган. - М.: Вильямс, 2015. - 320 c.Юрасов, А. В. Основы электронной коммерции. Учебник / А.В. Юрасов. - Москва: Высшая школа, 2021. - 500 c.Структурная модель [Электронный ресурс]. – URL: https:// economic_mathematics.academic.ru/4429/Структурные_модели (дата обращения: 28.02.2022).Организационная структура [Электронный ресурс]. – URL: https://ru.wikipedia.org/wiki/Организационная_структура (дата обращения: 28.02.2022).Информационная модель [Электронный ресурс]. – URL: https://ru. wikipedia.org/wiki/Информационная_модель (дата обращения: 28.02.2022).Цифровые сертификаты SSL [Электронный ресурс]. – URL: https://ru.wikipedia.org/wiki/SSL#:~:text=Криптографический%20протокол%2C%20который%20подразумевает%20более%20безопасную%20связь (дата обращения 28.02.2022).Элементы страницы сайта [Электронный ресурс]. – URL: https:// envybox.io/blog/jelementy-stranicy-sajta/ (дата обращения 28.02.2021).Современный дизайн сайта: тенденции и примеры [Электронный ресурс]. – URL: https://krasivodel.ru/articles/sovremennyy-dizayn-sayta.html (дата обращения: 28.02.2022).Веб-дизайн [Электронный ресурс]. – URL: https://ru. wikipedia.org/wiki/Веб-дизайн (дата обращения: 28.02.2022).Семантическое ядро сайта [Электронный ресурс]. – URL: https:// seo.ru/blog/sostavlenie-semanticheskogo-yadra-sayta/ (дата обращения: 28.02.2022).SEO оптимизация [Электронный ресурс]. – URL: https://ru. wikipedia.org/wiki/Поисковая_оптимизация (дата обращения: 28.02.2022).Структура сайта [Электронный ресурс]. – URL: https:// envybox.io/blog/struktura-sajta/ (дата обращения: 28.02.2022).Git [Электронный ресурс]. – URL: https://ru.wikipedia.org/wiki/Git (дата обращения: 28.02.2021).Что такое панель администратора [Электронный ресурс]. – URL: https://netpeak.net/ru/blog/chto-takoye-admin-panel-sayta-i-kak-tuda-popast-story/ (дата обращения: 28.02.2022).Что такое корпоративный сайт [Электронный ресурс]. – URL: https://semantica.in/blog/chto-takoe-korporativnyj-sajt.html (дата обращения: 28.02.2022).Адаптивный сайт [Электронный ресурс]. – URL: https:// semantica.in/blog/chto-takoe-adaptivnost-sajta.html (дата обращения: 28.02.2021).Учебник по Bootstrap [Электронный ресурс]. – URL: https:// itchief.ru/bootstrap/ (дата обращения: 28.02.2022). Полное руководство по Yii2 [Электронный ресурс]. – URL: https://www.yiiframework.com/doc/guide/2.0/ru/start-workflow (дата обращения: 28.02.2022). Цифровые SSL сертификаты. Разновидности [Электронный ресурс]. – URL: https://habr.com/ru/company/tuthost/blog/150433/ (дата обращения 28.02.2022).Documentation for Visual Studio Code [Электронныйресурс]. – URL: https://code.visualstudio.com/docs (датаобращения: 28.02.2022).ПРИЛОЖЕНИЕ