Номинируйте кейсы на Workspace Digital Awards 2026. Прием заявок до 15 декабря по льготной цене, успейте принять участие!
Mediacontext
Дизайн, который продает сыр: премиальный сайт для простого продукта занял I место в Рейтинге Рунета
Mediacontext
#Разработка сайтов под ключ

Дизайн, который продает сыр: премиальный сайт для простого продукта занял I место в Рейтинге Рунета

114 
Mediacontext Россия, Санкт-Петербург
Поделиться: 0 0 0
Дизайн, который продает сыр: премиальный сайт для простого продукта занял I место в Рейтинге Рунета
Клиент

Mildar

Сфера

Торговля

Регион

Россия, Санкт-Петербург

Тип сайта

Корпоративный сайт

Сдано

Февраль 2022

Задача

Mildar — производитель молочной продукции в категориях сыр и масло. Ключевой деятельностью компании является производство сыра в «головах» по 8 кг, а УТП — уникальная технология созревания сыра в натуральном латексе.

До 2020 года основный фокус дистрибуции был направлен на В2В сектор, но начиная с 2021 года вектор расширился дополнительно на В2С сегмент с продажей продукции конечному потребителю через сетевые и online-магазины.

Задачей агентства было создать брендовый сайт для производителя сыров и масла Mildar, который бы выполнял следующие функции:

представил бренд широкой аудитории B2C (до этого фокус был на B2B);

- продемонстрировал премиальную ценность продукта и стимулировал покупку в ритейле («пойти в магазин и купить») и запросы на сотрудничество от партнеров;

- работал как сильный экспертный источник о вкусе, способах производства и легендах бренда (контент для ценителей);

- соответствовал высокому визуальному уровню: изящный минимализм, food-стилистика, премиальная эстетика, качественная графика, легкая анимация.

При этом сайт нужно было сделать с нулевой базы (на старте у нас были только новый логотип и новый дизайн этикеток продукции, не было брендбука и фотографий продукции) и обеспечить простое дальнейшее сопровождение и SEO-продвижение.

Решение

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

1Аналитика и проектирование

Первым этапом была аналитика: мы собрали данные по ЦА, целям и сценариям пользователей (B2C и B2B-заявки).

 Далее, на основе полученных данных, мы перешли к проектированию проекта: сформировали структуру сайта и матрицу контента — страницы товаров, истории бренда, экспертные статьи и CTA «где купить» / «сотрудничество».

2Дизайн: от концепций до согласования

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

Дизайн делали в духе «изящного минимализма» с фокусом на аппетитную подачу продукта: крупные качественные мокапы упаковок, сделанные на основе нового дизайна упаковок, аккуратная типографика, фуд-фотография.

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

ЧТО В ИТОГЕ У НАС ПОЛУЧИЛОСЬ

Главная страница:

Каталог:

Карточка товара:

3Верстка и анимация

Верстка выполнялась с учетом продуманных эффектов анимации и референсов по интерактивности.

Для баланса визуала и скорости прорабатывались оптимальные решения анимации (ленивая загрузка, оптимизированные SVG и CSS-эффекты).

4Контент и наполнение

Далее мы подготовили тексты в экспертном ключе (описание вкусов, истории, легенды), сделали мокапы упаковок и наполнили сайт.

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

5SEO и оптимизация производительности

На следующем этапе мы провели базовую SEO-оптимизацию: мета-теги, семантика, дружелюбные URL.

В процессе столкнулись с проблемой скорости: избыточный вес JavaScript из-за эффектов анимации снижал показатели PageSpeed. После оптимизации кода сократили вес JS в 2 раза, устранили узкие места, что вернуло хорошую скорость загрузки и улучшило поведенческие метрики.

6Коммуникация с клиентом и поддержка

Клиент предоставил нашему агентству творческую свободу, но работа велась в тесном диалоге.

В итоге готовый сайт был передан на техническую поддержку нашему агентству: ведутся работы по SEO-продвижению и дальнейшему развитию.

Результат

1. Сайт Mildar был разработан с нуля и успешно запущен в течение полугода с учетом дизайна, верстки, интеграции, наполнения и доработок.

2. Технически проект был успешно интегрирован на MODX, сайт оптимизирован по скорости после доработок, клиент получил подробные инструкции для самостоятельного управления контентом.

3. Дальнейшая работа: сайт находится на поддержке агентства, продолжается SEO-оптимизация; для заказчика реализован второй проект (сайт группы компаний «Молоко»).

4. В 2022 году сайт занял Первое место в Рейтинге Рунета в категории «Потребительские товары и торговля» — независимое ежегодное голосование пользователей и профильного жюри подтвердило высокую оценку визуальной и пользовательской составляющей проекта.

Комментарий агентства

Александра Пай
Александра Пай

Проектный менеджер

Для нас это большой успех, огромное вдохновение и мощный стимул расти и развиваться дальше, делать лучше и покорять новые вершины! А для меня, как для менеджера проектов, особенно важно видеть результаты своей работы. Это значит, что мы с командой работали не зря.

https://mildar.ru/

Стек технологий


Награды


Над проектом работали:


Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.
оставить заявку

Хотите заказать похожий проект?

Mediacontext с удовольствием обсудит вашу задачу

Оставить заявку