·explainer-visuals
{}

explainer-visuals

قم بإنشاء مرئيات توضيحية متحركة عالية الجودة للمقالات ومنشورات المدونة. يُستخدم عندما يريد المستخدم تصور المفاهيم أو العمليات أو البيانات أو الأفكار باستخدام الرسوم المتحركة التفاعلية على الويب. مشغلات لطلبات مثل "إنشاء صورة مرئية لـ"، أو "تحريك هذا المفهوم"، أو "إنشاء شرح"، أو "تصور هذه الفكرة"، أو "رسم تخطيطي لهذه العملية"، أو "إظهار هذه البيانات"، أو عندما يستفيد محتوى المقالة من التفسير المرئي. يتعامل مع المفاهيم المجردة (النماذج العقلية والأطر)، والعمليات الفنية (الخوارزميات والأنظمة)، وتصور البيانات (الاتجاهات والمقارنات). يقوم بإخراج HTML/CSS/JS مستقل بذاته والذي يتم تضمينه مباشرة في محتوى الويب.

19التثبيتات·2الرائج·@petekp

التثبيت

$npx skills add https://github.com/petekp/claude-code-setup --skill explainer-visuals

كيفية تثبيت explainer-visuals

ثبّت مهارة الذكاء الاصطناعي explainer-visuals بسرعة في بيئة التطوير لديك عبر سطر الأوامر

  1. افتح الطرفية: افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal
  2. نفّذ أمر التثبيت: انسخ ونفّذ هذا الأمر: npx skills add https://github.com/petekp/claude-code-setup --skill explainer-visuals
  3. تحقق من التثبيت: بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

المصدر: petekp/claude-code-setup.

Create animated, interactive visuals that make complex ideas intuitive.

Great explainer visuals don't just illustrate—they reveal. They show the structure hidden in complexity, the motion implicit in static descriptions, the relationships that words struggle to convey.

Before creating any visual, conduct a brief discovery interview using AskUserQuestion. Understand not just WHAT to visualize, but WHY this idea needs visual treatment.

قم بإنشاء مرئيات توضيحية متحركة عالية الجودة للمقالات ومنشورات المدونة. يُستخدم عندما يريد المستخدم تصور المفاهيم أو العمليات أو البيانات أو الأفكار باستخدام الرسوم المتحركة التفاعلية على الويب. مشغلات لطلبات مثل "إنشاء صورة مرئية لـ"، أو "تحريك هذا المفهوم"، أو "إنشاء شرح"، أو "تصور هذه الفكرة"، أو "رسم تخطيطي لهذه العملية"، أو "إظهار هذه البيانات"، أو عندما يستفيد محتوى المقالة من التفسير المرئي. يتعامل مع المفاهيم المجردة (النماذج العقلية والأطر)، والعمليات الفنية (الخوارزميات والأنظمة)، وتصور البيانات (الاتجاهات والمقارنات). يقوم بإخراج HTML/CSS/JS مستقل بذاته والذي يتم تضمينه مباشرة في محتوى الويب. المصدر: petekp/claude-code-setup.

حقائق جاهزة للاقتباس

حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.

أمر التثبيت
npx skills add https://github.com/petekp/claude-code-setup --skill explainer-visuals
الفئة
{}تحليل البيانات
موثق
أول ظهور
2026-02-11
آخر تحديث
2026-03-10

Browse more skills from petekp/claude-code-setup

إجابات سريعة

ما هي explainer-visuals؟

قم بإنشاء مرئيات توضيحية متحركة عالية الجودة للمقالات ومنشورات المدونة. يُستخدم عندما يريد المستخدم تصور المفاهيم أو العمليات أو البيانات أو الأفكار باستخدام الرسوم المتحركة التفاعلية على الويب. مشغلات لطلبات مثل "إنشاء صورة مرئية لـ"، أو "تحريك هذا المفهوم"، أو "إنشاء شرح"، أو "تصور هذه الفكرة"، أو "رسم تخطيطي لهذه العملية"، أو "إظهار هذه البيانات"، أو عندما يستفيد محتوى المقالة من التفسير المرئي. يتعامل مع المفاهيم المجردة (النماذج العقلية والأطر)، والعمليات الفنية (الخوارزميات والأنظمة)، وتصور البيانات (الاتجاهات والمقارنات). يقوم بإخراج HTML/CSS/JS مستقل بذاته والذي يتم تضمينه مباشرة في محتوى الويب. المصدر: petekp/claude-code-setup.

كيف أثبّت explainer-visuals؟

افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/petekp/claude-code-setup --skill explainer-visuals بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

أين مستودع المصدر؟

https://github.com/petekp/claude-code-setup

التفاصيل

الفئة
{}تحليل البيانات
المصدر
skills.sh
أول ظهور
2026-02-11