הפניית כלי MCP

בהצלחה, כל כלי מלבד get-screen-image מחזיר את התוצאה שלו פעמיים: כ-structuredContent (מאומת מול סכמת הפלט שפורסמה של הכלי) וכאותו אובייקט מסודר לתוך בלוק טקסט, { type: "text", text: "<json-string>" }, עבור לקוחות שאינם קוראים תוכן מובנה. get-screen-image מחזיר רק בלוק תמונה של MCP: { type: "image", data: "<base64>", mimeType: "image/png" }. בכישלון, מוגדר isError: true ובלוק הטקסט מכיל הודעת שגיאה קצרה. שגיאות שאפשר לפעול לפיהן — אי התאמה של שם במחיקה, קישור Figma לא תקין, הנחיות עיצוב לא חוקיות, בעיה בקובץ מצורף, או timeout של יצירה — מסבירות מה לתקן. כשלונות אחרים מחזירים הודעה כללית כמו Failed to list files.

תמחור: שלושת כלי העיצוב בעזרת AI — ai-design-screens, ai-generate-screen-variant, ו-ai-edit-screen-variant — משתמשים באותה מכסת הודעות כמו אפליקציית Flowstep. כל שאר הכלים חינמיים. ראו מגבלות שימוש.

כל כלי מפרסם גם הערות MCP כדי שהלקוח שלכם ידע מה הוא עושה. delete-file, delete-screen, delete-design-guidelines, replace-screen-jsx, ai-design-screens, ו-ai-edit-screen-variant מסומנים כהרסניים, מכיוון שהם מסירים או דורסים תוכן קיים.

כלי קבצים

`list-files`

רשימת מטא-נתונים של קבצי Flowstep שלכם. קראו לזה תחילה כדי לבדוק אם קובץ רלוונטי כבר קיים. הוא לא מחזיר תוכן מסכים — להחזרת תוכן השתמשו ב-get-screen-image או ב-get-screen-jsx. קלט

פרמטר	סוג	ברירת מחדל	תיאור
`orderByCreation`	`boolean`	`true`	מיון מהחדש לישן לפי `created_at` (`true`) או לפי `updated_at` (`false`). השתמשו ב-`false` כדי למצוא קבצים שנערכו לאחרונה
`limit`	`integer` (1–100)	`20`	מספר הקבצים המרבי שמוחזר. עמוד מלא עשוי לציין שיש קבצים נוספים
`offset`	`integer` (≥0)	`0`	מספר הקבצים שיש לדלג עליהם. העמוד הבא הוא `offset + limit`

פלט — { files }.

{
  "files": [
    {
      "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
      "name": "Dashboard redesign",
      "created_at": "2026-04-30T15:02:13.120152+00:00",
      "updated_at": "2026-04-30T15:02:13.120152+00:00",
      "organisation_id": "0b7f3c9e-2d4a-4f1b-9a5e-6c8d7e1f2a3b",
      "shared_with_me": false,
      "owner": true,
      "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
    }
  ]
}

owner — true אם יצרתם את הקובץ.
shared_with_me — true אם הקובץ שותף איתכם ישירות, ולא רק דרך הארגון שלכם.
url — פותח את הקובץ בעורך של Flowstep.

`get-file`

קבלת מטא-נתונים של קובץ יחיד. תוכן הקובץ מושמט בכוונה — השתמשו ב-get-screen-image או ב-get-screen-jsx כדי לבדוק מסכים, וב-get-design-guidelines כדי לאחזר הנחיות מצורפות. אם יש לכם הזמנה ממתינה לקובץ, קריאה ל-get-file מקבלת אותה. קלט

פרמטר	סוג	תיאור
`id`	`uuid`	מזהה הקובץ

פלט — { file, user_access_level }.

{
  "file": {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
    "access_level": "private",
    "visibility": "private",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  },
  "user_access_level": "write"
}

access_level — private, read, או write.
visibility — private, member, או public.
user_access_level — הגישה שלכם לקובץ: read או write.

`create-file`

יצירת קובץ Flowstep ריק, בלי מסכים. כדי ליצור קובץ ולייצר מסכים בשלב אחד, קראו ל-ai-design-screens בלי fileId. השתמשו ב-create-file לזרימות עבודה מבוססות קוד, ואחריו ב-add-screen-jsx. קלט

פרמטר	סוג	תיאור
`name`	`string` (מינימום 1)	שם התצוגה של הקובץ החדש

