Про проект
Мы — агентство «Кожаные мешки»: небольшое ателье автоматизации и ИИ-продуктов. Сайт сразу должен был передавать наш характер — меньше бюрократии, больше смысла и экспериментов.
Задача
Нужно было запустить первую русскоязычную версию сайта, которая:
- помогает людям быстро сложить впечатление о нас и нашем подходе;
- показывает реальные кейсы и объясняет, чем мы полезны;
- работает как элемент воронки: форма + быстрые каналы связи;
- живёт в GitHub и легко обновляется ассистентами (мы строим AI-first агентство);
- визуально целостна, даже если собирается за неделю.
От идеи до первой публикации было всего семь дней. Корневой репозиторий был пуст, дизайн-гайд отсутствовал, иллюстраций не было вовсе.
Решение
1. Исследование и анализ
- Провели короткий воркшоп внутри команды, чтобы зафиксировать позиционирование («ателье ИИ»), ключевые тезисы и тон коммуникации.
- Пересмотрели 12 лендингов автоматизационных студий, отметили типичные проблемы (скучные хиро-блоки, перегруженные формы, общее ощущение «Сберконсалт»).
- Составили карту будущего контента: ценности, команда, первые кейсы, форма заявки. Заодно раскопали существующие презентации и тексты, чтобы не писать всё с нуля.
2. Реализация
- Завели проект на Astro 4 и Tailwind — стэк, который позволяет быстро собирать статический сайт и держать производительность под контролем.
- Настроили компонентную сетку: отдельный лэйаут для кейсов, карточки-компоненты для ценностей, команды и портфолио. Это упростило дальнейшее масштабирование.
- Сгенерировали визуальный набор через нейросеть (Midjourney + ручная правка в Photoshop): иллюстрацию хиро, обложки кейсов и кадры команды. На выходе получили единый стиль с «космическим» градиентом и гранёными формами.
- Подключили Web3Forms как форму обратной связи, чтобы получать лиды сразу в почту без собственного бэкенда.
- Добавили ссылки на Telegram, чтобы люди могли быстро выйти на контакт.
- Написали небольшой скрипт, который при каждой загрузке случайно меняет порядок карточек основателей — нас двое, мы долго спорили, кто будет первым, поэтому решили, что пусть побеждает дружба и генератор случайных чисел.
3. Оптимизация
- Срезали лишний CSS и проставили lazy loading для медиаматериалов, чтобы Lighthouse держался на 95+ без дополнительной оптимизации.
- Добавили пост-билд скрипт, который прогоняет HTML через типографку: тире, кавычки, дефисы. Это уберегло нас от ручной правки текстов.
- Настроили GitHub Actions с rsync на наш сервер: сайт живёт как статические файлы в GitHub, поэтому ассистенты и AI-инструменты могут обновлять его без лишней ручной рутины. Деплой занимает ~90 секунд после пуша в
main, включая проверку здоровья через curl.
Результаты
- MVP сайта готов за 7 дней: от первой строки кода до продакшн-деплоя.
- 3 иллюстрации и набор фонов, собранных через нейросеть, вошли в постоянный бренд-пак команды.
- Автодеплой гарантирует, что любая правка в контенте появляется на сайте за полторы минуты без участия DevOps.
- Сайт получает стабильные показатели: 97/100 по Lighthouse Performance и 100/100 по Accessibility на десктопе.
Что дальше
- Продолжить пополнять раздел кейсов — готовятся материалы по внедрению CRM и построению AI-агентов.
- Подключить полноценную аналитику и A/B-тесты CTA, чтобы улучшать конверсию.
