التوليد التلقائي لشيفرة واجهة المستخدم من لقطة شاشة: نهج قائم على التقسيم والتسوية

تعد المواقع الإلكترونية حاسمة في عالم اليوم الرقمي، حيث يوجد أكثر من 1.11 مليار موقع نشط حاليًا وحوالي 252,000 موقع جديد يتم إطلاقه يوميًا. تحويل تصميم تخطيط الموقع إلى شفرة واجهة مستخدم وظيفية هو خطوة تستغرق وقتًا لكنها لا غنى عنها في تطوير المواقع. تُقدم الطرق اليدوية لتحويل التصاميم المرئية إلى شفرة وظيفية تحديات كبيرة، لا سيما لغير المتخصصين. لاستكشاف حلول الترجمة التلقائية من التصميم إلى الشفرة، قمنا أولًا بدراسة تحفيزية على GPT-4o وحددنا ثلاثة أنواع من المشكلات في توليد شفرة الواجهة: حذف العنصر، تشوه العنصر، وترتيب العنصر بشكل خاطئ. كما كشفنا أن التركيز على أجزاء مرئية أصغر يمكن أن يساعد نماذج اللغة الكبيرة متعددة الوسائط (MLLMs) على التخفيف من هذه الأخطاء أثناء عملية التوليد. في هذه الورقة، نقترح DCGen، وهو نهج قائم على التقسيم والتسوية لأتمتة ترجمة تصميم صفحة الويب إلى شفرة واجهة المستخدم. يبدأ DCGen بتقسيم لقطات الشاشة إلى أجزاء يمكن إدارتها، وينشئ وصفًا لكل جزء، ثم يعيد تجميعها إلى شفرة واجهة مستخدم كاملة للقطات الشاشة بأكملها. أجرينا اختبارات واسعة باستخدام مجموعة بيانات تحتوي على مواقع إلكترونية من العالم الحقيقي ونماذج MLLMs مختلفة وأظهرنا أن DCGen يحقق تحسنًا يصل إلى 14% في التشابه البصري مقارنة بالطرق المنافسة. حسب علمنا، يُعتبر DCGen أول نهج مستند إلى التعليمات الموجهة الواعية بالأجزاء لتوليد شفرة واجهة المستخدم مباشرة من لقطات الشاشة.