Платформа
Для разработки мы выбрали платформу Tilda, позволяющую разработать маркетинговый сайт быстро, гибко, удобно для дальнейшего самостоятельного редактирования клиентом — и с небольшими затратами.
Объём сайта: 5 основных разделовРазработка сайта для «ЗаказТехСтрой»
Разработка сайта на Tilda
ztstroy.ru
B2B строительство
Ксения Павлова и Сергей Васильев
Дизайнер и Менеджер it-проектов CoffeeStudio
06.08.2026
Исходные данные
Наш клиент — ООО «ЗаказТехСтрой», компания из Пскова, которая предоставляет услуги технического заказчика в строительстве. Они берут на себя всю «головную боль» застройщика. Согласования, разрешения, контроль качества, приёмку объекта, работу с подрядчиками и проектировщиками. Клиент занимается своим делом — они следят, чтобы стройка шла по нормам, в срок и без сюрпризов.
К нам пришли с типичной болью: компании нужен был сайт, но для него не было ни брендбука, ни подготовленного контента, ни плана, каким этот сайт должен быть.
Задача
Сделать многостраничный сайт, который:
- понятно объясняет, чем вообще занимается технический заказчик
- показывает реальные проекты компании;
- аккуратно ведёт посетителя к заявке.
Аудитория здесь непростая: это застройщики, инвесторы, руководители компаний. Люди, которые доверяют не ярким слоганам, а конкретике и порядку. Сайт должен был выглядеть солидно, по-инженерному чётко и без лишней «воды».
Условия
Объём разработки
На старте у нас была небольшая презентация компании, список услуг и список реализованных проектов. Требовалось превратить сухой корпоративный материал в понятную и удобную для восприятия структуру.
Материалы
Фирменного стиля у компании не было, только логотип, использовавшийся в деловой коммуникации, который клиент попросил сохранить.
Что мы сделали, чтобы добиться результата
[1]
Погружение в нишу
и проектирование
Детально изучили каждый регламент услуг. Перепаковали сложный канцелярский язык в понятные клиенту выгоды. Выстроили последовательную логическую цепочку: кто мы → что конкретно делаем → проекты → контакты.
[2]
Концепция и подбор стилистики
Сформировали мудборд из строгих инженерных паттернов. Подготовили 3 альтернативных дизайн-направления. Клиент лично оценил живой интерактивный прототип и выбрал концепт с жёсткой сеткой.
[3]
Тексты и помощь нейросетей
Совместно с ИИ переписали скучные технические регламенты в чёткие списки. Сгенерировали технические плейсхолдеры для первых экранов: чертежи, инженеры на реальных объектах, атмосферные строительные узлы.
Если у бизнеса нет брендбука, контента и готового ТЗ, мы поможем собрать всё в рабочую систему: от смысла и структуры до дизайна, текстов, изображений и запуска сайта.
Дизайн
Из трёх предложенных направлений клиент выбрал второй вариант — и именно на его основе мы разработали дизайн всего сайта.
Шрифт: Inter — нейтральный, современный гротеск, который отлично читается и в заголовках, и в мелком тексте.
Inter
Regular
SemiBold
Bold
Цветовую палитру построили на сочетании глубокого тёмно-синего цвета и оранжевых акцентов с набором нескольких дополнительных оттенков. Эта палитра держит баланс: тёмно-синий и серые тона дают солидность, а оранжевый оживляет и ведёт взгляд к нужным действиям.
Отдельное пожелание заказчика: никаких скруглений. Все элементы — кнопки, карточки, блоки — сделали с чёткими острыми углами. Чтобы они не выглядели слишком утилитарно, мы подкрепили их скобами, линиями и рамками — как в чертежах и технической документации. Получился цельный визуальный язык, который считывается интуитивно: твёрдость, уверенность, профессионализм. Ровно те качества, которые клиент хочет видеть в техническом заказчике.
Что получилось в итоге:
- «Инженерная» эстетика. Острые углы, чёткие рамки, нумерация блоков в квадратных скобках [1] [2] [3] — как в технической документации. Это тонко намекает: здесь всё под контролем и по порядку.
- Сдержанная палитра. Тёмно-синий как база доверия и надёжности + оранжевый акцент для действий и кнопок. Ничего лишнего, всё работает на солидность.
- Первый экран, который сразу объясняет суть. Крупное фото инженеров на объекте + понятный заголовок «Предоставляем услуги технического заказчика в строительстве». Посетитель за 3 секунды понимает, куда попал.
Итог: сайт выглядит строго, но не скучно. Деловито, но современно. Именно так, как должен выглядеть надёжный подрядчик.
С какими трудностями столкнулись
История с логотипом
Брендбука у компании не было, был лишь «самодельный» логотип. Поскольку именно он зачастую определяет ключевые паттерны фирменного стиля, сначала клиент попросил предложить другие варианты эмблемы, но в результате решил оставить имеющийся.
Баланс между строгостью и «живостью»
Ниша обязывает к деловому тону, но сайт не должен усыплять. Мы нашли золотую середину: строгая сетка + акцентные элементы и живые фото объектов.
Какой результат смогли достичь
Собственный сайт на Tilda, который клиент может редактировать сам, без разработчиков. 5 основных + 2 технических страницы — полноценный сайт, презентующий все аспекты деятельности компании.
Понятная упаковка сложной услуги — теперь посетитель за минуту понимает, чем занимается компания и зачем она ему нужна.
Главный результат — у молодой компании появилось цифровое лицо, которое соответствует уровню её проектов. Теперь есть куда привести потенциального заказчика и что ему показать.
Выводы
Хороший сайт для B2B-ниши — это не про «покрасивее». Это про доверие, понятность и порядок. Именно на этих трёх китах мы и построили проект для «ЗаказТехСтрой»: перевели сложную услугу на человеческий язык, оформили всё в чёткой инженерной эстетике и собрали убедительное портфолио.
