Общая информация

• Дизайн подготовлен для внедрения на Bootstrap (адаптивная верстка).

• Все стили и визуальная логика должны соответствовать стилю сайта: https://aquapartners.weblium.site/

• Цветовая схема, кнопки, шрифты — в едином стиле с этим сайтом.

В приложении есть визуализация каждого экрана, выполненная в Paint примерного дизайна, который необходимо для верстальщика на Bootstrap сделать в Фигме. 

Экран 1 — Иконка виджета

Функциональность:

• Простой виджет для вставки на любой сайт, без нарушения стилей сайта.

• Кнопка для открытия виджета размещается справа и ведет к Экрану 2.

Экран 2 — Вход в систему / начало оформления

Цель: Ввести логин и пароль для перехода к оформлению заказа или выбрать "Заказать без регистрации".

Блоки:

• Заголовок: "Для оформления заказа введите Ваш Логин и Пароль"

• Поле для логина

• Поле для пароля

• Кнопка «Войти»

• Ссылки: «Забыли данные для входа?», «Зарегистрироваться…» ведут в телеграм-чат

• Кнопка неактивная «Заказать без регистрации» 

• Внизу: фраза с ссылкой — "Продолжая, я даю согласие на обработку персональных данных"

Экран 3 — Ввод информации о получателе

Цель: Ввести ФИО, email, телефон, адрес доставки.

Блоки:

• Ваше имя

• E-mail

• Номер телефона

• Список активных адресов (с радиокнопкой выбора, например: Адрес 1, Адрес 2)

• В каждом блоке адреса:

  • Город

  • Улица + дом

  • Подъезд, этаж, квартира / офис, домофон / код

• Кнопка «Добавить новый адрес» внизу

Экран 3.1 — Личный кабинет клиента (история заказов)

Функциональность:

• Отображение баланса денег и тарифов (задолженность/переплата)

• Статистика: количество заказов

• Информация о последнем заказе: список товаров, количество, сумма, водитель, адрес

• Кнопка: «Повторить последний заказ»

• Кнопка: «Оформить новый заказ» (ведет на Экран 4)

Экран 4 — Выбор товаров

Цель: Выбрать товары для нового заказа

Блоки:

• Выпадающий список с категориями товаров

• Выбранные товары из списка: название, количество +/-, цена, кнопка «Х» (удалить)

• Сумма заказа

• Скидка (если есть)

• К оплате

• Баланс (переплата/задолженность)

• Кнопка: «Далее»

Экран 4.1 — Детали доставки и оплаты

Цель: Выбрать дату, время, способ оплаты, оставить комментарий

Блоки:

• Выбор даты (доступны следующие 2 дня + кнопка выбора другой даты)

• Выбор времени (по умолчанию: 08:00–21:00, или выбрать интервал)

• Способ оплаты (используются только эти варианты):

  • Наличными

  • Б/Н картой

  • Б/Н по договору

  • Терминал

• Поле для комментария

• Кнопка «Оформить заказ»

Экран 5 — Проверка заказа

Цель: Просмотр введенных данных перед подтверждением

Блоки:

• Адрес доставки (с возможностью изменить)

• Телефон, дата доставки, время, способ оплаты

• Перечень товаров, количество, цена

• Итог: скидка, всего к оплате

• Комментарий к заказу (отображается)

• Кнопка «Назад»

• Кнопка «Подтвердить»

Экран 6 — Ошибка при оформлении

Цель: Показать причину, почему заказ не был оформлен

Контент:

• Заголовок: «Заказ не оформлен»

• Текст с указанной причиной (например: минимальное количество товаров типа «Оборудование»: 3)

• Иллюстрация с предупреждающим знаком

• Кнопка «Назад»

Экран 7 — Заказ подтвержден

Цель: Сообщить пользователю об успешном оформлении

Контент:

• Номер заказа

• Текст: «Заказ оформлен. Ожидайте доставку в указанный срок»

• Иллюстрация с подтверждением

• Кнопка «Понятно»