分類 デザイン · インテリジェンス Apache-2.0 · 地球製
Open Source Claude Design

テンプレート.

エージェントが生成したアーティファクト — プロトタイプ、スライド、画像・動画テンプレート — をフォークしてそのままデプロイできます。ローカルエージェントで独自のキーを使って実行できます。プロンプト、ポスター、サンプルHTMLすべてApache-2.0ライセンスです。

合計 · 254
AeroCore — Cinematic Aerospace Engine Landing のプレビュー プロトタイプ
@eli Open Design
プロンプト全文を読む →

AeroCore — Cinematic Aerospace Engine Landing

Premium scroll-cinematic aerospace propulsion marketing site: a blue-to-warm-white gradient hero with parallax wordmark and engine still, a mission thumbnail that grows into a fullscreen sticky video, a pinned tabbed showcase, a bento capabilities grid with looping video cards and a tool marquee, an animated dark stats chart, a horizontal video-story rail, and a starfield footer.

オーディオジングル のプレビュー 音声
@open-design Open Design
プロンプト全文を読む →

オーディオジングル

オーディオ生成スキル——ジングル、ベッド、ナレーション、効果音。音楽リクエストを Suno V5 / Udio / Lyria に、音声を MiniMax TTS / FishAudio / ElevenLabs V3 に、効果音を ElevenLabs SFX または AudioCraft にルーティング。出力はプロジェクトフォルダに保存される単一の MP3/WAV ファイルです。

デザイン評価 のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

デザイン評価

プロジェクト内の任意の HTML 成果物に対して 5 次元の専門デザインレビューを実施——哲学/視覚階層/ディテール/機能性/革新性を各 0-10 で採点。レーダーチャート、根拠に基づくスコア、3 つのリスト(維持/修正/クイックウィン)を含む単一の HTML レポートを出力します。

デート ウェブ のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

デート ウェブ

コンシューマー向けのマッチングダッシュボード。左サイドナビゲーション、コミュニティシグナルのティッカーバー、主要KPI、30日間の相互マッチング棒グラフ、マッチ率トレンドブロックを含む。エディトリアルタイポグラフィと控えめなアクセント。デートサイト、マッチング、コミュニティダッシュボード、SNSダッシュボードなど、データが主役の消費者向け製品に最適。

デジタルガイド のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

デジタルガイド

2ページのデジタルガイドプレビュー。1ページ目はカバー(タイトル、著者、『含まれる内容』統計、目次のティーザー)、2ページ目は見開き(引用文とステップリスト付きのレッスン本文)。ライフスタイル/クリエイターブランドのトーン。『電子ガイド』『デジタルガイド』『lookbook』『リードマグネット』『クリエイターガイド』『playbook』『PDFガイド』または『電子指南』が求められる場合に使用。

エンジニアリングランブック のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

エンジニアリングランブック

エンジニアリングランブック — サービス概要、アラート表、ダッシュボードリンク、コピペ可能なコマンド付き運用手順、オンコールローテーション、インシデント対応チェックリストを含みます。ランブック、運用ドキュメント、オンコールガイド、SREドキュメント、運維手册が必要な場面で使用します。

Flowai ライブダッシュボードテンプレート のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Flowai ライブダッシュボードテンプレート

FlowAI スタイルのチーム管理ダッシュボード。3つのタブ(チームメンバー、チーム詳細、アクティビティログ)、KPI統計行、メンバーテーブル、役割分布バーチャート、オンライン状態とアクティビティのスパークライン、トップ貢献者パネルを搭載。ライト/ダークテーマ、チャートツールチップ、パネルのクリック拡大、CSV エクスポートに対応。

ゲームスクリーンショット - アニメ格闘ゲーム:キャプテン・リュウガ vs カゼ・レンシン のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

ゲームスクリーンショット - アニメ格闘ゲーム:キャプテン・リュウガ vs カゼ・レンシン

Street Fighter 6 や Tekken 8 スタイルの格闘ゲームビジュアル。夜の中国寺院の中庭で対決する2人のアニメ風男性戦士を描き、完全な格闘ゲーム HUD(デュアル体力ゲージ、ラウンドタイマー、P1/P2 キャラクターパネル、コンボカウンター、ゲージ)を搭載。gpt-image-2 用に最適化、16:9。

ゲームスクリーンショット - 三国志ARPG:呂布の轅門射戟 のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

ゲームスクリーンショット - 三国志ARPG:呂布の轅門射戟

三国志の名場面「呂布の轅門射戟」を再現したアクションRPGのゲーム画面。Black Myth: Wukong風のフォトリアルな映画的スタイル、Unreal Engine 5で描画。三人称視点のゲームプレイ画面に、完全なゲームHUD(HP・気力バー、ミニマップ、スキルホットバー、ターゲットロックと距離表示)を搭載。gpt-image-2向け16:9形式。

ゲームスクリーンショット - 三国志 ARPG:趙雲の長坂坡脱出戦 のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

ゲームスクリーンショット - 三国志 ARPG:趙雲の長坂坡脱出戦

