Kullanım kılavuzuna geç
Baoyu Designyazan JimLiu

Baoyu Design Skill.

Prototipler, sunum konseptleri ve yeniden kullanılabilir görsel sistemler için dosya tabanlı bir tasarım iş akışı kullanın.

  • Prototipleme
  • Tasarım Sistemleri
  • Sunumlar
Kaynak İncelemesi · Baoyu DesignSKILL.md
Görev Prototipleme Çıktılar • Kopyalanmış varlıklarla kendi içinde eksiksiz HTML tasarım çıktıları • Kaydedilmiş tasarım sistemi bağlamalarına ve varlık meta verilerine sahip bir proje • Özel iş akışları geçerli olduğunda desteklenen sunum veya animasyon dışa aktarımları Başlamadan Önce Dosya işleyebilen bir ajan ile deponun metodolojisi, yerleşik rehberleri, referans belgeleri ve betikleri gerekir. Dışa ve içe aktarma yollarının kendi ön koşulları vardır.
Editoryal özet · kaynak incelenme tarihi 2026-10-07 · üretilmiş bir örnek değildir

01 İşlevler

Baoyu Design: Kendi İçinde Eksiksiz HTML Çıktıları

Çıktıya özel tariflere, design-system içe aktarma ve oluşturma yollarına, yerel önizlemeye ve kapsamı dikkatle belirlenmiş dışa aktarım iş akışlarına sahip bir HTML tasarım orkestratörüdür.

Kaynağa dayalı iş akışıÇalıştırma karşılaştırması değildir

Çalışma Yaklaşımı

Baoyu Design, HTML tasarım çıktıları üretmek için geniş kapsamlı bir orkestrasyon skill'idir. Giriş noktası, tel kafesler, uygulama ekranları, diyagramlar, belgeler ve slaytlar gibi farklı çıktıları özel yerleşik rehberlere yönlendirirken, ortak bir metodoloji tasarım sürecini sağlar.

Ayırt edici özelliği açık tasarım bağlamıdır. Yerel Figma dosyalarını, depo referanslarını ve mevcut HTML/CSS içeriklerini içe aktarma iş akışlarına yönlendirebilir ya da bir projeyi kopyalanmış bir tasarım sistemine bağlayabilir. Çıktılar, birbirinden kopuk HTML dosyalarına dönüşmek yerine varlıkları ve proje meta verileriyle birlikte gruplanmış kalır. Dışa aktarım kapsamı belirlidir: PowerPoint dışa aktarımı, desteklenen slayt yapısıyla hazırlanmış sunumlar için geçerlidir; rastgele HTML için değil.

Beklenen Çıktılar

  • Kopyalanmış varlıklarla kendi içinde eksiksiz HTML tasarım çıktıları
  • Kaydedilmiş tasarım sistemi bağlamalarına ve varlık meta verilerine sahip bir proje
  • Özel iş akışları geçerli olduğunda desteklenen sunum veya animasyon dışa aktarımları
Örnek Brief'i Gör

Brief'ten İncelemeye

  1. 01
    Bağlamı Belirleyin

    Bir tarif seçmeden önce çıktı türünü, doğruluk düzeyini, marka referanslarını ve varsa mevcut tasarım sistemini belirleyin.

  2. 02
    Doğru Yolu Yükleyin

    Her ortamda aynı önizleme araçlarının olduğunu varsaymak yerine, uygun yerleşik rehberi ve ajan ortamına ait araç referansını izleyin.

  3. 03
    Tasarım Sistemini Bağlayın

    Mevcut bir sistem kullanırken proje içinde yerel bir kopya içe aktarın ve bağlamasını kaydedin. Yeni bir sistem hazırlarken derleme, denetleme ve önizleme iş akışını kullanın.

  4. 04
    Oluşturun ve Önizleyin

    HTML ile başvurulan varlıkları bir arada tutun, sonucu yerel olarak sunun ve teslim edildi demeden önce gerçek bir önizlemede doğrulayın.

02 Kullanım Alanları

Ne Zaman Kullanılır

Dosya işleyebilen bir ajan ile deponun metodolojisi, yerleşik rehberleri, referans belgeleri ve betikleri gerekir. Dışa ve içe aktarma yollarının kendi ön koşulları vardır.

İyi Bir Uyum

  • Keşfedilebilir Tasarım KonseptleriPaydaşların açıp inceleyebileceği dosya tabanlı bir prototip veya görsel çıktı için uygundur.
  • Yeniden Kullanılabilir Sistem ÇalışmasıGiriş noktasında tasarım sistemi materyalini oluşturmak, içe aktarmak, doğrulamak ve önizlemek için açık yollar vardır.

Kontrol Edilecek Sınırlar

  • Dışa Aktarım KapsamlıdırPowerPoint yolu, bu skill ile hazırlanmış desteklenen sunumlar içindir; herhangi bir web sayfasını düzenlenebilir bir sunuma dönüştürme vaadi değildir.
  • Giriş Noktası Bir OrkestratördürZanaat süreci ve ortama özel araçlar ek dosyalarda bulunur. Tek başına kopyalanan bir SKILL.md temel talimatları içermez.

