О проекте
«Детские грёзы» — быстрорастущая компания, которая специализируется на продаже качественных и безопасных товаров для детей. Компания уделяет особое внимание надежности продукции и ее влиянию на развитие ребенка. Все товары интернет-магазина проходят контроль качества, а ассортимент формируется с учетом рекомендаций экспертов в области психомоторного развития.
Главный показатель работы компании — довольные покупатели. Поэтому интернет-магазин должен был не только привлекать внимание, но и формировать у родителей ощущение доверия, безопасности и высокого качества продукции.
Задачи проекта
Перед Iris Digital стояли следующие задачи:
- разработать логотип и фирменный стиль компании;
- создать привлекательный и понятный интернет-магазин;
- подчеркнуть безопасность и высокое качество товаров;
- сделать каталог удобным для родителей;
- обеспечить адаптивное отображение сайта на компьютерах, планшетах и мобильных устройствах;
- реализовать проект на платформе UMI.CMS с лицензией Commerce;
- добавить рейтинг товаров с оценкой по пятибалльной шкале;
- интегрировать сайт с Яндекс.Маркетом;
- подключить онлайн-оплату через Robokassa;
- настроить SMS-рассылки и дополнительные сервисы для работы с заказами.
Разработка логотипа и фирменного стиля
На первом этапе мы определили визуальное направление бренда. Заказчик хотел использовать в логотипе образы, связанные с детством, фантазией и игрушками:
- тукана, расположенного рядом с названием или сидящего на букве;
- осьминога, обвивающего буквы щупальцами;
- филина;
- крупную бабочку;
- луну и звезды;
- яркие оранжевые и зеленые оттенки.
Мы подготовили несколько концепций логотипа.
Концепция 1: буквы-игрушки
В первой версии графические элементы объединены с названием компании:
- буква «Д» превращается в машинку;
- буква «Р» — в собаку;
- буква «Е» — в зайчика;
- буква «Т» — в жердочку для попугая.
Дополнительный акцент создает рисованный детский шрифт. Такой вариант напрямую передает игровую атмосферу бренда.
Концепция 2: детские фантазии
Вторая идея построена на образах игрушек, которые появляются в детских мечтах. В облачках можно разместить машинку, медвежонка и другие предметы, связанные с детством.
Концепция 3: облако, луна и звезды
Третья концепция использует универсальные образы детских грез — облако и луну. В качестве дополнительного персонажа можно было добавить игрушечного медвежонка или другой объект.
Также по желанию заказчика мы подготовили вариант с туканом.
Финальная концепция
В качестве основного направления мы выбрали логотип с облаком и луной. Этот образ хорошо передает идею детских фантазий, сна и волшебного мира, а также позволяет использовать фирменную графику в оформлении сайта и рекламных материалов.
Чтобы усилить визуальный эффект, мы разработали дополнительные иллюстрации. На сайте их можно использовать вместе с логотипом и игрушечными фоновыми элементами. В качестве персонажей были рассмотрены, например, утка и кот.
Для логотипа подготовили основные варианты применения:
- полноцветную версию;
- светлую версию для размещения на темном фоне;
- черно-белую версию;
- вариант для печати.
Проектирование сайта
После утверждения логотипа мы приступили к созданию прототипа интернет-магазина. На этапе проектирования мы:
- переработали структуру главной страницы;
- оптимизировали вывод товарных блоков;
- убрали дублирующиеся пункты меню;
- предусмотрели области для иллюстраций;
- продумали размещение преимуществ магазина;
- определили структуру каталога и карточки товара;
- заложили основу для адаптивной версии сайта.
Особое внимание уделили тому, чтобы пользователь сразу понимал:
- товары безопасны для детей;
- ассортимент прошел контроль качества;
- игрушки подобраны с учетом возрастных особенностей;
- оформить заказ можно быстро и без лишних действий.
Дизайн главной страницы
В дизайне главной страницы мы использовали мягкие цвета, облака, иллюстрации и игровые элементы. При этом интерфейс сохранили достаточно спокойным и структурированным, чтобы декоративные детали не мешали поиску товаров.
В шапке сайта облака сделали более натуральными, а в блок преимуществ добавили тематические иконки. Фоновые изображения в карточках товаров убрали, чтобы сделать каталог более аккуратным и улучшить восприятие информации.
Главная страница включает:
- основные категории товаров;
- блок преимуществ магазина;
- подборки и популярные товары;
- информацию о безопасности продукции;
- элементы навигации по каталогу;
- быстрый доступ к корзине и поиску.
Иконки для сайта:
Страница товара
Карточку товара мы спроектировали так, чтобы покупатель мог быстро получить всю необходимую информацию:
- посмотреть фотографии и описание;
- выбрать размер, цвет и другие параметры;
- увидеть возрастные ограничения;
- определить, предназначен ли товар для мальчика или девочки;
- узнать, есть ли у игрушки звуковые функции;
- ознакомиться с рейтингом;
- добавить товар в корзину;
- оформить быстрый заказ.
Также предусмотрели возможность просмотра фотографий товара в увеличенном виде.
Функциональность интернет-магазина
В рамках разработки реализовали основные инструменты для удобной работы с каталогом и заказами.
Каталог и поиск
На сайте настроены:
- фильтрация товаров по различным параметрам;
- подсказки в поисковой строке;
- выбор опционных свойств товара — например, размера и цвета;
- отображение дополнительных характеристик в зависимости от выбранных параметров;
- блок просмотренных товаров, зафиксированный в нижней части экрана.
Корзина и заказ
Для упрощения покупки реализовали:
- быструю корзину, доступную на всех страницах;
- возможность показывать и скрывать содержимое корзины;
- фиксацию корзины в верхней части экрана;
- быстрый заказ выбранного товара;
- отображение выбранных параметров товара;
- интеграцию с платежным сервисом Robokassa.
Рейтинг товаров
Авторизованные пользователи могут оценивать приобретенные товары по пятибалльной шкале с помощью звездочек.
Оценка доступна после покупки, поэтому рейтинг формируется на основе опыта реальных клиентов.
Дополнительные возможности
Также были реализованы:
- вывод иконок характеристик товара;
- адаптивная версия для мобильных устройств и планшетов;
- интеграция с Яндекс.Маркетом;
- подключение SMS-рассылок;
- настройка платформы UMI.CMS с лицензией Commerce.
Также были разработаны рекламные баннеры для сайта с использованием визуальных образов известных брендов и популярных игрушек. Баннеры привлекали внимание пользователей, подчёркивали ассортимент и помогали эффективно продвигать акционные предложения и отдельные товары.
Результат
В результате мы разработали фирменный стиль и интернет-магазин для «Детских грёз» — от создания логотипа и визуальной концепции до адаптивной верстки и интеграции с необходимыми сервисами.
Сайт сочетает эмоциональный дизайн, связанный с миром детских фантазий, и практичную функциональность интернет-магазина. Структура каталога, фильтры, быстрый заказ, рейтинг товаров и информативные карточки помогают родителям быстро выбрать подходящую игрушку и оформить покупку.