趙雲が片手で幼い劉禅を抱き、もう片手で槍を振るい敵陣を突破する三国志の名場面を描いた ARPG ゲームスクリーンショット。Black Myth: Wukong と Elden Ring スタイルの映画的フォトリアル表現で、護衛保護バーやコンボカウンターなど完全な HUD を搭載。

ゲーム UI - 古代中国オープンワールド MMO HUD のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

ゲーム UI - 古代中国オープンワールド MMO HUD

Black Myth: Wukong スタイルの映画的なフォトリアル表現による、古代中国を舞台にした AAA オープンワールド MMO のゲーム内 HUD スクリーンショットモックアップを生成。キャラクターポートレート、HP/MP バー、中国書道風スキルアイコン付きホットバー、ミニマップ、クエストトラッカー、チャットウィンドウなど完全な MMO HUD を含む 16:9 画面。

ゲーミフィケーションアプリ のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

ゲーミフィケーションアプリ

3画面のゲーミフィケーションアプリプロトタイプ:カバー画面、XPリボンとレベルバー付き今日のクエスト、クエスト詳細。ゲーミフィケーションアプリ、習慣トラッカー、RPG風ライフアプリ、レベルアップアプリ、デイリークエスト、XP/連続記録アプリに最適。

GitHub ダッシュボード のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

GitHub ダッシュボード

GitHub リポジトリ分析ダッシュボード — スター、フォーク、コントリビューター、イシュー、プルリクエスト、最近のアクティビティ、トップコントリビューター。GitHub リポジトリダッシュボード、オープンソース成長レポート、リポジトリヘルスページ、GitHub 分析ビューに使用。

Hatch Pet のプレビュー 画像
@open-design Open Design
プロンプト全文を読む →

Hatch Pet

キャラクターアート、スクリーンショット、生成画像から Codex 互換のペットアニメーションスプライトシートを作成、修復、検証、プレビュー、パッケージ化。8x9 アトラス、透明な未使用セル、行ごとのアニメーションプロンプト、QA コンタクトシート、プレビュー動画、pet.json パッケージングを自動生成。

HTML PPT 方向キーナビ ミニマル のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

HTML PPT 方向キーナビ ミニマル

8ページのミニマル方向キー keynote — 各ページに単色背景(インディゴ / クリーム / 深紅 / ティール / グレー / パープル / ホワイト / チャコール)、160px displayタイトル + 4px太線アクセント区切り、矢印 → プレフィックスの Mono リスト、左下 ← → kbd ヒント + 右下ページ番号、大きな余白。『話すことはあるが見せるものは少ない』keynote、ローンチ、プレゼンに最適。

Html Ppt Graphify Dark Graph のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Graphify Dark Graph

