Agent Skills by ALSEL
Anthropic Claudeデータ・分析⭐ リポ 0品質スコア 50/100

drawio-logical-diagrams

draw.io のXMLフォーマット(.drawioファイル)を使用して、プロフェッショナルな論理フロー図およびシステムアーキテクチャ図を作成します。データ・プロセスフロー図、クラウド非依存の論理アーキテクチャ図、BPMNプロセス図、UML図(クラス・シーケンス・アクティビティ)、データフロー図(DFD)、意思決定フローチャート、システムインタラクション図などの作成時に使用してください。クラウドプロバイダー固有の構成ではなく、汎用・抽象的な表現に特化したスキルです(AWS/Azure向けにはaws-drawio-architecture-diagramsをご利用ください)。

description の原文を見る

Creates professional logical flow diagrams and logical system architecture diagrams using draw.io XML format (.drawio files). Use when creating: (1) logical flow diagrams showing data/process flow between system components, (2) logical architecture diagrams representing system structure without cloud provider specifics, (3) BPMN process diagrams, (4) UML diagrams (class, sequence, activity), (5) data flow diagrams (DFD), (6) decision flowcharts, or (7) system interaction diagrams. This skill focuses on generic/abstract representations, not AWS/Azure-specific architectures (use aws-drawio-architecture-diagrams for cloud diagrams).

SKILL.md 本文

Draw.io 論理図の作成

概要

draw.io のネイティブ XML 形式で、論理フロー図、システムアーキテクチャの視覚化、および汎用図形とシンボルを使用した抽象的なプロセス表現を作成します。

使用場面

  • システムコンポーネント間のデータフローを示す論理フロー図の作成
  • 抽象的なシステム構造を表す論理アーキテクチャ図の設計
  • ビジネスプロセス用の BPMN プロセス図の構築
  • UML 図(クラス、シーケンス、アクティビティ、状態)の作成
  • システム分析用のデータフロー図(DFD)の作成
  • 分岐ロジックを含む意思決定フローチャートの作成
  • システムインタラクションとシーケンスの可視化
  • クラウド固有の内容を含まない論理的なシステム設計のドキュメント化

使用しないでください: AWS/Azure/GCP アーキテクチャ図(aws-drawio-architecture-diagrams を使用してください)。

手順

論理図の作成

  1. リクエストを分析する:図示するシステム/プロセスを理解する
  2. 図の種類を選択する:フローチャート、アーキテクチャ、BPMN、UML、DFD など
  3. 要素を特定する:アクター、プロセス、データストア、コネクターを決定する
  4. XML 構造を作成する:適切なルートセルを持つ mxGraphModel を作成する
  5. 図形を追加する:適切なスタイルを持つ mxCell 要素を作成する
  6. コネクターを追加する:エッジ要素でコンポーネントをリンクする
  7. XML を検証する:XML が整形式であり、すべての ID が一意であることを確認する(以下の検証チェックリストを参照)
  8. 出力する:ユーザーに対して .drawio ファイルを書き込む

XML 検証チェックリスト