פלט — { file, user_access_level }, באותו מבנה כמו get-file. owner הוא תמיד true, ו-user_access_level הוא תמיד write. השתמשו ב-file.id שהוחזר כ-fileId בקריאות הכלים הבאות.

`update-file`

שינוי שם של קובץ. קלט

פרמטר	סוג	תיאור
`id`	`uuid`	מזהה הקובץ
`name`	`string` (מינימום 1)	שם התצוגה החדש

פלט — { file, user_access_level }, באותו מבנה כמו get-file.

`delete-file`

מחיקה קבועה של קובץ. ה-name שאתם מעבירים נבדק מול שם התצוגה הנוכחי של הקובץ לפני המחיקה — אם הוא לא תואם, המחיקה מבוטלת. כך מונעים מחיקה בטעות של קובץ שגוי. הסוכנים מונחים לאשר איתכם לפני כן. קלט

פרמטר	סוג	תיאור
`id`	`uuid`	מזהה הקובץ
`name`	`string`	שם התצוגה הנוכחי של הקובץ — חייב להתאים, אחרת המחיקה מבוטלת

פלט — { "deleted": true }

לא ניתן לבטל פעולה זו. כל המסכים בקובץ נמחקים.

כלי מסכים

`list-screens`

רשימת המסכים בקובץ, בסדר הקנבס. קראו לזה אחרי list-files כדי לראות מה כבר נמצא בקובץ. השתמשו בערכי screenId שהוחזרו עם שאר כלי המסכים וכלי העיצוב בעזרת AI. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ

פלט — { screens }.

{
  "screens": [
    {
      "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe",
      "name": "Mobile login screen",
      "prompt": "Generate a simple mobile login screen with email and password fields and a sign in button",
      "fidelity": "ui"
    }
  ]
}

prompt — הפרומפט האחרון של היצירה למסך, או מחרוזת ריקה אם המסך מעולם לא נוצר בעזרת AI (למשל מסך שנוסף עם add-screen-jsx).
fidelity — lofi, hifi, או ui.

`get-screen-image`

רינדור מסך ל-PNG והחזרתו כתמונה מוטמעת. דורש לקוח שתומך בבלוקים של תוכן תמונה. קראו לזה פעם אחת עבור כל screenId שמוחזר על ידי כלי עיצוב בעזרת AI, add-screen-jsx, replace-screen-jsx, או import-figma. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ
`screenId`	`uuid`	`screenId` מ-`list-screens` או מהמערך `screenIds` שמוחזר על ידי כלי עיצוב

פלט — בלוק תוכן תמונה של MCP (image/png). data הוא base64 סטנדרטי של בייטי ה-PNG, לא data URI. לכלי הזה אין structuredContent.

`get-screen-jsx`

קבלת מסך כ-JSX, יחד עם המטא-נתונים שלו — כדי שתוכלו לבנות ממנו בבסיס הקוד שלכם, או לערוך אותו ולכתוב אותו בחזרה עם replace-screen-jsx. להצגה חזותית השתמשו ב-get-screen-image במקום. קלט

פרמטר	סוג	ברירת מחדל	תיאור
`fileId`	`uuid`	—	מזהה הקובץ
`screenId`	`uuid`	—	`screenId` מ-`list-screens` או מהמערך `screenIds` שמוחזר על ידי כלי עיצוב
`includeIds`	`boolean`	`false`	כולל תכונת `data-id` באלמנטים ב-`jsx`. השתמשו בזה כשאתם צריכים מזהי אלמנטים כדי להעביר אותם כ-`elementIds` ל-`ai-design-screens`, בין אם לעריכה במקום ובין אם כהפניה חזותית

פלט — { fileId, screenId, name, prompt, fidelity, screenType, colorTheme, jsx, fragments }.

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenId": "c13d3707-0efe-49f5-b6cb-0ca5ac5223d0",
  "name": "World clock",
  "prompt": "A world clock screen with a city search and alert button",
  "fidelity": "ui",
  "screenType": "iphone-x-vertical",
  "colorTheme": "blue",
  "jsx": "<div className=\"bg-white text-zinc-950 w-full h-fit\">\n  <div className=\"flex p-6 flex-col gap-6\">\n    …\n  </div>\n</div>",
  "fragments": []
}

jsx — סימון בלבד. תכונות data-id נכללות רק כאשר includeIds הוא true.
prompt — הפרומפט האחרון של היצירה, או מחרוזת ריקה אם המסך מעולם לא נוצר בעזרת AI.
fragments — רכיבי מעטפת משותפים השמורים במסך, כמו סרגל ניווט, כותרת או לוגו, כאובייקטים מסוג { purpose, markup }. ריק כשאין כאלה. העבירו אותם בחזרה ל-replace-screen-jsx כדי לשמור או לעדכן אותם.

