Table Of Links Masanın sol tarafı abstraklık 1 INTRODUCTION 1 Giriş 2 SYSTEM DESIGN 2 Sistem Tasarımı 3 RESULTS, DISCUSSION AND REFERENCES 3 Sonuçlar, tartışma ve referanslar Sistem Tasarımı Frontend Difüzyon’u tanıtacağız.Frontend Difüzyon, bir LLM güçlendirilen yüksek kaliteli frontend kod üretimi aracı, çizim yapımından web sitesi önizlemelerine kadar uzanır.Girişinde belirtildiği gibi, frontend oluşturma görevi üç aşamadan geçiyor: çizim, yazma ve kodlama Sistemimiz tüm metin ve kod üretimi için Claude 3.5 Sonnet dil modeli (Sonnet)1 kullanır. Claude, Temmuz 2024 itibariyle en gelişmiş dil modellerinden birini temsil ederken, Generative AI'da hızlı gelişmeler bekliyoruz.Bu nedenle, burada açıklanan görev geçiş teknikleri, gelecekte daha gelişmiş Generative AI modellerine uygulanabilirliklerini sağlamak için model-agnostik olarak tasarlanmıştır. 2.1 Sketching: Visual Layout Design and Theme Input Sistemin başlangıç aşaması, iki ana bileşenle bir grafik kullanıcı arayüzü içerir: öngörülen web sitesi düzeninin görsel olarak temsil edilmesi için bir yaprak paneli ve web sitesi temasının metin açıklamaları için bir çağrı paneli. Bu iki adımlı dönüşüm süreci, testlerimizden elde edilen empirik kanıtlara dayanarak uygulanmıştır ve dil modellerinin JPG biçiminde görüntü işlemlerinde SVG biçimindeki görüntülere kıyasla daha iyi performans gösterdiğini göstermektedir. 2.2 Writing: Product Requirements Document Generation Bu aşama, kullanıcının görsel ve metin girdilerini bir yapılandırılmış belgeye dönüştürür, Ürün Gereksinimleri Belgesini (PRD) olarak adlandırılır ve bu da web sitesi geliştirme süreci için bir blueprint olarak hizmet eder. PRD oluşturma süreci, Sonnet'i kullanır. Dil modeli özellikle görüntü terimleri ve boyut açıklamaları (örneğin, [school(large)]) içermeleri istenir). Bu tanımlayıcılar daha sonra PRD'ye entegre etmek için ilgili görüntü URL'lerini iade eden Pexels API'sini sorgulamak için kullanılır. 2.3 Coding: Website Generation and Iterative Refinement Sistemin kodlama aşaması iki ana bileşenden oluşur: (1) Başlangıç kod üretimi: sistem oluşturulan PRD'yi ve orijinal kullanıcı talimatını kod üretimi için giriş olarak kullanır, Sonnet'i başlangıç web sitesi kodu üretmek için kullanır; (2) İteratif rafine: sistem oluşturulan web sitesini daha zengin işlevselliği ve hataları azaltarak otomatik olarak geliştirmek için bir iteratif rafine sürecini uygular. Bu işlem, optimizasyon önerileri oluşturmak için başlangıç kodunu analiz etmek, bu önerileri orijinal temayla birleştirmek ve önceden oluşturulan PRD ile birlikte geliştirilmiş temayı kullanarak kodu yenilemek içerir.Sistem bu iteratif iyileştirme işlemi defalarca gerçekleştirir (varsayılan olarak, n=4). Kullanıcılar, arayüzün altındaki önizleme mini resimlerini seçerek iterasyonlar arasında gezinebilir ve her bir sürüm için oluşturulan kodu erişebilir veya kopyalayabilirler. Yazarlar : Qinshi Zhang Latisha Besariani Hendra Mohan Chi Hakkında ZİJAN DING Authors: Çanakkale Zhang Latisha Besariani Hakkında Mohan Chi Hakkında ZİJAN DING Bu makale CC BY 4.0 DEED lisansı altında kullanılabilir. Bu makale CC BY 4.0 DEED lisansı altında kullanılabilir. Arşivde kullanılabilir