ファイルを出力する前に、以下を確認してください:

  • すべてのタグが適切に閉じられている(閉じられていない <mxCell></mxGeometry> などがない)
  • すべてのセル ID が一意である(0 と 1 は予約されたルートセル、2 以降の連続整数を使用)
  • すべての source および target 属性が既存のセル ID を参照している
  • すべての parent 属性が既存のセル ID を参照している
  • すべての座標(x、y、幅、高さ)が正の数である
  • 特殊文字がエスケープされている(<&lt;>&gt;&&amp;
  • 複数行のラベルが &#xa; または <br> を使用し、スタイルに html=1 がある

主な XML コンポーネント

コンポーネント説明
mxfileホストとバージョンを含むルート要素
diagram図の定義を含む
mxGraphModelキャンバス設定(グリッド、ページサイズ)
rootすべてのセルのコンテナ(id="0" と id="1" を含める必要があります)
mxCell個別の図形(頂点)またはコネクター(エッジ)

Draw.io XML の構造

<mxfile host="app.diagrams.net" agent="Claude" version="24.7.17">
  <diagram id="logical-flow-1" name="Logical Flow">
    <mxGraphModel dx="1200" dy="800" grid="1" gridSize="10" guides="1"
      tooltips="1" connect="1" arrows="1" fold="1" page="1"
      pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
      <root>
        <mxCell id="0" />
        <mxCell id="1" parent="0" />
        <!-- Shapes and connectors here -->
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

主なルール:

  • ID "0" と "1" はルートセル用に予約されている
  • 2 以降の連続整数 ID を使用する
  • アーキテクチャ図は横向き方向を使用する
  • すべての座標は正の数で、グリッドに揃える(10 の倍数)

汎用図形とスタイル

基本図形タイプ

図形スタイル
四角形rounded=0;whiteSpace=wrap;html=1;
角丸四角形rounded=1;whiteSpace=wrap;html=1;
楕円/円ellipse;whiteSpace=wrap;html=1;
ダイアモンドrhombus;whiteSpace=wrap;html=1;
円柱shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;
六角形shape=hexagon;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;
平行四辺形shape=ext;double=1;rounded=0;whiteSpace=wrap;html=1;

標準カラーパレット

要素タイプ塗りつぶし色枠線色用途
プロセス#dae8fc#6c8ebf操作/アクション
判定#fff2cc#d6b656条件分岐
開始/終了#d5e8d4#82b366終点状態
データ/ストア#e1f5fe#0277bdデータベース/ファイル
エンティティ#f3e5f5#7b1fa2外部システム
エラー/停止#f8cecc#b85450エラー状態
アクター/ユーザー#ffe0b2#f57c00ユーザー/アクター
コンテナ#f5f5f5#666666グループ化領域

コネクタースタイル

標準フロー:

edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;

破線(代替/オプション):

edgeStyle=orthogonalEdgeStyle;dashed=1;dashPattern=5 5;strokeColor=#666666;

矢印ヘッドスタイル:

  • endArrow=classic;endFill=1 - 塗りつぶされた三角形
  • endArrow=open;endFill=0 - オープン矢印
  • endArrow=blockThin;endFill=1 - ブロック矢印

図の種類

種類主な要素
論理フローアクター(オレンジ)、サービス(青)、データストア(シアン)、外部システム(紫)
論理アーキテクチャネストされたコンポーネントを持つ層状コンテナ
BPMN円(開始/終了)、角丸四角形(アクティビティ)、ダイアモンド(ゲートウェイ)
UML シーケンスメッセージ矢印を持つ垂直ライフライン
DFD正方形(エンティティ)、円(プロセス)、開いた四角形(データストア)

参考ファイル

詳細な図形の例とスタイルリファレンスについては、以下を参照してください:

  • shape-styles.md - 完全な図形の例とスタイルリファレンス
  • diagram-templates.md - すぐに使用できるテンプレート

例 1:注文処理フロー

リクエスト: 「注文処理を示す論理フロー図を作成してください:顧客が注文を送信、システムが検証、有効な場合は支払い処理と発送、無効な場合は顧客に通知」

<mxfile host="app.diagrams.net" agent="Claude" version="24.7.17">
  <diagram id="order-flow-1" name="Order Processing">
    <mxGraphModel dx="1200" dy="800" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
      <root>
        <mxCell id="0"/><mxCell id="1" parent="0"/>
        <mxCell id="2" value="Start" style="ellipse;whiteSpace=wrap;html=1;fillColor=#d5e8d4;strokeColor=#82b366;fontSize=12;" vertex="1" parent="1"><mxGeometry x="80" y="50" width="80" height="40" as="geometry"/></mxCell>
        <mxCell id="3" value="Submit Order" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=12;" vertex="1" parent="1"><mxGeometry x="60" y="130" width="120" height="60" as="geometry"/></mxCell>
        <mxCell id="4" value="Validate&#xa;Order?" style="rhombus;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;fontSize=12;" vertex="1" parent="1"><mxGeometry x="80" y="230" width="80" height="80" as="geometry"/></mxCell>
        <mxCell id="5" value="Notify&#xa;Customer" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f8cecc;strokeColor=#b85450;fontSize=12;" vertex="1" parent="1"><mxGeometry x="220" y="240" width="100" height="50" as="geometry"/></mxCell>
        <mxCell id="6" value="Process&#xa;Payment" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=12;" vertex="1" parent="1"><mxGeometry x="60" y="350" width="120" height="60" as="geometry"/></mxCell>
        <mxCell id="7" value="Ship Order" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=12;" vertex="1" parent="1"><mxGeometry x="60" y="450" width="120" height="60" as="geometry"/></mxCell>
        <mxCell id="8" value="End" style="ellipse;whiteSpace=wrap;html=1;fillColor=#d5e8d4;strokeColor=#82b366;fontSize=12;" vertex="1" parent="1"><mxGeometry x="80" y="550" width="80" height="40" as="geometry"/></mxCell>
        <mxCell id="10" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="2" target="3"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="11" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="3" target="4"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="12" value="No" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#b85450;strokeWidth=2;fontSize=11;" edge="1" parent="1" source="4" target="5"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="13" value="Yes" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#82b366;strokeWidth=2;fontSize=11;" edge="1" parent="1" source="4" target="6"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="14" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="6" target="7"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="15" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="7" target="8"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="16" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#b85450;strokeWidth=2;" edge="1" parent="1" source="5" target="8"><mxGeometry relative="1" as="geometry"/></mxCell>
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

例 2:3 層論理アーキテクチャ

リクエスト: 「プレゼンテーション層、ビジネスロジック層、データ層を持つ Web アプリケーション用の論理アーキテクチャ図を作成してください」

<mxfile host="app.diagrams.net" agent="Claude" version="24.7.17">
  <diagram id="three-tier-1" name="Three-Tier Architecture">
    <mxGraphModel dx="1200" dy="800" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
      <root>
        <mxCell id="0"/><mxCell id="1" parent="0"/>
        <mxCell id="2" value="User" style="ellipse;whiteSpace=wrap;html=1;fillColor=#ffe0b2;strokeColor=#f57c00;fontSize=12;" vertex="1" parent="1"><mxGeometry x="40" y="340" width="60" height="40" as="geometry"/></mxCell>
        <mxCell id="3" value="Presentation Layer" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f5;strokeColor=#666666;fontSize=14;fontStyle=1;" vertex="1" parent="1"><mxGeometry x="160" y="40" width="300" height="180" as="geometry"/></mxCell>
        <mxCell id="4" value="Web&#xa;Browser" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=12;" vertex="1" parent="3"><mxGeometry x="20" y="30" width="80" height="50" as="geometry"/></mxCell>
        <mxCell id="5" value="Mobile&#xa;App" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=12;" vertex="1" parent="3"><mxGeometry x="120" y="30" width="80" height="50" as="geometry"/></mxCell>
        <mxCell id="7" value="Application Layer" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f5;strokeColor=#666666;fontSize=14;fontStyle=1;" vertex="1" parent="1"><mxGeometry x="160" y="260" width="300" height="180" as="geometry"/></mxCell>
        <mxCell id="8" value="API&#xa;Gateway" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;fontSize=12;" vertex="1" parent="7"><mxGeometry x="20" y="30" width="80" height="50" as="geometry"/></mxCell>
        <mxCell id="9" value="Business&#xa;Logic" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontSize=12;" vertex="1" parent="7"><mxGeometry x="110" y="30" width="80" height="50" as="geometry"/></mxCell>
        <mxCell id="11" value="Data Layer" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f5;strokeColor=#666666;fontSize=14;fontStyle=1;" vertex="1" parent="1"><mxGeometry x="160" y="480" width="300" height="180" as="geometry"/></mxCell>
        <mxCell id="12" value="Primary&#xa;Database" style="shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;fillColor=#e1f5fe;strokeColor=#0277bd;fontSize=12;" vertex="1" parent="11"><mxGeometry x="20" y="30" width="60" height="80" as="geometry"/></mxCell>
        <mxCell id="13" value="Cache" style="shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;fillColor=#fff3e0;strokeColor=#e65100;fontSize=12;" vertex="1" parent="11"><mxGeometry x="100" y="30" width="60" height="80" as="geometry"/></mxCell>
        <mxCell id="20" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="2" target="4"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="21" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="4" target="8"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="22" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="8" target="9"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="23" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=classic;endFill=1;strokeColor=#666666;strokeWidth=2;" edge="1" parent="1" source="9" target="12"><mxGeometry relative="1" as="geometry"/></mxCell>
        <mxCell id="24" value="query" style="edgeStyle=orthogonalEdgeStyle;rounded=0;endArrow=open;endFill=0;strokeColor=#666666;strokeWidth=1;fontSize=10;dashed=1;" edge="1" parent="1" source="9" target="13"><mxGeometry relative="1" as="geometry"/></mxCell>
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

その他のテンプレート(マイクロサービスアーキテクチャ、イベント駆動、決定木、シーケンス、DFD)については、diagram-templates.md を参照してください。

制約と警告

重大な制約

  1. XML の有効性:タグを適切に閉じ、特殊文字をエスケープしてください
  2. 一意の ID:すべてのセル ID は一意である必要があります(親 "0" と "1" を除く)
  3. 有効な参照:ソース/ターゲットは既存のセル ID を参照する必要があります
  4. 正の座標:すべての x、y 値は >= 0 である必要があります

警告

  • XML ファイルが整形式でない場合、draw.io で開くことに失敗します
  • 無効な親参照により、要素が消えます
  • 負の座標により、要素が表示キャンバスの外に配置されます

ベストプラクティス

  1. すべての図で要素タイプごとに一貫した色を使用する
  2. 矢印をまっすぐに保ち、曲げを最小限にする
  3. ラベルを矢印線から少なくとも 20px 離す
  4. 関連する要素をコンテナにグループ化する
  5. ラベルには 12~14px、注釈には 10~11px のフォントを使用する
  6. すべての座標をグリッドに合わせる(10 の倍数)
  7. 高いコントラストの色を使用し、意味を色だけに頼らない

ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ

詳細情報

作者
giuseppe-trisciuoglio
リポジトリ
giuseppe-trisciuoglio/developer-kit
ライセンス
MIT
最終更新
不明

Source: https://github.com/giuseppe-trisciuoglio/developer-kit / ライセンス: MIT

関連スキル

OpenAIデータ・分析⭐ リポ 1,451

hugging-face-trackio

Trackioを使用してMLトレーニング実験を追跡・可視化できます。トレーニング中のメトリクスログ記録(Python API)、トレーニング診断のアラート発火、ログされたメトリクスの取得・分析(CLI)が必要な場合に活用してください。リアルタイムダッシュボード表示、Webhookを使用したアラート、HF Space同期、自動化向けのJSON出力に対応しています。

by gradio-app
汎用データ・分析⭐ リポ 855

btc-bottom-model

ビットコインのサイクルタイミングモデルで、加重スコアリングシステムを搭載しています。日次パルス(4指標、32ポイント)とウィークリー構造(9指標、68ポイント)の2カテゴリーにわたる13の指標を追跡し、0~100のマーケットヒートスコアを算出します。ETFフロー、ファンディングレート、ロング/ショート比率、恐怖・貪欲指数、LTH-MVRV、NUPL、SOPR(LTH+STH)、LTH供給率、移動平均倍率(365日MA、200週MA)、週次RSI、出来高トレンドに対応します。市場サイクル全体を通じて買いと売りの両方の推奨を提供します。ビットコインの底値拾い、BTCサイクルポジション、買い時・売り時、オンチェーン指標、MVRV、NUPL、SOPR、LTH動向、ETFの流出入、ファンディングレート、恐怖指数、ビットコインが過熱状態か、マイナーコスト、暗号資産市場のセンチメント、BTCのポジションサイジング、「今ビットコインを買うべきか」「BTCが天井をつけているか」「オンチェーン指標は何を示しているか」といった質問の際にこのスキルを活用します。

by star23
Anthropic Claudeデータ・分析⭐ リポ 380

protein_solubility_optimization

タンパク質の溶解性最適化 - タンパク質の溶解性を最適化します。タンパク質の特性を計算し、溶解性と親水性を予測し、有効な変異を提案します。タンパク質配列の特性計算、タンパク質機能の予測、親水性計算、ゼロショット配列予測を含むタンパク質エンジニアリング業務に使用できます。3つのSCPサーバーから4つのツールを統合しています。

by SpectrAI-Initiative
Anthropic Claudeデータ・分析⭐ リポ 1,743

research-lookup

Parallel Chat APIまたはPerplexity sonar-pro-searchを使用して、最新の研究情報を検索できます。学術論文の検索にも対応しています。クエリは自動的に最適なバックエンドにルーティングされるため、論文の検索、研究データの収集、科学情報の検証に活用できます。

by K-Dense-AI
Anthropic Claudeデータ・分析⭐ リポ 299

tree-formatting

ggtree(R)またはiTOL(ウェブ)を使用して、系統樹の可視化とフォーマットを行います。系統樹を図として描画する際、ツリーレイアウトの選択、分類学に基づく枝やラベルの色付け、クレードの折りたたみ、サポート値の表示、またはツリーへのオーバーレイ追加が必要な場合に使用してください。系統推定(protein-phylogenyスキルを使用)やドメイン注釈(今後の独立したスキル)には使用しないでください。

by majiayu000
汎用データ・分析⭐ リポ 145

querying-indonesian-gov-data

インドネシア政府の50以上のAPIとデータソースに接続できます。BPJPH(ハラール認証)、BOM(食品安全)、OJK(金融適正性)、BPS(統計)、BMKG(気象・地震)、インドネシア中央銀行(為替レート)、IDX(株式)、CKAN公開データポータル、pasal.id(第三者法MCP)に対応しています。インドネシア政府データを活用したアプリ開発、.go.idウェブサイトのスクレイピング、ハラール認証の確認、企業の法的適正性の検証、金融機関ステータスの照会、またはインドネシアMCPサーバーへの接続時に使用できます。CSRF処理、CKAN API使用方法、IP制限回避など、すぐに実行可能なPythonパターンを含んでいます。

by suryast
本サイトは GitHub 上で公開されているオープンソースの SKILL.md ファイルをクロール・インデックス化したものです。 各スキルの著作権は原作者に帰属します。掲載に問題がある場合は info@alsel.co.jp または /takedown フォームよりご連絡ください。
原作者: giuseppe-trisciuoglio · giuseppe-trisciuoglio/developer-kit · ライセンス: MIT