• znetalie

איך מתכננים מוצר דיגיטלי חדש או פיצ׳ר בכמה דקות בעזרת wireframes

אפיון חווית משתמש או wireframes,

זה השלב הראשון שאנחנו עושים לפני שאנחנו מתחילים לעצב ולפתח מוצר דיגיטלי חדש

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

בשלב ה״wireframes״ אנחנו לא מודאגים אם דברים לא נראים מושלם ולא אכפת לנו מהצבעים

או הצורה, אנחנו מתייחסים רק לתכנון של התוכן והבנה של מה תהיה זרימת התוכן והמעבר במסכים.


בעזרת מסכי ה-wireframes אפשר:

1- לראות את מסע היוזר ולראות על כמה קליקים הוא לחץ

2- לקבל פידבק ממשתמשים פוטנציאליים במוצר

3- לקבל הצעת מחיר ולוח זמנים ממעצבים ומפתחים



יש שני שלבים לתכנון

1- משרטטים את המסכים ביד מהר על מנת להוציא את מה שיש לנו בראש לדף

2- מעבירים הכל למחשב לתוכנה מקצועית כמו Balsamiq או Invision שתיהן חינמיות ,

אם אתם לא מסתדרים עם תוכנות חדשות אפשר לצלם את המסכים ששרטטתם ולהוסיף אותם כתמונה למייל ולשלוח.


אני אתעכב על התהליך של שרטוט המסכים ביד אני מאמינה שברגע שמשרטטים את המסכים אפשר

לעשות הכל יותר מהר ויותר אינטואיטיבי.

בצורה כזאת אפשר לחשוב מהר יותר וליצור דברים ולהעביר את הרעיונות שיש לכם מהראש החוצה

מהר יותר ובקלות מאשר מהראש למחשב.


מה צריך לתהליך:

1-לתהליך הזה צריך דף ועיפרון או עט

2-אתם לא חייבים שיהיה לכם את כל התוכן מדויק אבל כן את הרעיון הכללי בראשי פרקים של מה שאתם רוצים לעשות.

3-אני אדגים איך אני עושה אפיון של דף נחיתה עבור: ההרצאה שאני עומדת להעביר על יצירת מוצרים דיגיטליים.


איזה ראשי פרקים אני צריכה לדף נחיתה של הרצאה:

1-שם וכותרת ראשית של שם הההרצאה

2=תאור- מה יהיה בהרצאה

3- מה מקבלים מההרצאה

4- תמונה שקשורה לנושא של ההרצאה

5- מחיר- כמה תעלה ההרצאה

6- תאריך- מתי זה קורה

7- כפתור הנעה לפעולה- ״קנה כרטיס״



והנה 2 דרכים שונות להעביר את אותה האינפורמציה בשרטוט wireframes


בסקיצה 1 חילקתי את המסך ל-4

חלק 1- כותרת וכפתור הנעה לפעולה

חלק 2- תאור ההרצאה תאריך ושעה ותמונה ליד

חלק 3- עם מה יוצאים מההרצאה

חלק 4- מחיר וכפתור הנעה לפעולה


סקיצה 1


סקיצה 2

בסקיצה 2 החלוקה היא של תמונה ותאור ב-3 חלקים ואז כפתור הנעה לפעולה


ברגע שסיימנו עם הסקיצה אפשר לפתוח תוכנת אפיון ולהעביר את כל האינפורמציה למחשב

תוכנות מומלצות וחינמיות : Invision, Balsamiq



ככה הסקיצה הידנית נראית אחרי שערכנו את המסך בעזרת תוכנת invison החינמית בכלי פריהנד

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



בהצלחה!


תכתבו לי אם עזר לכם:)


ZOHAR STUDIO  / CREATIVE-DESIGN-UI/UX