Kullanım kılavuzuna geç
enhance-promptyazan Google Labs

Enhance Prompt Skill.

Claude Code ve Codex için bir UI tasarım skill'i: belirsiz UI fikirlerini cilalı, Stitch'e optimize edilmiş promptlara dönüştürür.

  • Web & UI
google-labs-code/stitch-skills · plugins/stitch-utilities/skills/enhance-prompt/SKILL.mdSKILL.md
--- name: enhance-prompt description: Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results. --- ## Prerequisites ## When to Use This Skill ## Enhancement Pipeline ## Output Options ## Examples ## Tips for Best Results
Ön bilgi ve bölüm başlıkları yukarı akış dosyasından 2026-09-14 tarihinde okundu · tam haliyle 6.618 karakter

01 Ne yapar

enhance-prompt Skill'i Claude Code ve Codex'te Ne Yapar

Özet, iş akışı ve çıktılar; hepsi skill'in SKILL.md dosyasından okundu.

SKILL.md'den14-09-2026 tarihinde okundu · kayıtlı bir çalıştırma değil

Skill'in Kendi İfadeleriyle

Bu skill, ham UI fikirlerini Stitch üretimi için şekillendirilmiş prompt'lara dönüştürür. Bir Stitch Prompt Mühendisi olarak çalışarak girdiyi eksik platform, sayfa türü, yapı, görsel stil, renkler ve bileşenler açısından denetler, ardından belirsiz ifadeleri belirli bileşen adlarına dönüştürür, ruh hali sıfatlarını güçlendirir, içeriği numaralı bölümler halinde gruplandırır ve her rengi ad, hex kodu ve fonksiyonel rol olarak biçimlendirir.

Projede bir DESIGN.md bulunduğunda, paleti, tipografisi ve bileşen stilleri bir DESIGN SYSTEM (REQUIRED) bloğuna dahil edilir; bulunmadığında ise bir ipucu design-md skill'ine yönlendirir. Çıktı varsayılan olarak kopyalanabilir bir metindir veya stitch-loop için next-prompt.md gibi bir dosyadır.

Neler üretir

  • Sayfanın amacı ve havasının tek satırlık bir açıklamasıyla başlayan, ardından tasarım sistemi bloğu ve numaralı sayfa yapısı gelen geliştirilmiş bir prompt.
  • stitch-loop skill'iyle kullanılmak üzere yazılmış isteğe bağlı bir next-prompt.md dosyası.
  • Kullanıcının seçtiği özel bir ad altında isteğe bağlı bir dosya.
Örnek istemi görün ↗

Nasıl Çalışır

  1. 01
    Ham Girdiyi Denetleyin

    Skill, kullanıcının prompt'unu altı unsura göre kontrol eder: platform, sayfa türü, yapı, görsel stil, renkler ve bileşenler.

  2. 02
    Tasarım Sistemini Dahil Edin

    Mevcut projede bir DESIGN.md arar ve tasarım sistemi bloğunu okur; böylece palet, tipografi ve bileşen stilleri yeni prompt'ta yeniden kullanılabilir.

  3. 03
    Geliştirme Tekniklerini Uygulayın

    Belirsiz terimler adlandırılmış bileşenlere dönüşür, sıfatlar bir ruh haline dönüştürülerek güçlendirilir, içerik numaralı bölümler halinde düzenlenir ve renkler açıklayıcı bir ad, hex değeri ve rolle yazılır.

  4. 04
    Çıktıyı Sabit Bir Sırayla Biçimlendirin

    Sonuç, sayfa amacı ve havasının tek satırlık bir açıklamasıyla başlar, ardından bir DESIGN SYSTEM (REQUIRED) bloğu, ardından numaralı bir Page Structure gelir.

02 Uyumunuzu bulun

enhance-prompt Skill Ne Zaman Kullanılır

İş bu türden bir kullanıcı arayüzü tasarımı olduğunda Claude Code veya Codex'te enhance-prompt becerisini kullanın. Aşağıdaki uygunluk ve sınırlar becerinin kendi dosyasından alınmıştır.

İyi Uyum

  • Stitch'e gönderilmeden önce bir UI prompt'unun cilalanması.
  • Zaten kötü üretim sonuçları veren bir prompt'un yeniden işlenmesi.
  • Basit bir fikre tasarım sistemi tutarlılığı ekleme.
  • Belirsiz bir konsepti, uygulanabilir ve yapılandırılmış bir prompt'a dönüştürme.

Sınırları Bilin

  • Birbiriyle ilgisiz birden fazla değişikliği tek bir düzenleme isteğinde birleştirmek kesinlikle önerilmez; düzenlemeler her seferinde tek bir değişiklik olacak şekilde ele alınmalıdır.
  • Aşırı tasarım bir anti-pattern'dir: kullanıcı basit bir şey istediğinde, geliştirme bu niyetle uyumlu kalmalıdır.

