Design System لوكلاء البرمجة: كيف تبنيه وتختبره عمليًا

يمكن لوكيل البرمجة أن يلتزم بـ Design System لديك إذا توقفت عن مطالبته بأن «يجعل هذا متسقًا مع هوية العلامة»، وقدّمت له بدلًا من ذلك ثلاثة أشياء: ملفًا واحدًا سهل القراءة يوجّه قرارات التصميم، ومجموعة مقيّدة من المكوّنات أو الأنماط تضبط التنفيذ المتكرر، وتقييمات ثابتة تكشف ما إذا كانت القواعد تعمل فعلًا.

هذا يغيّر بند التكلفة الذي يستحق القياس. فالهدف ليس خفض كلفة توليد الكود، بل تقليص الساعات التي تُهدر في تصحيح القرارات نفسها المتعلقة بالخطوط والتسلسل البصري والمسافات والنصوص بعد كل مسودة أولى. ويقدّم مسار العمل العلني design.md من Vercel أوضح نموذج مطبّق حتى الآن، فيما تبيّن نتائجه أيضًا لماذا تظل المراجعة البشرية جزءًا أساسيًا من المنظومة.

يتكوّن Design System الفعّال من ملف واحد وطبقة قيود وحلقة تحقق

الفكرة الأهم في مسار عمل design.md لدى Vercel ليست اسم الملف، بل الفصل الواضح بين المسؤوليات.

1. الإرشادات تحمل الحكم التصميمي. يوضّح ملف علني واحد للوكيل مَن تستهدفه الصفحة، وما القرار الذي يحتاج القارئ إلى اتخاذه، وكيف ينبغي تنظيم الأدلة، وما أسلوب العلامة في الكتابة، وأي عادات شائعة في التصميم المولّد يجب تجنبها.
2. المكوّنات الأولية تضبط التنفيذ. تمنح ورقة أنماط منشورة الوكيل مفردات محدودة من العناوين والجداول وشرائط الإحصاءات وأنماط الرسوم والفئات والرموز. وبدل أن يبتكر النموذج نظامًا جديدًا للمسافات أو الخطوط، يختار مكوّنًا أوليًا معتمدًا بالاسم.
3. التقييمات تقدّم الدليل. تكشف السيناريوهات الثابتة والفحوص الحتمية والمراجعة البشرية ما إذا كان التغيير قد حسّن المحاولات الأولى فعلًا، أم أنه نقل المشكلة إلى موضع آخر فحسب.

تخيّل الأمر كمطعم: ملف الإرشادات يمثّل حكم الطاهي على الوجبة، والمكوّنات والأنماط هي محطة العمل المجهّزة والأدوات المضبوطة، أما التقييمات فهي مرحلة التذوق. وحتى الوصفة المفصّلة ستنتج أطباقًا متفاوتة جدًا إن لم تكن محطة العمل مجهّزة.

وصلت Vercel إلى هذا التقسيم بعد فشل مطالبة نصية عادية. فقد وصفت النسخة العلنية الأولى اللغة البصرية، لكن النماذج فسّرت العبارات الذاتية بطرق مختلفة لأنها لم تكن تملك المكوّنات والأمثلة المنشورة المتاحة داخل مستودعات Vercel. لذلك أعاد الفريق كتابة الملف بالاستناد إلى مخرجات ثابتة، بدل اعتبار النص منتهيًا لمجرد أنه بدا مقنعًا.

هذا الفارق جوهري. يستطيع نظام التصميم الموجّه للبشر أن يعتمد على الذائقة المشتركة والذاكرة المؤسسية وقدرة المصمم على ملاحظة النتيجة القريبة من الصواب. أما النظام الجاهز للوكلاء، فعليه أن يجعل القرار سهل الاسترجاع، والتنفيذ المسموح واضحًا، والإخفاق قابلًا للرصد.

ما الذي ينبغي وضعه في ملف الإرشادات؟

ينبغي أن يكون ملفك الأول أقصر من نظام التصميم الذي يمثّله. فهو خريطة للقرارات، لا متحفًا يضم كل مكوّن.

قسّمه إلى ستة أقسام:

