Communitygithub.com

ComposioHQ/canvas-design

美しいビジュアルアート(.png/.pdf)をデザイン哲学に基づいて作成します。ポスター、アート作品、デザインなど静的な作品をユーザーが依頼した場合に使用します。オリジナルデザインを生成し、著作権侵害を避けるため既存アーティストの作品を複製しません。

canvas-design とは?

このスキルは、AIエージェント(Claude Code、Cursor、Codexなど)が、高度なデザイン哲学に基づいてオリジナルのビジュアルアート作品を生成できるようにします。ユーザーからの入力を基に、まず独自のデザイン哲学(美学的ムーブメント)を.mdファイルとして作成し、次にその哲学を視覚的に表現した単一ページのPDF/PNGファイルを生成します。このスキルは、単なるレイアウトツールではなく、芸術的な抽象表現を重視し、最小限のテキストと視覚的要素(空間、色、構成、パターン)で作品を構成します。キャンバスフォントディレクトリから適切なフォントを読み込み、高度なクラフトマンシップとプロフェッショナルな品質を達成するように設計されています。出力はダウンロード可能な.mdファイルと.pdf/.pngファイルとして提供されます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/ComposioHQ/awesome-codex-skills/tree/main/canvas-design

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

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

ドキュメント

デザイン哲学の作成手順

これらの指示は、デザイン哲学(美的運動)を作成し、それを視覚的に表現するためのものです。出力は.mdファイル、.pdfファイル、.pngファイルのみです。

以下の2つのステップで完了します。

  1. デザイン哲学の作成(.mdファイル)
  2. キャンバス上に表現(.pdfファイルまたは.pngファイル)

まず、以下のタスクを実行します。

デザイン哲学の作成

まず、以下を通じて解釈される視覚哲学(レイアウトやテンプレートではない)を作成します。

  • 形態、空間、色彩、構成
  • 画像、グラフィック、形状、パターン
  • 視覚的アクセントとしての最小限のテキスト

重要な理解

  • 受け取るもの: ユーザーからの微妙な入力や指示。基礎として考慮するが、創造的自由を制限してはならない。
  • 作成するもの: デザイン哲学/美的運動。
  • 次に行うこと: 同じバージョンが哲学を受け取り、視覚的に表現する。90%がビジュアルデザイン、10%が必須テキストのアーティファクトを作成する。

以下のアプローチを検討してください。

  • 芸術運動のマニフェストを書く。
  • 次のフェーズではアート作品を作成する。

哲学は以下を強調しなければなりません。視覚的表现。空間的コミュニケーション。芸術的解釈。最小限の言葉。

視覚哲学の生成方法

運動に名前を付ける(1〜2語): 「ブルータリスト・ジョイ」/「クロマティック・サイレンス」/「メタボリスト・ドリームス」

哲学を明確にする(4〜6段落、簡潔だが完全):

視覚的本質を捉えるために、哲学が以下を通じてどのように現れるかを表現する。

  • 空間と形態
  • 色彩と素材
  • スケールとリズム
  • 構成とバランス
  • 視覚的階層

重要なガイドライン:

  • 冗長性を避ける: 各デザイン要素は一度だけ言及する。色理論や空間関係、タイポグラフィの原則について新しい深みを加えない限り繰り返さない。
  • クラフトマンシップを繰り返し強調する: 最終作品が、膨大な時間をかけて作成され、注意深く練り上げられ、その分野の第一人者によるものであるかのように見えることを、哲学で何度も強調しなければならない。「緻密に作られた」「深い専門知識の産物」「痛烈な注意力」「マスターレベルの実行」といったフレーズを繰り返し使用する。この枠組みは不可欠である。
  • 創造的スペースを残す: 美的方向性については具体的に述べるが、次のClaudeが極めて高いクラフトマンシップで解釈の選択を行う余地を残すために、簡潔に留める。

哲学は、次のバージョンがテキストではなく視覚的にアイデアを表現するように導く必要がある。情報は段落ではなくデザインに宿る。

哲学の例

「コンクリート・ポエトリー」 哲学: 記念碑的なフォルムと大胆な幾何学によるコミュニケーション。 視覚的表现: 巨大なカラーブロック、彫刻的なタイポグラフィ(巨大な単一の単語、極小ラベル)、ブルータリストの空間分割、ポーランドのポスターエネルギーとル・コルビュジエの融合。アイデアは説明ではなく、視覚的な重みと空間テンションによって表現される。テキストは稀で力強いジェスチャーとして使われ、段落ではなく、視覚的アーキテクチャに統合された必須の単語のみ。すべての要素は、マスタークラフターの精密さで配置される。

「クロマティック・ランゲージ」 哲学: 色彩を主要な情報システムとして。 視覚的表现: 色彩ゾーンが意味を生み出す幾何学的精密性。タイポグラフィは最小限。小さなサンセリフラベルが色彩領域にコミュニケーションを任せる。ヨーゼフ・アルバースの相互作用とデータ可視化の融合を想像せよ。情報は空間的かつ色彩的にエンコードされる。言葉は、色彩がすでに示しているものを固定するためだけに存在する。苦痛を伴う色調整の結果。