Ne Sağlamalısınız

  • Kaba fikir veya mevcut promptBelirsiz bir arayüz üretim fikri veya beklenenin altında kalan bir prompt, skill'in yeniden yazacağı başlangıç malzemesidir.
  • Projenin DESIGN.md dosyası, varsaPaletinin, tipografisinin ve bileşen stillerinin yeni prompt'a taşınabilmesi için mevcut projeden okunur.

03 Skill'in içinde

enhance-prompt Skill'inin Claude Code ve Codex'e Verdiği Kurallar

SKILL.md'nin ajan için belirlediği 7 somut talimat, varsayılan ve sınır — dosyanın sonucu değiştiren kısmı.

  1. Önce Stitch Kılavuzuna Bakın

    Herhangi bir şeyi geliştirmeden önce resmi Stitch prompt yazma belgelerine başvurun, çünkü oradaki öneriler bu skill'e gömülü kalıpları geçersiz kılabilir.

  2. DESIGN.md'yi Zorunlu Bir Blok Olarak Yeniden Çerçeveleyin

    Bir DESIGN.md mevcut olduğunda, içeriği olduğu gibi alıntılanmaz; çıktıda DESIGN SYSTEM (REQUIRED) başlıklı bir bölüme yeniden biçimlendirilir.

  3. DESIGN.md'nin Eksik Olduğu Durumu Kapsayın

    Eğer bir DESIGN.md mevcut değilse, geliştirilmiş prompt, tutarlı çok ekranlı tasarımlar için kullanıcıyı design-md skill'ine yönlendiren bir notla sona erer.

  4. Renkleri Tek Sabit Bir Kalıpta Yazın

    Her renk; açıklayıcı ad, parantez içinde hex kodu ve üstlendiği işlevsel rol olarak ifade edilir, asla düz bir renk örneği veya belirsiz bir sıfat olarak değil.

  5. Sayfa Bölümlerini Numaralandırın

    Sayfa içeriği, Stitch'in hiyerarşiyi okuyabilmesi için numaralandırılmış bölümler halinde gruplanır, düz metin paragrafı olarak bırakılmaz.

  6. Varsayılan Olarak Metin Çıktısı Verin

    Kullanıcı başka türlü istemedikçe, geliştirilmiş prompt kopyalanabilir metin olarak döndürülür; dosya yazmak isteğe bağlıdır.

  7. Hedefli Düzenlemelerde Gerisini Koruyun

    İstek yeni bir sayfa değil de bir düzenleme olduğunda, prompt yalnızca tarif edilen değişikliğin yapıldığını ve mevcut tüm öğelerin olduğu gibi kaldığını belirtmelidir.

04 İşe koyun

enhance-prompt'u Claude Code veya Codex'e yükleyin

Bir npx skills add komutu, ardından ajanınızda ilk görev ve sonuç için bir kontrol listesi.

enhance-prompt'u Claude Code, Codex veya Ajanınıza Ekleyin

Projenizde çalıştırın; kurulum aracı, bunun hangi ajana ekleneceğini sorar.

Terminal
npx skills add https://github.com/google-labs-code/stitch-skills --skill enhance-prompt

plugins/stitch-utilities/skills/enhance-prompt/SKILL.md için genel skills CLI formu; depo kendi yolunu belgeleyebilir.

Skill'e İlk UI Tasarım Görevini Verin

Bu isteği kendi içeriğiniz ve kısıtlamalarınızla uyarlayın, ardından Claude Code veya Codex'te çalıştırın.

Example prompt
make me a login page

Kaynak: SKILL.md örneği (birebir).

İlk Sonucu Kontrol Edin

SKILL.md'nin doğru bir sonucun nasıl göründüğüne dair söyledikleri:

  • Prompt; platform, tema, arka plan, birincil vurgu ve birincil metin sırasıyla listelenen bir DESIGN SYSTEM (REQUIRED) bloğu içerir.
  • Her renk; açıklayıcı bir ad, hex kodu ve işlevsel rol olarak okunur.
  • Sayfa içeriği, gevşek bir açıklama yerine navigasyon içeren bir başlık gibi numaralandırılmış bölümler halinde görünür.
  • Belirsiz bileşen sözcükleri hayatta kalmaz; bir buton isteği birincil çağrı-eylem butonuna dönüşür.
  • Design system bloğu her durumda mevcuttur, çünkü çok sayfalı çıktının tutarlı kalmasını sağlayan tutarlılıktır.
  • Hedefli bir düzenleme için prompt, sayfanın tümünü yeniden tarif etmek yerine konumu, stili, placeholder'ı, davranışı ve genişliği belirler.

OpenDesign'da enhance-prompt birlikte gelir: Plugins → Skills, üst çubuktan seçin.

05 Açık kaynak, izlenebilir

