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.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ıztrue.shared_with_me— dosya yalnızca organizasyonunuz üzerinden değil, doğrudan sizinle paylaşıldıysatrue.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,readveyawrite.visibility—private,memberveyapublic.user_access_level— dosyaya erişiminiz:readveyawrite.
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 }
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ğinadd-screen-jsxile eklenen bir ekran).fidelity—lofi,hifiveyaui.
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ızcaincludeIdstrueolduğ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çinreplace-screen-jsxaracı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.
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 saklananDESIGN.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 }.
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
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ış:
-
Yalnızca
mimeTypevefileNameileupload-attachmentçağırın (örneğinimage/pngvedog.png). Yanıt, saklanmış bir dosya değil, hazırlanmış bir yüklemedir: -
uploadCommandiçindekiLOCAL_FILE_PATHdeğ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.signedUrliç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. -
Tasarım aracının
attachmentsdizisine yalnızca{ id, path, type }iletin —signedUrl,uploadCommandveyanextStepdeğil.
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ınDESIGN.mdyönergeleri otomatik olarak güncellendiyse değişikliğin kısa bir özeti; aksi haldenull.
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ıreplyiçinde bulunur vescreenIdsboş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.
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.
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.