/ الدليل / الملعب / excalidraw-skill
● مجتمع Agents365-ai ⚡ فوري

excalidraw-skill

بواسطة Agents365-ai · Agents365-ai/excalidraw-skill

مهارة Claude Code لتحويل أوصاف الأنظمة باللغة الطبيعية إلى رسوم بيانية Excalidraw مرسومة بخط اليد — تصدير SVG/PNG/.excalidraw قابل للتحرير

مهارة Excalidraw من Agents365-ai تكتشف تلقائياً عندما تحتاج النقاشات إلى رسم بياني (3+ مكونات، أنظمة متعددة الطبقات، سير عمل) وتنشئ الصحيح: مخطط تدفق، معمارية، تسلسل، خريطة ذهنية، أو حارة سباحة. التصدير عبر Kroki API (بدون تثبيت) أو excalidraw-brute-export-cli محلي مع Firefox. يمكن فتح ملفات .excalidraw القابلة للتحرير مباشرة على excalidraw.com

لماذا تستخدمه

الميزات الأساسية

عرض مباشر

كيف يبدو في الممارسة

excalidraw-skill.replay ▶ جاهز
0/0

التثبيت

اختر العميل

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "excalidraw-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/Agents365-ai/excalidraw-skill",
        "~/.claude/skills/excalidraw-skill"
      ],
      "_inferred": true
    }
  }
}

افتح Claude Desktop → Settings → Developer → Edit Config. أعد التشغيل بعد الحفظ.

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "excalidraw-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/Agents365-ai/excalidraw-skill",
        "~/.claude/skills/excalidraw-skill"
      ],
      "_inferred": true
    }
  }
}

يستخدم Cursor نفس مخطط mcpServers مثل Claude Desktop. إعدادات المشروع أولى من الإعدادات العامة.

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "excalidraw-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/Agents365-ai/excalidraw-skill",
        "~/.claude/skills/excalidraw-skill"
      ],
      "_inferred": true
    }
  }
}

انقر على أيقونة MCP Servers في شريط Cline الجانبي، ثم "Edit Configuration".

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "excalidraw-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/Agents365-ai/excalidraw-skill",
        "~/.claude/skills/excalidraw-skill"
      ],
      "_inferred": true
    }
  }
}

نفس الصيغة مثل Claude Desktop. أعد تشغيل Windsurf لتطبيق التغييرات.

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "excalidraw-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/Agents365-ai/excalidraw-skill",
        "~/.claude/skills/excalidraw-skill"
      ]
    }
  ]
}

يستخدم Continue مصفوفة من كائنات الخادم بدلاً من خريطة.

~/.config/zed/settings.json
{
  "context_servers": {
    "excalidraw-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/Agents365-ai/excalidraw-skill",
          "~/.claude/skills/excalidraw-skill"
        ]
      }
    }
  }
}

أضف إلى context_servers. يعيد Zed التحميل تلقائيًا عند الحفظ.

claude mcp add excalidraw-skill -- git clone https://github.com/Agents365-ai/excalidraw-skill ~/.claude/skills/excalidraw-skill

أمر من سطر واحد. تحقق باستخدام claude mcp list. احذف باستخدام claude mcp remove.

حالات الاستخدام

استخدامات عملية: excalidraw-skill

رسم مخطط معمارية microservices من وصف نصي

👤 مهندسون يكتبون وثائق التصميم ⏱ ~10 min beginner

متى تستخدمه: عندما تكتب RFC وتريد رسم بياني بدون فتح أداة منفصلة

المتطلبات الأساسية
  • تم استنساخ المهارة إلى ~/.claude/skills/excalidraw-skill — git clone https://github.com/Agents365-ai/excalidraw-skill ~/.claude/skills/excalidraw-skill
  • وصول شبكي إلى kroki.io (مسار بدون تثبيت) — لا توجد إعدادات إذا كان الوصول الصادر HTTPS يعمل
الخطوات
  1. وصف النظام
    استخدم مهارة excalidraw — ارسم معمارية e-commerce microservices مع عملاء وبوابة API و4 خدمات وRabbitMQ وقواعد بيانات لكل خدمة✓ تم النسخ
    → ينشئ Claude تخطيط ويصدره SVG عبر Kroki
  2. تعديل وإعادة تصدير
    أضف Redis أمام خدمة المنتج وأعد الإنشاء✓ تم النسخ
    → رسم بياني محدث مع Redis مُدرج، التخطيط معاد التوازن
  3. حفظ النسخة القابلة للتحرير
    احفظ كـ .excalidraw حتى أتمكن من تحريره على excalidraw.com✓ تم النسخ
    → الملف محفوظ في CWD

