Skip to main content
Başarılı olduğunda, get-screen-image dışındaki her araç sonucunu iki kez döndürür: structuredContent olarak (aracın yayımlanmış çıkış şemasına göre doğrulanmış) ve aynı nesnenin bir metin bloğuna serileştirilmiş hali olarak, { type: "text", text: "<json-string>" }, yapılandırılmış içeriği okumayan istemciler için. get-screen-image yalnızca bir MCP görsel bloğu döndürür: { type: "image", data: "<base64>", mimeType: "image/png" }. Hata durumunda isError: true ayarlanır ve metin bloğu kısa bir hata mesajı içerir. Üzerinde işlem yapabileceğiniz hatalar — silmede ad uyuşmazlığı, geçersiz bir Figma bağlantısı, geçersiz tasarım yönergeleri, bir ek sorunu veya bir oluşturma zaman aşımı — neyin düzeltilmesi gerektiğini açıklar. Diğer hatalar Failed to list files gibi genel bir mesaj döndürür.
Fiyatlandırma: yapay zekâ tasarım araçları — ai-generate-screens, ai-edit-screens, ai-generate-screen-variant ve ai-edit-screen-variant — Flowstep uygulamasıyla aynı mesaj kotasını kullanır. Diğer tüm araçlar ücretsizdir. Bkz. Kullanım limitleri.
Her araç ayrıca, istemcinizin ne yaptığını bilmesi için MCP açıklamaları yayımlar. delete-file, delete-screen, delete-design-guidelines, replace-screen-jsx, ai-edit-screens ve ai-edit-screen-variant, mevcut içeriği kaldırdıkları veya üzerine yazdıkları için yıkıcı olarak işaretlenir.

Dosya araçları

list-files

Flowstep dosyalarınızın meta verilerini listeleyin. İlgili bir dosyanın zaten var olup olmadığını kontrol etmek için önce bunu çağırın. Ekran içeriği döndürmez; bunun için get-screen-image veya get-screen-jsx kullanın. Giriş Çıktı — { files }.
  • owner — dosyayı siz oluşturduysanız true.
  • shared_with_me — dosya yalnızca organizasyonunuz üzerinden değil, doğrudan sizinle paylaşıldıysa true.
  • url — dosyayı Flowstep düzenleyicisinde açar.

get-file

Tek bir dosyanın meta verilerini alın. Dosya içeriği bilerek dahil edilmez; ekranları incelemek için get-screen-image veya get-screen-jsx, ekli yönergeleri almak için get-design-guidelines kullanın. Dosya için bekleyen bir davetiniz varsa get-file çağırmak bu daveti kabul eder. Giriş Çıktı — { file, user_access_level }.
  • access_level — private, read veya write.
  • visibility — private, member veya public.
  • user_access_level — dosyaya erişiminiz: read veya write.

create-file

Ekran içermeyen boş bir Flowstep dosyası oluşturun. Bir dosyayı oluşturup ekranları tek adımda üretmek için bunun yerine fileId olmadan ai-generate-screens çağırın. Kod öncelikli iş akışları için create-file kullanın ve ardından add-screen-jsx çağırın. Giriş Çıktı — get-file ile aynı biçimde { file, user_access_level }. owner her zaman true, user_access_level her zaman write olur. Sonraki araç çağrılarında döndürülen file.id değerini fileId olarak kullanın.

update-file

Bir dosyanın adını değiştirin. Giriş Çıktı — get-file ile aynı biçimde { file, user_access_level }.

delete-file

Bir dosyayı kalıcı olarak silin. İlettiğiniz name değeri silmeden önce dosyanın mevcut görünen adıyla karşılaştırılır; eşleşmezse silme işlemi iptal edilir. Bu, yanlış dosyanın yanlışlıkla silinmesini önler. Ajanlara önce sizden onay almaları talimatı verilmiştir. Giriş Çıktı — { "deleted": true }
Bu işlem geri alınamaz. Dosyadaki tüm ekranlar silinir.

Ekran araçları

list-screens

Bir dosyadaki ekranları tuval sırasına göre listeleyin. Bir dosyada zaten neyin olduğunu görmek için list-files çağrısından sonra bunu çağırın. Döndürülen screenId değerlerini diğer ekran araçlarında ve yapay zekâ tasarım araçlarında kullanın. Giriş Çıktı — { screens }.
  • prompt — ekranın son oluşturma istemi; hiç oluşturulmamışsa boş bir dize (örneğin add-screen-jsx ile eklenen bir ekran).
  • fidelity — lofi, hifi veya ui.