「アナログ・メディテーション」 哲学: 静かな視覚的熟考、テクスチャーと余白を通じて。 視覚的表现: 紙目の質感、インクのにじみ、広大なネガティブスペース。写真とイラストが支配する。タイポグラフィは囁くように(小さく、控えめで、視覚に奉仕する)。日本の写真集の美学。画像はページを超えて呼吸する。テキストは控えめに現れる—短いフレーズのみ、説明ブロックは決して使われない。各構成は瞑想の練習のような注意をもってバランスが取られる。

「オーガニック・システムズ」 哲学: 自然なクラスタリングとモジュール式成長パターン。 視覚的表现: 丸みを帯びたフォルム、有機的な配置、自然から建築を通じた色彩。情報は視覚図、空間関係、アイコンを通じて示される。テキストは空間に浮かぶ主要なラベルのみ。構成は、専門的な空間オーケストレーションを通じてストーリーを語る。

「ジオメトリック・サイレンス」 哲学: 純粋な秩序と抑制。 視覚的表现: グリッドベースの精密性、大胆な写真または厳格なグラフィック、劇的なネガティブスペース。タイポグラフィは正確だが最小限—小さな必須テキスト、大きな静かなゾーン。スイス形式主義とブルータリストの素材の正直さの融合。構造がコミュニケーションし、言葉はしない。すべての配置は無数の洗練の結果。

これらは簡略化された例です。実際のデザイン哲学は4〜6段落の充実したものにしてください。

必須原則

  • 視覚哲学: デザインを通じて表現される美的世界観を作成する。
  • 最小限のテキスト: テキストは疎らで、必須のみ、視覚要素として統合され、決して長くならないことを常に強調する。
  • 空間的表现: アイデアは段落ではなく、空間、形態、色彩、構成を通じて伝達される。
  • 芸術的自由: 次のClaudeは哲学を視覚的に解釈する—創造的余地を提供する。
  • 純粋なデザイン: これは装飾のある文書ではなく、アートオブジェクトを作ることである。
  • 専門家のクラフトマンシップ: 最終作品は、緻密に作られ、注意深く練り上げられ、その分野の第一人者による無数の時間の産物であるように見えることを繰り返し強調する。

デザイン哲学は4〜6段落の長さにすること。 詩的なデザイン哲学で満たし、中核ビジョンを統合する。同じ点を繰り返さない。デザイン哲学は、アートの意図に言及せず、どこでも使用できるように汎用的に保つ。デザイン哲学を.mdファイルとして出力する。


微妙な参照の推測

重要なステップ: キャンバスを作成する前に、元のリクエストから微妙な概念的スレッドを特定する。

本質的原則: トピックは、アート自体に織り込まれた微妙でニッチな参照であり、常に文字通りではなく、常に洗練されている。その主題に詳しい人は直感的に感じ取るべきであり、他の人は単に達人的な抽象構成を体験する。デザイン哲学は美的言語を提供する。推測されたトピックは魂を提供する—静かな概念的なDNAが、形、色、構成に目に見えない形で織り込まれる。

これは非常に重要です。参照は、作品の深みを高めつつ、それ自体を主張しないように洗練されなければならない。ジャズミュージシャンが別の曲を引用するように考える。知っている人だけが気づくが、誰もが音楽を楽しむ。


キャンバス作成

哲学と概念的枠組みの両方が確立されたら、それをキャンバス上に表現する。少し時間を取り、考えをまとめ、心をクリアにする。作成されたデザイン哲学と以下の指示を使用して、哲学のすべての側面を専門家のクラフトマンシップで具現化した傑作を作成する。

重要: あらゆるタイプのコンテンツ(映画/ゲーム/本の依頼であっても)に対して、アプローチは洗練されたものでなければならない。アマチュア的で漫画っぽいものではなく、アートであるべきだという考えを決して見失わない。

ミュージアムまたはマガジン品質の作品を作成するには、デザイン哲学を基盤として使用する。単一ページで、高度にビジュアルで、デザイン重視のPDFまたはPNG出力を作成する(複数ページが要求されない限り)。一般的に、繰り返しパターンと完璧な形状を使用する。抽象的な哲学デザインを、あたかも科学的な聖書であるかのように扱い、体系的な観察の視覚言語—密なマークの集積、繰り返し要素、または忍耐強い反復を通じて意味を構築し、持続的な鑑賞に報いる層状のパターン—を借りて表現する。疎らで臨床的なタイポグラフィと体系的な参照マーカーを追加し、これが想像上の学問分野からの図である可能性を示唆し、目に見えない主題を、観察可能な現象を文書化するのと同じ敬意をもって扱う。作品を、意図的でまとまりのある限られたカラーパレットを使用して、控えめに配置された単純なフレーズや詳細で固定する。人間の経験についてのアイデアを表現するために分析的な視覚言語を使用するという逆説を受け入れる:結果は、注意深い観察を通じて、何か儚いものが研究され、マッピングされ、理解され得ることを証明するアーティファクトのように感じられるべきである。これが真のアートである。

