
プレビューギャラリー
類似の Skill
すべての Skill を見る手に入るもの
- 完全なダークのマーケティングサイト:プロダクトの Hero、アニメーションする機能カード、スクロール連動のワークフロー、導入事例、連携とセキュリティ、請求期間の切り替え付き料金、FAQ、登録セクション
- 実際に動く下層ページ:フィルターと検索付きの更新履歴、導入事例、ログインと規約のページ、さらにバリデーションと完了表示を備えたフォーム
- ページに組み込まれ、あなたのプロダクトに合わせてテーマを変えたプロダクト画面、Geist の書体、生成した顧客ポートレートを、すべてオフラインの単一ファイルに埋め込み
向いている人
- 初日から資金調達済みのように見えるダークなページがほしい、SaaS や開発者ツールをローンチする創業者
- 料金、実績、FAQ、更新履歴までキャンペーンに使える完全なローンチサイトが必要なプロダクトマーケター
- 整ったスクリーンショットがないチーム:プロダクト画面はすべてページに組み込まれ、あなたのプロダクトに合わせてテーマが変わります
向いていない人
- 明るく軽やかな見た目を求めるブランド:Cadence はダーク専用です
- 実際の登録や課金:フォームはページ上で検証と確認表示を行いますが、どこにも送信されません
- ブログ、ドキュメントポータルなど、コンテンツ中心のサイト:これはいくつかのサポートページを備えたプロダクトマーケティングサイトで、CMS ではありません
プロダクトローンチ・アプリグロースWeb デザイン・デジタル体験LP 作成スタイル固定コンバージョン重視シアンアクセントグラデーション文字チャコールダークCSS デバイスモックアップスクロールモーション
この Skill について

Cadence マーケティングランディングページは、プロダクトそのものを Hero 画像にしたダークな SaaS マーケティングサイトを作ります。チャコールの背景、ひとつだけのシアンのアクセント、グレーから白へのグラデーション見出しが、最初の画面から登録まで一続きのストーリーを運び、その奥に更新履歴、導入事例、ログイン、規約の各ページが控えます。例は架空の顧客フィードバックプラットフォーム Loopwright です。

手に入るもの
- ひと続きの流れで構成したホームページ:Hero のプロダクトカード、ワードマークのマーキー、アニメーションする機能カード、スクロール連動のワークフロー、ポートレート付きの導入事例、連携とセキュリティ、料金、FAQ、そしてスクロールで蓋が開くノートパソコン付きの登録セクション
- サポートページ:フィルター可能な更新履歴、出典を明記した 3 つの数値を含む導入事例、ログイン、規約
- ページに組み込まれ、あなたのプロダクトに合わせてテーマを変えたプロダクト画面。ひとつの代表的なリクエストがストーリー全体を通して流れます
- 実際に動く請求期間の切り替え、比較表、FAQ、Tab、モバイルメニュー、バリデーションと完了表示を備えたフォーム
- Geist と Geist Mono の書体と生成したポートレートを、どのブラウザでも開けてオフラインで動作する単一ファイルに埋め込み

使い方
- プロダクト名、何をするものか、主な顧客ワークフロー、おおよその料金を伝えます。メモ程度で十分です。
- エージェントが機能カードとワークフローをあなたのプロダクトに対応させ、ポートレートを生成し、すべてのセクションとページを埋めます。
- ブラウザでファイルを開き、各ページとフォームをクリックして確かめ、コピーやセクションの変更を普段の言葉で依頼します。

ポートレートは、利用可能な場合はエージェントの画像ツールで作られ、そのツールの利用料金がかかる場合があります。ブリーフにない内容はプレースホルダーのコピーになり、エージェントが確認用に一覧にします。
始める前に必要なもの
- 用意するもの
- プロダクト名、何をするものか、成果を先に打ち出す見出しのアイデア · 4〜5 個の機能、主なワークフローのステップ、おおよその料金プラン · 顧客の声、導入事例の数値、連携、正直に主張できるセキュリティ上の事実(任意。欠けている部分はプレースホルダーとして一覧にします)
- 依存関係
- エージェントのマシン上の Node.js 18 以降。単一のオフラインファイルを構築する同梱スクリプトの実行に使用 · ファイル作成時のインターネット接続(フォントを一度ダウンロードして埋め込むため) · 顧客ポートレートと導入事例の写真用の、エージェントの画像ツール(任意。ない場合はイニシャルのアバターのままです)
- 外部コスト
- 顧客ポートレートと導入事例の写真は、利用可能な場合はエージェント自身の画像ツールで生成するため、そのツールの利用料金がかかる場合があります。ない場合は、ページはイニシャルのアバターのままとなり、写真が必要な枠をエージェントが一覧にします。それ以外に有料サービスは使いません。
- 最終検証
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
ユーザーレビュー
レビューを読み込み中…









