GiftShop создан для того, чтобы помочь пользователям легко и быстро найти идеальный подарок. Специально для него был разработан современный и функциональный сайт, сочетающий приятную эстетику и удобство. Структура сайта включает:
- Главная (домашняя) страница.
- Категории товаров.
- Все товары.
- Корзина.
- Детали заказа.
- Админпанель.
Дизайн выполнен в нежной светло-голубой цветовой гамме, создавая приятную атмосферу и акцентируя внимание покупателей на фото товаров.
Техническая сторона проекта:
- Back-end: PHP-фреймворк Laravel.
- Аутентификация и авторизация: Laravel Breeze.
- Флеш-сообщения: Toastr и PHPFlasher.
- Генерация PDF-файла с заказом в админпанели: DOMPDF Wrapper.
- Стилизация: CSS-фреймворк Bootstrap.
- База данных: MySQL.
Домашняя страница
Главная страница интернет-магазина разработана так, чтобы сразу привлекать внимание пользователей и помогать им быстро находить нужные товары. В верхней части страницы расположен баннер с эффектной фотографией и призывом к действию. что свою очередь мотивирует посетителей сайта изучить ассортимент и приступить к покупкам. Под баннером расположены самые свежие поступления товаров. В целом, структура домашней страницы направлена на комфортное и продуктивное взаимодействие пользователей с сайтом.
Страница с товарами
Страница предоставляет пользователям полный доступ к актуальному ассортименту, позволяя легко изучать и выбирать нужные позиции. Здесь представлены все товары, имеющиеся в наличии, с возможностью их подробного просмотра. Чтобы сделать процесс поиска и выбора товаров еще комфортнее, реализована пагинация, которая позволяет быстро переключаться между страницами и находить нужные позиции без перегрузки интерфейса.
Категории товаров
Для быстрого перехода к нужной группе товаров пользователю достаточно выбрать интересующую категорию в меню выпадающего списка Choose Category (Выбрать категорию). Доступны следующие категории: Men – товары для мужчин, Women – товары для женщин, Electronics – электроника, Sweeties – сладости.
Карточки товаров
Каждая карточка товара оснащена двумя важными кнопками: Details (Детали), которая открывает страницу с подробной информацией о товаре; Add to Cart (Добавить в корзину), позволяющая мгновенно добавить товар в корзину без лишних действий. при этом в навигационной панели (navbar) происходит автообновление корзины и сразу отображается актуальное количество товаров, включая только что добавленный подарок.
Страница товара
При нажатии на кнопку Details (Детали) открывается страница с полным описанием товара, его характеристиками и актуальной стоимостью. На карточке товара представлены два кнопки: Back to shop (Вернуться к покупкам) и Add to Cart (Добавить в корзину). Благодаря продуманному интерфейсу пользователи могут быстро оценить товар, вернуться к покупкам или сразу добавить товар в корзину, что делает процесс выбора и покупки простым и удобным.
Корзина
Для безопасного и удобного оформления покупок работа с корзиной возможно только после входа пользователя на сайт. Если посетитель не авторизован, то при нажатии на кнопку Add to Cart (Добавить в корзину) система автоматически перенаправит его на страницу с логином, на которой есть ссылка для регистрации, если пользователь первый раз зашёл на сайт. Если пользователь уже авторизовался, то на странице корзины он увидит всю необходимую информацию о своих покупках, включая название товара, его фото, количество единиц и кнопку для удаления. Интуитивно понятный интерфейс обеспечивает комфортное управление корзиной, помогая пользователю легко редактировать список покупок и готовиться к оформлению заказа.
Удаление товара из корзины
Перед тем как товар будет удален из корзины, отображается всплывающее Этот функционал делает процесс покупок более надежным и удобным, позволяя пользователям уверенно управлять своей корзиной и не допустить случайного удаления своего заказа.
Проверка заказа
После нажатия на кнопку Make Order (Сделать заказ) пользователю открывается страница с формой, в которой автоматически проставлены его контактные данные, указанные при регистрации. При необходимости пользователь может корректировать все данные в полях формы, за исключением стоимости своего заказа.
Способы оплаты и просмотр заказов
После оформления заказа пользователь может выбрать удобный способ оплаты: 1) наличными – при выборе этого варианта заказ автоматически подтверждается, и система перенаправляет пользователя на страницу с деталями заказа; 2) банковской картой – сначала откроется форма для ввода данных карты, где необходимо ввести реквизиты для онлайн-платежа. После успешного подтверждения платежа пользователь также перейдет на страницу с деталями утвержденного заказа. Этот процесс делает оформление заказа максимально удобным, позволяя пользователям гибко выбирать способ оплаты и получать мгновенное подтверждение.
Пользователь может легко просмотреть все свои оформленные заказы, просто кликнув на пункт меню My Orders (Мои заказы). В этом разделе представлены все предыдущие и текущие заказы, где можно посмотреть их датели и статусы. Что делает процесс отслеживания заказов простым, удобным и наглядным.
Админпанель
Для эффективного администрирования интернет-магазина разработана удобная админпанель, доступная по ссылке: https://gshop.prx.by/admin . Админ получает полный контроль над содержимым магазина и может управлять товарами, добавляя новые, редактируя существующие и удаляя ненужные при необходимости. Также админ настраивает категории товаров, редактирует данные пользователей сайта, обрабатывает заказы. Доступ к админпанели предоставляется только администратору, обеспечивая безопасность и защиту данных.