Şu Girdileri Hazırlayın

  • Çıktı TürüSonucun tel kafes, yüksek doğruluklu ekran, sunum, belge, diyagram veya desteklenen başka bir biçim olup olmadığını belirtin.
  • Tasarım Referanslarıİlgili markayı, UI kitini, yerel Figma dosyasını, HTML/CSS içeriğini veya dar kapsamlı bir depo referansını sağlayın.
  • Çıktı KısıtlarıProjenin nereye ait olduğunu ve tarayıcı önizlemesinin ya da belirli bir desteklenen dışa aktarımın gerekip gerekmediğini belirtin.

03 Önemli Kararlar

Önemli Kararlar

  1. Tasarım Bağlamı Taşınır

    Proje içindeki sistem kopyaları ve meta veriler, çalışmaya devam edildiğinde görsel kısıtı açık hale getirir.

  2. Çıktıya Özel Kurallar

    E-posta, baskıya benzer belgeler, slaytlar ve etkileşimli ekranlar tek bir genel web sayfası formülü yerine ayrı tarifleri izler.

04 Örnek Görev Tanımı

Odaklı Bir Brief Deneyin

Aşağıdaki örnek brief test edilmemiştir. Kullanmadan önce skill'in kurulumunu kontrol edin.

Kurulumu İnceleyin

Yalnızca giriş dosyasını değil, baoyu-design dizininin tamamını edinin; built-in-skills, agents, references ve başlangıç bileşenlerini koruyun.

Upstream Kaynak Dosyası
https://github.com/JimLiu/baoyu-design/blob/6530033592bf7fa58bc1a5a2a2ad278da45213a9/skills/baoyu-design/SKILL.md

Dosya işleyebilen bir ajan ile deponun metodolojisi, yerleşik rehberleri, referans belgeleri ve betikleri gerekir. Dışa ve içe aktarma yollarının kendi ön koşulları vardır.

Tek Bir Çıktıyla Başlayın

Skill'i çalıştırmadan önce bu brief'teki kapsamı, kaynak materyali ve kısıtları uyarlayın.

Örnek Brief
Sağlanan HTML/CSS referansından, kendi içinde eksiksiz bir editoryal okuma uygulaması HTML prototipi oluşturmak için Baoyu Design kullanın. Tipografi ve renk token'larını koruyun, tasarım sistemi bağlamasını kaydedin ve gerçekçi iki okuma durumu hazırlayın. Varlıkları yerel tutun, HTTP üzerinden önizleyin ve PowerPoint dışa aktarımı denemeyin.

Sonucu İnceleyin

Gerçek çıktıyı bu gözlemlenebilir ölçütlere göre kontrol edin.

  • Çıktı, sağlanan tasarım bağlamını izler.
  • Başvurulan varlıklar teslim edilen proje içindedir.
  • Önizleme yüklenir ve seçilen dışa aktarım kapsamı doğru belirtilmiştir.

OpenDesign, kodlama ajanları için yerel bir tasarım çalışma alanı sağlar. Bu listeleme, skill'in paketle birlikte geldiği veya harici araçlarının, kimlik bilgilerinin ve yazılım bağımlılıklarının dahil olduğu anlamına gelmez.

05 Kaynak ve Lisans

Kaynak ve Lisans

Bu sayfa, aşağıda bağlantısı verilen sabitlenmiş kaynak revizyonunu açıklar. Upstream davranışı ve gereksinimleri değişebilir.

Kaynak Sahibi
JimLiu
Lisans
MIT
İncelenen Anlık Görüntü
2026-10-07 · 6530033592bf
Editoryal Kaynak Özeti
Çıktıya özel tariflere, design-system içe aktarma ve oluşturma yollarına, yerel önizlemeye ve kapsamı dikkatle belirlenmiş dışa aktarım iş akışlarına sahip bir HTML tasarım orkestratörüdür.

Bağlantılı kaynağa dayanan, OpenDesign tarafından hazırlanmış özgün özet. Depo yıldızları tarihli bir popülerlik göstergesidir; skill kullanımı veya kalite puanı değildir.

06 Başlamadan Önce Sorular

Başlamadan Önce Sorular

Tek bir kodlama ajanına mı bağımlı?

Tek bir kodlama ajanına bağlı değildir. Kaynak, desteklenen ortamlar için ayrı araç referansları olan dosya tabanlı bir iş akışı tanımlar.

Yerel bir Figma dosyasını okuyabilir mi?

Giriş noktası çevrimdışı bir .fig içe aktarma yolu içerir. Bu iş akışı için ayrıntılı içe aktarma rehberi ve betikler gereklidir.

Herhangi bir HTML PowerPoint'e aktarılabilir mi?

Hayır. Kaynak, sunum dışa aktarımını açıkça desteklenen slayt yapılı HTML ile sınırlar.

OpenDesign

Sonraki Tasarım Yinelemesine Yer Açın.

Brief'inizi, kaynak materyalinizi ve tasarım çalışmanızı yerel bir çalışma alanında bir arada tutun. İş akışınıza eklemeden önce skill'in kendi kurulumunu kontrol edin.

Upstream Kaynak Dosyası
https://github.com/JimLiu/baoyu-design/blob/6530033592bf7fa58bc1a5a2a2ad278da45213a9/skills/baoyu-design/SKILL.md