Задача
Компания «Планета Витаминов» специализируется на производстве и продаже овощных смесей, замороженных ягод и фруктов. Задача заключалась в разработке и доработке функционала сайта для улучшения пользовательского опыта, внедрения новых функций и оптимизации существующих процессов. Включает обновление мобильной версии, улучшение отображения продуктов, настройку всплывающих окон и реализации анимаций, а также дополнительные требования к функциональности сайта.
Подход
Проект был разделен на несколько этапов, каждый из которых включал доработку ключевых частей сайта. Основное внимание уделялось улучшению функционала поиска, отображению контента, оптимизации мобильной версии, внедрению анимаций и улучшению взаимодействия с карточками продуктов и рецептами.
В рамках каждого этапа были использованы гибкие подходы для решения специфических задач, таких как улучшение пользовательского интерфейса, добавление новых элементов и устранение проблем с отображением информации. При этом были учтены требования заказчика по SEO-оптимизации и мобильной адаптации.
Что реализовано
Поиск
Изменена логика поиска, теперь сначала выводится продукция, а затем рецепты. В карточке рецепта добавлено краткое описание из админки.
Всплывающие окна и анимации
Реализовано SEO-оптимизированное открытие всплывающих окон с изменением ссылок без перезагрузки страницы для разделов "Рецепты" и "Каталог". Добавлена анимация значков.
Разделы сайта
О марке: Увеличен размер шрифта, верстка подкорректирована, текст сокращен.
Калькулятор калорий: Установлен предвыбор на "Капусту Брокколи", заменена картинка калькулятора в футере.
Трейд-Ин и рецепты: Всплывающее окно теперь правильно отображает информацию о других продуктах (например, при отображении брокколи подставляются другие овощи с этим же продуктом).
Карточка продукции
Отображение упаковок: Добавлена возможность отображения двух видов упаковок с разным граммажем (например, 400 г и 1 кг) и изменение цвета при наведении на кружок с граммажем. Всплывающее окно теперь открывает картинку выбранной упаковки.
Ингредиенты в карточке: В карточке продукции для раздела "Овощные смеси" выведен состав под заголовком, а также добавлена возможность загрузки картинок с инструкциями по приготовлению.
Мобильная версия
Главная страница: Расстояние над и под заголовком "Творчество на кухне" увеличено. Значок "Новый рецепт" перемещен в угол картинки, а значок поиска стал размытым.
Раздел "Рецепты": В админке добавлена возможность загрузки фоновой картинки для каждого рецепта.
Всплывающее окно в разделе "Каталог": Зафиксировано положение всплывающего окна для мобильной версии, сделано плавное пролистывание.
Интерфейс и макеты проекта
Результат
-
Повышен удобство поиска и отображения продукции и рецептов.
-
Реализованы анимации для значков и улучшена визуальная интерактивность.
-
Мобильная версия улучшена с оптимизацией интерфейса и добавлением фонов для рецептов.
-
Карточки продукции теперь отображают две упаковки с разным граммажем и правильный состав.
-
Внесены изменения в раздел «О марке», улучшена верстка и сокращен текст.
-
Исправлены ошибки в калькуляторе калорий и всплывающих окнах.
-
Улучшена SEO-оптимизация через корректировку ссылок и всплывающих окон.
Сайт корректно отображается на всех видах устройств:
монитор компьютера, планшет и телефон
Другие проекты