• النطاق: ما الواجهات التي ينبغي أن تحمّل الملف، وما الأعمال التي يجب أن تتجاهله.
• القارئ والمهمة: مَن يفتح كل مخرج، وما الذي يحتاج إلى فهمه أو تقريره، وما الأدلة التي تساعده على اتخاذ ذلك القرار.
• قرارات قابلة للملاحظة: قواعد مثل «يمكن لجداول الأدلة استخدام عرض المحتوى كاملًا»، لا صفات مثل «نظيف» أو «فاخر».
• المكوّنات المتاحة: الأسماء الدقيقة للمكوّنات أو الفئات أو الرموز التي يجوز للوكيل اختيارها، مع توضيح موضع استخدام كل منها.
• أنماط إخفاق مسمّاة: نتائج سيئة متكررة تحمل أسماء سهلة التذكّر، مع عرض ملموس للمشكلة والتصحيح المفضّل.
• الحدود: الحقائق التي يجب على الوكيل الحفاظ عليها، والحالات التي ينبغي أن يغطيها، والادعاءات غير المدعومة التي عليه حذفها، والقرارات التي ما زالت تتطلب شخصًا.

اشرح سبب وجود الخيار عندما يكون السياق مهمًا، وأحِل الوكيل إلى الكود عندما يكون الكود هو المرجع الفعلي. فنسخ كل قاعدة CSS إلى سياق النموذج يبدّد انتباهه ويخلق مصدرين للحقيقة. تُحمَّل ورقة الأنماط العلنية من Vercel داخل المتصفح، بينما يوثّق design.md الأسماء التي ينبغي للوكيل استخدامها؛ وبذلك لا يستهلك كود ورقة الأنماط نفسه مساحة من سياق النموذج.

هناك أيضًا مشكلة الاسترجاع. ففي تقييمات منفصلة خاصة بـ Next.js، وجدت Vercel أن الوكلاء لم يستدعوا مهارة متاحة في 56% من الحالات. لذلك ينبغي وضع محفّز الاستدعاء ضمن تعليمات المستودع الدائمة، وتحديد النطاق بوضوح، ومطالبة الوكيل بالإبلاغ عن الإرشادات التي حمّلها، واختبار التحميل بمعزل عن اختبار الالتزام بالقواعد. فالملف المثالي الذي لا يُفتح ليس أكثر من وثائق.

إذا كنت تختار الوكيل أو الواجهة التي ستحيط بهذا النظام، فإن الفروق العملية في مقارنة Claude Design وv0 لتوليد واجهات المستخدم أقل أهمية من ضمان حصول كليهما على القيود والتقييم نفسه.

وجّه كل تصحيح إلى أضيق جهة قادرة على فرضه

أقوى قاعدة تشغيلية هنا بسيطة: لا تعالج كل إخفاق تصميمي بإضافة مزيد من النثر.

هنا تحديدًا تجعل فرق كثيرة الملف أكبر مما ينبغي. فهي تواصل إضافة جمل مثل «استخدم المسافات الصحيحة»، مع أن رمز مسافات مقيّدًا يمكنه حسم القرار في كل مرة. أو تحوّل خيارًا متعلقًا بسياسة المنتج إلى قاعدة تدقيق، رغم أن الكود لا يستطيع تقدير استثناءاته. كثرة التعليمات لا تعني بالضرورة مزيدًا من التحكم.

شغّل تقييمات متطابقة قبل التعميم

لا يكون التقييم مفيدًا إلا إذا كانت المقارنة عادلة. اختر مخرجًا متكررًا له قارئ حقيقي ومدخلات حقيقية ومعايير مختصرة. أنشئ خط أساس أولًا، ثم شغّل المطالبة والمدخلات والنموذج وأبعاد العرض نفسها بعد تحميل الإرشادات. احتفظ بالمحاولات الأولى، واخلط ترتيب المخرجات قبل المراجعة حتى لا يعرف المراجع أي نسخة استخدمت القواعد الجديدة.

أنشأت Vercel سبعة سيناريوهات من أعمال متكررة، من بينها عرض تجديد وتقرير معايير مرجعية وصفحة تخطيط وموجز أمني وعرض تقديمي. وشملت الجولات الكاملة السيناريوهات السبعة كلها على Claude Opus 4.8 وCodex مع GPT-5.5. واحتفظ كل تشغيل مخزّن بالمطالبة والمدخلات وإعدادات النموذج وإصدار الإرشادات ولقطات الشاشة وملاحظات المراجع.