Kaynak, Lisans ve Doğrulama

Bu sayfadaki bilgilerin nereden geldiği ve en son ne zaman kontrol edildiği.

Skill dosyası
plugins/stitch-utilities/skills/enhance-prompt/SKILL.md Doğrulama sırasında içerik sağlama toplamı kaydedildi; commit 0337446
License
Apache-2.0 LICENSE dosyasından.
Repository yıldızları
8.304 GitHub anlık görüntüsü 2026-09-14 tarihinde google-labs-code/stitch-skills deposunun tamamı için alındı, bu katalogda 12 skill içerir. enhance-prompt için derecelendirme veya kullanım sayısı değildir.
OpenDesign tarafından doğrulandı
2026-09-14 Kaynak dosya, yol, lisans metni ve yıldız sayısı kontrol edildi. OpenDesign ana sürümünde paketlenmiştir (2026-08-28 tarihinde kontrol edildi); bu sayfada canlı bir çalıştırma kaydı bulunmamaktadır.

SKILL.md içinde

  1. Ön KoşullarGeliştirmeden önce resmi Stitch prompting kılavuzuna bakın, çünkü bu kalıpların yerini alabilir.
  2. Bu Skill Ne Zaman KullanılırDört tetikleyici: bir prompt'u cilalamak, zayıf bir sonucu düzeltmek, tasarım tutarlılığı eklemek, belirsiz bir konsepti yapılandırmak.
  3. Geliştirme SüreciDört adım: boşlukları değerlendir, DESIGN.md'yi kontrol et, anahtar kelime, vibe, yapı ve renk tekniklerini uygula, ardından biçimlendir.
  4. Çıktı SeçenekleriVarsayılan olarak kopyalanabilir metin; isteğe bağlı olarak next-prompt.md veya kullanıcının adlandırdığı bir dosya yazar.
  5. ÖrneklerBelirsiz bir giriş sayfası isteği ve hedefli bir arama çubuğu ekleme düzenlemesi, her ikisi de tam geliştirilmiş çıktıyla.
  6. En İyi Sonuçlar İçin İpuçlarıBelirginlik, kullanıcı amacı, numaralandırılmış yapı, design system dahil etme ve tek değişiklik düzenlemelerini kapsayan beş hatırlatma.
Skill'in Kendi Açıklaması
"Belirsiz kullanıcı arayüzü fikirlerini, Stitch için optimize edilmiş gelişmiş istemlere dönüştürür. Özgüllüğü artırır, kullanıcı arayüzü ve kullanıcı deneyimi anahtar kelimeleri ekler, tasarım sistemi bağlamını enjekte eder ve daha iyi üretim sonuçları için çıktıyı yapılandırır."

SKILL.md dosyasından ön bilgi açıklaması. Tam dosya yaklaşık 6.618 karakter. Tam dosyayı GitHub'da okuyun.

06 Kurmadan önce

enhance-prompt Skill Hakkında Sorular

Yanıtlar, 2026-09-14 tarihinde okunan SKILL.md üzerinden alınmıştır, kaydedilmiş bir çalıştırmadan değil.

Bu skill'i kullanmadan önce bir DESIGN.md'ye ihtiyacım var mı?

Hayır. Skill sadece geçerli projede bir DESIGN.md arar. Yoksa geliştirilmiş prompt, tüm oluşturulan sayfaların aynı görsel dili paylaşması için design-md skill ile bir tane oluşturmanızı öneren bir ipucuyla sona erer.

Tamamlanmış prompt gerçekte neye benziyor?

Sayfa amacı ve vibe'ının tek satırlık bir açıklaması, platform, tema, arka plan ve vurgu token'larını içeren bir DESIGN SYSTEM (REQUIRED) bloğu, ardından numaralandırılmış bir Page Structure. Yapı bölümü, header, hero ve footer gibi her alanı listeler.

Prompt'u bir yere kaydediyor mu, yoksa sadece gösteriyor mu?

Varsayılan olarak geliştirilmiş prompt'u kopyalamanız için metin olarak döndürür. Bir dosya isterseniz, stitch-loop skill için next-prompt.md veya belirttiğiniz bir dosya adını yazabilir.

Bu skill hangi araçlara ihtiyaç duyar?

İzin verilen araçları olarak Read ve Write'ı bildirir, bu da bir DESIGN.md okumayı ve isteğe bağlı bir prompt dosyası yazmayı kapsar.

Enhance Prompt

enhance-prompt'u Gerçek Bir UI Tasarım Görevinde Çalıştırın.

enhance-prompt skill'i OpenDesign'ın içinde gelir. Uygulamayı indirin, Plugins → Skills'de skill'i seçin, yukarıdaki prompt'u yapıştırın ve sonuçtan önce planı okuyun.

Terminal
npx skills add https://github.com/google-labs-code/stitch-skills --skill enhance-prompt