توجيه التصميم البصري المميز لواجهات المستخدم الأمامية بعيدًا عن القوالب الجاهزة

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

لا تتضمن الملفات أي سكربتات أو اعتماديات برمجية أو حسابات مطلوبة، فهي مهارة إرشادية نصية فقط في ملف SKILL.md مرخصة بموجب Apache License 2.0. تتطلب وكيلًا قادرًا على كتابة كود الواجهات الأمامية مثل HTML وCSS. التقاط لقطات الشاشة للمراجعة الذاتية اختياري ويعتمد على دعم بيئة الوكيل لذلك. جودة النتيجة الجمالية تعتمد على وضوح الموجز ولا تُضمن مسبقًا، وقد تختلف المخرجات بين جلسة وأخرى.