النتيجة الجديرة بالتذكّر محددة وليست قاعدة عامة. فعبر ثلاثة سيناريوهات على شاشات سطح المكتب وست صفحات من المحاولة الأولى، أحصت Vercel 39 إخفاقًا معروفًا مع design.md مقابل 91 من دونه، أي أقل بنسبة 57% في ذلك الاختبار. لكن الاختبار كان صغيرًا، ولم تستطع الفحوص رؤية سوى الإخفاقات المشفّرة مسبقًا، كما بقي في كل صفحة خلل واحد على الأقل يكفي لمنع نشرها. لا تنقل نسبة 57% إلى توقعات أعمالك؛ انقل المنهج وقِس عبء المراجعة الفعلي لديك.

ابدأ بهذه الحسبة العملية:

• احسب الدقائق التي يقضيها مصمم أو مهندس أول في تصحيح كل مسودة أولى.
• اضربها في عدد المخرجات المتكررة التي تُنشر كل شهر.
• أضف الوقت المنفق على شرح التصحيح نفسه في المحادثات وطلبات السحب ومراجعات التصميم.
• بعد تطبيق النظام، شغّل مجموعة المخرجات نفسها وقِس الفارق.

على سبيل المثال، تستهلك أربع صفحات متكررة تحتاج كل منها إلى ساعتين من التصحيح ثماني ساعات مراجعة. وإذا أزال النظام المقيّد ساعة واحدة من الإصلاحات المتكررة لكل صفحة، فالمكسب أربع ساعات. هذا وفر قابل للقياس، أما القول إن «المخرج يبدو أكثر اتساقًا مع العلامة» فليس كذلك.

يمنح السوق الحالي معيارًا آخر مفيدًا. تتراوح أسعار منصات إنشاء المواقع بالذكاء الاصطناعي بين نحو $0 و$160 شهريًا في نتائج الأسعار الحالية، بينما يضع دليل واحد لعام 2026 تكلفة المواقع المخصّصة بين $1,500 و$5,000. لذلك يجب أن تبرر طبقة ضبط العلامة تكلفتها مقارنة بكلا الخيارين. فقيمتها ليست زرًا آخر للتوليد، بل خفض تكاليف المراجعة والموافقة ومخاطر العلامة في الأعمال المتكررة.

سبع حالات استخدام مرتبة بحسب الأكثر استفادة

1. وكالات متعددة العلامات تنتج مواقع حملات بصورة متكررة

تستطيع وكالة لديها عشرة عملاء نشطين الاحتفاظ بملف إرشادات واحد ومجموعة مكوّنات أولية مقيّدة لكل عميل، ثم تشغيل تقييم صفحة الإطلاق نفسه كلما تغيّر وكيل أو مكتبة مكوّنات أو نموذج. والعائد هو تقليص ساعات كبار المصممين التي تُستهلك في استعادة الخطوط والتسلسل البصري بعد أن تصبح الصفحة عاملة بالفعل. تستفيد هذه الفئة أكثر من غيرها لأن كل تصحيح معتمد يمكن أن يحسّن جميع المخرجات اللاحقة لذلك العميل.

2. فرق منتجات تسمح لعدة وكلاء بتعديل الواجهة نفسها

يمكن لفريق المنصة تمرير كل أعمال واجهة المستخدم عبر تعليمة واحدة في المستودع، وتحميل الإرشادات فقط للتغييرات التي يراها المستخدم، وفرض القواعد الميكانيكية بواسطة التدقيق البرمجي. قد يتغير الوكيل المستخدم، لكن القرارات المعتمدة تبقى بجانب الكود. والعائد هو اتساق المساهمات من دون مطالبة كل نموذج باستنتاج النية من المكوّنات المنشورة وحدها.

3. فرق الإيرادات التي تُنشئ العروض والتقارير والمعايير المرجعية

