Интернет-магазин • Дизайн и разработка

FermMart — фермерские продукты с удобным выбором

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

Без AI-инструментов
Тип проектаИнтернет-магазин
ТематикаФермерские продукты
Что сделалиСтруктура, дизайн, каталог, адаптив
Основной сценарийВыбор продуктов и переход к покупке

Десктопная версия

Сайт на компьютере

Выберите снимок и откройте его целиком — внутри можно прокручивать его по высоте.

Задача и решение

От ассортимента — к конкретному продукту

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

Задача

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

Решение

Категории, поиск, фотографии продуктов и заметные действия собраны в согласованную систему. Информация о доставке вынесена на отдельную страницу.

Мобильная версия

Удобно со смартфона

Выберите снимок и откройте его целиком — внутри можно прокручивать его по высоте.

Результат

Единый магазин на разных экранах

Согласованная подача ассортимента: от первого знакомства с магазином до изучения выбранного продукта.

Понятные категорииПродукты сгруппированы по разделам, а поиск помогает перейти к нужной позиции.
Подробная карточкаФотография, описание, цена и вес размещены рядом с действиями покупки.
Мобильная версияГлавная и карточка товара адаптированы к узкому экрану с сохранением основных действий.

Следующий проект

Покажем идею вашего сайта ещё до договора

Отправьте ТЗ, ссылку или короткое описание. В первые минуты общения соберём бесплатное визуальное направление с помощью AI — финальные решения всегда проверяет специалист.

Практика и разборы

Полезное по теме

Все статьи ↗
Сгенерированная иллюстрация к статье «Как показать доставку и оплату до того, как об этом спросят»

Как показать доставку и оплату до того, как об этом спросят

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

Читать статью
Сгенерированная иллюстрация к статье «Корзина не равна заказу: разбираем последний шаг покупки»

Корзина не равна заказу: разбираем последний шаг покупки

Проверяем итоговую сумму, данные, подтверждение и повторную отправку на последнем шаге покупки.

Читать статью
Сгенерированная иллюстрация к статье «Поиск по сайту ничего не нашёл: что показать вместо пустоты»

Поиск по сайту ничего не нашёл: что показать вместо пустоты

Как сохранить запрос, предложить осмысленные варианты и использовать пустую выдачу для улучшения содержания сайта.

Читать статью
Сгенерированная иллюстрация к статье «Фильтры каталога: начинайте с выбора клиента, а не со списка свойств»

Фильтры каталога: начинайте с выбора клиента, а не со списка свойств

Почему настройка фильтров начинается с вопросов покупателя и качества данных, а не с количества технических характеристик.

Читать статью
Сгенерированная иллюстрация к статье «Нет товара в наличии: как не заводить покупателя в тупик»

Нет товара в наличии: как не заводить покупателя в тупик

Как честно сообщить об отсутствии, предложить подходящую альтернативу и не обещать неподтверждённое поступление.

Читать статью
Сгенерированная иллюстрация к статье «Карточка товара: какие вопросы нужно закрыть до кнопки заказа»

Карточка товара: какие вопросы нужно закрыть до кнопки заказа

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

Читать статью
Сгенерированная иллюстрация к статье «Каталог или интернет-магазин: нужен ли вам заказ без менеджера»

Каталог или интернет-магазин: нужен ли вам заказ без менеджера

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

Читать статью
Сгенерированная иллюстрация к статье «Слишком много полей: какие вопросы оставить в заявке»

Слишком много полей: какие вопросы оставить в заявке

Разбираем поля по назначению: что спросить сразу, что перенести на разговор и как оставить место для ответа «не знаю».

Читать статью
Сгенерированная иллюстрация к статье «Форма заявки, которую удобно заполнить с телефона»

Форма заявки, которую удобно заполнить с телефона

Проверяем поля, клавиатуру, ошибки и получение заявки: что делает мобильную форму удобной в реальном использовании.

Читать статью