Communitygithub.com

peth-eth/unicorn-landing

Claude Code スキル:Stripe、Airbnb、Coinbase、DoorDash、Dropbox、GitLab、Instacart、Gusto の 11 のパターンに基づいてランディングページを監査または構築します。

unicorn-landing とは?

このスキルは、ユニコーン企業(Stripe、Airbnb、Coinbase など)の分析から導き出された 11 のパターンを使用して、ランディングページを監査または構築するためのものです。監査モードでは、提供された URL、コード、または説明に対して各パターンをスコアリング(PASS / PARTIAL / FAIL)し、最もコンバージョンに影響を与える修正リストを優先順位付けして提供します。構築モードでは、これらのパターンを仕様として使用し、見出し、サブ見出し、ヒーローレイアウト、社会的証明、ナビゲーション、CTA、フッターを含む完全なランディングページ構造を生成します。Stripe、Airbnb、Coinbase、DoorDash、Dropbox、GitLab、Instacart、Gusto などの主要なテクノロジー企業からインスピレーションを得て、市場で実証済みの高コンバージョン戦略を学び、適用できます。このスキルは、既存のページの改善、新しいランディングページの構築、またはコピーやデザインに関するフィードバックが必要な場合に特に役立ちます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add peth-eth/unicorn-landing

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

使用するタイミング

以下の場合に呼び出します:

  • ユーザーが既存のランディングページを監査したい場合(「このページに必要なものが揃っているか?」)
  • ユーザーが新しいランディングページやヒーローセクションを構築したい場合
  • ユーザーがコピー、構造、CTA デザインに関するフィードバックを求める場合

このスキルの機能

提供されたページ(URL、コード、または説明)を以下の 11 のパターンすべてに対して実行します。各パターンを PASS / PARTIAL / FAIL で評価し、1 文の理由を付けます。その後、コンバージョンへの影響が最も高いものから順に優先修正リストを出力します。

ゼロから構築する場合は、パターンを仕様として使用し、完全なランディングページ構造(見出し、サブ見出し、ヒーローレイアウト、社会的証明、ナビゲーション、CTA、フッター戦略)を生成します。


11 のユニコーンパターン

Stripe ($65B)、Airbnb ($80B)、Coinbase ($50B)、DoorDash ($55B)、Dropbox ($8B)、GitLab ($8B)、Instacart ($10B)、Gusto ($10B) の分析から導き出されました。

1. カテゴリーを定義する見出し

機能リストではなく、カテゴリーを主張します。

  • 推奨: 「インターネットのための金融インフラ」(Stripe) — カテゴリーを所有しています
  • 推奨: 「最も信頼される暗号プラットフォーム」(Coinbase) — 「A」ではなく「THE」を主張しています
  • 非推奨: 「チームが [X] を管理するためのプラットフォーム」— 一般的で印象に残りません
  • テスト: 会社名を競合他社の名前に置き換えてみてください。見出しがまだ当てはまる場合、それは失敗です。

2. ヒーローのシンプルさ — 合計 30 ワード未満

ヒーローは「ここは自分が探している場所か?」という 1 つの質問に答えるだけです。それ以上は不要です。

  • 推奨: 見出し + 1 つのサブライン + 1 つの CTA。以上。
  • 非推奨: 機能の箇条書き、説明文の段落、フォールドの上の複数セクション
  • ヒーロー内のすべての単語(見出し + サブ見出し + CTA + 補足テキスト)をカウントします。30 を超える場合は削減します。

3. 両面市場の分割(マーケットプレイスにのみ適用)

両方のオーディエンスが 3 秒以内に明確にラベル付けされたパスを取得できること。スクロールは不要です。

  • 推奨: 「ゲスト / ホスト」トグル (Airbnb)、「食事を注文 / 配達パートナーになる」(DoorDash)
  • 非推奨: 両方の側に話しかけようとする 1 つの汎用的なヒーロー。
  • 製品に供給側と需要側の両方がある場合、両方がヒーローで対応可能でなければなりません。

4. ヒーロー内の製品

イラスト、アイコン、ライフスタイル写真ではなく、実際の製品を表示します。

  • 推奨: ダッシュボードのスクリーンショット、ライブインターフェース、実際のデータ(Stripe はダッシュボードを表示、GitLab はパイプラインを表示)
  • 非推奨: 抽象的なブロブグラフィック、アニメーションパーティクル、ストックフォト
  • この規模では、製品自体がコンセプトの証明です。

5. 規模による社会的証明

持っている中で最も大きな真の数字でリードします。

  • 推奨: 「Stripe で実行される世界の GDP」/「5000 万人以上」(GitLab) / 顧客ロゴ
  • 推奨(初期段階): 「500 以上のチームが使用」は、数字がないよりはるかに優れています。
  • 非推奨: 具体性のない「数千の企業に参加」のような一般的な表現。
  • 1 つの具体的な数字は、複数の曖昧な主張よりも優れています。