يمكن لفريق عمليات المبيعات تثبيت سيناريو لعرض تجديد يتضمن بيانات عميل تجريبية، ومعايير موجهة للقراءة التنفيذية، وأخرى للتدقيق المفصّل. ويجب أن يحافظ كل إصدار جديد من الإرشادات على بروز التوصية، وصون الأرقام المقدمة، ومنح الأدلة مساحة كافية. والعائد هو مسودات أولى أسرع، من دون السماح لتخطيط لوحة معلومات عام بأن يطمر القرار التجاري.

4. فرق أنظمة التصميم التي تستعد لاعتماد الوكلاء

يستطيع فريق نظام التصميم توثيق الرموز والمكوّنات الدقيقة التي يجوز للوكلاء استخدامها، وتسمية أنماط الإخفاق الشائعة، وإضافة فحوص حتمية عندما تكون القاعدة ميكانيكية. والعائد هو تحويل مكتبة المكوّنات إلى نظام تشغيل للقرارات، لا مجرد فهرس تقلّده الوكلاء بصورة غير متسقة.

5. شركات ناشئة لا تملك قائمة انتظار لمراجعة التصميم بدوام كامل

يمكن لفريق صغير أن يبدأ بمخرج واحد، مثل صفحة المقاييس الأسبوعية، وبآخر عشرة تصحيحات متكررة تخصها. لا يحتاج إلى تطبيق التقييم الكامل من Vercel؛ فخط أساس واحد وتشغيل متطابق واحد وبطاقة تقييم بشرية واحدة تكفي لكشف أكبر مواطن القصور. والعائد هو تجميع الحكم التصميمي النادر في مرجع قابل لإعادة الاستخدام، مع إبقاء الموافقة النهائية لدى مؤسس أو مصمم.

6. فرق الأدوات الداخلية التي تخدم إدارات مختلفة

يمكن لفريق منصة داخلية مشاركة آليات معتمدة لإتاحة الوصول والحالات والتخطيط، مع إبقاء طبقة إرشادات صغيرة لكل مهمة، مثل التسوية المالية أو عمليات الدعم. والعائد هو جودة تنفيذ مشتركة من دون إجبار مسارات عمل مختلفة جوهريًا على قالب بصري واحد.

7. فرق خاضعة للتنظيم تحتاج إلى سجل تدقيق

يمكن لفريق في الرعاية الصحية أو التمويل أو الأمن تخزين المطالبة والمدخلات وإصدار النموذج وإصدار الإرشادات والنتيجة المرئية والفحوص وقرار المراجع لكل تشغيل. والعائد هو قابلية التتبع: يستطيع المراجع معرفة القاعدة التي شكّلت المخرج والشخص الذي وافق على الاستثناء. لا يجعل هذا النمط المخرج ممتثلًا تلقائيًا، لكنه يسهّل إعادة بناء أدلة المراجعة.

إذا كانت مؤسستك ما زالت تقرر ما إذا كان مسار عمل الوكلاء ينبغي أن يكون منتجًا أم قدرة داخلية، فإن إطار المفاضلة بين بناء وكلاء البرمجة وشرائهم لمسارات العمل الداخلية هو الخطوة التالية المفيدة.

ثلاثة منتجات تستحق البناء

1. مُصرّف لأنظمة تصميم جاهزة للوكلاء، وهو الفرصة الأقوى

ابنِ مساحة عمل تحوّل الرموز الحالية للشركة ووثائق المكوّنات وتصحيحات المراجعة المتكررة إلى ملف إرشادات ذي إصدارات، وخريطة تنفيذ مقيّدة، وحزمة تقييم أولية. وستدفع فرق عمليات التصميم والمنصات مقابل ذلك لأن المنتج يقع مباشرة بين نظامها الحالي وكل وكيل برمجي تعتمده.

الطلب أضيق من سوق توليد المواقع العام، لكنه أقرب بكثير إلى المشتري. تستهدف نحو 260 عملية بحث أمريكية شهريًا عبارة design system software بنية تجارية، وصعوبة كلمة مفتاحية تبلغ 14، وتكلفة نقرة قدرها $12.33. وتهم هذه التكلفة لأنها تشير إلى أن المورّدين يقدّرون هذا الاهتمام بالفعل رغم تواضع حجم البحث.