ダークテーマのナレッジグラフ deck。深夜のグラデーション (#06060c→#0e1020)、浮遊する blur orbs、SVG 力学グラフ、レインボーグラデーションタイトル、JetBrains Mono CLI ハイライト、glass-morphism カードを搭載。dev-tool / CLI / ナレッジグラフ / データビジュアライゼーション向けで、'AI-native + SF + 暖色系' の雰囲気。

Html Ppt Hermes サイバーターミナル のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Hermes サイバーターミナル

ダークターミナル風プレゼンテーションテンプレート。#0a0c10 黒背景、56px サイバーグリッド、CRT ビネット、スキャンライン、ウィンドウ信号灯 chrome、`$ prompt` コマンドラインタイトル、ミントグリーン #7ed3a4 大文字、JetBrains Mono、アウトラインのみの棒グラフ、点滅カーソル、琥珀/緑/赤の3段階タグ、ダークコードブロック。CLI/agent/開発ツールレビューに最適(trace、diff、benchmark を含む)。

Html Ppt ナレッジアーキテクチャ設計図 のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt ナレッジアーキテクチャ設計図

クリーム色の設計図アーキテクチャデッキ — クリーム紙 #F0EAE0 ベース + 単一の錆赤 #B5392A ハイライト、48px 設計図グリッドマスク、2px 黒枠ハードカード、パイプラインステップボックス(1つを浮き上がらせる)、右側の錆赤インサイトコールアウト、Playfair セリフ大文字、SVG 破線フィードバックループ。グラデーションなし、ソフトシャドウなし、シリアスで印刷に最適。

Html Ppt Obsidian Claude Gradient のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Obsidian Claude Gradient

GitHub ダークパープルグラデーションデッキテーマ。GitHub-dark #0d1117 背景、紫青の放射状アンビエントライト、60px グリッドマスク、中央揃えレイアウト、パープルピルタグ、3色グラデーション見出し(#a855f7→#60a5fa→#34d399)、GitHub スタイルコードパレット、紫の左ボーダーハイライトブロックを搭載。開発者ワークフロー、MCP、Agent、開発ツールチュートリアルに最適。

Html Ppt プレゼンターモード Reveal のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt プレゼンターモード Reveal

プレゼンターモード専用デッキ — tokyo-night デフォルトテーマ、T キーで切り替え可能な 5 つのテーマ、各ページに 150-300 字の詳細スクリプト例(<aside class="notes">)、S キーで popup を開く(CURRENT / NEXT / SCRIPT / TIMER の 4 枚のカード)。技術共有、公開スピーチ、授業での使用に最適。

Html Ppt Taste Brutalist のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Html Ppt Taste Brutalist

16:9 HTML デッキ、タクティカルテレメトリー / CRT ターミナルスタイル。非アクティブ CRT チャコールスライド、白色リン光モノスペース、ハザードレッドアクセント、スキャンラインオーバーレイ、ASCII 構文、装飾より密度を優先。Leonxlnx/taste-skill `brutalist-skill`(タクティカルテレメトリーモード)から抽出。

Html Ppt Xhs パステルカード のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Xhs パステルカード

柔らかなマカロンカラーのスローライフ deck — クリーム #fef8f1 背景 + 3つのソフトブロブ、Playfair イタリック serif display タイトル + sans 本文、28px 角丸マカロンカード(ピーチ / ミント / スカイ / パープル / レモン / ローズ)、Playfair イタリック 01-04 番号、SVG ドーナツ図、chip+page トップバー。ライフスタイル / 個人成長 / スローライフ / エモーショナルコンテンツに最適、『雑誌、手作り、テックすぎない』雰囲気。

Html Ppt Xhs ホワイト編集風 のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Xhs ホワイト編集風

白背景の雑誌風デッキ — 純白背景 + 上部10色レインボーバー、80-110pxディスプレイタイトル、紫→青→緑→オレンジ→ピンクのグラデーション文字、マカロンソフトカード(ピンク/紫/青/緑/オレンジ)、黒背景白文字.focusピル、引用ブロック。小紅書の画像投稿と横型PPTの両方に対応。

Html Ppt Zhangzara Biennale Yellow のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Biennale Yellow

ビエンナーレイエロー — 温かみのある羊皮紙に太陽の黄色、深いインディゴのセリフ体と雰囲気のある陽光グラデーション。アートビエンナーレのポスター、美術館の年間プログラム、展覧会プレゼン、デザインカンファレンス資料、キュレーター提案書、文芸出版物、スタジオ回顧展などに最適。

Html Ppt Zhangzara ボールドポスター のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara ボールドポスター

ボールドポスター — 大型 Shrikhand ディスプレイフォントと消防車レッドのアクセントを使用したエディトリアルポスター美学。ブランドマニフェスト、創業者ビジョンデッキ、編集・文化提案、クリエイティブレビューなど、雑誌の表紙のようなインパクトが必要なコンテンツに最適。

Html Ppt Zhangzara Broadside のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Broadside

Broadside — ダークな編集キャンバスに、単一のファイアオレンジのアクセントとラテン文字/中国語のバイリンガルタイプスタックを組み合わせたテンプレート。新聞の見出しのようなインパクトが必要なコンテンツに最適:ブランドマニフェスト、雑誌や文化的提案、デザイン講演、英語/中国語バイリンガルデッキ、創業者のビジョンステートメント。

Html Ppt Zhangzara カプセル のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara カプセル

Capsule — 温かみのあるボーン色の背景に配置されたモジュール式のピル型カード、フルパステルポップパレット付き。モジュール式でモダン、Y2K風のデザインに最適:ライフスタイルブランド、クリエイターポートフォリオ、DTC立ち上げ、美容・ウェルネス、エージェンシー資料。

Html Ppt Zhangzara Cartesian のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Cartesian

Cartesian — 落ち着いた暖色系ニュートラルパレットとクラシカルな Playfair セリフ体。上品でゆったりとした印象。投資報告書、ホワイトペーパー、コンサルティング資料、長編リサーチ、ギャラリー・文化プレゼンテーションなど、静かで思慮深く大人な雰囲気が必要なコンテンツに最適。

Html Ppt Zhangzara Creative Mode のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Creative Mode

Creative Mode — クリーム色の紙のキャンバスに自信あふれるマルチカラー(グリーン、ピンク、オレンジ、イエロー)のアクセントと Archivo Black フォントを採用。デザイン主導で自信を感じさせたいあらゆるシーン:クリエイティブエージェンシーのピッチ、デザインスタジオのデッキ、広告代理店の実績資料、ブランドクリエイティブレビュー、アートディレクションレビューに最適。

Html Ppt Zhangzara Daisy Days のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Daisy Days

Daisy Days — 手描きのデイジー、星、虹が描かれた明るいパステルデッキ。親しみやすく、柔らかく、温かみのあるデザイン。教育コンテンツ、子供と家族向け、ウェルネスプログラム、コミュニティワークショップ、クラフト・イラスト作品集など、親しみやすく優しい印象が必要なあらゆるコンテンツに最適。

Html Ppt Zhangzara Editorial Tri Tone のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Editorial Tri Tone

Editorial Tri-Tone — 3色エディトリアルシステム:ダスティピンク、マスタードクリーム、ディープバーガンディを Bricolage + Instrument Serif で構成。ファッション誌風のコンテンツに最適:編集企画、ファッションブランドデッキ、ライフスタイルメディア、アートディレクションレビュー。

Html Ppt Zhangzara Grove のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Grove

Grove — フォレストグリーンのキャンバスにクリーム色の文字、クラシックな Playfair セリフ体、ラストカラーのアクセント。サステナビリティやウェルネスブランド、アウトドア/自然製品、ワイナリーやレストラン、文学・芸術プレゼン、コンサル成果物、日英/中英バイリンガルレポートなど、オーガニックで洗練された大人の印象が必要なコンテンツに最適。

Html Ppt Zhangzara Long Table のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Long Table

Long Table — 温かみのあるクリーム色とラストレッドのサパークラブ美学。太字のグロテスク大文字見出し、イタリック体のFraunces、ピル型のアウトラインボタンが特徴。温かく親密でモダンなホスピタリティ・コミュニティブランドに最適:サパークラブ、ディナーシリーズ、小規模レストラン、クリエイティブスタジオイベント、メンバーシップ提案、ライフスタイル・ワインブランド。

Html Ppt Zhangzara Mat のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Mat

Mat — ダークセージのキャンバスに、ボーンペーパーとバーントオレンジのアクセント。ウッドトーンを基調としたミッドセンチュリーモダン。デザインスタジオのポートフォリオ、建築・インテリアブランド、陶器・クラフト・家具、コンサルティング資料など、ミッドセンチュリーで触覚的、意図的な雰囲気が必要な場面に最適。

Html Ppt Zhangzara Monochrome のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Monochrome

モノクローム——アイボリーの台帳用紙に純黒の文字。見出しは Lora セリフ体、本文は Jost、完全な無彩色。手組み台帳のような雰囲気が必要なコンテンツに最適:ユーザー調査の総括、ホワイトペーパー、長文レポート、学術・政策ブリーフ、コンサルティング成果物、英中バイリンガルレポート。

Html Ppt Zhangzara 人民プラットフォーム のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara 人民プラットフォーム

人民プラットフォーム(ブロック&ボールド)— アクティビストポスターエネルギー:クリーム色の背景に青、オレンジ、赤を配色し、Alfa Slab + Caveat Brush フォントを使用。率直でラウドでグラフィカルな表現に最適:文化評論、マニフェスト、コミュニティプレゼン、デザイントーク、キャンペーン提案。

Html Ppt Zhangzara Pink Script のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Pink Script

Pink Script — After Hours — ブラックキャンバス、ホットピンクのアクセント、パールクリームの紙、Instrument Serif見出し:深夜のエディトリアルラグジュアリー。ファッションブランドデッキ、クリエイターのパーソナルブランド、ナイトライフ/スピリッツローンチ、ラグジュアリー商品発表、エディトリアル特集など、夜間の洗練されたラグジュアリーな雰囲気に最適。

Html Ppt Zhangzara Playful のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Playful

Playful — 太陽のような温かみのあるピーチ背景にSyneフォントを組み合わせた、フレンドリーなインディープロダクト向けプレゼンテーション。クリエイターポートフォリオ、インディープロダクトローンチ、ライフスタイルブランド、スモールビジネスピッチ、コミュニティデッキなど、温かく親しみやすい雰囲気が必要なシーンに最適。

Html Ppt Zhangzara Raw Grid のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Raw Grid

Raw Grid — 太い境界線、オフセットシャドウ、ピンク/セージ/インクのパレットを備えたネオブルータリストデッキ。直接的でグラフィカルな自信を表現したいシーンに最適:創業者ピッチ、アクセラレーターデモ、ブランドデッキ、インディーローンチ、クリエイターポートフォリオ。

Html Ppt Zhangzara Retro Zine のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Retro Zine

Retro Zine — ベージュの紙にグリーンのアクセント、Bebas Neue + Caveat フォント使用:HTML 形式のリソグラフ印刷風 Zine。インディー雑誌、音楽・アートブランド、クリエイターポートフォリオ、小ロット製品ローンチ、コミュニティデッキなど、印刷物感、ローファイ、手作り感が必要なシーンに最適。

Html Ppt Zhangzara Sakura Chroma のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Sakura Chroma

Sakura Chroma — ヴィンテージ日本カセットパッケージの美学:クリーム色の紙、斜めのレインボーリボン、コンデンス太字、JIS規格チェックボックス。インディーハードウェアブランドデッキ、音楽レーベルリリーススケジュール、アナログスタジオ回顧録、雑誌企画、カワイイテック製品発表、クリエイティブスタジオ年次報告に最適。

Html Ppt Zhangzara Scatterbrain のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Scatterbrain

Scatterbrain — 付箋インスパイア:パステルカラーの付箋、Caveat 手書きフォント、Shrikhand と Zilla Slab タイプスタック。デザイナーのホワイトボードシーン向け:ブレスト、ワークショップ、クリエイティブエージェンシー資料、デザイン思考セッション、アイデア提案、アートディレクションレビュー。

Html Ppt Zhangzara ソフトエディトリアル のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara ソフトエディトリアル

ソフトエディトリアル — Cormorant Garamond セリフフォントを温かみのある紙の背景に、セージ、ブラッシュ、レモンのアクセントで。文学的で優雅でゆったりとした雰囲気に:編集特集、ブランドストーリー、ギャラリー/美術館プレゼン、アドバイザリー成果物、ウェディング/ライフスタイルメディア、創業者エッセイ。

Html Ppt Zhangzara ステンシルタブレット のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara ステンシルタブレット

ステンシル&タブレット——ボーン紙にステンシルカットの見出しと6色のアースパレット:考古学とブランドの融合。博物館や文化施設のプレゼン、アート/建築ブランド、長文リサーチ、伝統工芸ブランド、マニフェストなど、アーカイブ的で触感的、重厚なグラフィックが必要なコンテンツに最適。

Html Ppt Zhangzara Vellum のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Html Ppt Zhangzara Vellum

Vellum — 深いネイビーのキャンバスに暖かみのある黄色のイタリック Cormorant セリフ体と単一のダスティティールアクセント。静かで学術的な美学。研究論文、ホワイトペーパー、学術・政策ブリーフ、アドバイザリー成果物、長文記事、創業者の考察など、学術的で文学的、知的な印象を与えたいコンテンツに最適。

Hyperframes のプレビュー 動画
@open-design Open Design
プロンプト全文を読む →

Hyperframes

HyperFrames HTML で動画コンポジション、アニメーション、タイトルカード、オーバーレイ、字幕、ナレーション、オーディオリアクティブビジュアル、シーントランジションを作成。HTML ベースの動画コンテンツ制作、音声同期字幕追加、テキスト読み上げナレーション生成、音楽連動アニメーション(ビート同期、グロー、パルス)、アニメーションテキスト強調(マーカースイープ、手描き円、バーストライン、スクリブル、スケッチアウト)、シーントランジション(クロスフェード、ワイプ、リビール、シェーダートランジション)に対応。

動画
@heygen Open Design
プロンプト全文を読む →

HyperFrames:30秒ブランドプロモーション映像

30秒 16:9 HyperFrames プロモーション映像 — 高速カット、ビート同期キネティックタイポグラフィ、オーディオリアクティブなテキストスケール、5つのシーン間のシェーダートランジション、ロゴブルーム付きエンドカード。学生キットの aisoc-hype アーキタイプをベースにしています。

動画
@heygen Open Design
プロンプト全文を読む →

HyperFrames:30秒 SaaS プロダクトプロモ(Linear スタイル)

Linear/ClickUp スタイルのプロダクト映像を模した30秒の HyperFrames コンポジション——UI 3D リビール、ビート同期キネティックタイポグラフィ、アニメーション UI スクリーンショット、ロゴアウトロ付きエンドカード。HF カタログブロック(ui-3d-reveal、app-showcase、logo-outro)とシーン間シェーダートランジションで構築。

動画
@heygen Open Design
プロンプト全文を読む →

HyperFrames:9:16 ソーシャルオーバーレイスタック(X · Reddit · Spotify · Instagram)

15秒の縦型1080×1920 HyperFrames構成。フェイスカムループの上に4つのアニメーションソーシャルカードを重ねます—Xの投稿、Redditのリアクション、Spotifyの再生中カード、最後にInstagramのフォローCTA。各カードはHyperFramesカタログブロックで、振り付けが付加価値です。

動画
@heygen Open Design
プロンプト全文を読む →

HyperFrames:9:16 TikTok トーキングヘッド+カラオケキャプション

縦型 1080×1920 HyperFrames ショート動画 — TTS ナレーション付きトーキングヘッドとフェイスカムループ映像に、カラオケスタイルの単語同期キャプション、アニメーション下三分割テロップ、最後に TikTok フォロー誘導オーバーレイを配置。HyperFrames 学生キットの may-shorts-19 アーキタイプを踏襲。

動画
@heygen Open Design
プロンプト全文を読む →

HyperFrames:Apple スタイルフライトマップ(出発地 → 目的地)

8秒間の16:9シネマティックな飛行ルートマップ——リアルな地形ズーム、曲線経路に沿って出発地から目的地へ滑空するアニメーション飛行機、都市ラベル、動的距離カウンター。HyperFrames `nyc-paris-flight` カタログブロックをベースに構築され、任意の都市ペアに再利用可能。

動画
@heygen Open Design
プロンプト全文を読む →

HyperFrames:ウェブサイト→動画変換パイプライン(15秒マーケティング版)

3つのビューポートサイズでウェブサイトをキャプチャし、色収差ラジアル分割でシーン間をアニメーション遷移する15秒16:9のHyperFramesコンポジション。サイトをソースアセットとするhyperframes-sizzle学生キットのアーキタイプに準拠。

投資銀行ピッチブック のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

投資銀行ピッチブック

戦略的選択肢のための投資銀行ピッチブック。類似企業分析、先例取引、バリュエーションフットボールフィールド、DCF感応度分析、戦略オプションマトリックス、プロセス提案を含む。投資銀行固有のフォーマット、開示バンド、出典ラベルを保持。取締役会およびセルサイド向け資料に使用。

イラスト - クレヨン子供風手描き変換 のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

イラスト - クレヨン子供風手描き変換

あらゆる参考画像を10歳の子供が描いたようなクレヨンイラストに変換。明るいクレヨンカラーと白い紙に、お城やキャンディ、星、雲、虹などの童心あふれる要素を加えます。Webスクリーンショット、ブランドビジュアル、商品写真、ポートレートに対応した gpt-image-2 の画像編集機能。

インフォグラフィック - オタク踊りの振付分解図(極楽浄土、16パネル) のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

インフォグラフィック - オタク踊りの振付分解図(極楽浄土、16パネル)

2:3縦型ポスター、4×4グリッドの16個の正方形パネルで構成され、人気曲「極楽浄土」の完全な振付分解チャートを表示。各パネルには同じ半リアル系アニメアイドル少女(ピンクツインテール、セーラー襟スクールアイドル衣装)のシグネチャーポーズを収録。AI動画生成用のポーズ参照シートとして設計、gpt-image-2対応、2:3比率。

Kami Deck のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Kami Deck

kami(紙)デザインシステムで印刷品質のスライドデッキを作成:温かみのある羊皮紙背景(表紙・章扉はインクブルー)、単一ウェイトのセリフ体、スライドごとのインクブルーアクセント ≤ 5%、イタリック不使用。横スクロール雑誌風ページネーション(←/→ · ホイール · スワイプ · ESC 一覧)。単一 HTML ファイル、Google Fonts 以外の依存関係なし。

Kami Landing のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Kami Landing

印刷品質のシングルページ紙文書を生成——温かみのある羊皮紙キャンバス、インクブルーのアクセント、単一ウェイトのセリフ体、イタリック無し、クールグレー無し。アプリUIではなく、プロフェッショナルなホワイトペーパーやスタジオワンページャーのような出力。多言語対応設計(EN · zh-CN · ja)。単一の自己完結型HTMLファイル、依存関係ゼロ。

ライブダッシュボード のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

ライブダッシュボード

Notion スタイルのチームダッシュボードを Live Artifact としてレンダリング。KPI、7 日間のスパークライン、リアルタイムアクティビティフィード、リンクデータベースタスクテーブルを含む単一ページの自己完結型 HTML ダッシュボード。Composio コネクタカタログ経由で Notion に接続。オンデマンドおよび開封時に更新し、コネクタ未接続時はモックデータで動作。

モバイルアプリ のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

モバイルアプリ

ピクセル単位で正確な iPhone 15 Pro フレーム内にレンダリングされるモバイルアプリ画面。assets/template.html をコピーし、references/layouts.md から1つの画面アーキタイプを貼り付けて構築します。ブリーフで『モバイルアプリ』『iOS アプリ』『Android アプリ』『スマホ画面』『アプリ UI』が求められた際に使用します。

モバイルオンボーディング のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

モバイルオンボーディング

3つのスマホ画面を並べたマルチスクリーンのモバイルオンボーディングフロー(スプラッシュ、バリュープロップ、サインイン)。ステータスバー、スワイプドット、プライマリCTAを含む。『モバイルオンボーディング』『iOSオンボーディング』『スマホサインアップ』『移动端引导』に関する要件に対応。

Motion Frames のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Motion Frames

ループするCSS アニメーション(回転するテキストリング、アニメーション地球儀、タイマー、パララックスラベル)を含む単一フレームのモーションデザイン合成。HyperFrames や任意のキーフレームベースのエクスポーターに直接渡せるヒーロー動画ポスターとしてレンダリング。モーションデザイン、アニメーションヒーロー、ループ、動画ポスター、タイトルカードの要件に対応。

Notion スタイルチームダッシュボード(ライブアーティファクト) のプレビュー 画像
@joeylee12629-star Open Design
プロンプト全文を読む →

Notion スタイルチームダッシュボード(ライブアーティファクト)

単一画面の Notion ネイティブチームダッシュボードモックアップ — KPI グリッド、7日間スパークライン、アクティビティフィード、リンクデータベースタスクテーブルを搭載。データ更新やコネクタ連携に対応し、静的モックアップとしても使用可能。

Open Design ランディングページ のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Open Design ランディングページ

Atelier Zero ビジュアル言語(Monocle / Apartamento / Études エディトリアルコラージュ)を使用した単一ページのランディングサイトを生成。ブランドブリーフから inputs.json を入力し、gpt-image-2 で最大16枚のコラージュアセットを生成、自己完結型 HTML を出力。スクロールアニメーションと固定ナビゲーションを自動実装。

Open Design ランディングデッキ のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Open Design ランディングデッキ

Atelier Zero ビジュアル言語(温紙背景、イタリックセリフ強調、コーラル終端ドット、シュールコラージュ)を使用したシングルファイルスライドデッキを生成。横型マガジンスタイルのスワイプページネーション(←/→、ホイール、スワイプ)、ブランドマークとスライドカウンター付きクロームストリップ、ESC 概要グリッド、コーラルプログレスバーを搭載し、姉妹スキル open-design-landing から標準スタイルシートと 16 スロット画像ライブラリを継承。

Orbit 総合ブリーフィング のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Orbit 総合ブリーフィング

2つ以上のコネクタを接続すると、Orbit が自動的に起動し、過去24時間のすべての認証済みコネクタ(GitHub、Linear、Notion、Slack、飞书、カレンダー、Gmail、ドライブ、Sentry、Vercel など)からアクティビティを取得し、「我的设计」の上部にアダプティブなベントグリッドダッシュボードを生成します。Orbit の日次ダイジェストスケジューラーによって自動実行されます。

Orbit Linear のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Orbit Linear

Linearがユーザーの唯一の接続済みコネクタである場合、またはユーザーがデイリーダイジェストをLinearに明示的にスコープした場合にOrbitパイプラインによって自動的にトリガーされます。過去24時間の課題の動き、ステータス変更、アサイン、サイクル進捗を取得し、Linearネイティブの受信トレイビジュアル言語でレンダリングします。

Orbit Notion のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Orbit Notion

Open Orbit ブリーフィングスキル — Notion がユーザーの唯一の接続コネクタである場合、またはユーザーがデイリーダイジェストを明示的に Notion にスコープした場合に Orbit パイプラインによって選択されます。過去24時間のドキュメント編集、コメント、メンション、データベース行の変更をユーザーの認証済み Notion 接続から取得し、ネイティブ Notion ページ(コールアウト/トグル/データベーステーブル)としてダイジェストをレンダリングします。このスキルは手動でトリガーすべきではありません — Orbit のデイリーダイジェストスケジューラによってライブ Notion データに対して呼び出されます。

Replit Deck のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

Replit Deck

Replit Slides のランディングページテンプレートギャラリースタイルの単一ファイル横スワイプ HTML デッキ。8つのテーマ(helix、holm、vance、bevel、world-dark、world-mint、atlas、bluehouse)を用意。各テーマは replit.com/slides から抽出された完全なビジュアルシステム(パレット+フォント+アクセント)です。1つのテーマを選択し、混在させないでください。ピッチデッキ、取締役会報告、ブランドメモ、キャンペーン発表など、Replit Slides スタイルが必要な場合に最適です。

シンプルデッキ のプレビュー スライド
@open-design Open Design
プロンプト全文を読む →

シンプルデッキ

単一ファイルの横スワイプ HTML デッキ。assets/template.html(実績のある 5 行の iframe ナビゲーションスクリプトを含む)をコピーし、references/layouts.md からスライドレイアウトを貼り付けて構築します。ピッチデッキ、製品概要、学習資料など、magazine-web-ppt のマガジン風デザインが不要な場合に最適。

ソーシャルカルーセル のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

ソーシャルカルーセル

1080×1080の正方形で構成される3枚のソーシャルメディアカルーセル。映画的でブランドに沿った3つのパネルに、シリーズ全体で連続する見出し(『前へ。』→『次へ。』→『先を見据えて。』)を配置。各カードにはブランドマーク、番号/総数、キャプション、「ループ」アフォーダンスが含まれます。『カルーセル投稿』『ソーシャルカルーセル』『Instagram カルーセル』『LinkedIn シリーズ』『X スレッドカード』『三連発』などの要件に対応。

ソーシャルメディアダッシュボード のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

ソーシャルメディアダッシュボード

クリエイター向けソーシャルメディア分析ダッシュボード、単一 HTML ファイル。プラットフォーム切り替え(X / LinkedIn / YouTube / Instagram)、KPI カード(フォロワー数、エンゲージメント率、いいね数、リポスト数)、フォロワー成長チャート、今週のトップ投稿プレビュー、トレンドトピック/トップコメントサイドパネルを搭載。

ソーシャルメディアマトリックストラッカーテンプレート のプレビュー テンプレート
@open-design Open Design
プロンプト全文を読む →

ソーシャルメディアマトリックストラッカーテンプレート

ソーシャルメディアマトリックスデータ追跡パネルテンプレート(Social Media Matrix Tracker)。マルチプラットフォーム指標、インタラクティブチャート、ホバーインサイト、範囲比較、ダーク/ライトテーマ切り替えを備えた、映画的でデータ密度の高いソーシャルメディア分析ダッシュボードが必要な場合に使用。単一の HTML で実現可能。

ソーシャルメディア投稿 - センセーショナルガールダンス絵コンテ(8ショット) のプレビュー 画像
@open-design-contributors Open Design
プロンプト全文を読む →

ソーシャルメディア投稿 - センセーショナルガールダンス絵コンテ(8ショット)

統一感のあるダンスシーケンスを生成する8ショット完全絵コンテプロンプトセット。gpt-image-2モデル向けに調整され、グローバルスタイルトークン、共通ネガティブプロンプト、8つの個別ショットプロンプト(オープニングポーズ、ヒップグルーヴ、ボディウェーブ、ビートドロップ、サイドヒップスウェイ、ヘアフリック、パワースタンス、フィニッシングポーズ)を含みます。

スプライトアニメーション のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

スプライトアニメーション

ピクセルアート風のアニメーション解説スライド。クリーム色の背景、太字の年号表示、ピクセルアートのマスコット(花札カード、キノコ、8ビットゲーム機など)、動的な日本語タイポグラフィとタイムラインリボンを特徴とします。CSS アニメーションのみで、縦動画として録画可能。

トレーディング分析ダッシュボードテンプレート のプレビュー テンプレート
@open-design Open Design
プロンプト全文を読む →

トレーディング分析ダッシュボードテンプレート

プロフェッショナルなトレーディング分析ダッシュボードテンプレート(単一ファイル HTML)。ライト/ダークテーマ切替、密集型マーケットパネル、チャート操作、デモ/ライブ再生、コマンドパレット機能を搭載。ウォール街スタイルの分析ターミナルやハイテク金融ダッシュボードに最適。

動画
@open-design-contributors Open Design
プロンプト全文を読む →

Video - Desk Hologram AR on Real Workspace (Seedance 2.0)

A two-phase Seedance 2.0 workflow for the viral desk-hologram format: first lock a photoreal keyframe on a real developer desk (Open Design UI on the monitor, a cobalt-blue extraterrestrial hunter standing on the keyboard), then animate that still into a ~15s 9:16 image-to-video clip. Tuned for believable AR passthrough — medium-strength VFX, real desk clutter, monitor glow spill on the character, and light physical interactions (open mug, keyboard step, bow draw). Inspired by the desk-hologram Seedance 2.0 trend; no copyrighted character names in the prompt.

動画
@open-design-contributors Open Design
プロンプト全文を読む →

動画 - 三国志 ARPG - 呂布轅門の射戟(Seedance 2.0)

約10秒のゲームエンジン内アクションシーン。呂布が対峙する二つの軍勢の間で赤漆の長弓を引き、金色の気を纏った矢を遠方の戟に向けて放つ。Seedance 2.0向けに最適化されたカメラワーク、弓矢の物理演算、風砂と旗の動き、ゲームスクリーンショット風カラーグレーディングを収録。対応する静止画テンプレートとセットで使用可能。

ショート動画 のプレビュー 動画
@open-design Open Design
プロンプト全文を読む →

ショート動画

ショート動画生成スキル — 3-10秒の商品紹介、モーションティザー、アンビエントループ。デフォルトは Seedance 2 ですが、Kling 3 / 4、Veo 3、Sora 2 でも同様に動作します。出力は MP4 ファイル1つでプロジェクトフォルダに保存されます。ワークスペースにインタラクティブ動画/ハイパーフレームスキルがある場合は、長い単一クリップではなく複数のショットを1つのタイムラインに構成することを推奨します。

ウェイトリストページ のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

ウェイトリストページ

メールアドレス収集、ブランドロゴ、オプションの装飾レイヤーを備えたミニマルなプレローンチランディングページ。DESIGN.md から配色、タイポグラフィ、レイアウトルールを読み込みます。製品ローンチ、ベータサインアップ、早期アクセスプログラム、インディープロジェクトに最適。

Web Prototype Taste Brutalist のプレビュー プロトタイプ
@open-design Open Design
プロンプト全文を読む →

Web Prototype Taste Brutalist

スイス産業印刷スタイルのウェブプロトタイプ。新聞紙キャンバス、モノリシックな黒のグロテスク書体、ビューポートから溢れる数字、ヘアライングリッド分割、ハザードレッドアクセント、ASCII シンタックス装飾。Leonxlnx/taste-skill `brutalist-skill`(スイス産業印刷モード)より抽出。

よくある質問

Open Designのテンプレートとは?

Open Designに付属するバンドル型プラグインテンプレートです。Open DesignはオープンソースのClaude Design代替ツールです。各テンプレートは実行可能なアーティファクト — プロトタイプ、スライドセット、画像生成器、動画コンポジション、またはHyperFramesモーション作品のいずれか。ローカルエージェントがプロンプトとオプションのサンプルHTMLに対してプラグインを実行し、あなたのマシン上で共有可能なアセットを生成します。

テンプレートのライセンスは?

すべてApache-2.0です。プロンプトをフォーク、example.htmlを修正、ブランドトークンを変更 — 再配布する際はLICENSE通知を保持するだけです。

自分のAPIキーで実行できますか?

可能です。Open Designはあらゆる層でBYOK対応 — あなたのClaude / OpenAI / ローカルモデルの認証情報はマシンを離れません。マーケティングサイトは推論をプロキシしません。カタログ行に表示されるライブプレビューはテンプレートに付属するポスターとCloudflare Stream URLから来たもので、ホストされたランタイムからではありません。

テンプレートはどうやって投稿しますか?

nexu-io/open-design/plugins/_officialに対してPRを開き、open-design.jsonSKILL.md、実行可能なexample.htmlを含む新しいフォルダを追加してください。リポジトリのCONTRIBUTING.mdに投稿ガイドがあり、マニフェストフィールドについて説明しています。承認された投稿は公開カタログに載り、次のデプロイで自動的にここに表示されます。

Claude Design Studioとの違いは?

Claude Design StudioはAnthropicのホスト型プロダクトです。Open DesignはオープンソースのClaude Design代替ツール — このカタログ内のすべてのテンプレート、プロンプト、デザインシステムは公開リポジトリに存在し、あなたが選んだキーでローカルで実行でき、誰でも作成できるプラグインを通じて拡張可能です。同じアーティファクト分類(プロトタイプ、スライド、画像、動画)をミラーしているのでメンタルモデルは引き継がれますが、エージェントランタイムまですべてあなたのマシン上に留まります。

プレビューはどこから来ていますか?

各テンプレートのマニフェストにはポスターURL(Cloudflare CDN)が含まれ、動画テンプレートの場合はCloudflare Stream MP4が含まれます。グリッドはポスターを静的サムネイルとしてレンダリングし、ホバー時にループ動画に切り替わります。画像とプロトタイプテンプレートはポスターを直接表示します。クリックするとディテールページで実行可能なexample.htmlが開きます。