4.55M

Category:

internet

Смотри и не беги!

1.

Представление проекта:
“Смотри и не беги!”

Краткое описание и главная цель
• Мой сайт показывает количество товара , акции и очередь в
магазине вблизи корпоративного жилья
• Главная цель моего проекта это экономить время. Выбранный
способ это чтобы студенты и работники не тратили своё время на
поход к магазину за тем, чего там нет, и не стояли очередь о
которой не знали.

3.

Представление технического задания.
Полное ТЗ будет показано позже, вот основные моменты из него:\
• Сайт должен обладать плашкой сверху названием сайта, а также
кнопкой qr-кода открывающей сканер qr кода и кнопкой входа в
акаунт. Ниже находится переключатель с 3 положениями. Ниже
представлен плашка в которой будут указаны текущие акции
• Под переключателями будет список товаров магазина
выбранного переключателем. Под списком установлен индикатор
загруженности магазина. Ниже находится секция с отзывами
• Сроки: До 25 сентября 2024 года

4.

Демонстрация макета сайта
Первая страница
На первой странице представлено
название, кнопка входа, и открытие
сканера QR-кода. Ниже видны кнопки
для выбора магазина и текущие
акции.

5.

Демонстрация макета сайта
Каталог товаров
Каталог товаров это основная функция
сайта. Здесь отображаются количество и
цена товара и их фото. (вместо фото
поставлена заглушка)

6.

Демонстрация макета сайта
Отзывы
Отзывы должны быть либо
положительными (+), либо
отрицательными (-), а также должны
иметь текст.

7.

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

8.

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

9.

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

10.

Демонстрация макета сайта
О нас
Здесь представлена основная
информация о сайте

11.

Демонстрация макета сайта
Подвал
В подвале представлены контакты для
связи при нештатных ситуация на сайте, а
также преимущества использования сайта

12.

Описание процесса верстки
Вёрстка выдалась долгой, так-как у проекта менялся концепт.
Так как проект начинался делать до освоения scss, он сделан с
использованием css.
Основными вызовами стали фоновые изображения жалоб.
Все позиции товара, жалобы, отзывы – сделаны с учётом на
автоматическое добавление новых.

Смотри и не беги!

1.

2.

3.

4.

5.

6.

7.

8.

9.

10.

11.

12.

13.

14.

15.

16.

17.

18.

19.

20.

21.

22.

23.

24.

25.

26.

27.

28.