ما هي design-implementation-reviewer؟
يقارن بصريًا تنفيذ واجهة المستخدم المباشرة مع تصميمات Figma ويقدم تعليقات مفصلة حول التناقضات. يُستخدم بعد كتابة مكونات HTML/CSS/React أو تعديلها للتحقق من دقة التصميم. المصدر: udecode/plate.
·design-implementation-reviewer
*
design-implementation-reviewer
✓يقارن بصريًا تنفيذ واجهة المستخدم المباشرة مع تصميمات Figma ويقدم تعليقات مفصلة حول التناقضات. يُستخدم بعد كتابة مكونات HTML/CSS/React أو تعديلها للتحقق من دقة التصميم.
التثبيت
كيفية تثبيت design-implementation-reviewer
ثبّت مهارة الذكاء الاصطناعي design-implementation-reviewer بسرعة في بيئة التطوير لديك عبر سطر الأوامر
- افتح الطرفية: افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal
- نفّذ أمر التثبيت: انسخ ونفّذ هذا الأمر: npx skills add https://github.com/udecode/plate --skill design-implementation-reviewer
- تحقق من التثبيت: بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
المصدر: udecode/plate.
SKILL.md
عرض النص الخامContext: The user has just implemented a new component based on a Figma design. user: "I've finished implementing the hero section based on the Figma design" assistant: "I'll review how well your implementation matches the Figma design."
Since UI implementation has been completed, use the design-implementation-reviewer agent to compare the live version with Figma. Context: After the general code agent has implemented design changes.
user: "Update the button styles to match the new design system" assistant: "I've updated the button styles. Now let me verify the implementation matches the Figma specifications." After implementing design changes, proactively use the design-implementation-reviewer to ensure accuracy.
يقارن بصريًا تنفيذ واجهة المستخدم المباشرة مع تصميمات Figma ويقدم تعليقات مفصلة حول التناقضات. يُستخدم بعد كتابة مكونات HTML/CSS/React أو تعديلها للتحقق من دقة التصميم. المصدر: udecode/plate.
حقائق جاهزة للاقتباس
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
- أمر التثبيت
npx skills add https://github.com/udecode/plate --skill design-implementation-reviewer- المصدر
- udecode/plate
- الفئة
- *وسائط إبداعية
- موثق
- ✓
- أول ظهور
- 2026-03-10
- آخر تحديث
- 2026-03-10
إجابات سريعة
كيف أثبّت design-implementation-reviewer؟
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/udecode/plate --skill design-implementation-reviewer بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
أين مستودع المصدر؟
https://github.com/udecode/plate
التفاصيل
- الفئة
- *وسائط إبداعية
- المصدر
- skills.sh
- أول ظهور
- 2026-03-10