Figma تطلق Code Layers في Config 2026، وتتيح للمصممين كتابة وتنفيذ الكود مباشرة على اللوحة

أمضت Figma العقد الماضي في إقناع المصممين والمهندسين بالعمل في نفس الملف. في Config 2026، الذي عُقد في 24 يونيو، اتخذت الشركة أكثر خطواتها جرأة نحو إزالة الحدود بينهم تمامًا.
الإعلان الرئيسي هو Code Layers: نظام يجلب الكود القابل للتنفيذ مباشرة إلى لوحة Figma التعاونية. يمكن للمستخدمين تحويل أي طبقة تصميم إلى طبقة كود تفاعلية بنقرة واحدة، واستنساخ المستودعات (Repositories) لاستخراج تدفقات الإنتاج، وتشغيل حزم npm دون مغادرة Figma. يمكن لدردشة AI بناء وتعديل طبقات الكود عند الطلب. النتيجة تُشحن داخل Figma Sites، مدعومة بكود React مخصص.
قال ديلان فيلد، الرئيس التنفيذي لـ Figma: «يجب معاملة الكود مثل أي مادة تصميم أخرى. Code Layers تعامل المصممين والمهندسين كمتعاونين على سطح مشترك حيث يتعايش منطق التصميم والإنتاج.»
الآثار العملية هي أن مرحلة التسليم التقليدية (handoff) تصبح اختيارية. يمكن للفرق تكرار طبقات الكود لاستكشاف اتجاهات متعددة في وقت واحد، واستخراج إطارات التصميم مرة أخرى إلى طبقات قابلة للتعديل، والحفاظ على العناصر التفاعلية داخل نفس الملف حيث تم اتخاذ قرارات التصميم.
إلى جانب Code Layers، أطلقت Figma أداة بناء إضافات AI باللغة الطبيعية تتيح للمستخدمين وصف الوظيفة المطلوبة والحصول على إضافة عاملة دون كتابة JavaScript. يدعم النظام Skills قابلة لإعادة الاستخدام — مهام سير عمل مجمعة يمكن للمساعد AI تنفيذها عند الطلب. يتصل المساعد بـ Notion وSlackوGitHub وAtlassian وGranola وExcel للحصول على سياق أكثر ثراءً. الوكيل متاح لجميع المستخدمين اليوم؛ الوصول إلى FigJam وSlides قيد الانتظار.
الإطلاق الثالث الكبير هو Figma Motion، وهو نظام رسوم متحركة أصلي قائم على الجدول الزمني وkeyframe متاح فورًا. يدعم Dev Mode تصدير CSS وJSON وReact وMP4 وWebM وSVG متحرك وGIF، بالإضافة إلى توافق MCP. تتضمن تعبئات shader المولدة بواسطة AI وتحولات ثلاثية الأبعاد. سابقًا، كانت أعمال الحركة تتطلب أدوات خارجية مثل After Effects أو Rive.
استجابة Figma لأدوات التصميم المبنية على AI في Config 2026 هي جعل اللوحة المكان الذي يهبط فيه كود الإنتاج. Code Layers الآن في قائمة الانتظار وسيبدأ الإطلاق في يوليو 2026. Figma Motion متاح اليوم. لم يتم الإعلان عن أي تغييرات في الأسعار.
Originally reported by TechCrunch. Read the original article for additional details.
View original source