Доработка макета карточки товара

Задача - усовершенствовать пользовательский интерфейс карточки товара для интернет-магазина электронных компонентов, ориентируясь на предоставленный пример. Основная цель - повышение удобства и скорости оформления заказа для клиента.

Ключевые цели

• Создание компактной карточки, где вся необходимая информация для заказа видна на первом экране без необходимости прокрутки.
• Улучшение блока с информацией о наличии, ценами и добавлением в корзину.
• Сохранение общего стиля и интеграция с текущей версткой и брендбуком.

Основные требования

1. Работа с макетом

• Разработка и доработка должны вестись в Figma.
• Шапка и подвал сайта остаются без изменений.
• Необходимо ориентироваться на текущую верстку, чтобы сохранить общий дизайн страницы.
• Будет предоставлен брендбук для соблюдения фирменного стиля.

2. Функциональность блока заказа

• Переработать блок информации о товаре и добавления в корзину.
• Учесть наличие нескольких складов. Рядом с выбором склада необходимо разместить поле для ввода количества товара.
• Реализовать кнопку "Заказать" в непосредственной близости от полей выбора склада и количества.
• Цена товара зависит от количества. Необходимо визуально отображать клиенту динамическое изменение итоговой стоимости при изменении количества (например, с помощью динамического обновления цены).

3. Проработка интерфейса

• Необходимо проработать состояния активных элементов: кнопок, ссылок, полей ввода (hover, active, focus).
• Интерфейс должен быть интуитивно понятным и удобным для совершения быстрого заказа.

Результат работы

Готовый, детализированный макет карточки товара в Figma, соответствующий всем требованиям и готовый к передаче в разработку.