Цели проекта
- Запустить современный онлайн-каталог медицинских и косметологических расходников.
Сложная и визуально непривлекательная ниша
но европейское качество товаров от петербургского производителя
«Медикосм» — российский производитель расходных материалов для врачей и косметологов, более 20 лет присутствующий на рынке и сотрудничающий с мировыми производителями.
Анализ ниши показал, что сайты всех российских компаний морально устарели, в то время как западные конкуренты продолжают держать высокую планку по нескольким фронтам.
Какое решение? Использовать в дизайне все современные тренды:
- свободное пространство («воздух»), легкость;
- большие яркие блоки, хорошо читабельные шрифты;
- вывод информации поблочно: 1 экран — 1 смысл;
- отказ от вывода каталога товаров в классическом варианте.
Было решено отказаться от стандартного варианта слайдера на всю ширину экрана, тк в перспективе это бы осложняло клиенту работу с контентом — проблемы в подборе эстетически приятных фотографий.
Выводим только самое важное:
- ниши, где может потребоваться продукция компании;
- навигация по каталогу;
- преимущества в цифрах, показывающие масштаб производства.
Блочное расположение информации
позволило грамотно расставить акценты
Все расположение информации опиралось на 12-колончатую модульной сетку. Фактически «цветные» блоки не висели в воздухе оторвано друг от друга, а были привязаны к направляющим линиям
Каталог был построен по аналогичной схеме. По умолчанию все картинки разделов выводились в монохроме и становились цветными при наведении курсора, что позволило «оживить» страницу.
Посадочная страница с товаром
должна быть подана максимально информативно и «вкусно»
Нельзя сухо дать перечень характеристик и вывести мелкую картинку, тк товар сам по себе малопривлекателен. Нужно создать желание купить и именно у «Медикосм»! В этот раз был использован подход премиум-брендов одежды: большое яркое фото и емкой описание с преимуществами на одном экране.
А во втором экране, чуть ниже, шла техническая информация, документы для скачивания и торговые предложения.
Отдельное цветовое решение
всей страницы под торговую марку BENOVY
При этом полностью изменилась только цветовая гамма, сама же структура страницы осталась прежнему, по аналогии с другими разделами.
Корзина и оформление заказа
были максимально простыми
Основная задача проекта — показать каталог и получить заявки, но не вести полноценную продажу и историей покупок и синхронизацией остатков.
Благодаря модульной сетке адаптация под мобильные делается быстро, при этом не нарушаются правила перестроения блоков при верстке.
