Создание веб-сайта для стартапа сегодня стало доступно каждому, однако разработка уникального и запоминающегося бренда остается сложнейшим вызовом для фаундеров. В рамках проекта Design Review от акселератора Y Combinator сооснователь и генеральный директор платформы Linear Карри Сааринен (Karri Saarinen) провел глубокий аудит сайтов молодых компаний. Известный дизайнер поделился собственным опытом построения культового продукта, объяснил ценность радикальной простоты и рассказал, почему молодым проектам опасно мимикрировать под зрелые корпорации.
🛠️ Истоки Linear: Как за два дня заложить основу культового бренда 0:00
Путь Карри Сааринена в индустрии технологий неразрывно связан с дизайном знаковых продуктов: он успел поработать первым дизайнером в Coinbase и занимал позицию ведущего дизайнера в Airbnb, прежде чем в 2019 году запустить собственный стартап Linear. Вспоминая первые шаги компании, спикер отмечает, что дебютная версия сайта была собрана буквально за пару дней. Основатели сознательно отказались тратить недели или месяцы на полировку веб-страницы, посчитав, что ключевые усилия на раннем этапе должны быть сфокусированы непосредственно на разработке самого продукта.
Важнейшим элементом ранней стратегии Linear стало точное, осознанно суженное позиционирование. По словам Карри Сааринена, в то время как крупные игроки вроде Slack используют размытые формулировки в духе «платформа, где происходит работа», маленьким стартапам жизненно необходимо говорить с клиентом на максимально конкретном языке. На первом сайте Linear красовался прямой технический термин «issue tracking» (отслеживание задач). Фаундер объясняет, что это не отражало долгосрочное видение компании, но идеально резонировало с целевой аудиторией — инженерами и техническими командами на ранних стадиях. Таким образом, сайт работал как эффективный фильтр, отсекающий нерелевантных пользователей.
Интересным тактическим ходом стало использование скриншота продукта. На тот момент полноценной рабочей версии приложения еще не существовало, поэтому изображение было слегка размыто. Как утверждает гость, это позволило создать атмосферу таинственности и подтолкнуть заинтригованных посетителей оставлять свои адреса электронной почты для вступления в список ожидания. Простой одностраничный сайт без разделов «О нас» или блога отлично справился со своей задачей — зафиксировать первичный интерес рынка, не перегружая аудиторию лишней фактурой.
📈 Эволюция дизайна: От фиолетового тренда к зрелому минимализму 6:34
Бренд любой компании неизбежно эволюционирует вместе с ростом ее клиентской базы, и Linear не стала исключением. Карри Сааринен выделяет три основных этапа развития веб-ресурса платформы. Второй шаг в этой эволюции — знаменитый «фиолетовый сайт» — стал настоящим феноменом в индустрии интерфейсов, породив волну копирования со стороны десятков других технологических стартапов.
Современный дизайн Linear ушел в сторону строгой черно-белой гаммы, отражающей зрелость компании. Продукт перерос рамки простого трекера задач и теперь включает в себя масштабные модули планирования и дорожных карт. Тем не менее, как подчеркивает Карри Сааринен, команда сознательно борется с искушением завалить посетителя бесконечным списком функций. По его мнению, главная страница должна служить своего рода «тизером» для тех, кто видит компанию впервые. Она обязана соблюдать тонкий баланс: давать достаточно информации для понимания сути, но не приводить к ментальному ошеломлению пользователя. Для детального же изучения возможностей продукта теперь существуют специализированные вложенные разделы.
Представитель Y Combinator добавил, что в рамках акселератора стартапам часто рекомендуют разделять описания продукта на два типа: амбициозный питч для инвесторов и максимально прагматичный, наполненный профессиональным сленгом текст для конечных пользователей. Linear доказала жизнеспособность именно такого подхода, поставив клиентский фокус во главу угла.
🔍 Разбор стартапов: Ошибки позиционирования и анимационный хаос 9:56
В процессе анализа веб-сайтов, присланных выпускниками Y Combinator, эксперты выявили ряд критических дизайн-ошибок. Первым под разбор попал проект Sprites AI со слоганом «Создавайте кастомные ИИ-воркфлоу и оптимизируйте рост». Карри Сааринен сразу указал на фундаментальную проблему: из текста совершенно неясно, для кого создан этот инструмент — для дизайнеров, инженеров или блогеров.
По итогам анализа Sprites AI Карри Сааринен выделил несколько ключевых рекомендаций:
- Определить целевую аудиторию: Сгруппировать шаблоны воркфлоу по конкретным профессиональным ролям, чтобы аналитики или создатели контента сразу узнавали свои юзкейсы.
- Укротить анимацию: Убрать навязчивое циклическое движение элементов, которое перетягивает на себя все внимание и мешает считывать текстовые смыслы.
- Исправить структуру: Выстроить информацию по принципу перевернутой пирамиды — от простого и точечного сообщения на самом верху к постепенному раскрытию деталей при скроллинге.
Кроме того, плавающий виджет ввода промпта на сайте Sprites AI визуально напоминает навязчивый баннер о сборе куки-файлов, из-за чего пользователи подсознательно его игнорируют.
Второй кейс — стартап Giga ML, предлагающий ИИ-агентов для корпоративной поддержки, столкнулся с низкой конверсией сайта. Карри Сааринен высказал парадоксальную, на первый взгляд, мысль: для B2B-компаний, ориентированных на крупный бизнес (enterprise), конверсия сайта вообще не имеет значения. Представители корпораций практически никогда не принимают решения, хаотично кликая по кнопкам на веб-страницах. По мнению гостя, таких клиентов нужно искать через классические B2B-продажи, профильные мероприятия, экспертные публикации и закрытые ужины. Попытка оптимизировать сайт под моментальную конверсию в духе потребительских приложений здесь бессмысленна.
В ходе тестирования голосового демо-агента на сайте Giga ML ведущие заметили технические шероховатости: ИИ заставил пользователя импровизировать без готовых подсказок, а также некорректно произнес индустриальный стандарт безопасности SOC2 Type 2 как «S2 type 2». Эксперты посоветовали направлять пользователя готовыми триггерами и убрать из шапки сайта общие фразы в пользу конкретного описания функционала.
🥛 Парадокс искусственного молока: Дизайн против страхов потребителей 22:01
Ярким примером нестандартного подхода стал сайт проекта Unreal Milk (разрабатываемого компанией Brown Foods), создающего выращенное в лаборатории молоко. Страница использует уникальный горизонтальный скроллинг, обилие рисованных иллюстраций и ироничный сюжет о корове, ушедшей в «вечный отпуск». По оценке Карри Сааринена, этот сайт гарантирует стопроцентную запоминаемость бренда — пользователь точно вспомнит его спустя неделю.
Спикер подметил глубокий психологический нюанс этого дизайна. Технологически лабораторная еда — это продукт сухой науки, способный вызывать у обывателей внутреннее отторжение и страх перед искусственными компонентами. Анализируя кейс Unreal Milk, эксперты выделили сильные стороны дизайна и зоны для роста. К преимуществам они отнесли:
- Борьбу со страхами: Дружелюбные, «живые» шрифты и ручные иллюстрации снижают тревожность потребителей, транслируя ощущение естественности и безопасности.
- Высокую запоминаемость: Смелый отказ от шаблонов выделяет проект на фоне «куки-каттер» сайтов современной IT-индустрии.
Однако у сайта обнаружились и критические недостатки:
- Отсутствие CTA (призыва к действию): На странице нет ни одной формы для сбора email-адресов или кнопок обратной связи, из-за чего стартап теряет потенциальное комьюнити.
- Визуальный разрыв: Стилистика сайта не бьется со строгим черно-белым дизайном реальной бутылки, изображенной на фото. По мнению фаундера Linear, это упущенная возможность укрепить идентичность бренда на полке магазина.
🎯 Дифференциация продукта: Опыт Confident AI и Dropback 30:00
Разбор платформы для тестирования нейросетей Confident AI выявил классическую ошибку IT-интерфейсов. Разработчики выделили ключевое слово фиолетовым цветом с подчеркиванием, что вызывает стойкую ассоциацию со старыми посещенными гиперссылками в браузерах. Карри Сааринен добавил, что абстрактные заголовки вроде «Двигайтесь вперед всегда» лишены практического смысла. Стартапам необходимо находить свою узкую колею дифференциации. Например, для Linear на старте такой уникальной фишкой стала экстремальная скорость работы интерфейса, поскольку именно на медлительность существующих инструментов массово жаловались разработчики.
Финальным аккордом стал аудит проекта Dropback — софта для распределения доходов в элитных спортивных колледжах, привлекшего $1.6 млн инвестиций. Фаундеры Dropback пожаловались, что их сайт выглядит хаотично, но они вынуждены забивать первый экран информацией, так как их нетехнологичные клиенты — футбольные тренеры — якобы не умеют скроллить страницы.
Карри Сааринен решительно опроверг этот миф, заявив, что в эпоху смартфонов привычка к скроллингу стала повсеместной для любых аудиторий. Движущаяся неоновая сетка на фоне сайта Dropback лишь размывает текст и мешает чтению.
Для исправления хаоса сооснователь Linear предложил ряд конкретных шагов:
- Отключить движущийся фон: Подобные эффекты лишь снижают читаемость важного текста.
- Повысить контрастность: Избегать блеклых сочетаний, таких как белый текст или логотипы на ярко-желтом фоне.
- Добавить социальное подтверждение: Разместить лица и цитаты реальных клиентов из спортивной индустрии, ведь для консервативного рынка доверие важнее любых футуристических графиков.
- Разделить контент: Создать отдельные целевые подстраницы для разных типов пользователей в меню навигации, разгрузив главную страницу.
