דלג לתוכן הראשי
Flowstep יוצר מסכי UI מפרומפטים בשפה טבעית, ומאפשר לכם לעבור מרעיון לעיצוב חזותי תוך שניות. בין אם אתם צריכים מסך יחיד כדי לאמת קונספט ובין אם סט מלא של מסכים שמכסה מסע משתמש שלם, פרומפט טוב מספיק כדי להתחיל.

​
יצירת עיצוב

1

פתחו פרויקט חדש

מתוך לוח הבקרה של Flowstep, צרו פרויקט חדש או פתחו פרויקט קיים שבו תרצו להוסיף מסכים.
2

כתבו את הפרומפט

הקלידו תיאור של המסך או המסכים שתרצו. היו ספציפיים לגבי סוג האפליקציה, מטרת המשתמש והתוכן שאתם מצפים לראות.
3

ציינו כמה מסכים אתם רוצים

כברירת מחדל, Flowstep יוצר מסך יחיד. אם תרצו כמה מסכים, כתבו זאת במפורש בפרומפט — Flowstep יכול ליצור עד 6 מסכים מפרומפט אחד.
4

יצירה

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

​
עצירת יצירה

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

​
מסך יחיד לעומת מסכים מרובים

אפשר ליצור מסך יחיד או עד 6 מסכים מפרומפט יחיד. שתי הגישות מתאימות לשלבים שונים בעבודת העיצוב.
  • מסך יחיד — מתאים ביותר לחקירת מצב ממשק ספציפי, רכיב או קונספט ממוקד.
  • מסכים מרובים — מתאימים ביותר למיפוי זרימות, השוואת אפשרויות פריסה או כיסוי מהיר של מסע משתמש מלא.
כשאתם רוצים מסכים מרובים, היו מפורשים בפרומפט. Flowstep משתמש בניסוח של הפרומפט כדי להחליט כמה מסכים ליצור, ולכן פרומפטים מעורפלים בדרך כלל מחזירים מסך יחיד. מסכים שנוצרו נקראים Screen 1, Screen 2 וכן הלאה — השתמשו בשמות האלה כדי להתייחס למסך מסוים בפרומפטים של המשך.

​
דרכים נוספות לפרומפט

טקסט הוא לא הקלט היחיד. אפשר גם:
  • לצרף קבצים — להוסיף לפרומפט תמונות (JPG, PNG, WEBP) או מסמכים (PDF, MD, TXT) עד 3 MB כל אחד, בגרירה ושחרור, דרך בוחר הקבצים או בהדבקה. התייחסו לתמונה מצורפת בפרומפט וFlowstep ישלב אותה במסכים שנוצרו. ראו שימוש בהפניות עיצוב.
  • לכתוב את הפרומפט בקול — לחצו על כפתור המיקרופון בסרגל הפרומפט (או הקישו Cmd+Shift+V ב-Mac, Ctrl+Shift+V ב-Windows) ודברו עד 60 שניות. התמלול מתווסף למה שכבר הקלדתם.
  • לתת ל-Flowstep לחפש ברשת — כשהפרומפט דורש זאת (למשל, “שכפלו את דף התמחור של Stripe”), Flowstep יכול לחפש ברשת ולקרוא את המיתוג של דף — צבעים, פונטים, לוגו ורכיבי UI — ולהשתמש בו במסכים שנוצרו. Flowstep מחליט בעצמו אם לחפש, ולכן זה לא יופעל בכל פרומפט. שימו לב שאתרים משוחזרים משתמשים בתמונות ובניווט שונים מהמקור.
  • להגדיר הנחיות עיצוב — הגדירו כללי סגנון קבועים שחלים על כל יצירה בקובץ. ראו הנחיות עיצוב.

​
כתיבת פרומפטים יעילים

דוגמה לפרומפט למסך יחיד: “עצבו מסך כניסה לנייד לאפליקציית מעקב כושר, עם שדות אימייל וסיסמה, כפתור כניסה וקישור לשכחתי סיסמה.”
דוגמה לפרומפט למסכים מרובים: “צרו כמה מסכים לתהליך ההרשמה הראשונית של אפליקציית משלוחי אוכל — כסו בחירת העדפות מטבח, הזנת כתובת למשלוח ואישור ההזמנה הראשונה.”
דוגמה לפרומפט למסע מלא: “כסו את מסע המשתמש המלא באפליקציית דיווח הוצאות, מהגשת קבלה ועד לאישור של המנהל.”
זכרו את העקרונות האלה בעת כתיבת פרומפטים:
  • ציינו את הפלטפורמה (נייד, שולחן עבודה, טאבלט) כדי ש-Flowstep יתאים נכון את גודל המסכים.
  • תארו את מטרת המשתמש, ולא רק את אלמנטי הממשק — Flowstep מסיק את הפריסה מתוך הכוונה.
  • כללו תוכן מרכזי כמו תוויות, פעולות או נתונים, אם הם חשובים לעיצוב.
  • השתמשו בביטויים כמו “צרו כמה מסכים” (generate multiple screens) או “כסו את מסע המשתמש המלא” (cover the full user journey) כדי להפעיל פלט של כמה מסכים.