تحتاج أصغر نسخة قابلة للبيع إلى مسار إدخال واحد، مثل مستودع مع نموذج منظّم لتصحيحات المراجعة، ومسار إخراج واحد: design.md وخريطة للمكوّنات الأولية المعتمدة وثلاثة سيناريوهات ثابتة وتقرير يبيّن القواعد التي اجتازها كل تشغيل. ابدأ بإطار عمل واحد وفئة مخرجات واحدة.

العقبة هي التهيئة. فنادرًا ما يكون أهم حكم تصميمي لدى الشركة منظّمًا بما يكفي لاستيراده تلقائيًا. سيتصرف المنتج المبكر جزئيًا كبرنامج وجزئيًا كخدمة، وسيأتي عنصر حمايته التنافسية من تحويل سجل المراجعات الفوضوي إلى قرارات موثوقة وقابلة للاختبار.

2. مصنع مواقع مصغّرة ملتزمة بالعلامة

ابنِ مولّدًا للوكالات وفرق الإيرادات ينشئ فئة ضيقة واحدة من الصفحات المتسقة مع العلامة، مثل العروض أو المواقع المصغّرة للحملات، انطلاقًا من بيانات معتمدة وحزمة قيود خاصة بالعميل. يدفع المشتري مقابل التكرار المنضبط وأدلة الموافقة، لا مقابل توليد الصفحة الخام.

الطلب العام كبير: تحصل عبارة ai website builder على نحو 40,500 عملية بحث أمريكية شهريًا، بارتفاع 49% في الاتجاه السنوي، وبنية تجارية وتكلفة نقرة قدرها $31.41. وتتراوح العروض الحالية من الخطط المجانية إلى نحو $160 شهريًا، لذلك لا يستطيع وافد جديد المنافسة بوعد «اكتب مطالبة واحصل على موقع». بل يحتاج إلى وعد أدق: قواعد العلامة نفسها، والمكوّنات الأولية المعتمدة نفسها، وأدلة المراجعة نفسها في كل تشغيل.

ينبغي أن يدعم المنتج الأولي نوع صفحة واحدًا، وتنسيق استيراد واحدًا، ومجموعة مكوّنات ثابتة، وثلاثة سيناريوهات تقييم، وشاشة موافقة للمقارنة جنبًا إلى جنب. أما العقبة فهي سوق مزدحمة بمنافسين راسخين. يجب أن تكون الحوكمة وقابلية التكرار هما المنتج نفسه، وإلا فلن يكون سوى واجهة سطحية أخرى فوق نموذج.

3. خدمة لضمان جودة التصميم الذي تنتجه الوكلاء

ابنِ خدمة لطلبات السحب تعرض الصفحات التي صنعتها الوكلاء بأبعاد ثابتة، وتشغّل فحوص التصميم الميكانيكية، وتحفظ إصدارات النموذج والإرشادات، ثم ترسل الفروق الذاتية إلى قائمة مراجعة بشرية عمياء. ستدفع الفرق التي تستخدم وكلاء البرمجة بالفعل مقابل اكتشاف الإخفاقات المتكررة قبل وصولها إلى مراجع أول.

تستهدف نحو 320 عملية بحث أمريكية شهريًا عبارة visual regression testing، بصعوبة كلمة مفتاحية تبلغ 8 وتكلفة نقرة قدرها $20.56. هذا ليس حجم سوق جماهيريًا، لكنه دليل مباشر على وجود فرق تبحث عن تحقق بصري آلي. كما تترك الصعوبة المنخفضة مساحة لزاوية متخصصة بالوكلاء، تركّز على الالتزام بالقواعد بدل فروق البكسلات وحدها.

يمكن أن يبدأ المنتج الأولي بفحص GitHub وبُعدَي عرض واثنتي عشرة قاعدة حتمية وتخزين لقطات الشاشة وحكم من المراجع. لكن الفارق البصري ليس هو جودة التصميم. يستطيع فرق البكسلات التقاط الانحراف، ويمكن لحَكَم قائم على نموذج أن يصوغ نقدًا أوليًا، إلا أن التسلسل البصري ومعنى المنتج والسياسات الجديدة ما زالت بحاجة إلى البشر.

ما الذي لا يعالجه هذا النمط؟

