Описание

Дизайн интернет-магазина наушников.
Клиент хотел лёгкий и лаконичный сайт, без перегрузки графикой и текстами — чтобы всё внимание было сосредоточено на продукте.
Главная цель — максимально простой и понятный интерфейс, который одинаково удобно использовать на любом устройстве.

Задача:
- Разработать UX/UI-дизайн.
- Разработать сайт.
- Сделать адаптивную мобильную версию.

Клиент хотел лёгкий и лаконичный сайт, без перегрузки графикой и текстами — чтобы всё внимание было сосредоточено на продукте.
- Разработать **минималистичный дизайн**, подчёркивающий качество продукта.
- Создать **понятную навигацию** и простую структуру каталога.
- Проработать **адаптивную систему сеток** для корректного отображения на мобильных и планшетах.
- Подобрать **нейтральную цветовую палитру**, не отвлекающую от изображений.
- Сформировать **UX-логику карточки товара** — визуал, цена, CTA, детали.

Решение

Так как формального ТЗ не было, дизайн разрабатывался в процессе общения с клиентом.

Определили ключевые ориентиры:
- Максимум воздуха и фокуса на продукте,
- Отсутствие отвлекающих элементов,
- Одинаково удобное использование на всех устройствах

Создал адаптивную сетку, чтобы дизайн выглядел чисто и аккуратно на экранах любого размера — от 1440px до смартфонов.

Для мобильной версии переработал блоки:
- меню уехало в бургер,
- карточки стали вертикальными,
- фильтрация и кнопки CTA адаптированы под пальцевое управление.

Ключевые решения
- Минималистичный интерфейс: визуально лёгкий, с акцентом на фото товара.
- Адаптивная сетка— одинаково читается и на ноутбуке, и на телефоне.
- Фиксированная шапка для удобной навигации.
- Крупные изображения и лаконичная типографика** (Manrope / Inter).
- Мягкие hover-эффекты и плавные переходы** для ощущения современности.

Результат

- Получился чистый и современный дизайн, где весь фокус на продукте.
- Сайт одинаково комфортен на всех устройствах — от смартфона до десктопа.
- Клиент отметил, что макет “дышит” и создаёт ощущение дорогого продукта.
- Дизайн был передан на разработку и утверждён без доработок.

Прототипы помогают наглядно продемонстрировать, как будет выглядеть сайт до того, как начнётся этап дизайна. Это позволяет всем участникам проекта и клиенту понять, что будет на каждой странице.

Презентация проекта

Ссылки на примеры реализации