ראו ערכי שדות מסך לערכים של fidelity, screenType, ו-colorTheme.

`add-screen-jsx`

הוספת מסך חדש לקובץ מ-JSX שכתבתם. זוהי הדרך מבוססת הקוד והיא חינמית — השתמשו ב-ai-design-screens כשאתם רוצים ש-AI של Flowstep יעצב את המסך. add-screen-jsx תמיד יוצר מסך חדש: כדי לדרוס מסך קיים, השתמשו ב-replace-screen-jsx. כדי להציג תמונה שהעליתם, ראו תמונות ב-JSX. כשהמסך החדש מבוסס על מסך קיים, התחילו מ-get-screen-jsx (בלי includeIds) עבור name, fidelity, screenType, colorTheme, ו-jsx, ואז שנו את מה שצריך להיות שונה. קלט

פרמטר	סוג	ברירת מחדל	תיאור
`fileId`	`uuid`	—	מזהה הקובץ
`name`	`string` (1–100 תווים)	—	שם תצוגה אופציונלי. השמיטו אותו כדי לתת למסך שם אוטומטי `Screen N`
`fidelity`	`string`	`"ui"`	רמת הנאמנות של המסך
`screenType`	`string`	—	חובה — המכשיר או ה-viewport שאליהם המסך מעוצב
`colorTheme`	`string`	`"default"`	ערכת הצבעים
`jsx`	`string`	—	סימון JSX בלבד. תכונות `data-id` מתעלמות — למסך החדש יוקצו מזהי אלמנטים חדשים

פלט — { fileId, screenId }. קראו ל-get-screen-image עם screenId כדי לראות את התוצאה.

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbf"
}

`replace-screen-jsx`

דריסת מסך קיים ב-JSX שכתבתם. המסך שומר על ה-screenId ועל מיקומו בקנבס; אלמנטים מקוננים מקבלים מזהים חדשים. זוהי הדרך מבוססת הקוד והיא חינמית — השתמשו ב-ai-design-screens או ב-ai-edit-screen-variant לשינויים עם AI, וב-add-screen-jsx כדי ליצור מסך חדש במקום. התחילו מ-get-screen-jsx (בלי includeIds), ואז שנו את מה שצריך להיות שונה. כדי להציג תמונה שהעליתם, ראו תמונות ב-JSX. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ
`screenId`	`uuid`	המסך שיידרס
`jsx`	`string`	סימון JSX בלבד. תכונות `data-id` מתעלמות
`name`	`string` (1–100 תווים)	אופציונלי. השמיטו כדי לשמור על השם הנוכחי
`fidelity`	`string`	אופציונלי. השמיטו כדי לשמור על רמת הנאמנות הנוכחית
`screenType`	`string`	אופציונלי. השמיטו כדי לשמור על סוג המסך הנוכחי
`colorTheme`	`string`	אופציונלי. השמיטו כדי לשמור על ערכת הצבעים הנוכחית
`fragments`	`{ purpose, markup }[]`	אופציונלי. רכיבי מעטפת משותפים מ-`get-screen-jsx`. השמיטו כדי לשמור על הרכיבים הנוכחיים, או העבירו `[]` כדי לנקות אותם

פלט — { fileId, screenId }. קראו ל-get-screen-image עם screenId כדי לראות את התוצאה.

פעולה זו מחליפה את התוכן של המסך במקומו.

`rename-screen`

שינוי שם התווית של מסך בקנבס — השם שמוצג על ידי list-screens ובעורך. זה משנה רק את התווית, לא את הפריסה, הגודל או התוכן של המסך — לשינויים כאלה השתמשו ב-ai-design-screens. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ
`screenId`	`uuid`	ה-`screenId` שמוחזר על ידי `list-screens`
`name`	`string` (1–100 תווים)	שם המסך החדש. רווחים בתחילה ובסוף מוסרים

פלט — { screenId, name }.

{ "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe", "name": "Checkout — empty cart" }

`delete-screen`

מחיקה קבועה של מסך מקובץ. ה-name שאתם מעבירים נבדק מול שם התצוגה הנוכחי של המסך — אם הוא לא תואם, המחיקה מבוטלת. הסוכנים מונחים לאשר איתכם לפני כן. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ
`screenId`	`uuid`	המסך למחיקה
`name`	`string`	שם התצוגה הנוכחי של המסך — חייב להתאים, אחרת המחיקה מבוטלת

