59 Prototype.
Interactive product mockups — dashboards, apps, landing pages, internal tools. Anything you’d hand a stakeholder and click through.
シーン
- 001
ブログ記事 長文記事/ブログ投稿 — マストヘッド、ヒーロー画像プレースホルダー、図表や引用を含む本文、著者の署名、関連記事を含みます。「ブログ」「記事」「投稿」「エッセイ」「ケーススタディ」などの要望に対応します。 - 002
臨床症例報告 回診、カンファレンス、診療記録向けの構造化された症例プレゼンテーションを生成。生理学的に正確なバイタル、検査値、エビデンスベースの治療計画を含むSOAP形式または叙述形式の症例報告を作成します。 - 003
Codex インタラクティブ機能マップ 長文記事、スレッド、メモ、製品説明を、ワークフローループ、ユースケースマトリックス、レスポンシブ詳細パネル付きの Codex スタイルのクリック可能な機能マップに変換します。 - 004
デザイン評価 プロジェクト内の任意の HTML 成果物に対して 5 次元の専門デザインレビューを実施——哲学/視覚階層/ディテール/機能性/革新性を各 0-10 で採点。レーダーチャート、根拠に基づくスコア、3 つのリスト(維持/修正/クイックウィン)を含む単一の HTML レポートを出力します。 - 005
ダッシュボード 単一HTMLファイルの管理/分析ダッシュボード。固定左サイドバー、ユーザー/検索機能付きトップバー、KPIカードとチャートのメイングリッド。『ダッシュボード』『管理画面』『分析』『コントロールパネル』が必要な場合に使用。 - 006
データビジュアライゼーションレポート CSV、Excel、または JSON データを洗練されたビジュアルレポートページに変換します。 - 007
デート ウェブ コンシューマー向けのマッチングダッシュボード。左サイドナビゲーション、コミュニティシグナルのティッカーバー、主要KPI、30日間の相互マッチング棒グラフ、マッチ率トレンドブロックを含む。エディトリアルタイポグラフィと控えめなアクセント。デートサイト、マッチング、コミュニティダッシュボード、SNSダッシュボードなど、データが主役の消費者向け製品に最適。 - 008
DCF評価 上場企業向けの割引キャッシュフロー評価と本質的価値分析。DCF、適正価値、本質的価値、目標株価、過小評価・過大評価分析などに対応。 - 009
デバイス 3D ショーケース iPhone と MacBook の静的な 3D スタイルショーケース。画面に実際の HTML を埋め込み、ガラスレンズの屈折効果と 360 度ターンテーブル構成を実現。 - 010
デジタルガイド 2ページのデジタルガイドプレビュー。1ページ目はカバー(タイトル、著者、『含まれる内容』統計、目次のティーザー)、2ページ目は見開き(引用文とステップリスト付きのレッスン本文)。ライフスタイル/クリエイターブランドのトーン。『電子ガイド』『デジタルガイド』『lookbook』『リードマグネット』『クリエイターガイド』『playbook』『PDFガイド』または『電子指南』が求められる場合に使用。 - 011
ドキュメントページ ドキュメントページ — サイドナビゲーション、スクロール可能な本文、目次を含むレイアウト。'ドキュメント'、'ガイド'、'API リファレンス'、'チュートリアル'が指定された際に使用します。 - 012
メールマーケティング ブランド製品発売用メールテンプレート。マストヘッド、ヒーロー画像、斜体アクセント見出し、本文、CTAボタン、仕様グリッドを含むHTML中央寄せ単一カラムレイアウト。 - 013
エンジニアリングランブック エンジニアリングランブック — サービス概要、アラート表、ダッシュボードリンク、コピペ可能なコマンド付き運用手順、オンコールローテーション、インシデント対応チェックリストを含みます。ランブック、運用ドキュメント、オンコールガイド、SREドキュメント、運維手册が必要な場面で使用します。 - 014
財務レポート 四半期・月次財務レポート——KPI付きマストヘッド、収益・消費チャート、P&L集計表、ハイライト、見通し段落を含みます。『財務レポート』『Q3レポート』『MRRレビュー』『P&L』『財報』などの要件に対応。 - 015
Flowai ライブダッシュボードテンプレート FlowAI スタイルのチーム管理ダッシュボード。3つのタブ(チームメンバー、チーム詳細、アクティビティログ)、KPI統計行、メンバーテーブル、役割分布バーチャート、オンライン状態とアクティビティのスパークライン、トップ貢献者パネルを搭載。ライト/ダークテーマ、チャートツールチップ、パネルのクリック拡大、CSV エクスポートに対応。 - 016
ゲーミフィケーションアプリ 3画面のゲーミフィケーションアプリプロトタイプ:カバー画面、XPリボンとレベルバー付き今日のクエスト、クエスト詳細。ゲーミフィケーションアプリ、習慣トラッカー、RPG風ライフアプリ、レベルアップアプリ、デイリークエスト、XP/連続記録アプリに最適。 - 017
GitHub ダッシュボード GitHub リポジトリ分析ダッシュボード — スター、フォーク、コントリビューター、イシュー、プルリクエスト、最近のアクティビティ、トップコントリビューター。GitHub リポジトリダッシュボード、オープンソース成長レポート、リポジトリヘルスページ、GitHub 分析ビューに使用。 - 018
人事オンボーディング 1ページの新入社員オンボーディング計画——初週スケジュール、バディ+マネージャー紹介、学習トラック、機器チェックリスト、『準備完了の目安』。「オンボーディング」「新入社員」「初週計画」「入職」といった記述がある場合に使用。 - 019
Html Ppt Taste Brutalist 16:9 HTML デッキ、タクティカルテレメトリー / CRT ターミナルスタイル。非アクティブ CRT チャコールスライド、白色リン光モノスペース、ハザードレッドアクセント、スキャンラインオーバーレイ、ASCII 構文、装飾より密度を優先。Leonxlnx/taste-skill `brutalist-skill`(タクティカルテレメトリーモード)から抽出。 - 020
Html Ppt Taste Editorial 16:9 HTML プレゼンテーション、エディトリアル・ミニマリスト様式。温かみのあるクリーム色のスライド、セリフ見出し + グロテスク本文、極細罫線、等幅メタ情報、ゆとりある余白、アクセント1色。Leonxlnx/taste-skill `minimalist-skill` より抽出。 - 021
請求書 印刷可能な請求書ページ——送信者・受信者ブロック、明細表、税金内訳、合計、支払い方法を含みます。『invoice』『bill』『billing statement』『発票』といったキーワードが要件に含まれる場合に使用します。 - 022
Kami Landing 印刷品質のシングルページ紙文書を生成——温かみのある羊皮紙キャンバス、インクブルーのアクセント、単一ウェイトのセリフ体、イタリック無し、クールグレー無し。アプリUIではなく、プロフェッショナルなホワイトペーパーやスタジオワンページャーのような出力。多言語対応設計(EN · zh-CN · ja)。単一の自己完結型HTMLファイル、依存関係ゼロ。 - 023
Kami パーチメントドキュメント 温かみのある羊皮紙キャンバス (#f5f4ed)、モノクロームインクブルーアクセント (#1B365D)、1つのセリフ書体ファミリー、編集グレードのタイポグラフィ。 - 024
かんばんボード かんばん/タスクボード。列(To do / In progress / In review / Done)、ドラッグ可能なカード、担当者アバター、スイムレーン、上部フィルターバーを含みます。'kanban'、'task board'、'sprint board'、'trello'、'看板'が言及されたときに使用します。 - 025
過去30日間 過去30日間のコミュニティとソーシャルトレンド調査。現在の意見、最近の感情、コミュニティの反応、ソーシャルプルーフ、ローンチ反応、トレンドスキャン、または過去30日間のコンテキストに関する問い合わせに使用します。 - 026
マガジン記事 Huashu / huashu-md-html にインスパイアされたマガジン記事レイアウト。Markdown やメモを洗練された長文 HTML エッセイに変換します。 - 027
マガジンポスター 新聞紙スタイルの編集ポスター。新聞用紙、日付線、打ち消し線とイタリック体を含む特大セリフ見出し、2段組本文、引用注釈付き6つの番号セクションを備えています。雑誌ポスター、エディトリアルポスター、新聞紙レイアウト、マニフェストデザインに最適。 - 028
マーケティングポスター 縦型ポスターやストーリーズ風のシェア画像、視覚的インパクトが強い。 - 029
議事録 議事録ページ — 参加者付きタイトルバー、アジェンダチェックリスト、決定事項ブロック、担当者と日付付きアクションアイテムテーブル、および「次回会議」フッター。'議事録'、'minutes'、'1:1ノート'、'全社ミーティング要約'、'会議紀要'などの指示に使用。 - 030
モバイルアプリ ピクセル単位で正確な iPhone 15 Pro フレーム内にレンダリングされるモバイルアプリ画面。assets/template.html をコピーし、references/layouts.md から1つの画面アーキタイプを貼り付けて構築します。ブリーフで『モバイルアプリ』『iOS アプリ』『Android アプリ』『スマホ画面』『アプリ UI』が求められた際に使用します。 - 031
モバイルオンボーディング 3つのスマホ画面を並べたマルチスクリーンのモバイルオンボーディングフロー(スプラッシュ、バリュープロップ、サインイン)。ステータスバー、スワイプドット、プライマリCTAを含む。『モバイルオンボーディング』『iOSオンボーディング』『スマホサインアップ』『移动端引导』に関する要件に対応。 - 032
モダン履歴書 モダンでミニマルな履歴書、A4サイズ1ページ、印刷またはPDF出力に対応。 - 033
Motion Frames ループするCSS アニメーション(回転するテキストリング、アニメーション地球儀、タイマー、パララックスラベル)を含む単一フレームのモーションデザイン合成。HyperFrames や任意のキーフレームベースのエクスポーターに直接渡せるヒーロー動画ポスターとしてレンダリング。モーションデザイン、アニメーションヒーロー、ループ、動画ポスター、タイトルカードの要件に対応。 - 034
Open Design ランディングページ Atelier Zero ビジュアル言語(Monocle / Apartamento / Études エディトリアルコラージュ)を使用した単一ページのランディングサイトを生成。ブランドブリーフから inputs.json を入力し、gpt-image-2 で最大16枚のコラージュアセットを生成、自己完結型 HTML を出力。スクロールアニメーションと固定ナビゲーションを自動実装。 - 035
Orbit 総合ブリーフィング 2つ以上のコネクタを接続すると、Orbit が自動的に起動し、過去24時間のすべての認証済みコネクタ(GitHub、Linear、Notion、Slack、飞书、カレンダー、Gmail、ドライブ、Sentry、Vercel など)からアクティビティを取得し、「我的设计」の上部にアダプティブなベントグリッドダッシュボードを生成します。Orbit の日次ダイジェストスケジューラーによって自動実行されます。 - 036
Orbit Github GitHub コネクタに基づいて毎日のダイジェストを自動生成する Orbit スキル。過去 24 時間の PR、レビューリクエスト、Issue、CI 実行、マージを取得し、GitHub ネイティブ通知風のレイアウトで表示します。Orbit の毎日ダイジェストスケジューラーによって自動起動されます。 - 037
Orbit Gmail Gmail が唯一の接続サービスの場合、または明示的に指定された場合に、過去 24 時間の受信トレイアクティビティを抽出してデイリーダイジェストを生成します。Orbit スケジューラーにより自動起動され、手動での実行は不要です。 - 038
Orbit Linear Linearがユーザーの唯一の接続済みコネクタである場合、またはユーザーがデイリーダイジェストをLinearに明示的にスコープした場合にOrbitパイプラインによって自動的にトリガーされます。過去24時間の課題の動き、ステータス変更、アサイン、サイクル進捗を取得し、Linearネイティブの受信トレイビジュアル言語でレンダリングします。 - 039
Orbit Notion Open Orbit ブリーフィングスキル — Notion がユーザーの唯一の接続コネクタである場合、またはユーザーがデイリーダイジェストを明示的に Notion にスコープした場合に Orbit パイプラインによって選択されます。過去24時間のドキュメント編集、コメント、メンション、データベース行の変更をユーザーの認証済み Notion 接続から取得し、ネイティブ Notion ページ(コールアウト/トグル/データベーステーブル)としてダイジェストをレンダリングします。このスキルは手動でトリガーすべきではありません — Orbit のデイリーダイジェストスケジューラによってライブ Notion データに対して呼び出されます。 - 040
プロダクト仕様書 1ページのプロダクト仕様書/PRD——課題、成功指標、スコープ、ユーザーストーリー、デザインノート、ロールアウト計画、未解決の質問を記載。仕様書や要件定義書の作成に使用。 - 041
料金ページ 独立した料金ページ — ヘッダー、プラン階層、機能比較表、FAQを含みます。「料金」「プラン」「サブスクリプション階層」または「プラン比較」ページが必要な場合に使用します。 - 042
Reddit投稿カード 投票レールとコメント数を備えたリアルなReddit投稿カード。動画オーバーレイやストーリー共有に最適です。 - 043
SaaS ランディング ヒーロー、機能紹介、ソーシャルプルーフ、料金、CTAを含むシングルページのSaaSランディングページ。有効なDESIGN.mdのカラー/タイポグラフィ/レイアウトトークンに準拠。トリガーキーワード:"saas landing"、"marketing page"、"product landing"。 - 044
ソーシャルカルーセル 1080×1080の正方形で構成される3枚のソーシャルメディアカルーセル。映画的でブランドに沿った3つのパネルに、シリーズ全体で連続する見出し(『前へ。』→『次へ。』→『先を見据えて。』)を配置。各カードにはブランドマーク、番号/総数、キャプション、「ループ」アフォーダンスが含まれます。『カルーセル投稿』『ソーシャルカルーセル』『Instagram カルーセル』『LinkedIn シリーズ』『X スレッドカード』『三連発』などの要件に対応。 - 045
ソーシャルメディアダッシュボード クリエイター向けソーシャルメディア分析ダッシュボード、単一 HTML ファイル。プラットフォーム切り替え(X / LinkedIn / YouTube / Instagram)、KPI カード(フォロワー数、エンゲージメント率、いいね数、リポスト数)、フォロワー成長チャート、今週のトップ投稿プレビュー、トレンドトピック/トップコメントサイドパネルを搭載。 - 046
Spotify 再生中カード Spotify風の再生中カード。アルバムアート、プログレスバー、再生コントロールを備え、動画オーバーレイや個人ホームページに最適。 - 047
スプライトアニメーション ピクセルアート風のアニメーション解説スライド。クリーム色の背景、太字の年号表示、ピクセルアートのマスコット(花札カード、キノコ、8ビットゲーム機など)、動的な日本語タイポグラフィとタイムラインリボンを特徴とします。CSS アニメーションのみで、縦動画として録画可能。 - 048
チーム OKR OKR トラッカーページ — 四半期バナー、3つの目標とその主要結果をプログレスバーで表示、オーナーアバター、ステータスピル、『今四半期の概要』サイドバー。OKR、主要結果、目標、または「目标」に言及がある場合に使用。 - 049
調整ツール HTML要素にライブコントロールパネルを追加し、アクセントカラー、タイプスケール、密度、モーション、テーマをリアルタイムで調整。CSSカスタムプロパティを即座に書き換え、localStorageに保存します。 - 050
Twitter シェアカード 投稿と組み合わせて使用するTwitterの引用またはデータカード。 - 051
ウェイトリストページ メールアドレス収集、ブランドロゴ、オプションの装飾レイヤーを備えたミニマルなプレローンチランディングページ。DESIGN.md から配色、タイポグラフィ、レイアウトルールを読み込みます。製品ローンチ、ベータサインアップ、早期アクセスプログラム、インディープロジェクトに最適。 - 052
Webプロトタイプ 汎用デスクトップWebプロトタイプ。`assets/template.html` をコピーし、`references/layouts.md` のレイアウトを貼り付けて単一の自己完結型 HTML ファイルを生成。ランディングページ、マーケティング、ドキュメント、SaaS ページのデフォルトオプション。 - 053
Web Prototype Taste Brutalist スイス産業印刷スタイルのウェブプロトタイプ。新聞紙キャンバス、モノリシックな黒のグロテスク書体、ビューポートから溢れる数字、ヘアライングリッド分割、ハザードレッドアクセント、ASCII シンタックス装飾。Leonxlnx/taste-skill `brutalist-skill`(スイス産業印刷モード)より抽出。 - 054
Web Prototype Taste エディトリアル エディトリアル・ミニマリストなウェブプロトタイプ。暖色モノクロームキャンバス、セリフ見出し+グロテスク本文、1pxヘアライン、ミュートパステルチップ、余白重視、アンビエントモーション。 - 055
Web Prototype Taste Soft Apple レベルのソフトなウェブプロトタイプ。シルバー/クリームキャンバス、ダブルベゼルカード、ネストボタン CTA、大きなスコーナー、スプリングモーション、アンビエントメッシュ。Leonxlnx/taste-skill の soft-skill およびセクション 4-8 に基づく。 - 056
ワイヤーフレームスケッチ 手描き風のワイヤーフレーム。方眼紙の背景、マーカー/鉛筆のトーン、複数のタブラベル、付箋メモ、ラフなチャート、ハッチング塗りを収録。「ワイヤーフレーム」「スケッチ」「手描き」「ローファイ」「ホワイトボード」などの要件に最適。 - 057
X / Twitter 投稿カード いいね、リポスト、閲覧数などのエンゲージメント指標を含むリアルなX投稿カード。動画オーバーレイやシェア可能な画像カードに最適。 - 058
X リサーチ 市場、企業、製品、コミュニティに関する X/Twitter の世論調査。X や Twitter の感情分析、暗号コミュニティの意見、専門家の投稿、株式・セクター・企業・製品・市場イベントへの反応を知りたい場合に使用します。 - 059
Xiaohongshuカード Xiaohongshuスタイルのナレッジカードをスワイプ可能なマルチカードカルーセルで表示。