Перейти к основному содержимому

Каталог

@layero собирает лендинг из двух независимых осей: структуры (что строим) и дизайн-системы (как выглядит). Любую структуру можно покрасить любой системой; матчер подбирает 3 ближайших варианта под бриф юзера.

Дизайн-системы

minimal · Чистый sans, светлый фон, синий акцент

Inter, светлый нейтральный фон, один насыщенный акцент. Большая воздушность, квадратные углы, без теней. Контекстно — как современный продуктовый сайт уровня Linear или Stripe.

Подходит: SaaS waitlist / demo, корпоративные мастер-классы, технические события, B2B-лендинги.

Не подходит: тёплое, винтажное, ручное, личный бренд.

editorial · Magazine, serif, тёплый

Cormorant Garamond на заголовках, кремовый фон, один приглушённый акцент. Большая воздушность, квадратные радиусы, тонкие разделители. Читается как длинная статья или страница из Substack.

Подходит: лендинги менторов, портфолио дизайнеров, waitlist newsletter'ов, запуски книг, ремесленные мастер-классы.

Не подходит: dev, SaaS, корпоративное, неоновое.

terminal · Тёмный фон, монospace, неоновый акцент

JetBrains Mono на лейблах и метках, плотная типографика, неоновый зелёный акцент. Без декора. Читается как заметки инженера — сигнал, не шум.

Подходит: dev-портфолио, open-source проекты, технические продукты, hackathons.

Не подходит: тёплое, дружелюбное, декоративное, корпоративное.

warm · Тёплая палитра, мягкие формы

Manrope + кремово-персиковая палитра, скруглённые углы (16-24px), pill-кнопки, коралловый акцент. Контекстно — как личное приглашение, а не продуктовая страница.

Подходит: менторство, воркшопы для не-tech аудитории, wellness, мастер-классы по творчеству, community.

Не подходит: корпоративное, тёмное, минимализм, технические продукты.

bold · Огромная типографика, тёмный фон, vivid

Space Grotesk, гигантские display-заголовки, монохромные плиты, один яркий акцент (жёлтый). Высокий контраст, urgency. Читается как манифест.

Подходит: конференции, фестивали, релизы продуктов, манифесты, большие митапы.

Не подходит: тихое, личный бренд, editorial.

Структуры

СтруктураЧто этоСовместимые системы
masterclassЛендинг одного мастер-класса/воркшопа со сбором заявоквсе
portfolio-devЛичная страница разработчика — проекты, опыт, контактыterminal, minimal
portfolio-designerПортфолио дизайнера — кейсы крупными визуаламиeditorial, minimal, warm
portfolio-mentorЛендинг ментора / коуча со сбором заявок на сессииwarm, editorial, minimal
eventКонференция, митап, релиз — одностраничник с акцентом на датуbold, minimal, editorial
saasПродукт со сбором waitlist / demo requestminimal, bold, terminal

Как матчер выбирает

При вызове @layero ... плагин:

  1. Спрашивает мотивацию (тема, аудитория, цель) → определяет структуру
  2. Спрашивает visual preference (палитра, тон, опциональные референсы) → строит запрос
  3. Скорит каждую дизайн-систему по описательным метаданным:
    • visual_tags (warm, mono, neon, serif, ...) — +3 за совпадение
    • mood_keywords (technical, personal, urgent, ...) — +2 за совпадение
    • description — +1 за упоминание токена
    • not_for — -4 (резко понижает)
  4. Возвращает топ-3, показывает в финальном квизе с превью

Out-of-scope: что если ничего не подходит

Плагин никогда не отказывается. Если тема юзера не ложится на категорию (например, «лендинг для йога-ретрита»), он:

  1. Подбирает ближайшую структуру (event для йога-ретрита — это одноразовое мероприятие)
  2. Использует её design-system как есть
  3. Адаптирует копирайт под реальную тему
  4. Сообщает что сделал в одном предложении

Подробнее — conversation/out-of-scope.md.