Блог. Статья
Июнь 2026
Единство в многообразии:
Дизайн корпоративного сайта для Технониколь
Любой пазл легче собрать если иметь представление об итоговой картинке. Без понимания, что должно получиться, сборка обречена на долгие попытки соединять несоединимое.
А теперь представьте пазл, который нужно собрать в процессе создания сайта для крупного бизнеса с тысячами людей. Этот продукт должен одновременно отражать саму компанию, всю её богатую палитру опыта, направлений и при этом продавать товар самым разным категориям клиентов. Пытаться всё это соединить в единый имиджевый образ, не имея чёткого представления — бессмысленная трата времени ради непредсказуемого результата.
Технониколь искал решение такой сложной головоломки. И нашёл его с теми, кто смог увидеть настоящее единство в его впечатляющем многообразии.
Клиентские масштабы
Технониколь входит в число крупнейших производителей строительных материалов в России и в топ рейтинга РБК. 9500 сотрудников, более 70 заводов в 8 странах и экспорт в 95 государств. Продуктовая линейка огромна: кровельные системы, утеплители, гидроизоляция, фасадные решения, и это далеко не всё. Ядро бизнеса — B2B-сегмент. Но есть и частные клиенты, которые не менее важны.
Любая компания, достигая такого масштаба, сталкивается с одним и тем же парадоксом: чем богаче её содержание, тем сложнее его выразить. Технониколь — не исключение. Живой и по-настоящему сложный организм. Сотни направлений, у каждого своя аудитория, своя логика и своё представление о том, как нужно себя презентовать. Разработка корпоративного сайта для такой компании — это создание монолитного утверждения сразу для миллионов людей.
Взять всё в свои руки
До начала нашего сотрудничества Технониколь уже успела поработать с рядом крупнейших российских digital-агентств, предложивших UX-дизайн, креативный, и продуктовый, но цельного решения, объединяющего все части задачи и отвечающего требованиям компании, достигнуть не удалось.
Технониколь решила сфокусироваться на поиске оригинальных идей, поэтому обратилась к рейтингу креативности Рейтинга Рунета, где в тот момент наше агентство занимало первое место. Мы помогли компании не только с решением креативных задач. Главным преимуществом стал наш опыт работы с масштабными бизнес-процессами. Мы провели глубокий аудит и работу над ошибками, связали воедино разрозненные элементы UX, креативного дизайна и сторителлинга и усилили коммуникативное решение собственными идеями и предложениями. Нам удалось включить дизайн сайта, как единый механизм, действующий для компании целиком, а не пытаться завести его отдельные части — именно такую глубокую системную логику и искали в Технониколь.
Сыграл роль и визуальный уровень. В решениях, предлагаемых компании, не хватало баланса вдохновляющего креатива и выверенного бизнес-стиля — того, что отличает сайт международной корпорации от региональных компаний. Технониколь искал элегантный, эмоционально впечатляющий, но строгий, мирового класса дизайн с вниманием к деталям. И увидел его в наших работах.
Что стоит за дизайном корпоративного сайта для крупного бизнеса
Контекст, в котором мы оказались
Работать с Технониколь означало работать в постоянно подвижном контексте. Десятки направлений внутри компании, у каждого свои приоритеты, своя аудитория, свой товар. Мы проводили встречи большими группами, на которых представители разных отделов высказывали пожелания к сайту. Каждый отдел хотел видеть на главной странице свои продукты. Каждый приходил со своей логикой, и каждая логика по-своему имела смысл.
Параллельно менялся сам бренд. Цвета, стилистика, акценты. То, что было согласовано на старте, переставало быть актуальным через несколько недель. В итоге мы прошли через три итерации дизайн-концепции, каждый раз адаптируясь к новым вводным. Готовых требований нам тоже никто не давал. Были люди, мнения, данные, фокус-группы, внутренние исследования. Из всего этого нужно было собрать понимание задачи самостоятельно.
Как мы с этим работали
Мы шли в департаменты сами. Разговаривали с представителями разных направлений, собирали их видения, сопоставляли с данными о поведении пользователей. Главным было подняться над запросами отдельных отделов и понять, что нужно их клиентам, когда они придут на сайт.
Отдельной задачей стало формирование самого видения. У клиента не было референсов и готовых ориентиров. Внутренние сайты и лендинги компании были сделаны простыми средствами — опираться на них для создания нового было сложно. Поэтому мы взяли этот этап на себя: собирали массивы референсов по блокам и страницам, писали пояснения, презентовали клиенту. Отбирали то, что находило отклик, и уже от этого строили решения. По сути, мы помогли Технониколь увидеть, каким может быть их сайт, до того, как начали его проектировать.
Сначала общая картина, потом решения для конкретных узлов. По формату это напоминало работу спецназа: мы точечно закрывали самые сложные части сайта, те, с которыми у клиента были наибольшие трудности. Главная страница, каталог, навигация, «Где купить». Всё остальное команда Технониколь доделывала самостоятельно.
UX-стратегия: три сценария — одно решение
Главный вопрос стоял так: как люди будут искать продукцию на сайте с сотнями категорий?
Квалифицированный специалист знает, что ему нужно, и ищет по артикулу. Пользователь среднего уровня понимает свою потребность, но далеко не всегда знает точное название, ему нужен поиск по категории или задаче. А новичок может вообще не подозревать, что нужная ему категория существует. Для таких людей мы спроектировали визуальный навигатор. Интерактивный 3D-дом: наводишь на крышу и уходишь в материалы для кровли, наводишь на фасад и попадаешь в фасадные системы, на фундамент — в гидроизоляцию. Пространство, в котором продукт привязан к месту и задаче.
Все три сценария должны были сосуществовать на одной главной, в гармонии друг с другом. Навигатор для новичков, строка поиска для профессионалов, тематические блоки для всех остальных.
Поиск в исходной версии прятался где-то в шапке. Мы вынесли его на главную и расположили как «прослойку» между первыми блоками. Он склеивает два пространства, заметен с первого взгляда, но при этом не нагружает ни один из блоков. К этому решению пришли далеко не сразу, до него поиск просто не существовал как самостоятельный элемент страницы — теперь же имел особое место.
Раздел «Где купить» оказался одним из самых сложных узлов. Десятки тысяч точек продаж по всему миру, множество фильтров. Мы упаковали всё в один экран: справа карта или список, слева фильтры. Отрисовали десятки состояний, продумали сценарии. После реализации клиентом провели собственное тестирование, искали проблемы, дорабатывали. Внутри этого раздела содержится огромное количество функционала, но при этом всё подано просто и лаконично.
Аналитический отчёт по навигации мы подготовили по собственной инициативе. Увидели меню, спроектированное другой компанией, описали проблемы и предложили улучшения. Меню это точка, в которой сходится вся структура сайта, и оставить его без внимания значило бы проигнорировать связь между всеми частями продукта.
Лаконичность масштабных решений
Задача от клиента звучала так: сайт должен ощущаться как крупный международный бренд. Надёжный, ценный, способный конкурировать с лидирующими западными производителями. Поэтому мы добавляли графику и иллюстрации, чтобы за функциональностью чувствовался масштаб. Тональность получилась международной, сдержанной, уверенной, и при этом с характером, который сразу узнаёшь.
Всё началось с одного решения, из которого выросло остальное. Мы взяли рубленые, угловатые формы логотипа Технониколь и превратили их в сквозной визуальный приём. Характерный скос появляется в кнопках, как срезанный угол. В плашках, как диагональная отсечка. В стрелках, иконках, разделителях блоков. Листаешь сайт и чувствуешь один и тот же ритм: резкий, точный, узнаваемый. Около пятисот уникальных иконок мы нарисовали в этой стилистике. Рубленые, как сам логотип. Клиенту они так понравились, что используются за пределами сайта.
К финальной дизайн-концепции мы пришли через три итерации. Первая была в фирменных красных цветах. Тёмные поля, крупная типографика, 3D-иллюстрации продукции, яркие акценты. Современная, брутальная, с выраженным промо-характером. Клиент не согласовал: красный убирали из бренда, да и в целом подход показался слишком радикальным. Вторая строилась на паттернах, геометрических фигурах, рифмующихся с логотипом. Формы повторялись в фонах, в разделителях, в декоративных элементах. Богатый, узнаваемый язык. Тоже не прошла, хотя визуально была очень сильной. Третья стала финальной.
Мы хотим показать все три. Каждая концепция — самостоятельное решение и одновременно этап поиска. Во всех трёх мы искали одно: визуальный принцип, достаточно сильный, чтобы удержать целостность на масштабе сайта с сотнями страниц.
Имиджевые разделы стоят особняком. Для страницы «О компании» мы сделали постерные композиции на первом экране, крупные фотографии людей, тёплый и дружелюбный тон. Идея была в том, чтобы показать живых сотрудников, лица, которым доверяешь. В макетах пока стоки, с расчётом на замену реальными съёмками.
«Технониколь в лицах» — раздел о руководстве, такой же имиджевый и человечный.
В дизайн мы закладывали слой интерактива. Слайдеры, раскрывающиеся по наведению, анимации переходов между блоками, интерактивный глобус на WebGL: крути и смотри, где работает Технониколь. Часть из этого клиент реализовал в упрощённом виде, глобус заменили на статичный рендер, анимации срезали. Но дизайн-система это допускает, фундамент заложен так, что интерактивный слой можно достроить в любой момент.
Богатство кроется в деталях
Каталог это ядро сайта. Сюда приходит большинство пользователей, здесь они проводят основную часть времени. При всей визуальной сдержанности это одна из самых важных страниц проекта.
Продуктовая страница — полноценный лендинг. Открываешь её, и перед тобой описание, технические схемы, сравнение с аналогами, рекомендации, галерея реализованных объектов, отзывы. Скроллишь вниз, и информация раскрывается слой за слоем, как в хорошо выстроенной презентации. Фирменные скосы и рубленые формы здесь тоже есть, но работают незаметно, организуя пространство.
За кадром осталась работа, которую редко видно. Мы прописали гайдлайны по подбору изображений для тысяч страниц каталога. Какие фото использовать, как кадрировать, где размещать ключевые объекты на снимке, какие области оставлять свободными для текста. Когда контент наполняют десятки людей из разных отделов, только жёсткая система правил удерживает визуальный язык от распада.
За этим стояла и практическая проблема. В концепции стоят выверенные, идеальные снимки. Но когда начинается наполнение, клиент присылает то, что есть: заводскую съёмку, фото продукции на складе, кадры без композиции. Разрыв между концепцией и реальным контентом способен убить любой дизайн. Именно поэтому гайдлайны были не рекомендацией, а необходимостью — жёстким каркасом, который удерживает визуальный уровень сайта независимо от того, кто и какие фотографии загружает.
«Школа мастерства» — ещё один раздел, который мы оформили. Темы, группировки, обучающие материалы. По насыщенности это фактически отдельный сайт внутри сайта. И даже здесь тот же визуальный характер, те же формы. Деталь из того же пазла.
Результат: от креативного подрядчика к стратегическому партнёру
Мы пришли в этот проект как агентство, известное богатым портфолио креативных решений. А вышли с крупным кейсом корпоративного сайта, который показал нашу настоящую силу: способ мышления. Вместо фокуса на фрагментарные решения, следования шаблонам и «стилям», мы увидели целое: компанию как систему, её аудитории, её логику, её масштаб, и предложили дизайн, который работает на всех уровнях.
Сайт для Технониколь показал, что наш подход не зависит от направления бизнеса. Он эффективен и применим везде, где требуется глубокое понимание сути и создание связей между сложным и масштабным.
