Техническое Задание
интернет-магазина METZ
Сайт должен быть мультиязычным.
Сайт предназначен для нескольких стран Европы, если к примеру пользователь заходит с Чехии, локализация сайта должна быть чешская.
Аналогично с валютой сайта
Главная страница
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=427%3A4&scaling=min-zoom&page-id=0%3A1
1. Логотип должен иметь линк на главную страницу
2. Элементы хедера должны иметь ховеры
https://prnt.sc/1g4d5ql
3. При скролле нижняя часть хедера должна плавно заходить под верхнюю часть и быть закреплена при скролле.
https://prnt.sc/1g4c36m
4. Карусель должна плавно прокручиваться раз в 5 секунд, так же к каждое изображение должно быть кликабельный и вести на определенную страницу товара
5. Блоки «New models» и «Top sellers» должны иметь ховеры при наведении, иконки сравнить, поделиться и в корзину тоже
https://prnt.sc/1g4i7oq
6. Блок «Services» так же должен иметь ховер при наведение
https://prnt.sc/1g4iup1
Каталог
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=304%3A1502&scaling=min-zoom&page-id=0%3A1
На следующих страницах под хедером должна быть хлебные крошки
https://prnt.sc/1ghqqms
2. Под заголовком должно быть количество товаров, которые принадлежат к данной группе товаров
https://prnt.sc/1ghrfzu
3. Кнопки: Поиск, Фильтр, Сортировать и Сравнить должны иметь ховеры при наведении
4. При нажатии кнопку Поиск, должна выезжать форма поиска
https://prnt.sc/1giihl4
5. Текст Сlear Al Filter должен быть кликабельным и очищать все заданные фильтры
https://prnt.sc/1gkrbjr
6. Товары на которые поставлена скидка, должны иметь такой вид
https://prnt.sc/1gl7qpt
<!--[if !supportLineBreakNewLine]-->
Поиск
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=1540%3A4901&scaling=min-zoom&page-id=0%3A1
Фильтр
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=323%3A2438&scaling=min-zoom&page-id=0%3A1
Сортировка товара
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=329%3A403&scaling=min-zoom&page-id=0%3A1
Страница товара
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=69%3A93&scaling=min-zoom&page-id=0%3A1
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=253%3A20&scaling=min-zoom&page-id=0%3A1
1. Плашка с текстом «Overview» и «Specifications» должна плавно подниматься и прикрепляться к верхней части хедера. Элементы должны быть закреплены при скролле страницы
https://prnt.sc/1gkv9uk
2. Текст «Overview» и «Specifications» должен быть кликабельным.
«Overview» должен вести к описанию товара, «Specifications» к характеристикам товара.
3. При нажатии на кнопку, должно происходить скачивание пдф файла.
Сравнение двух товаров
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=528%3A97&scaling=min-zoom&page-id=0%3A1
1. При нажатии Add product to comparе должен добавляться товар к сравнению
2. Сlear all очищает все товары
3. При нажатии на артикул товара происходит переход на страницу товара.
4. Максимум для сравнения 4 товара
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=524%3A25&scaling=min-zoom&page-id=0%3A1
5. В адаптивной версии, страница должна иметь горизонтальный скролл
6. При добавлении товаров в сравнение, иконка должна загораться с количеством товаров
https://prnt.sc/1glxjw6
<!--[if !supportLineBreakNewLine]-->
Сравнение четырех товаров
https://www.figma.com/proto/pDokvTnIVi0v7rFqwUy0Py/METZ.SHOP?node-id=524%3A25&scaling=min-zoom&page-id=0%3A1
Корзина
1.При добавлении товара в корзину, над иконка в хедере должна загораться с количеством товаров в корзине
https://prnt.sc/1glsvb1
2.Корзина должна быть поп апом, а не отдельной страницей.
3. Должна быть возможность легко удалить лишний товар из корзины
4. Товар должен иметь артикул, и диагональ товара
https://prnt.sc/1glom2r
5. Должна быть возможность увеличивать количество товара
https://prnt.sc/1glp1uy
6. Иконка с весами должна направлять товар на сранение
7. Должна быть возможность поделиться ссылкой
https://prnt.sc/1glqihp
6. Кнопка Detail должна вести на страницу товара
https://prnt.sc/1glqvy9
7. При добавлении нескольких товаров корзину, корзина должна скроллится
https://prnt.sc/1glu0iq
8. При закрытии корзины, пользователь должен быть на той же странице, где он ее и открыл
https://prnt.sc/1glugi7
9. При нажатии на кнопку Continiue shopping, корзина так же должна просто закрыться
<!--[if !supportLineBreakNewLine]-->
Чекаут
<!--[if !supportLineBreakNewLine]-->
1. В левой части страницы пользователь должен внести данные, если это первая покупка, то в дальнейшем эти данные должны быть сохранены в личном кабинете
https://prnt.sc/1glxzgn
2. В правой части, должна находиться корзина, кнопка Edit Bag направляет в саму корзину
https://prnt.sc/1glykg5
3. Блок с доставкой в будущем будет редактироваться и возможно будет иметь несколько способов доставки, в данном блоке должен быть метод выбора radio button
https://prnt.sc/1glzwh9
4.В блоке “Адрес доставки”, выбор стран, региона и города должен быть выпадающим списком.
https://prnt.sc/1gm0ar6
5. Блок с оплатой так же должен быть методом radio button
https://prnt.sc/1gm16gv
6. Кнопка создать аккаунт должна быть неактивна
<!--[if !supportLineBreakNewLine]-->
Личный кабинет
<!--[if !supportLineBreakNewLine]-->
1. В левой части страницы должна находиться информация о пользователе
https://prnt.sc/1gm40qr
2. В правой должна быть информация о покупках, а так же о их статусе
https://prnt.sc/1gm47yd
Языки и регионы
- Сайт должен предусматривать мультизычность/региональность
- Чешский – включено сразу
- Польский – включено сразу
- Словацкий – мы должны иметь возможность включить/добавить этот язык
- Венгерский– мы должны иметь возможность добавить/включить этот язык
- Выбирая язык http://joxi.ru/LmG6yZ4cg7d9ar пользователь выбирает язычность сайта и регион. Соответственно контактные данные и платёжные системы для каждого языка региона уникальные.
- Пример мульти зычности:
CZ https://metzblue.shop/cz/android-tv/moc9000/65moc9000/
PL https://metzblue.shop/pl/android-tv/moc9000/65moc9000/
SK https://metzblue.shop/sk/android-tv/moc9000/65moc9000/
HU https://metzblue.shop/hu/android-tv/moc9000/65moc9000/