פלט — { "deleted": true }

תמונות ב-JSX

add-screen-jsx ו-replace-screen-jsx מקבלים תמונות ב-src של img, או כרקע ב-className עם bg-[url(...)]. כתבו טקסט alt, והתאימו את גודל כל תמונה לתפקידה. כדי להציב תמונה משלכם:

העלו אותה עם upload-attachment במצב א’ (mimeType + fileName), והריצו את uploadCommand שיוחזר.
אם ה-type בתגובה הוא "image", הדביקו את ה-assetUrl בדיוק כפי שהוחזר ב-img src או ב-bg-[url(assetUrl)].

השאירו כל כתובת תמונה אחרת בדיוק כפי ש-get-screen-jsx החזיר אותה. אל תכניסו path, signedUrl, או uploadCommand ל-src.

<img src="ASSET_URL" alt="Team photo" className="w-full h-48 object-cover rounded-lg" />

ערכי שדות מסך

get-screen-jsx מחזיר, ו-add-screen-jsx ו-replace-screen-jsx מקבלים, את הערכים האלה:

שדה	ערכים
`fidelity`	`lofi`, `hifi`, `ui`
`screenType`	`web`, `desktop`, `desktop-large`, `desktop-medium`, `desktop-small`, `tablet`, `ipad-tablet-horizontal`, `ipad-tablet-vertical`, `android-tablet-horizontal`, `android-tablet-vertical`, `mobile_ios`, `mobile_android`, `iphone-vertical`, `iphone-horizontal`, `iphone-x-vertical`, `iphone-x-horizontal`, `android-vertical`, `android-horizontal`, `android-small-vertical`, `android-small-horizontal`
`colorTheme`	`default`, `defaultDark`, `blue`, `blueDark`, `ice`, `iceDark`, `grayscale`, `grayscaleDark`, `green`, `greenDark`, `orange`, `orangeDark`, `red`, `redDark`, `rose`, `roseDark`, `violet`, `violetDark`, `yellow`, `yellowDark`

כלי הנחיות עיצוב

הנחיות עיצוב הן טקסט DESIGN.md השמור בקובץ. כשהן מוגדרות, הן מוזרקות לכל יצירת AI עבור הקובץ הזה. ראו הנחיות עיצוב.

`get-design-guidelines`

קבלת הנחיות העיצוב המצורפות לקובץ. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ

פלט — { guidelines }.

{
  "guidelines": "## Colors\n\nPrimary: #6366F1\nBackground: #FFFFFF\n\n## Typography\n\nFont: Inter"
}

guidelines הוא null אם לא הוגדרו הנחיות.

`update-design-guidelines`

הגדרה או החלפה של הנחיות העיצוב לקובץ. העבירו את ההנחיות כמחרוזת רגילה בפורמט DESIGN.md של Google — לא כאובייקט או JSON. אם אתם קוראים מקובץ, העבירו את הטקסט של אותו קובץ. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ
`designGuidelines`	`string` (מינימום 1)	הטקסט הגולמי של ההנחיות. חייב להיות מחרוזת רגילה — לא מקודדת כ-JSON

כללי אימות

ה-frontmatter חייב להיפתח ולהיסגר כראוי
שורות ה-frontmatter חייבות להיות YAML חוקי בסגנון בלוקים
גוף ה-Markdown לא יכול להכיל כותרות ## כפולות

אם האימות נכשל, הקריאה מחזירה שגיאה שמתחילה ב-Invalid design guidelines:. פלט — { updated, warnings? }.

{ "updated": true, "warnings": ["…"] }

warnings מפרט בעיות אימות רכות (מפתחות לא מוכרים, צבעים שאינם הקסדצימליים) שהתקבלו אך ייתכן שה-AI יתעלם מהם. הציגו אותן למשתמש. השדה מושמט כשאין אזהרות.

`delete-design-guidelines`

ניקוי הנחיות העיצוב של קובץ. מחיקה של הנחיות שלא קיימות אינה משנה דבר. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ

פלט — { "deleted": true }

כלי צ’אט

`get-chat-history`

קבלת שיחת העיצוב המשויכת לקובץ — צ’אט הקובץ ב-Flowstep, לא השיחה של לקוח ה-MCP שלכם. השתמשו בזה כדי להמשיך עבודה קודמת על הקובץ. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	מזהה הקובץ

פלט — { messages }. messages ריק כשאין לכם שיחת עיצוב על הקובץ. לכל הודעה יש type ("request" או "response"), author ("human" או "ai"), ו-content_type. הודעות תגובה משתמשות ב-"text", "summary", או "followup".