get-screen-image

Bir ekranı PNG olarak oluşturun ve satır içi bir görsel olarak döndürün. Görsel içerik bloklarını destekleyen bir istemci gerektirir. Bir yapay zekâ tasarım aracı, add-screen-jsx, replace-screen-jsx veya import-figma tarafından döndürülen her screenId için bir kez çağırın. Giriş Çıktı — MCP görsel içerik bloğu (image/png). data, PNG baytlarının standart base64 kodlamasıdır; veri URI’si değildir. Bu araç için structuredContent yoktur.

get-screen-jsx

Bir ekranı, meta verileriyle birlikte JSX olarak alın — böylece kod tabanınızda bundan geliştirme yapabilir ya da düzenleyip replace-screen-jsx ile geri yazabilirsiniz. Bunun yerine görsel bir önizleme için get-screen-image kullanın. Giriş Çıktı — { fileId, screenId, name, prompt, fidelity, screenType, colorTheme, jsx, fragments }.
  • jsx — yalnızca işaretleme. data-id öznitelikleri yalnızca includeIds true olduğunda dahil edilir.
  • prompt — son oluşturma istemi; ekran hiç oluşturulmamışsa boş bir dize.
  • fragments — ekranda saklanan ortak arayüz parçaları; gezinme çubuğu, üst bilgi veya logo gibi, { purpose, markup } nesneleri olarak. Yoksa boştur. Bunları korumak veya güncellemek için replace-screen-jsx aracına geri iletin.
fidelity, screenType ve colorTheme değerleri için bkz. Ekran alanı değerleri.

add-screen-jsx

Yazdığınız JSX’ten bir dosyaya yeni bir ekran ekleyin. Bu kod öncelikli yoldur ve ücretsizdir; ekranı Flowstep’in yapay zekâsının tasarlamasını istediğinizde ai-generate-screens kullanın. add-screen-jsx her zaman yeni bir ekran oluşturur: mevcut bir ekranın üzerine yazmak için replace-screen-jsx kullanın. Yeni ekran mevcut bir ekrana dayanıyorsa, name, fidelity, screenType, colorTheme ve jsx için get-screen-jsx (includeIds olmadan) ile başlayın, ardından farklı olması gereken her şeyi değiştirin. Giriş Çıktı — { fileId, screenId }. Sonucu görmek için screenId ile get-screen-image çağırın.

replace-screen-jsx

Yazdığınız JSX ile mevcut bir ekranın üzerine yazın. Ekran screenId değerini ve tuvaldeki konumunu korur; iç içe öğeler yeni kimlikler alır. Bu kod öncelikli yoldur ve ücretsizdir; yapay zekâ ile değişiklik için ai-edit-screens veya ai-edit-screen-variant kullanın, yeni bir ekran oluşturmak için ise add-screen-jsx kullanın. get-screen-jsx (includeIds olmadan) ile başlayın, ardından farklı olması gereken her şeyi değiştirin. Giriş Çıktı — { fileId, screenId }. Sonucu görmek için screenId ile get-screen-image çağırın.
Bu, ekranın içeriğini yerinde değiştirir.

rename-screen

Bir ekranın tuval etiketini yeniden adlandırın — list-screens içinde ve düzenleyicide gösterilen ad. Bu yalnızca etiketi değiştirir; ekranın düzenini, boyutunu veya içeriğini değiştirmez — bunlar için ai-edit-screens kullanın. Giriş Çıktı — { screenId, name }.

delete-screen

Bir dosyadan bir ekranı kalıcı olarak silin. İlettiğiniz name değeri ekranın mevcut görünen adıyla karşılaştırılır; eşleşmezse silme iptal edilir. Ajanlara önce sizden onay almaları talimatı verilmiştir. Giriş Çıktı — { "deleted": true }

Ekran alanı değerleri

get-screen-jsx bu değerleri döndürür; add-screen-jsx ve replace-screen-jsx bu değerleri kabul eder:

Tasarım yönergeleri araçları

Tasarım yönergeleri, bir dosyada saklanan DESIGN.md metnidir. Ayarlandığında, o dosya için yapılan her yapay zekâ üretimine eklenir. Bkz. Tasarım yönergeleri.

get-design-guidelines

Bir dosyaya ekli tasarım yönergelerini alın. Giriş Çıktı — { guidelines }.
Hiç yönerge ayarlanmadıysa guidelines değeri null olur.

update-design-guidelines

