Глубина за счёт наслаивающихся блоков
Чтобы компенсировать ограничение по цвету, страница построена на наслаивающихся друг на друга блоках — секции визуально перекрывают соседние, создавая глубину и движение там, где обычно за это отвечал бы цвет.
Дизайн · UI/UX
Лендинг для IT-агентства
Адаптивный лендинг в строгой чёрно-белой палитре — без единого цветного акцента, с глубиной за счёт наслаивающихся блоков и графичных 3D-элементов.
Задача
Разработать лендинг для IT-агентства, занимающегося цифровизацией производства.
Что нужно было решить
По требованию заказчика в дизайне нельзя было использовать ничего, кроме чёрного и белого — без единого цветного акцента.
Задача усложнялась тем, что монохромная палитра легко скатывается в монотонность: без цвета сложнее визуально разделить блоки и удержать внимание на длинной странице.
Реализация
Типографика и 3D-элементы держат внимание
Контраст и внимание держат крупная типографика в hero-блоке и графичные металлические 3D-элементы, которые проходят через несколько секций.
Адаптив под три брейкпоинта
Сайт свёрстан адаптивно под десктоп (1920), планшет (1200) и мобильную версию — с сохранением той же логики слоёв на каждом из них.
Живой отклик через модальные окна
Отдельно проработаны модальные окна — подтверждение об успешной отправке формы и приглашение созвониться — чтобы у пользователя было ощущение живого отклика на каждое действие, а не просто отправленной в никуда формы.
Дизайн целиком
Строгая чёрно-белая палитра с сохранённой глубиной и вниманием к деталям — на десктопе (1920) и в мобильной версии с той же логикой слоёв. Прокрутите макеты внутри окон.
— десктоп 1920
— мобильная
Результат
Готовый адаптивный дизайн лендинга в строгой чёрно-белой палитре — с сохранённой глубиной и вниманием к деталям, несмотря на цветовое ограничение.
Дизайн выполнен дизайнером команды Парсли