{
  "messages": [
    {
      "id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "type": "request",
      "status": "success",
      "content": "Generate a simple mobile login screen with email and password fields",
      "author": "human",
      "content_type": "text",
      "sequence": 1,
      "targets": [],
      "attachments": []
    },
    {
      "id": "d860186b-82d5-4bd1-8e8e-8ba5377a14bf",
      "type": "response",
      "status": "success",
      "content": "Generated a mobile login screen with email and password input fields, a sign in button, and a sign up link.",
      "author": "ai",
      "content_type": "summary",
      "sequence": 7,
      "request_message_id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "targets": [{ "target_id": "3f9e6eb6-5525-4383-9375-67e0bd762dbe" }]
    }
  ]
}

כלי קבצים מצורפים

`upload-attachment`

העלאת קובץ עזר לשימוש כקובץ מצורף ב-ai-design-screens, או תמונה להצבה ב-JSX שלכם עם add-screen-jsx או replace-screen-jsx. ai-generate-screen-variant ו-ai-edit-screen-variant לא מקבלים קבצים מצורפים. בתים של הקובץ לעולם לא עוברים דרך המודל, והשרת לעולם לא מביא כתובות URL בשמכם. כדי להתייחס לעמוד אינטרנט, כללו את הכתובת שלו ב-message של ai-design-screens במקום. יש שני מצבים — השתמשו באחד בלבד, ואל תשלבו ביניהם. מצב א — קבצים ותמונות (mimeType + fileName) תהליך של שלושה שלבים שנדרש לכל תמונה, PDF או קובץ טקסט גדול:

קראו ל-upload-attachment עם mimeType ו-fileName בלבד (למשל image/png ו-dog.png). התגובה היא העלאה מוכנה, לא קובץ שמור:

{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "assetUrl": "https://…",
  "type": "image",
  "mimeType": "image/png",
  "signedUrl": "https://…",
  "uploadCommand": "curl -sS -f -X PUT '…' -H 'Content-Type: image/png' -H 'x-metadata: …' --data-binary @LOCAL_FILE_PATH",
  "nextStep": "…"
}

החליפו את LOCAL_FILE_PATH ב-uploadCommand בנתיב המוחלט לקובץ שלכם, והריצו את הפקודה המדויקת הזו בטרמינל — היא חייבת להסתיים עם קוד 0. הטוקן ב-signedUrl מאשר רק את ההעלאה הבודדת הזו. דילוג על שלב זה משאיר את האחסון ריק, וכלי העיצוב נכשל בבדיקה המקדימה שלו.
העבירו רק { id, path, type } למערך attachments של ai-design-screens — לא את signedUrl, uploadCommand, או nextStep. כדי להציב תמונה ב-JSX שלכם במקום זאת, שימו את assetUrl ב-img src או ב-bg-[url(...)] של ה-JSX שאתם מעבירים ל-add-screen-jsx או ל-replace-screen-jsx. ראו תמונות ב-JSX.

כדי לצרף קובץ מרוחק, הורידו אותו קודם לנתיב מקומי בעצמכם (למשל עם curl), ואז עקבו אחרי אותם שלושה שלבים. לעולם אל תעבירו כתובת URL ל-upload-attachment.

פרמטר	סוג	תיאור
`mimeType`	enum	סוג ה-MIME של הקובץ. אחד מ-`image/jpeg`, `image/png`, `image/webp`, `application/pdf`, `text/markdown`, `text/plain`, `text/javascript`. השתמשו ב-`text/javascript` עבור קבצי `.jsx`, `.tsx`, `.js`, `.ts`
`fileName`	`string` (מינימום 1)	שם הקובץ המקורי עם הסיומת, למשל `cat.png` או `design.md`

מצב ב — טקסט קצר (text + mimeType) העלאת טקסט שכבר נמצא בהקשר — בלי צורך בפקודת shell. התגובה מוכנה לשימוש ישירות:

{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "assetUrl": "https://…",
  "type": "document",
  "mimeType": "text/plain"
}

פרמטר	סוג	תיאור
`text`	`string` (מקסימום 64,000 תווים)	תוכן טקסט גולמי. לקבצי טקסט בלבד — אל תשתמשו בזה לתמונות או ל-PDF. ארוך מ-64,000 תווים? השתמשו במצב א
`mimeType`	enum	אחד מ-`text/markdown`, `text/plain`, `text/javascript`