لن يحوّل ملف واحد نظام تصميم ضعيفًا إلى نظام قوي. ولا يمكنه اختراع قرارات لم يتخذها فريقك قط، أو إصلاح مكوّنات تفتقر إلى إتاحة الوصول، أو إثبات دقة الحقائق، أو حسم سياسة منتج جديدة. كذلك لن يجعل كل نموذج يتصرف بالطريقة نفسها.

قد تكبح القيود التباين المتكرر، لكنها قد تثبّت أيضًا مكوّنًا أوليًا سيئًا. وقد تمنع التقييمات الإخفاقات المعروفة، لكنها قد تكافئ معايير ضيقة وتفوت مشكلة جديدة. وتستطيع المراجعة البشرية التقاط أخطاء الحكم، ولكن فقط إذا سجّل المراجعون التصحيحات بصيغة يمكن للمنظومة إعادة استخدامها.

نتيجة Vercel إشارة مفيدة تحديدًا لأن Vercel تصرّح بقيودها. ست صفحات لا تكوّن دراسة موثوقية. وفحوص الإخفاقات المعروفة ليست مقياسًا لجودة التصميم العامة. كما بقي في كل صفحة مختبرة عائق يمنع النشر. لذلك ينبغي أن يكون هدف أول تعميم لديك تقليل التصحيحات المتكررة، لا اعتماد التصميم بصورة مستقلة.

خطوة يوم الاثنين واضحة: اختر صفحة متكررة واحدة، واحفظ مسودتها الأولى غير المدعومة، واجمع آخر عشرة تصحيحات أجراها فريقك على هذا النوع من الصفحات، ثم وجّه كل تصحيح إلى الإرشادات أو المكوّنات الأولية أو الكود أو قرار بشري، وبعد ذلك نفّذ مقارنة عمياء متطابقة واحدة. لا توسّع النطاق إلا بعد أن تخفّض هذه الحلقة زمن المراجعة المقاس.

هل يستطيع الذكاء الاصطناعي بناء موقع لي فعلًا؟

نعم. تستطيع وكلاء البرمجة ومنصات إنشاء المواقع بالذكاء الاصطناعي إنتاج صفحات عاملة انطلاقًا من مطالبة. لكن السؤال الأصعب هو ما إذا كانت المسودة الأولى ستلتزم بعلامتك، وتحافظ على الحقائق المقدمة، وتغطي الحالات الصحيحة، وتجتاز المراجعة. تعالج الإرشادات والمكوّنات الأولية المقيّدة والتقييمات المتطابقة هذه الفجوات.

هل منصات إنشاء المواقع بالذكاء الاصطناعي جيدة؟

هي مفيدة للسرعة، خصوصًا عندما تكون المهمة محدودة وخيارات التنفيذ مقيّدة. لكنها أقل موثوقية عندما تعتمد الجودة على حكم منتج غير مكتوب، أو لغة تصميم خاصة، أو قرارات سياسة جديدة. قيّمها بحسب زمن تصحيح المحاولة الأولى، لا بحسب أجمل عرض تجريبي أُعيد توليده مرات عدة.

كم تكلّف منصات إنشاء المواقع بالذكاء الاصطناعي؟

تتراوح الأسعار الحالية لمنصات إنشاء المواقع بالذكاء الاصطناعي بين نحو $0 و$160 شهريًا. ولا يشمل ذلك تكاليف المراجعة والتصحيح والموافقة ومخاطر العلامة لدى فريقك. قِس تلك الساعات بصورة مستقلة قبل تحديد ما إذا كان نظام داخلي أكثر انضباطًا سيسترد تكلفته.

هل الأفضل بناء موقعك بنفسك أم استخدام أداة لإنشاء المواقع؟

استخدم أداة إنشاء عندما تكون الصفحة قياسية والمخاطر منخفضة وقيود الأداة مناسبة لعلامتك. وابنِ مسار عمل مضبوطًا للوكلاء عندما تكرر المخرج نفسه، أو تحتاج إلى مكوّنات وأدلة معتمدة، أو تنفق وقتًا ملموسًا من كبار المختصين على تصحيح النتائج. الرقم الحاسم هو تكلفة المراجعة المتكررة.

إذا أردت بناء مسار عمل لوكلاء البرمجة يراعي التصميم بهذه الطريقة لنشاطك، فتعرّف إلى تطوير وكلاء الذكاء الاصطناعي.