Сцена: «Сделайте как у Stripe»
Владелец говорит: «Хочу сайт как у Stripe — минималистично, дорого, понятно». Дизайнер слышит: «Нужен визуал в стиле Stripe». Через три недели вы получаете чистый макет с градиентами и шрифтом Inter. Красиво. Только посетитель не чувствует «здесь решают мою задачу». Он видит обёртку без содержания — и уходит.
Stripe построил свой дизайн не вокруг эстетики, а вокруг конкретного посетителя: разработчика, который ищет инструмент для приёма платежей. Каждая деталь говорит: «Ты справишься за пять минут, без бюрократии». Это решение приняли до первого пикселя. Когда вы просите «как у Stripe», вы просите результат их стратегии, но не повторяете их процесс. Чтобы получить такой же эффект, нужно задать те же вопросы, что задали они.
Это и есть работа до Figma: не утверждение шрифтов и цвета, а определение трёх вещей.
Три вопроса, которые дизайнер должен закрыть до первого экрана
Любой сайт — это разговор с посетителем. Если вы не знаете, с кем говорите и что хотите услышать в ответ, разговор не случится. До того как открыть Figma, дизайнер фиксирует:
- Кто приходит на страницу. Не «широкая аудитория предпринимателей», а конкретный человек с задачей: финансовый директор, которого достали ручные платежи, или владелец интернет-магазина, потерявший заявку из-за сбоя в оплате.
- Что он должен почувствовать в первые секунды. Не «доверие» абстрактно, а чёткий сигнал: «Я попал по адресу, здесь решают именно мою проблему». Это чувство строит первый экран, а не логотип и цвета.
- Какое действие вы от него ждёте сейчас. Оставить заявку, начать тестовую интеграцию, заказать демо. Без конкретного действия макет превращается в галерею картинок.
Дизайнер не угадывает эти ответы. Он вытаскивает их из владельца бизнеса, из цифр, из разговоров с клиентами. Если владелец пожимает плечами: «Ну, всем, кто платит», — вы уже согласились на переделки. Потому что макет, сделанный для всех, не работает ни для кого.
Кейс: как TinyPilot превратил $7 000 в $46 000
В 2022 году Майкл Линч, основатель TinyPilot, заказал редизайн трёх страниц своего интернет-магазина. Бюджет: $5 000–7 000, срок: 4 недели. Закончил он через 8 месяцев и $46 000.
Срыв случился не потому, что агентство плохо рисовало. Проблема была в том, что до старта никто не зафиксировал, какой именно результат нужен бизнесу. Бриф звучал как «сделайте красиво и современно». Агентство интерпретировало «красиво» как визуальный редизайн, бизнес ожидал роста продаж. Стороны расходились в критериях успеха, потому что не договорились о них до начала работы.
Каждая итерация макетов вызывала вопросы: «Почему здесь эта кнопка?», «Почему текст такой длины?». Агентство отвечало: «Это современный UX-паттерн». Линч отвечал: «Мне не нужен паттерн, мне нужны покупки». Спор о вкусах заменил спор о бизнес-задаче. Будь задачей «увеличить конверсию в покупку» с чёткими метриками на этапе до Figma, макеты оценивались бы иначе.
Итог: после 8 месяцев редизайн всё-таки принёс +66% продаж. Но цена вопроса — х7 к бюджету и х20 к срокам — была обусловлена именно провалом на этапе до первого макета.
Что владелец говорит — и что на самом деле нужно
Почти каждый проект начинается с одной из этих фраз. Вот что за ними стоит — и как переформулировать задачу до встречи с дизайнером.
| Что владелец говорит | Что дизайнер слышит | Что нужно было сказать |
|---|---|---|
| «Сделайте как у конкурента Х» | «Скопируйте визуал Х» | «У конкурента Х посетитель сразу понимает, что это решение для бухгалтеров. Нам нужно добиться того же эффекта для нашей аудитории — распознавания за 2 секунды» |
| «Сайт должен выглядеть дорого» | «Использовать премиум-шрифты и тени» | «Дорого — значит, посетитель не сомневается, что мы решим его задачу с деньгами. Покажите кейсы и гарантии на первом экране» |
| «Мне нужен современный дизайн» | «Трендовые сетки и градиенты» | «Современный — значит, не отвлекает от действия. Посетитель не замечает дизайн, а проходит путь: понял → захотел → оставил заявку» |
Если вы передаёте левую колонку, вы отдаёте дизайнеру задачу на визуал. А вам нужна задача на эффект. Переформулировка занимает 30 минут — и экономит месяцы.
Когда этого разговора не случилось, посетитель мгновенно считывает пустоту. Именно тогда срабатывает механизм, описанный в статье «Шаблонный сайт компании: когда это видно клиенту»: клиент распознаёт шаблон за 50 мс и уходит. Внешне макет может быть кастомным, но по сути он шаблонный, потому что не отвечает на главный вопрос: «Почему я должен остаться?»
До макета: цифры, которые подтверждают подход
Решение до Figma — не теория. В практике brezatech оно напрямую влияет на бизнес-метрики.
Для сервиса ЛИИС мы спроектировали сценарий, где посетитель за 5 секунд понимал: «Здесь я получу освобождение от поверки приборов учёта». Макет лишь оформил эту мысль. Результат: +293% конверсии в заявку, стоимость лида снизилась в 7 раз. Подробнее — в кейсе ЛИИС.
Для NF Group (бывш. Knight Frank) задача стояла иначе: посетитель элитной недвижимости должен ощутить не продажу, а приватный диалог. Сценарий, построенный до первого экрана, привёл к росту конверсии на 133% (NF Group). Оба проекта объединяет одно: макет стал только визуализацией уже принятых решений о посетителе и его пути.
Как проверить: готов ли ваш проект к старту
Не нужно ждать встречи с дизайнером. Задайте себе один вопрос: можете ли вы описать, что именно должно произойти в голове посетителя на первом экране, — не словами «понравится» или «будет красиво», а конкретным действием или ощущением? Если ответ расплывчатый, до Figma вам нужен не дизайнер, а структура разговора.
Этот разговор — не абстрактная «стратегия». Это документ, с которым вы идёте к дизайнеру: кто ваш посетитель, какое чувство вы у него вызываете, к какому действию ведёте. Без него вы рискуете повторить путь TinyPilot: платить за переделки вместо того, чтобы платить за результат.
Мы в brezatech начинаем каждый проект именно с этого этапа — /attention. Там мы не рисуем, а фиксируем, как сайт будет превращать внимание в интерес и действие. Процесс не растягивается на месяцы, но защищает бюджет от бесконечных итераций «подвиньте кнопку левее». Потому что кнопка работает не сама по себе — она работает только внутри правильного сценария.
Ключевые факты
- TinyPilot: бюджет $7 000 → фактические затраты $46 000, срок 4 недели → 8 месяцев из-за отсутствия согласованного результата до старта.
- Apple: 5–10% конверсия в покупателя (оценка Raw Studio) — результат дизайн-системы, построенной до первого экрана.
- ЛИИС: +293% конверсии, −7× стоимость лида — эффект от сценария, спроектированного до макета.
- NF Group: +133% конверсии после внедрения сценария до открытия Figma.
Частые вопросы
- Почему нельзя просто сделать красиво, как у конкурентов?
- Потому что посетитель чувствует не «красиво», а «я на правильном месте» или «это не для меня». Без решения, кому и зачем, красота вызывает подозрение.
- Сколько времени должно занимать проектирование до Figma?
- От нескольких дней до двух недель, в зависимости от сложности. Каждый день, потраченный здесь, экономит недели переделок.
- Как понять, что дизайнер действительно готов открыть Figma?
- Вы видите не макет, а документ: кто ваш посетитель, что он должен подумать на каждом экране, какое целевое действие. Макет — лишь воплощение этого.
- Что теряет бизнес, если пропустить этот этап?
- Теряет время, бюджет и заявки. TinyPilot потерял $39 000 и 7 месяцев; другие теряют клиентов, которые уходят с сайта, не поняв, зачем им здесь быть.
О brezatech
brezatech делает сайты, которые превращают внимание в интерес и действие, и внедряет ИИ в бизнес-процессы. ИИ-агент продаж 24/7 →