העבירו את { id, path, type } שהתקבל למערך attachments של ai-design-screens. גודל הקובץ המרבי הוא 3 MB בשני המצבים, וקבצי PDF מוגבלים ל-100 עמודים. פלט — { id, path, assetUrl, type, mimeType, signedUrl?, uploadCommand?, nextStep? }.

type — "image" עבור קבצי תמונה ו-"document" עבור PDF וקבצי טקסט.
assetUrl — כתובת הקובץ שהועלה, מוחזרת בשני המצבים. השתמשו בו ב-JSX עבור add-screen-jsx או replace-screen-jsx רק כש-type הוא "image", ורק אחרי שה-uploadCommand של מצב א’ רץ.
signedUrl, uploadCommand, nextStep — מוגדרים רק במצב א’. אל תעבירו אותם לכלי העיצוב.

כלי Figma

`import-figma`

ייבוא פריים מ-Figma לקובץ Flowstep כאלמנטים הניתנים לעריכה על הקנבס שלו. כל ייבוא מוסיף מסך חדש — ייבוא של אותו פריים פעמיים ייתן לכם שני מסכים, לכן מחקו את הישן עם delete-screen אם התכוונתם להחליף אותו. הארגון של הקובץ חייב להיות מחובר ל-Figma בהגדרות Flowstep. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	קובץ Flowstep שאליו יש לייבא את הפריים. זה לא מפתח הקובץ של Figma ב-`figmaUrl`
`figmaUrl`	`string`	קישור לפריים ספציפי ב-Figma, עם `node-id`. ב-Figma, לחצו לחיצה ימנית על הפריים ובחרו Copy/Paste as → Copy link to selection. קישור לעמוד מייבא את כל הפריימים ברמה העליונה בעמוד (מוגבל ל-20 פריימים דרך MCP)

פלט — { fileId, screenId, frameCount? }. screenId הוא המסך שיובא — העבירו אותו ל-get-screen-image כדי לראות את התוצאה. כשקישור לעמוד מייבא כמה פריימים, screenId הוא null ו-frameCount מוחזר במקומו; קראו ל-list-screens, ואז ל-get-screen-image עבור כל מסך חדש.

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe"
}

כלי תוכנית וחיוב

`get-plan-details`

קבלת התוכנית של הארגון שלכם ב-Flowstep, סטטוס המנוי, השימוש והמכסה שנותרה. אין קלט — הארגון נקבע לפי המשתמש המחובר. השתמשו בזה כדי לבדוק את המכסה לפני שתקראו לכלי העיצוב בעזרת AI. פלט — { plan, subscription, limits, usage, remaining }.

שדה	תיאור
`plan`	`{ name, code, type }`. `type` הוא `"free"` או `"paid"`
`subscription`	`{ isPaid, isTrial, startDate, endDate, trialDaysRemaining }`
`limits`	מגבלות לפי תכונה, מפתוח לפי תכונה (למשל `messages`). לכל אחת יש אובייקטים אופציונליים `daily` ו-`monthly` עם הערכים `max` ו-`warn`, בתוספת דגל `unlimited`
`usage`	שימוש לפי תכונה עד כה, כ-`{ daily, monthly }`
`remaining`	מכסה שנותרה לפי תכונה, כ-`{ daily, monthly }`. מושמט עבור תכונות ללא הגבלה

המגבלות משתנות לפי תוכנית — ראו תמחור ומגבלות שימוש.

כלי עיצוב בעזרת AI

שלושת הכלים האלה מעצבים מתיאור או מהגדרה מוכנה — הם לעולם לא מקבלים או משתמשים מחדש ב-JSX. כל קריאה משתמשת באותה מכסת הודעות כמו אפליקציית Flowstep, וחוסמת עד שהיצירה מסתיימת או פוקעת (180 שניות).

כלי	השתמשו בו כדי ל
`ai-design-screens`	ליצור מסכים חדשים, לשנות מסכים קיימים במקומם, או את שניהם, מתיאור חופשי
`ai-generate-screen-variant`	להוסיף צעד הבא, מצב שגיאה או ריק, או וריאציה לפלטפורמה של מסך קיים אחד
`ai-edit-screen-variant`	להחיל הגדרה מוכנה של עריכה או עיצוב מחדש על מסך קיים שלם אחד

שלושתם מחזירים { status, fileId, screenIds, designGuidelinesUpdated }. קראו ל-get-screen-image פעם אחת עבור כל screenId כדי לראות את התוצאה.