النتيجة: رسم معمارية بأسلوب مرسوم بخط اليد في وثيقتك في أقل من 5 دقائق

المزالق
  • الرسم البياني مكتظ ل10+ مكونات — اطلب من Claude تجميعها حسب الطبقة أولاً؛ المهارة لديها قواعد تخطيط لذلك
اجمعها مع: filesystem

إنشاء رسم بياني تسلسلي من تفاعل API الذي قمت بتصحيحه للتو

👤 مهندسو الخلفية الذين يوثقون التدفقات لزملائهم ⏱ ~10 min beginner

متى تستخدمه: عندما تفهم أخيراً رقصة OAuth ذات 5 خدمات وتريد توثيقها

الخطوات
  1. الصق السجل أو صف التدفق
    مهارة Excalidraw — رسم تسلسلي: مستخدم → frontend → خدمة المصادقة → موفر الهوية → رد الاتصال → الجلسة✓ تم النسخ
    → رسم تسلسلي بأسهم صحيحة ورسائل الإرجاع
  2. تحسين
    أضف مسار الخطأ عندما يعود IdP 401✓ تم النسخ
    → تم عرض التدفق البديل بشكل واضح

النتيجة: رسم تسلسلي يمكنك إسقاطه في وصف PR

التركيبات

اجمعها مع خوادم MCP أخرى لتحقيق نتائج x10

excalidraw-skill + filesystem

احفظ الرسوم البيانية المنتجة مباشرة في مجلد الوثائق الخاصة بك

أنشئ رسم المعمارية واحفظه في docs/architecture/v2.svg✓ تم النسخ
excalidraw-skill + github

الإرفاق بالرسم البياني في PR بالالتزام به جنباً إلى جنب مع المواصفات

قم بإنشاء الرسم البياني والالتزام به في docs/، والإشارة إليه في نص PR✓ تم النسخ

الأدوات

ما يوفره هذا الـ MCP

الأداةالمدخلاتمتى تستدعيهاالتكلفة
generate_flowchart process description العملية لديها نقاط قرار وخطوات متسلسلة 0 via Kroki, 0 local
generate_architecture components + relationships النظام لديه طبقات أو حدود خدمات 0
generate_sequence actors + messages توثيق تفاعل مرتب زمنياً 0
export_png diagram ID تحتاج إلى صورة نقطية للوثائق التي لا تدعم SVG 0 (requires local CLI)

التكلفة والحدود

تكلفة التشغيل

حصة API
Kroki ليس لديه حصة صريحة لكن لا تحطمه
الرموز لكل استدعاء
مواصفات الرسم البياني مضغوطة (<2k tokens عادة)
التكلفة المالية
مجاني — المهارات هي ملفات محلية. Kroki مجاني
نصيحة
استخدم Kroki للحالات الفردية، ثبت excalidraw-brute-export-cli فقط إذا احتجت إلى وضع بلا اتصال

الأمان

الصلاحيات والأسرار ونطاق الأثر

تخزين بيانات الاعتماد: لا توجد بيانات اعتماد — توجيهات نقية
نقل البيانات الخارجي: مسار Kroki يرسل مواصفات الرسم البياني الخاص بك إلى kroki.io. مسار CLI المحلي لا يرسل أي شيء

استكشاف الأخطاء

الأخطاء الشائعة وحلولها

لم يتم استدعاء المهارة عندما تطلب رسم بياني

قل 'excalidraw' أو 'diagram' بوضوح؛ أو تحقق من وجود استنساخ

تحقق: ls ~/.claude/skills/excalidraw-skill/SKILL.md
SKILL.md frontmatter خاطئة

أعد الاستنساخ؛ frontmatter يدفع التنشيط التلقائي

تحقق: head ~/.claude/skills/excalidraw-skill/SKILL.md
كلمات المفاتيح الخاطئة — Claude يكتب Mermaid بدلاً من ذلك

قل 'excalidraw' صراحة؛ 'draw a diagram' وحده يمكن أن يختار أدوات أخرى

البدائل

excalidraw-skill مقابل البدائل

البديلمتى تستخدمهاالمقايضة
Mermaid via markdownوثائقك بالفعل تعرض Mermaid بشكل محلي (GitHub، إلخ.)لا جمالية مرسومة بخط اليد، تحكم تخطيط أقل
drawio via desktop appتريد تخطيط يدوي ثقيل النقراتليس موجه من قبل الوكيل

المزيد

الموارد

📖 اقرأ ملف README الرسمي على GitHub

🐙 تصفح القضايا المفتوحة

🔍 تصفح أكثر من 400 خادم MCP و Skills