Блог

Босс прислал ссылку конкурента. Что дальше?

Когда ваш нетехнический босс просит скопировать страницу конкурента, не спорьте — переосмыслите задачу. Этот гайд покажет, как отстоять более понятную страницу с одним CTA и выиграть внутреннее согласование.

Краткое содержание

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

Что ответить, когда босс отправляет вам лендинг конкурента с пометкой «наш должен выглядеть так»? Вы в отделе маркетинга из трёх человек. У вас нет бюджета на дизайн. У вас есть продукт, который нужно продавать, дата запуска и босс, который не отличает шрифт от заголовка. И сейчас этот босс указывает на страницу, которая действительно выглядит хорошо — так что самый простой и безопасный путь — кивнуть, скопировать структуру и подставить свой текст. Но безопасный путь обычно приводит к тому, что страницу игнорируют.

Совещание в пятницу. У вас есть четыре дня, чтобы показать боссу, почему другой подход лучше, не превращая обсуждение в ссору. Вот план, которому можно следовать от начала до конца.

Читайте письмо, а не ссылку

Ссылка — это требование, замаскированное под URL. Прежде чем открывать вкладку браузера, прочитайте примечание к ней. Босс просит похожий внешний вид? Похожий порядок секций? Похожую обработку логотипа? Это разные запросы. В большинстве случаев в примечании написано «сделайте наш таким же», а на самом деле означает «сделайте наш таким же надёжным». Страница, на которую вы смотрите, важна только потому, что даёт боссу ощущение легитимности. Так что ваша настоящая задача — не воспроизвести страницу, а создать то же ощущение с помощью собственных аргументов.

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

Прежде чем что-либо открывать, ответьте на один вопрос: что должна делать эта страница? Не «выглядеть как современный SaaS», а что посетитель должен подумать, почувствовать и на что нажать в ближайшие шестьдесят секунд? Запишите это до того, как смотреть на что-либо. Если вы не можете этого сделать, вы создаёте постер, а не страницу.

Типичный соблазн — воспринимать страницу конкурента как список покупок: крупный заголовок, сетка возможностей в три колонки, виджет чата, ссылка на цены, логотипы клиентов. Но самый устойчивый паттерн в дизайне SaaS проще. Снова и снова конвертирующие страницы — это те, которые не пытаются делать шесть дел одновременно. Они ставят ясность выше оригинальности: лаконичный заголовок, краткое описание, один очевидный следующий шаг. Это не секрет, но это удивительно трудно защищать в компании, которая постоянно просит «ещё».

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

Эта таблица предназначена для момента, когда страница проходит внутреннее согласование, потому что каждая строка — это вопрос, который кто-то задаст. Ответ на каждый — не «так выглядит современный SaaS». Ответ — что посетителю нужно сделать дальше.

Напишите предложение, которое спасёт вас от редизайна

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

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

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

Это также паттерн, который вы узнаете на самых популярных главных страницах SaaS. Слоган Calendly звучит просто: «назначайте встречи без переписки по email». Никаких упоминаний алгоритмов, никакого «революционного планирования». Он называет результат, который нужен конкретному человеку. У вашего продукта есть такое же предложение; просто вы его ещё не написали.

Будьте готовы к сопротивлению. Босс скажет, что новый заголовок «слишком простой» или «не звучит как настоящая технологическая компания». Эта реакция связана с идентичностью, а не с ясностью. Ваши коллеги читают презентацию продукта каждый день; простое предложение звучит для них слишком просто именно потому, что они уже знают, что делает продукт. Посетитель — нет. Защищайте предложение, опираясь на это различие. Если босс говорит: «Мы также работаем с ресторанами, а не только с розничными магазинами», это на самом деле хорошая новость: предложение может называть категорию более широко, сохраняя при этом результат. Чего вы не можете позволить — так это заголовка, который ничего не описывает.

Одно действие на экран

Посмотрите на самые уважаемые главные страницы SaaS, и вы заметите привычку: они выбирают один следующий шаг и заставляют всё остальное уступать ему дорогу. Notion, ориентир в обзорах лендингов, стремится к одному призыву к действию, например «Получить Notion бесплатно». Эта одна кнопка сообщает, что произойдёт при клике; она не заставляет выбирать между «Начать триал», «Посмотреть цены», «Запросить демо» и «Поговорить с отделом продаж».

Ваша страница, скорее всего, ведёт себя именно так. На первом экране две или три кнопки, в навигационной панели ссылки на цены, блог, поддержку и вакансии, а поверх всего плавает виджет чата. Каждое дополнение — небольшой налог на внимание посетителя. Он пришёл за одной задачей. Каждая ссылка — возможность отказаться от неё.

Решение не в том, чтобы раздеть сайт догола. Нужно определить, какое основное действие будет на этой странице — начать триал, забронировать демо или совершить покупку — и сделать так, чтобы только оно выглядело как кнопка на первом экране. Второстепенные ссылки могут быть ниже по странице, после того как аргументы уже изложены. Если вы беспокоитесь о любопытстве по поводу цен, простая текстовая ссылка в подвале или в верхней навигации решит этот вопрос, не конкурируя с главным призывом. Эта страница — всего лишь глава большого сайта; ей не нужно выполнять работу всего сайта. Если вы также перестраиваете весь сайт, каркас лендинга с проверенными практиками конверсии SaaS — хороший справочник, которым можно поделиться с боссом: это внешний голос, говорящий то, что вы пытаетесь сказать.

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