Bir dosya için tasarım yönergelerini ayarlayın veya değiştirin. Yönergeleri Google’ın DESIGN.md biçiminde düz bir dize olarak iletin — nesne veya JSON olarak değil. Bir dosyadan okuyorsanız, o dosyanın metnini iletin. Giriş Doğrulama kuralları
  • Frontmatter doğru şekilde açılmalı ve kapatılmalıdır
  • Frontmatter satırları geçerli blok biçimli YAML olmalıdır
  • Markdown gövdesi yinelenen ## bölüm başlıklarını içermemelidir
Doğrulama başarısız olursa çağrı Invalid design guidelines: ile başlayan bir hata döndürür. Çıktı — { updated, warnings? }.
warnings, kabul edilmiş ancak yapay zekâ tarafından yok sayılabilecek yumuşak doğrulama sorunlarını (bilinmeyen anahtarlar, onaltılık biçimde olmayan renkler) listeler. Hiç yoksa dahil edilmez. Bunları kullanıcıya bildirin.

delete-design-guidelines

Bir dosyanın tasarım yönergelerini temizleyin. Var olmayan yönergeleri silmek bir işlem yapmaz. Giriş Çıktı — { "deleted": true }

Sohbet araçları

get-chat-history

Bir dosyayla ilişkili tasarım konuşmasını alın — MCP istemcinizin konuşmasını değil, dosyanın Flowstep sohbetini. Dosyadaki önceki çalışmalara devam etmek için kullanın. Giriş Çıktı — { messages }. Dosyada bir tasarım konuşmanız yoksa messages boştur. Her mesajın bir type ("request" veya "response"), bir author ("human" veya "ai") ve bir content_type değeri vardır. Yanıt mesajları "text", "summary" veya "followup" kullanır.

Ek araçları

upload-attachment

ai-generate-screens veya ai-edit-screens içinde ek olarak kullanmak üzere bir referans dosyası yükleyin (ai-generate-screen-variant ve ai-edit-screen-variant ek kabul etmez). Dosya baytları modelden hiç geçmez ve sunucu sizin adınıza URL’leri asla getirmez. Bir web sayfasına başvurmak için bunun yerine URL’sini tasarım aracının message alanına ekleyin. İki mod vardır — birini kullanın, ikisini birleştirmeyin. A modu — dosyalar ve görseller (mimeType + fileName) Herhangi bir görsel, PDF veya daha büyük bir metin dosyası için gereken üç adımlı akış:
  1. Yalnızca mimeType ve fileName ile upload-attachment çağırın (örneğin image/png ve dog.png). Yanıt, saklanmış bir dosya değil, hazırlanmış bir yüklemedir:
  2. uploadCommand içindeki LOCAL_FILE_PATH değerini dosyanızın mutlak yoluyla değiştirin ve bu komutu tam olarak kabuğunuzda çalıştırın — çıkış kodu 0 olmalıdır. signedUrl içindeki belirteç yalnızca bu tek yüklemeye yetki verir. Bu adımı atlamak depolamayı boş bırakır ve tasarım aracı ön kontrolünde başarısız olur.
  3. Tasarım aracının attachments dizisine yalnızca { id, path, type } iletin — signedUrl, uploadCommand veya nextStep değil.
Uzak bir dosyayı eklemek için önce onu kendiniz yerel bir yola indirin (örneğin curl ile), ardından aynı üç adımı izleyin. upload-attachment aracına asla URL iletmeyin. B modu — kısa metin (text + mimeType) Zaten bağlamda olan metni yükleyin — kabuk komutu gerekmez. Yanıt doğrudan kullanıma hazırdır:
Ortaya çıkan { id, path, type } değerini ai-generate-screens veya ai-edit-screens aracının attachments dizisine iletin. Her iki modda da en fazla dosya boyutu 3 MB’dır ve PDF’ler en fazla 100 sayfa olabilir. type, görsel dosyalar için "image", PDF’ler ve metin dosyaları için "document" değerini alır.

Figma araçları

import-figma

Bir Figma çerçevesini bir Flowstep dosyasına, tuvalinde düzenlenebilir öğeler olarak aktarın. Her aktarma yeni bir ekran ekler — aynı çerçeveyi iki kez aktarmak size iki ekran verir; bu yüzden onu değiştirmek istediyseniz eski ekranı delete-screen ile silin. Dosyanın bağlı olduğu organizasyonda, Flowstep ayarlarında Figma’nın bağlı olması gerekir. Giriş Çıktı — { fileId, screenId, frameCount? }. screenId, aktarılan ekrandır — sonucu görmek için bunu get-screen-image aracına iletin. Bir sayfa URL’si birden fazla çerçeve aktardığında screenId null olur ve bunun yerine frameCount döndürülür; list-screens çağırın, ardından her yeni ekran için get-screen-image çağırın.