designGuidelinesUpdated — סיכום קצר של השינוי כשהנחיות ה-DESIGN.md של הקובץ עודכנו אוטומטית במהלך התור הזה; אחרת null.

`ai-design-screens`

יצירת מסך אחד או יותר חדשים, שינוי מסכים קיימים במקומם, או שניהם בקריאה אחת, מתיאור טקסטואלי — זרימות חדשות, עיצוב ערכות נושא, טקסט, פריסה, או שינויים מתואמים על פני כמה מסכים. זהו אותו סוכן עיצוב כמו הצ’אט בעורך של Flowstep: הוא מחליט מתוך ה-message וה-elementIds מה לבנות ומה לשנות. השמיטו את fileId כדי להתחיל קובץ חדש; העבירו fileId כדי לעבוד בקובץ קיים. אם הבקשה יכולה לחול על קובץ שכבר יש לכם, הסוכן שלכם צריך לבדוק קודם את list-files ואת list-screens. לצעד הבא, מצב שגיאה או מצב ריק, או וריאציה לפלטפורמה של מסך אחד, השתמשו ב-ai-generate-screen-variant. לעריכה או עיצוב מחדש מוגדרים מראש של מסך אחד, השתמשו ב-ai-edit-screen-variant. אם כבר יש לכם JSX, השתמשו ב-add-screen-jsx או ב-replace-screen-jsx במקום. קלט

פרמטר	סוג	ברירת מחדל	תיאור
`fileId`	`uuid`	—	הקובץ היעד. השמיטו כדי ליצור קובץ חדש. חובה כש-`elementIds` מוגדר
`message`	`string`	—	תיאור המסכים שיש ליצור ו/או השינויים שיש לבצע. כשאתם מעבירים `elementIds`, ציינו אם לערוך אותם או להשתמש בהם כהפניה. כללו כאן כל כתובת URL של עמוד אינטרנט שתרצו ש-Flowstep יתייחס אליה
`elementIds`	`uuid[]`	`[]`	`screenId`s אופציונליים מ-`list-screens` ו/או `data-id`s של אלמנטים מ-`get-screen-jsx` (עם `includeIds`), בדומה לבחירה בעורך. אפשר לערוך אותם במקום או להשתמש בהם כהפניה חזותית למסכים חדשים. `screenId` מכוון לכל המסך
`attachments`	`{ id, path, type }[]` (מקסימום 5)	`[]`	קבצים מ-`upload-attachment` — תמונות, PDF, או קבצי קוד וטקסט. אל תכניסו תוכן של קבצים להודעה

דוגמה — עריכת מסך אחד והוספת מסך נוסף בקריאה אחת:

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "message": "Switch this sign-in screen to dark mode, then add a matching forgot-password screen.",
  "elementIds": ["3f9e6eb6-5525-4383-9375-67e0bd762dbe"]
}

פלט — { status, fileId, screenIds, designGuidelinesUpdated, reply? }.

{
  "status": "generated",
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenIds": [
    "3f9e6eb6-5525-4383-9375-67e0bd762dbe",
    "c13d3707-0efe-49f5-b6cb-0ca5ac5223d0"
  ],
  "designGuidelinesUpdated": null
}

status — "generated" כשמסכים נבנו או שונו. "chat" כש-Flowstep ענה בלי לבנות, ובמקרה כזה reply מכיל את התשובה ו-screenIds ריק. אם הבריף שלכם לא ברור, הסוכן שלכם צריך לבקש ממכם להבהיר ולקרוא לכלי שוב.
screenIds — כל מסך שנבנה או שונה במהלך הקריאה, כולל מסכים שנערכו במקום. אם הקריאה פוקעת אחרי שחלק מהמסכים נבנו, היא מחזירה את המסכים האלה במקום שגיאה.

מסכים שאתם מבקשים לערוך נדרסים במקומם.

`ai-generate-screen-variant`

הוספת מסך חדש שנגזר ממסך קיים אחד בדיוק — הצעד הבא בזרימה, מצב שגיאה או ריק, או גרסה לפלטפורמה אחרת. המסך המקורי נשאר ללא שינוי. כדי להוסיף מסך שאינו וריאציה של מסך קיים (למשל מסך הגדרות), השתמשו ב-ai-design-screens עם fileId. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	הקובץ היעד
`screenId`	`uuid`	המסך הקיים שממנו נגזרים
`operationVariant`	enum	חובה — איך המסך החדש קשור לקיים