Первый экран — это тест, а не плакат

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

Идея «первого экрана» перешла из физического сгиба газеты на первый экран смартфона, и здесь ограничения жёстче. Посетитель, листающий ленту по дороге на работу, видит половину заголовка и обрезанный скриншот, но всё равно делает вывод. Поэтому первый экран должен пережить трёхсекундный взгляд: одно предложение о том, что это за продукт, одно предложение о том, что он делает, одна кнопка. Если ему нужно объяснение — значит, он неправильный.

Используйте это как собственный тест. Не тестируйте на коллегах; тестируйте на людях, которые не знают ваш продукт. Покажите черновик первого экрана четырём-пяти друзьям или знакомым вне индустрии и задайте один вопрос: «Что делает этот продукт?» Если кто-то заколеблется — первый экран провален. Если они могут ответить без вашей помощи — у вас есть основа страницы.

Это также этап, где вы встретитесь с вопросом «сделайте поярче». Эффектность — это симптом, а не особенность. Первый экран может быть визуально уверенным — яркий цвет, чёткий скриншот продукта — и оставаться спокойным. Дело не в том, чтобы убрать визуальный интерес. Дело в том, чтобы каждое визуальное решение было подчинено единственному действию, которое вы выбрали на предыдущем шаге. Эффектное фото человека, использующего ваш продукт, — нормально; фото рэпера с вашим логотипом — нет.

Соберите доказательства до того, как они понадобятся

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

Босс не будет спорить с социальными доказательствами, потому что это не дизайнерское решение, а свидетельство. Когда кто-то спрашивает, почему на странице «нет контента», ответ таков: удачно размещённый отзыв может убедить сильнее, чем три абзаца описания возможностей. Посетители пока не доверяют вашим заявлениям. Они доверяют людям, похожим на них, которые уже совершили действие, о котором вы просите.

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

Финальное совещание не о вкусе

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

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

Вот спорный момент, который большинство советов пропускают: ваш босс не ошибается, желая характерно выглядящую страницу. Если ваш продукт действительно создаёт новую категорию, определённая визуальная индивидуальность необходима — вы хотите, чтобы её запомнили. Но это требование относится к вашему общему бренду и навигации сайта, а не к лендингу с одной целью конверсии. На странице, чья задача — получить клик, дизайн, привлекающий внимание к себе, конкурирует с сообщением. Возможно, придётся пожертвовать долей «вау» ради ясности. Этот компромисс реален, назовите его явно и превратите в решение, а не в сюрприз.

Есть и параллельный, более сложный случай: что, если ваша понятная версия ошибочна? Если цель страницы — запустить совершенно новый продукт на переполненном рынке, некоторая визуальная отличительность может помочь — например, сильная иллюстрация или необычная цветовая система, создающая узнавание. Правило не в том, чтобы «быть скучным». Правило в том, что каждый элемент должен оправдывать себя с точки зрения следующего шага посетителя, и если единственная защита элемента — то, что он эффектно выглядит, вероятно, его там быть не должно. Вы можете уверенно сказать это в комнате, и это снимет давление, которое испытывает ваш босс, желая, чтобы всё выглядело впечатляюще.

Более сильный ход — предложить тест. Если босс настаивает на своём варианте, скажите: «Давайте выложим обе страницы на две недели и измерим частоту кликов по основному действию». Небольшие команды иногда переживают, что у них недостаточно трафика для содержательного теста, и это справедливое замечание. Если это так — у вас всего несколько сотен посетителей в месяц — используйте качественные сигналы: записи сессий, комментарии при выходе или простое юзабилити-исследование с пятью участниками. Тест — не единственный способ узнать; это просто самый понятный способ завершить разногласия без уязвлённого самолюбия.

Настоящий результат — не страница

Вернёмся к вашему сценарию. Вы стоите на своём, создаёте понятную версию, объясняете два прототипа, и босс выбирает понятную — отчасти потому, что вы представили это как выбор, отчасти потому, что у вас есть заголовок, который можно произнести вслух одним предложением. Страница запускается. Она принесёт больше регистраций, меньше недоумённых уходов или любой другой вариант успеха для вашего продукта, и в следующий раз, когда босс пришлёт ссылку конкурента, у вашей команды уже будет язык, чтобы обсудить, касается ли запрос стратегии или стиля.

Этот язык и есть настоящий результат. Лендинг легко редизайнить; стандартное предположение команды о том, что «современный дизайн означает много всего», меняется медленнее. Каждый раз, когда вы защищаете простое ценностное предложение или один CTA, вы создаёте небольшую библиотеку ссылок, которую может использовать вся команда. Следующий проект станет проще. Если вы хотите применить ту же честность ко всему сайту, а не только к одной странице, вы можете провести аудит остальной части сайта как равнодушный клиент. А если вы сомневаетесь, нужен ли вам вообще промо-лендинг вместо полноценного сайта, это руководство по выбору формата сайта поможет вам сформулировать задачу.

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

Sources (5)