Plan ve faturalandırma araçları

get-plan-details

Organizasyonunuzun Flowstep planını, abonelik durumunu, kullanımını ve kalan kotasını alın. Giriş almaz — organizasyon, oturum açmış kullanıcıdan belirlenir. Yapay zekâ tasarım araçlarını çağırmadan önce kotanızı kontrol etmek için kullanın. Çıktı — { plan, subscription, limits, usage, remaining }. Limitler plana göre değişir — bkz. Fiyatlandırma ve Kullanım limitleri.

Yapay zekâ tasarım araçları

Bu dört araç bir açıklamadan veya hazır ayardan tasarım yapar — hiçbir zaman JSX almaz veya yeniden kullanmaz. Her çağrı, Flowstep uygulamasıyla aynı mesaj kotasını kullanır ve oluşturma tamamlanana veya zaman aşımına uğrayana (180 saniye) kadar bekler. Dördü de { status, fileId, screenIds, designGuidelinesUpdated } döndürür. Sonucu görmek için her screenId için bir kez get-screen-image çağırın.
  • designGuidelinesUpdated — bu tur sırasında dosyanın DESIGN.md yönergeleri otomatik olarak güncellendiyse değişikliğin kısa bir özeti; aksi halde null.

ai-generate-screens

Bir metin açıklamasından bir veya daha fazla tamamen yeni ekran oluşturun. Otomatik olarak yeni bir dosya oluşturmak için fileId değerini atlayın; ekranları mevcut bir dosyaya eklemek için fileId iletin. Bu araç her zaman yeni ekranlar oluşturur — mevcut ekranları yerinde asla düzenlemez. Giriş Çıktı — { status, fileId, screenIds, designGuidelinesUpdated, reply? }.
  • status — ekranlar oluşturulduğunda "generated". Flowstep oluşturmadan yanıt verdiğinde "chat"; bu durumda yanıtı reply içinde bulunur ve screenIds boştur. Talebiniz belirsizse ajanınız sizden açıklama istemeli ve aracı yeniden çağırmalıdır.

ai-edit-screens

Bir metin talimatıyla bir veya daha fazla mevcut ekranı yerinde değiştirin — tema, metin, düzen veya birden fazla ekranda koordineli değişiklikler. Bütün ekranları veya içlerindeki tek tek öğeleri hedefleyebilirsiniz. Tek bir bütün ekranda hazır ayar değişikliği için ai-edit-screen-variant daha basittir. Giriş Çıktı — { status, fileId, screenIds, designGuidelinesUpdated, reply? }; status ve reply davranışı ai-generate-screens ile aynıdır.
Bu, hedeflenen ekranların içeriğinin yerine yazar.

ai-generate-screen-variant

Tam olarak bir mevcut ekrandan türetilmiş yeni bir ekran ekleyin — akıştaki sonraki adım, bir hata veya boş durum ya da başka bir platform için bir sürüm. Özgün ekran değiştirilmez. Mevcut bir ekranın varyantı olmayan bir ekran eklemek için (örneğin bir ayarlar ekranı), fileId ile ai-generate-screens kullanın. Giriş Çıktı — { status, fileId, screenIds, designGuidelinesUpdated }. status her zaman "generated" olur.

ai-edit-screen-variant

Bir hazır ayar kullanarak tam olarak bir mevcut ekranı yerinde değiştirin — temasını veya görünümünü iyileştirin, farklı bir düzen ya da görsel stil deneyin ya da sıfırdan yeniden tasarlayın. Serbest biçimli talimatlar veya tek tek öğelerde hassas düzenleme için ai-edit-screens kullanın. Giriş Çıktı — { status, fileId, screenIds, designGuidelinesUpdated }. status her zaman "generated" olur.
Bu, ekranın içeriğinin yerine yazar.

Yeniden adlandırılan araçlar

Araç adları Eylül 2026’da değişti. Eski adları kullanan istemleriniz, betikleriniz veya ajan talimatlarınız varsa bunları güncelleyin: Girdiler de değişti: yapay zekâ tasarım araçları targets yerine elementIds (ya da varyant araçları için tek bir screenId) alır; add-screen-jsx, meta veri yorumu olan jsxContent yerine jsx ve açık meta veri alanları alır; create-file, title yerine name alır; tasarım yönergeleri araçları ise resourceId ve linkedTo yerine fileId alır.