Дизайн
Если коротко. На старте дизайн — это не «красиво», а «понятно за 5 секунд». Если человек не понимает, что делать — твой продукт не работает, какой бы дорогой UI ни был.
Объяснение
5.1. Зачем дизайн на старте
Дизайн на ранней стадии — это не про вау-эффект и не про Dribbble. Это про то, чтобы пользователь за несколько секунд понял: что это, для кого, зачем ему нажать кнопку и что будет дальше.
Хороший дизайн на старте снижает трение: меньше вопросов в поддержку, меньше брошенных регистраций, быстрее доходит до ценности. Плохой дизайн маскирует слабый продукт — на неделю. Потом люди просто уходят.
Твоя задача — не выиграть конкурс красоты, а провести человека от «что это?» до «получил пользу» без лишних шагов.
5.2. Ясность важнее красоты
Красивый интерфейс без ясного оффера — это обёртка без конфеты. Пользователь смотрит, восхищается и закрывает вкладку.
Ясность — это когда видно главное действие, текст говорит простым языком, нет 15 равнозначных кнопок, а заголовок отвечает на вопрос «что я получу?», а не «мы инновационная платформа».
Правило: если убрать все декоративные элементы и экран всё ещё работает — дизайн нормальный. Если без градиентов и иконок ничего не понятно — проблема не в «недостаточно красиво», а в структуре.
5.3. Минимум дизайна для MVP
На MVP тебе нужны четыре вещи: один главный экран с оффером, одно главное действие (CTA), понятный путь до ценности и базовая читаемость (шрифт, контраст, отступы).
Не нужны: кастомные иллюстрации, анимации ради анимаций, тёмная тема «на будущее», 12 вариантов карточек, сложная навигация, брендбук на 40 страниц.
Достаточно: системный шрифт, 2–3 цвета, один UI-kit или готовый шаблон, одинаковые отступы и кнопки одного стиля. Лучше скучно и понятно, чем стильно и запутанно.
5.4. Инструменты
Figma — если хочешь быстро собрать экраны и показать кому-то до кода. Бесплатного тарифа хватит на старт.
Готовые UI-kit'ы — shadcn/ui, Tailwind UI, Material, Bootstrap. Не изобретай кнопки с нуля.
Конструкторы — Tilda, Framer, Webflow — для лендинга без разработчика. Нормальный вариант для проверки спроса.
AI-инструменты — v0, Galileo, Uizard — ускоряют черновик, но финал всё равно проверяй глазами реального пользователя, не нейросети.
Главный инструмент — скриншот и вопрос «понятно ли это человеку, который видит продукт впервые?»
Примеры
Главная страница с анимированным фоном, слоганом «Революция в продуктивности» и тремя одинаковыми кнопками «Начать», «Узнать больше», «Смотреть демо»
Заголовок «Считай оплаты от фриланс-клиентов за 2 минуты», одна кнопка «Попробовать бесплатно», под ней — скрин того, что человек получит
Ошибки
- Тратить недели на визуал до первых пользователей
- Копировать дизайн больших продуктов без их контекста и ресурсов
- Делать «красиво» вместо «понятно с первого взгляда»
- Пихать на экран всё сразу — фичи, тарифы, отзывы, блог, чат
- Не показывать прототип 5 людям до разработки
- Менять дизайн каждые два дня вместо проверки гипотез
Что сделать руками
- Открой свой экран и за 5 секунд ответь: что это и что нажать? Если не можешь — перепиши заголовок и оставь одну кнопку.
- Собери один ключевой экран в Figma или на лендинге за один день. Без идеала — рабочий черновик.
- Покажи 5 людям из аудитории и попроси пройти задачу вслух. Запиши, где они тупят.
Чеклист
- За 5 секунд понятно, что за продукт
- Есть одно главное действие на экране
- Текст простой — без «экосистема» и «инновационный»
- Контраст и шрифт читаются на телефоне
- Не тратил больше 2–3 дней на визуал MVP
- 5 человек из аудитории прошли сценарий без подсказок
- Дизайн помогает проверить гипотезу, а не откладывает запуск