`operationVariant`	מוסיף
`next_screen`	המסך הבא בזרימת המשתמש
`error_state`	מצב שגיאה של המסך
`empty_state`	מצב ריק של המסך
`web_version`	גרסת web
`mobile_version`	גרסה לנייד
`tablet_version`	גרסה לטאבלט
`mobile_ios_version`	גרסת iOS
`mobile_android_version`	גרסת Android

פלט — { status, fileId, screenIds, designGuidelinesUpdated }. status הוא תמיד "generated".

`ai-edit-screen-variant`

שינוי מסך קיים אחד בדיוק במקומו, באמצעות הגדרה מוכנה — עיצוב או ליטוש שלו בערכת נושא, ניסיון לפריסה או סגנון חזותי אחר, או עיצוב מחדש מההתחלה. למסכים חדשים, להוראות חופשיות, או לעריכה מדויקת של אלמנטים בודדים, השתמשו ב-ai-design-screens. קלט

פרמטר	סוג	תיאור
`fileId`	`uuid`	הקובץ היעד
`screenId`	`uuid`	המסך הקיים לשינוי
`operationVariant`	enum	חובה — ההגדרה המוכנה של עריכה או עיצוב מחדש להחלה

`operationVariant`	סוג	השפעה
`dark_theme`	עריכה	מעבר של המסך לערכת נושא כהה
`light_theme`	עריכה	מעבר של המסך לערכת נושא בהירה
`make_pretty`	עריכה	ליטוש העיצוב החזותי של המסך
`different_layout`	עיצוב מחדש	ניסיון לפריסה אחרת
`different_style`	עיצוב מחדש	ניסיון לסגנון חזותי אחר
`from_scratch`	עיצוב מחדש	עיצוב מחדש של המסך מההתחלה

פלט — { status, fileId, screenIds, designGuidelinesUpdated }. status הוא תמיד "generated".

פעולה זו דורסת את התוכן של המסך במקומו.

שמות כלים ששונו

שמות הכלים השתנו בספטמבר ואוקטובר 2026. אם יש לכם פרומפטים, סקריפטים או הוראות לסוכן שמשתמשים בשמות הישנים, עדכנו אותם:

שם ישן	שם חדש
`get-screen`	`get-screen-jsx`
`add-screen`	`add-screen-jsx`
`replace-screen`	`replace-screen-jsx`
`ai-generate-screens`	`ai-design-screens`
`ai-edit-screens`	`ai-design-screens`
`create-new-design`	`ai-design-screens`
`edit-design` (הוראות חופשיות)	`ai-design-screens`
`edit-design` (עם הגדרה מוכנה `operationVariant`)	`ai-edit-screen-variant`
`regenerate-design`	`ai-edit-screen-variant`
`expand-design`	`ai-generate-screen-variant`

הקלטים השתנו גם: כלי העיצוב בעזרת AI מקבלים elementIds (או screenId בודד לכלי הווריאציות) במקום targets, add-screen-jsx מקבל jsx ושדות מטא-נתונים מפורשים במקום jsxContent עם הערת מטא-נתונים, create-file מקבל name במקום title, וכלי הנחיות העיצוב מקבלים fileId במקום resourceId ו-linkedTo.

​כלי קבצים

​list-files

​get-file

​create-file

​update-file

​delete-file

​כלי מסכים

​list-screens

​get-screen-image

​get-screen-jsx

​add-screen-jsx

​replace-screen-jsx

​rename-screen

​delete-screen

​תמונות ב-JSX

​ערכי שדות מסך

​כלי הנחיות עיצוב

​get-design-guidelines

​update-design-guidelines

​delete-design-guidelines

​כלי צ’אט

​get-chat-history

​כלי קבצים מצורפים

​upload-attachment

​כלי Figma

​import-figma

​כלי תוכנית וחיוב

​get-plan-details

​כלי עיצוב בעזרת AI

​ai-design-screens

​ai-generate-screen-variant

​ai-edit-screen-variant

​שמות כלים ששונו

כלי קבצים

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

כלי מסכים

`list-screens`

`get-screen-image`

`get-screen-jsx`

`add-screen-jsx`

`replace-screen-jsx`

`rename-screen`

`delete-screen`

תמונות ב-JSX

ערכי שדות מסך

כלי הנחיות עיצוב

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

כלי צ’אט

`get-chat-history`

כלי קבצים מצורפים

`upload-attachment`

כלי Figma

`import-figma`

כלי תוכנית וחיוב

`get-plan-details`

כלי עיצוב בעזרת AI

`ai-design-screens`

`ai-generate-screen-variant`

`ai-edit-screen-variant`

שמות כלים ששונו