المصدر: https://github.com/anthropics/skills/tree/dbd4588f9e1033efb41dad4bef2f7947c8993d44/skills/frontend-design
النسخة: dbd4588f9e1033efb41dad4bef2f7947c8993d44
بصمة الحزمة: a32963888452a4fa4469d38c28d385b010bc0a2d9f541e95b0f2b13c7b0b8c68
الترخيص: Apache-2.0

1. قدّم للوكيل موجز التصميم موضحًا المنتج أو الموضوع والجمهور والهدف الأساسي للصفحة، وإن لم تحدده فسيقترح الوكيل موضوعًا وجمهورًا ووظيفة أساسية ويطلب تأكيدك.
2. مثال على طلب المستخدم: «صمّم صفحة هبوط لتطبيق يساعد هواة زراعة النباتات المنزلية على تتبع مواعيد الري، وأريدها ألا تبدو كقالب جاهز».
3. سيعدّ الوكيل أولًا خطة تصميم مختصرة تتضمن لوحة أساسية من 4 إلى 6 ألوان مسماة بقيم hex، والخطوط وأدوارها، ومفهوم التخطيط مع رسوم ASCII توضيحية وإرشادات المحاذاة، ومبادئ تميز الصفحة.
4. يراجع الوكيل الخطة مقابل الموجز، ويعدّل أي جزء يشبه الخيارات الافتراضية الشائعة، ويوضح ما غيّره ولماذا قبل البدء بكتابة الكود.
5. بعد ذلك يكتب الكود مع الانتباه إلى أولوية محددات CSS، ويراعي التجاوب مع الجوال وظهور تركيز لوحة المفاتيح واحترام تفضيل تقليل الحركة، وينتقد عمله أثناء البناء بلقطات شاشة إن سمحت بيئته بذلك.
6. راجع النتيجة واطلب تعديلات محددة، علمًا بأن أي اتجاه بصري تحدده صراحةً في الموجز يُتّبع حرفيًا حتى لو كان من الأنماط الشائعة.

تم حفظ ملفات المصدر دون تعديل. راجع صلاحيات الوكيل قبل الاستخدام.