Сайт для Lucent: перешли на светлую сторону вместе с брендом светового оборудования

Lucent — бренд светового оборудования, который только выходит на рынок. Компания работает в B2B: поставляет светодиодные ленты и другое оснащение оптовикам. На старте у Lucent был брендинг и слоган, а за сайтом клиент обратился в AVA Digital.

Сайт должен был объединить эффектную презентацию компании с удобным и интуитивно понятным каталогом.

Чтобы создать сайт компании, мы сфокусировались на трех вещах:

— навигация и каталог сайта;

— визуальная концепция, раскрывающая идею бренда;

— интерактив, который притягивает взгляд, но не отвлекает от товаров.

Работу провели в три этапа:

1. Разработали структуру и каталог, продумали логику, которая приводит посетителя в главный раздел сайта с товарами.

2. В дизайне воплотили слоган компании и сделали акцент на световые решения. 

3. Добавили анимации и микровзаимодействия: подняли вовлеченность благодаря эффектам свечения по скроллу и ховерам.

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

Важно было совместить подробные технические характеристики товаров с минимализмом дизайна. Мы продумали состав карточек и многоуровневую фильтрацию, чтобы посетитель быстро находил нужный товар. Также заложили возможность будущего расширения ассортимента и объема категорий.

Сайт создавался на Битриксе, что для нас нетипично. Это усложнило разработку, но дало клиенту возможность интеграции с 1С, которую предоставляет платформа.

В визуальной концепции развили идею, заложенную в слогане бренда: «На светлой стороне». На главном экране — логотип, мерцающий на темном фоне. При скролле посетитель буквально попадает «на светлую сторону» — экран заливается светом. Так дизайн воплощает философию бренда с первого касания.

Палитра — сдержанные оттенки с яркими неоновыми акцентами, отсылающими к светодиодным лентам. Карточки каталога и информационные блоки объединены единой визуальной системой. Четкие линии, аккуратная типографика и световые решения подчеркивают качество продукта.

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

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

Прокрутку страницы сопровождает лента, которая заливается неоновым светом при скролле. Lottie-анимации и эффекты свечения, разработанные в After Effects, поддерживают единый визуальный язык сайта.

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

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

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

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