Skip to main content
Flowstep, tasarım araçlarını Model Context Protocol üzerinden kullanıma sunar ve yapay zeka asistanınızın editörden çıkmadan UI ekranları oluşturmasına ve geliştirmesine olanak tanır. Sunucu https://api.flowstep.ai/mcp adresinde barındırılır (Streamable HTTP aktarımı). Çalıştırılması gereken yerel bir işlem yoktur.

Neler yapabilirsiniz

Sunucu yedi kategori arasında 20 aracı kullanıma sunar:

Yaygın kullanım durumları

İstemden ekranlar oluşturun — bir açıklama ile create-new-design öğesini çağırın. Flowstep, dosyayı ve ekranları bir adımda oluşturur. Döndürülen screenIds ile get-screen-image öğesini çağırarak sonucu satır içinde görebilirsiniz. React bileşenini görselleştirin.jsx veya .tsx dosyanızı upload-attachment aracılığıyla yükleyin (mimeType: text/javascript kullanın), ardından döndürülen eki bileşeni açıklayan bir iletiyle create-new-design içine geçirin. Flowstep kaynağı okur ve eşleşen bir tasarım ekranı oluşturur. Tasarımda yineleme yapın — hedef screenId ile edit-design öğesini çağırarak onu değiştirmek için yönergeler verin veya bir ekranı sıfırdan yeniden yapmak için regenerate-design öğesini çağırın. Tasarım yönergelerini yönetin — geçerli stil kurallarınızı (renkler, tipografi, boşluk, ton) almak için get-design-guidelines öğesini çağırın, ardından tasarımınız gelişirken bunları eşit tutmak için update-design-guidelines öğesini kullanın. create-new-design veya edit-design öğesine tutarlı yönergeleri geçmek, her oluşturulan ekranın marka ile uyumlu kalmasını sağlar. Bunları tamamen sıfırlamak için delete-design-guidelines öğesini kullanın. Figma’dan içe aktarın — bir Figma çerçeve bağlantısı ve bir fileId ile import-figma öğesini çağırarak çerçeveyi Flowstep dosyasına düzenlenebilir öğeler olarak getirebilirsiniz. Dosyanın organizasyonunun önce Figma bağlı olması gerekir. Kotayı denetleyin — oluşturma işleminden önce kalan günlük ve aylık kullanımı görmek için get-plan-details öğesini çağırın.

Uç nokta

Aktarım: Streamable HTTP. Oturum modeli: durumsuz (her istek bağımsızdır, oturum ID’si yoktur).

Sonraki adımlar

Hızlı Başlangıç

Cursor ile 5 dakika içinde ilk araç çağrısı.

Kimlik Doğrulama

OAuth 2.1 PKCE’nin nasıl çalıştığı ve belirteçlerin nasıl verildiği.

Araçlar

Tüm 20 aracın tam giriş/çıkış referansı.

Örnekler

Yaygın görevler için uçtan uca iş akışları.