6. 最小限のナビゲーション

最大 5~6 項目。ナビゲーション項目が増えるごとに、コンバージョンを損なう意思決定ポイントが生まれます。

  • 推奨: Stripe (5 項目)、Airbnb (3 項目)、Coinbase (6 項目)
  • 非推奨: メガメニュー、10 以上のナビゲーション項目、マーケティングページのプライマリナビゲーション内のドロップダウン
  • 目標は 1 つのアクションです。それ以外はすべて摩擦です。

7. オーディエンスによるパーソナライゼーション(上級)

訪問者セグメントを検出できる場合は、セグメント固有のコンテンツを表示します。

  • 推奨: Stripe は開発者とビジネスオーナーに異なるコンテンツを表示;Gusto は企業規模に応じてコンテンツを表示
  • 実装: URL パラメータ、リファラー検出、Cookie ベース、または明示的な「私は [役割] です」セレクター
  • パターン 1~6 が確固たるものになるまで、これはスキップしてください。

8. CTA は常に無料

摩擦のないアクションでリードします。営業/エンタープライズはセルフサービスでの採用後に行われます。

  • 推奨: 「はじめる」「サインアップ」「無料で試す」「無料で始める」
  • 非推奨: プライマリヒーロー CTA として「営業に問い合わせる」「デモを予約する」「見積もりをリクエストする」
  • B2B エンタープライズページ(Stripe、GitLab)でも、無料のセルフサービスでリードします。

9. ページ速度は見えない

ページは瞬時に感じられるべきです。読み込みに気づいた時点で、すでに失敗しています。

  • 推奨: Lighthouse / PageSpeed Insights で監査。目標 LCP < 2.5 秒、CLS < 0.1
  • 推奨: ヒーロー画像の最適化、重要でない JS の遅延読み込み、最新の画像形式(WebP/AVIF)の使用
  • 非推奨: ヒーローで重いライブラリ、ブロッキングスクリプト、または最適化されていない動画を読み込む

10. ナビゲーションハブとしてのフッター(製品に応じてスケール)

初期段階: シンプルな 3 列フッター。成熟した製品: カテゴリ別の包括的なサイトマップ。

  • 推奨: 製品、開発者、会社、法務(最低限)で整理
  • 推奨: Stripe のフッターには 50 以上のリンクがカテゴリ別に整理されています — SEO と発見可能性の両方に役立ちます
  • 非推奨: 成熟した製品で、空のフッター、または著作権とソーシャルリンクのみのフッター

11. すべてのページ間の一貫性

すべてのページが同じシステムの一部のように感じられること:同じフォント、色、間隔、コンポーネントスタイル。

  • 推奨: デザイントークンを早期に確立 — カラー変数、タイプスケール、間隔単位
  • 非推奨: ページごとにわずかに異なるボタンスタイル、不整合な見出しサイズ
  • テスト: サイトのランダムな 5 ページを開きます。ロゴを見なくても同じ製品だとわかりますか?

監査出力形式

## ユニコーンランディング監査 — [製品名]

### パターンスコア
| パターン | スコア | 備考 |
|---------|-------|------|
| 1. カテゴリー見出し | PASS / PARTIAL / FAIL | 1文 |
| 2. ヒーローのシンプルさ | ... | 単語数: X |
| 3. 両面分割 | N/A / PASS / FAIL | (マーケットプレイスのみ) |
| 4. ヒーロー内の製品 | ... | |
| 5. 社会的証明 | ... | 使用された最大の証明数字: X |
| 6. 最小限のナビゲーション | ... | 現在の項目数: X |
| 7. パーソナライゼーション | ... | |
| 8. 無料 CTA | ... | 現在のプライマリ CTA: 「X」 |
| 9. ページ速度 | ... | LCP: X 秒(既知の場合) |
| 10. フッターの深さ | ... | |
| 11. クロスページの一貫性 | ... | |

### 優先修正(コンバージョンへの影響が最も高い順)
1. [パターン X] — [行うべき具体的な変更]
2. ...

構築出力形式

ランディングページ構造をゼロから生成する場合:

## ランディングページ仕様 — [製品名]

**カテゴリー主張(見出し):** 「...」
**サブ見出し(15 ワード以下):** 「...」
**ヒーワード数:** X(30 以下である必要があります)
**プライマリ CTA:** 「...」(無料/摩擦がない必要があります)
**製品ビジュアル:** [表示するもの — スクリーンショット、デモなど]
**最大の証明数字:** 「...」
**ナビゲーション項目:** [リスト — 最大 5]
**オーディエンス分割が必要か?** はい / いいえ — [理由]

### ヒーローセクション(完全なコピー):
[見出し]
[サブ見出し]
[CTA ボタン]

### 社会的証明セクション:
[数字/規模の主張]
[ロゴまたは推薦文]

### フッター構造:
[列 1: 製品] | [列 2: 会社] | [列 3: 法務]

関連スキル