Meandre
Редизайн сайта архитектурного бюро

О студии
Meandre — архитектурная студия полного цикла, основана в Москве в 2011 году. За 14 лет работы — больше 200 реализованных объектов и клиенты вроде Avito, Bloomberg, DHL, Samsung, Google, H&M. Студия проектирует офисы, пространства общепита и жилые интерьеры. Главная особенность: архитекторы и инженеры работают как единая команда. Клиент не ищет двух подрядчиков — он работает с одним.


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


Отправная точка
Начали с детального технического задания — зафиксировали УТП, аудиторию, визуальные ориентиры, конкурентов. Детальное ТЗ в начале работы экономит правки в конце. Два созвона с заказчиком — и направление стало понятным. Провели конкурентный анализ трёх студий со схожим профилем: это сразу показало, где есть возможности выделиться, а где достаточно сделать просто хорошо.



Метафора проекта
Meandre — не только про красивые интерьеры. Студия самостоятельно ведёт инженерные разделы, без сторонних подрядчиков. Это редкость на рынке, и об этом важно было говорить не словами, а формой. Технические шрифты, архитектурные линии, элементы вёрстки с отсылкой к чертежам. Сайт должен считываться как точный рабочий инструмент — и одновременно оставаться понятным для заказчика, который впервые ищет студию для проектирования офиса.


Страница проектов
Работу начали именно с этой страницы. Нужно было решить две задачи одновременно: показать избранные проекты крупно и выразительно, и открыть доступ к полному архиву из 200+ объектов. Архивные работы без отдельной страницы отображаются как карточки: площадь, тип помещения, год. Фильтрация по категориям реализована так, что одинаково удобно работает и на большом экране, и на телефоне.


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


Блог
У студии большой архив статей с собственной графикой, накопленной за годы. Задача — вписать этот разнородный контент в новую стилистику без потерь. Страница блога получила фильтрацию по темам, время чтения и счётчик просмотров. Страница самой статьи разработана отдельно: строчный шрифт 17px, выверенные межстрочные расстояния, логика отступов между заголовками и изображениями.


Студия и люди
Раздел «Студия» — семь внутренних страниц: о студии, меморандум, команда, клиенты, упоминания, вакансии и раздел для прессы. Каждая держится в общей стилистике, но использует свой визуальный приём — пользователь не скучает, но не теряется. Контент намеренно вёрстан в узкой колонке: легче читать, быстрее найти нужное.



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


Дизайн-система
Проект потребовал полноценной дизайн-системы. Система цветов, система шрифтов, иконки, базовые компоненты — кнопки, поля форм, составные блоки, модули, попапы. Отдельно выстроена система отступов Spacing: каждое значение берётся из единой шкалы, ни одного произвольного расстояния. Это сокращает время разработки и делает код чище — разработчик работает с системой, а не расшифровывает макеты.

Итог
25 уникальных страниц, две цветовые темы, авторский контроль Pixel Perfect на финальном этапе. Готовые HTML/CSS/JS файлы переданы backend-разработчику для интеграции в собственную CMS на Django. Отдельная благодарность основателю бюро Андрею Гаврилову. Человек, который понимает: творческий процесс иногда живёт по своему расписанию и требует времени. Работать с такими людьми — редкость.