文脈要素としてのテキスト: テキストは常に最小限で視覚優先だが、文脈に応じて、それが囁くような静かなラベルか、大胆なタイポグラフィのジェスチャーかを判断する。パンク会場のポスターは、ミニマリストの陶芸スタジオのアイデンティティよりも大きく、より攻撃的なタイプを持つかもしれない。ほとんどの場合、フォントは細くするべきである。すべてのフォントの使用はデザイン重視で、視覚的コミュニケーションを優先しなければならない。テキストの規模に関わらず、ページからはみ出したり、重なったりしてはならない。すべての要素は、適切なマージンでキャンバス境界内に収められなければならない。すべてのテキスト、グラフィック、視覚要素に呼吸スペースと明確な分離があることを注意深く確認する。これはプロフェッショナルな実行のために譲れない条件である。重要: テキストを書く場合は異なるフォントを使用すること。./canvas-fontsディレクトリを検索すること。アプローチに関わらず、洗練は譲れない。

必要なフォントをダウンロードして使用し、これを実現する。タイポグラフィをアート自体の一部にすることによって創造的になる—アートが抽象的な場合、フォントをキャンバスに持ち込むのであって、デジタルでタイプセットするのではない。

限界を押し広げるために、哲学を指針としながらデザインの直感/直感に従う。究極のデザインの自由と選択を受け入れる。美学とデザインを最前線に押し上げる。

重要: 人間が作成した品質(AI生成ではない)を達成するために、作品が無数の時間をかけて作成されたように見えるようにする。その分野の絶対的なトップにいる誰かが、細部に至るまで痛烈な注意を払って練り上げたように見えるようにする。構成、間隔、色の選択、タイポグラフィ—すべてが専門家レベルのクラフトマンシップを叫ぶものであることを確認する。重なりがないこと、フォーマットが完璧であること、すべての細部が完璧であることを再確認する。人々に専門知識を証明し、疑いなく印象的なランクとして示すことができるものを作成する。

最終結果を、使用したデザイン哲学(.mdファイル)とともに、単一のダウンロード可能な.pdfまたは.pngファイルとして出力する。


最終ステップ

重要: ユーザーはすでに「完璧ではない。完璧でなければならない。職人技の傑作であり、まるで美術館に展示されるかのようでなければならない」と言っています。

重要: 作品を洗練するために、グラフィックを追加するのではなく、作成されたものを洗練し、非常に鮮明にし、デザイン哲学とミニマリズムの原則を完全に尊重する。楽しいフィルターを追加したり、フォントをリファクタリングしたりする代わりに、既存の構成をアートとよりまとまりのあるものにする方法を考える。新しい関数を呼び出したり、新しい形状を描いたりしたいという衝動に駆られたら、立ち止まって代わりに「すでにあるものをどのようにしてもっと芸術作品にできるか?」と自問する。

セカンドパスを取る。コードに戻り、さらに洗練/磨き上げ、これを哲学的にデザインされた傑作にする。

マルチページオプション

要求された場合に追加ページを作成するには、デザイン哲学と同じラインに沿って、しかし明確に異なる、よりクリエイティブなページを作成する。それらのページを同じ.pdfまたは複数の.pngにバンドルする。最初のページを、一杯になるのを待っているコーヒーテーブルブック全体の単一ページとして扱う。次のページをオリジナルのユニークなひねりと記憶として作成する。それらが非常にセンスの良い方法でほとんどストーリーを語るようにする。完全な創造的自由を行使する。

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

ComposioHQ/-21risk-automation

Automate 21risk tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/-2chat-automation

Automate 2chat tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/ably-automation

Automate Ably tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/abstract-automation

Automate Abstract tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/abuselpdb-automation

Automate Abuselpdb tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/abyssale-automation

Automate Abyssale tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/accelo-automation

Automate Accelo tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/accredible-certificates-automation

Automate Accredible Certificates tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/acculynx-automation

Automate Acculynx tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/active-campaign-automation

Automate ActiveCampaign tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/addresszen-automation

Automate Addresszen tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/adobe-automation

Automate Adobe tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/adrapid-automation

Automate Adrapid tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/adyntel-automation

Automate Adyntel tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/aeroleads-automation

Automate Aeroleads tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/aero-workflow-automation

Automate Aero Workflow tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/affinda-automation

Automate Affinda tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/affinity-automation

Automate Affinity tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/agencyzoom-automation

Automate Agencyzoom tasks via Rube MCP (Composio). Always search tools first for current schemas.

ComposioHQ/agent-deep-links

Build, validate, and troubleshoot deep links for Codex, Cursor, VS Code, Visual Studio, and similar tools. Use when users ask for clickable links (especially in Slack) that open threads, files, folders, or app settings.

関連スキル