
プレビューギャラリー
類似の Skill
すべての Skill を見る手に入るもの
- つながったスイート:ホーム、チェックアウト付きの料金、ログインと新規登録、動作するプロダクト、管理画面、更新履歴、お問い合わせ、プライバシー、利用規約、404 ページが、1 つのストーリーと 1 つのステートを共有します
- アンバーのスクラップブック風ルック:アンバーのグラデーションを 1 か所入れた中央揃えのミニマルな Hero とステッカー風タイル、続いてテープで貼った写真、手書きメモ、クリーム色の Bento グリッド、ロードマップボード、メイソンリー型のお客様の声
- ライトとダークで動作するインタラクション:リアルタイム解析付きのタスク登録、クレジットを消費するプラン作成アクション、請求サイクルの切り替え、管理画面の検索・並べ替え・フィルター、コマンドメニュー
向いている人
- 企業的なグラデーションのページではなく、温かく手作り感のあるローンチサイトが欲しい SaaS、生産性ツール、インディーソフトウェアのチーム
- ローンチや初期検証のために、マーケティングサイト・料金・プロダクト・管理画面を説得力のある 1 つのデモとしてモックアップしたい創業者
- 登録・整理・結果生成といった明確な中核ループを持ち、プロダクト画面の中で実際に動く様子を見せられるプロダクト
向いていない人
- フォーマルなエンタープライズや規制業種のブランド。ステッカー、マスキングテープ、手書きメモで、あえて遊び心のあるトーンにしています
- 実際のアカウント、決済、データを扱う本番アプリ。ログイン、チェックアウト、メールはページ内のシミュレーションであることを明示しています
- カフェやポートフォリオなど、ソフトウェアプロダクトのない事業。このスイートはプロダクト、その料金、管理画面を中心に構成されています
プロダクトローンチ・アプリグロースWeb デザイン・デジタル体験ホームページ作成LP 作成スタイル固定編集可能な出力アンバースクラップブッククリーム Bento傾いた UI コラージュ手書き注釈遊び心あるエディトリアル
この Skill について

Amber Scrapbook Suite は、SaaS プロダクトのあらゆる画面を、つながった 1 つのビュー群として構築します。マーケティング用ホーム、料金、ログイン、動作するプロダクト、管理画面、補助ページ。マーケティング側はクリーム色の紙、マスキングテープ、ポラロイド、手書きメモで手作り感を出し、プロダクトと管理画面は落ち着いて精緻に保ちます。作例は架空の AI デイプランナー Dayfold です。

手に入るもの
- 一式そろったスイート:ホーム、チェックアウトドロワー付きの料金、ログインと新規登録、プロダクト、管理画面、更新履歴、お問い合わせ、プライバシー、利用規約、404 ページ
- ミニマルな Hero から始まり、ワードマークのマーキー、傾いたカードとテープで貼った写真によるフィーチャー紹介、クリーム色の Bento グリッド、導入事例、ロードマップボード、メイソンリー型のお客様の声、FAQ、メモ用紙風の締めくくりへと続くホームページ
- 自然言語でタスクを登録でき、クレジットを消費するプラン作成アクションを備えたプロダクト画面と、統計・グラフ・検索可能なユーザーテーブルを備えた管理 Dashboard
- 共有ステート:新規登録やプラン購入で、アカウントメニュー、クレジット、料金バッジ、管理テーブルが更新されます
- ライト/ダークテーマ、コマンドメニュー、どのブラウザでも開けてオフラインで動く自己完結型の単一ファイル

使い方
- プロダクト名、一文の約束、8〜10 個の機能(うち 3 つの主力機能に印を付ける)、料金体系、いくつかのロードマップ項目を共有します。
- エージェントがプロダクトの中核ループをあなたの領域に当てはめ、写真を計画・生成し、あなたのコピーで全画面を構築します。
- ファイルを開いてライトとダークで各ページを確認し、コピー、プラン、セクションの修正を依頼します。

写真は、エージェントに画像ツールがあればそれで作成され、そのツールの利用料金がかかる場合があります。ブリーフに含まれていない内容は仮テキストになり、エージェントが確認用に一覧にします。
始める前に必要なもの
- 用意するもの
- プロダクト名、一文の約束、ターゲット · 3 つの主力機能に印を付けた 8〜10 個の機能と、料金体系 · ロードマップ項目、導入事例、実際の引用や写真(任意)
- 依存関係
- エージェントのマシン上の Node.js 18 以降。単一のオフラインファイルを構築する同梱スクリプトの実行に使用 · ファイル作成時のインターネット接続(フォントを一度ダウンロードして埋め込むため) · 写真用にエージェントの画像ツール(任意。ない場合は写真を提供するか、ラベル付きのプレースホルダーになります)
- 外部コスト
- 写真は、エージェントに画像ツールがあればそれで生成され、そのツールの利用料金がかかる場合があります。ない場合は、写真の提供を依頼するか、明確にラベル付けしたプレースホルダーを入れて納品します。それ以外に有料サービスは使いません。
- 最終検証
- v1.0.9 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
ユーザーレビュー
レビューを読み込み中…








