Сайт бренда URSA

URSA — крупный бренд со своим узнаваемым фирменным стилем, поэтому сайт должен быть не просто красивым и современным, но еще и узнаваемым. В современной ситуации многие специалисты привыкли разделять стили для онлайн и офлайн, упуская детали и теряя узнаваемость бренда. Было принято решение реализовать максимум стилеобразующих элементов из бренд-гайдлайна компании.

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

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

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

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

В процессе работы над сайтом, с помощью html и css, было воссоздано довольно много стилеобразующих элементов, например:

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

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

СТРАНИЦА ПРОДУКТА

Сайт является больше информационным, тем не менее нельзя забывать о конверсии. Поэтому страница продукта была поделена на 2 части — «шахту» и контент. Так продукт и кнопка находятся на экране максимальное количество времени. Кроме того, функция реализована так, что сохранилась поддержка максимального количества браузеров, в т.ч. и устаревшего IE 11.

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