אפיון ממשק וחווית משתמש
Download
1 / 119

Hghgh - PowerPoint PPT Presentation


jhjhjh

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha

Download Presentation

hghgh

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript




Slide3 l.jpg

מי אנחנו?

ליאור יאיר

ראש תחום חווית משתמש

  • עתודאי בוגר ממר"ם

  • נציג ארגון IXDA בישראל

  • ממקימי ארגון UXI

  • חוקר Eyetracking


Slide4 l.jpg

רן לירון

מאפיין ממשק בכיר

  • 15 שנות ניסיון באפיון, עיצוב ופיתח ממשקים

  • מפתח קורסי ממשק וחווית משתמש

  • ממקימי ארגון UXI



Slide6 l.jpg

מי אנחנו

נטקרפאט מתמחה במתן שירותי אפיון, עיצוב ופיתוח פתרונות המציעים חווית משתמש יוצאת דופן.



Slide10 l.jpg

המטרות שלנו

מה נראה היום?

  • קורס מקיף שיספק הבנה מעמיקה

  • לצד כלים פרקטים לאפיון ממשק וחווית משתמש.

  • חווית משתמש טובה בכל שיעור

  • ושיעור.


Slide11 l.jpg

קצת על הקורס

מה נראה היום?

f

  • קבוצת פייסבוק לתלמידים בלבד

  • מטלות שבועיות משיעור לשיעור

  • חוברות מודפסות בכל שיעור

  • משוב סדיר בכל שני שיעורים

  • (החל מהשיעור הבא...)


Slide12 l.jpg

מרצים אורחים

מה נראה היום?

  • מורן מלמד

  • מנהלת אתר האינטרנט orange.co.il

  • גיל פארן

  • מנהל תחום חוויית משתמש, בנק הפועלים

  • גדי להב

  • סמנכ"ל תוכן ועורך ראשי, אתרי קבוצת הארץ

  • גל מור

  • בעל הבלוג "חורים ברשת"



Slide14 l.jpg

חווית משתמש?

מה נראה היום?

מכלול ההתנסות

חברה | שירות | מוצר




Slide19 l.jpg

מה נראה היום?

  • מה הן המגבלות האנושיות?


Slide20 l.jpg

מה נראה היום?

  • איך ניתן לעצב לשימוש יעיל,

  • למרות המגבלות?


Slide21 l.jpg

האבולוציה

מה נראה היום?

שנות התשעים

שנות השבעים

שנות השישים

  • GUI

  • UI Designer

  • UX Designer

  • IxD | IA

  • MMI (HMI)

  • CHI

  • HCI

  • ארגונומיה

  • הנדסת גורמי אנוש


Slide22 l.jpg

Don Norman

מה נראה היום?

  • ארכיטקט חוויית משתמש

  • חוקר וסופר מוכר בתחום הפסיכולוגיה הקוגניטיבית

  • שטבע את המונח לראשונה בהגדרת התפקיד שלו

  • בחברת Apple ב-1995.


Slide23 l.jpg

אפיון אל מול עיצוב

מה נראה היום?

V

s



Slide25 l.jpg

התפקיד אחד, שמות רבים

מה נראה היום?

מאפיין, ארכיטקט מערכות, מעצב GUI, מעצב UI, איש UX,

מעצב חווית משתמש, מומחה ממשק משתמש, מומחה חווית משתמש, מומחה שימושיות,

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


Slide26 l.jpg

מעגלים מקצועיים

מה נראה היום?

המעגל הפנימי

מומחים העוסקים באפיון ועיצוב

מממשקים.

עוסקים ישירות בתחום

מאפיינים

מעצבים


Slide27 l.jpg

מעגלים מקצועיים

מה נראה היום?

המעגל השני

  • בעלי מקצוע העובדים ישירות מול

  • מאפייני ומעצבי הממשק, ומשפיעים על

  • האופן בו מתנהל אפיון ועיצוב הממשק.

  • עוסקים בתחומים משיקים ומנהלים

  • ישירים

מנהלי תחום אינטרנט

מנתחי מערכות

אנשי תוכן

מפתחים

מנהלי פרויקטים

אנשי קידום


Slide28 l.jpg

מעגלים מקצועיים

מה נראה היום?

המעגל החיצוני

  • בעלי אתרים, חברות פיתוח,

  • חברות מוצר...

  • לקוחות

ארגונים

יזמים



Slide30 l.jpg

ROI המשתמשים?

מה נראה היום?

Return

On

Investment

ROI


Slide31 l.jpg

החזר השקעה המשתמשים?

מה נראה היום?

  • השקעה של 10% מתקציב הפיתוח בשיפור הממשק מניב

  • שיפור ממוצע בהכנסות של ...?

  • 10%

  • מתקציב הפיתוח

  • ?


Slide32 l.jpg

החזר השקעה המשתמשים?

מה נראה היום?

מחקר שערך ג'יקוב נילסן בשנת 2008 הראה כי:

  • השקעה של 10% מתקציב הפיתוח בשיפור הממשק מניב

  • שיפור ממוצע בהכנסות של 83% (!)

  • 83

  • 10


Slide33 l.jpg

  • ROI המשתמשים?

מה נראה היום?

שאלה לדיון

  • מהיכן מגיע ההחזר על ההשקעה

  • בממשק?


Slide34 l.jpg

החזר השקעה המשתמשים?

מה נראה היום?

מהיכן מגיע ההחזר על ההשקעה בממשק?

  • הגדלה באפקטיביות של המשתמשים.

  • יצירת אמון.

  • צמצום זמן הלימוד במערכת למשתמשים חדשים.

  • צמצום טעויות.

  • הקלה בשיווק ובמכירות.



Slide36 l.jpg

נגישות

זמינות המידע

  • שמישות

אסטטיקה

הנאה

שימושיות


Usability l.jpg
שמישות המשתמשים?Usability


Slide38 l.jpg
שמישות המשתמשים?

  • האם ניתן להשתמש במערכת?

  • האם נוח להשתמש במערכת?

  • האם נעים להשתמש המערכת?


Slide39 l.jpg
מדדי השמישות המשתמשים?העיקריים

יעילות ((efficiencyכמה מאמץ ומשאבים נדרשים מהמשתמש -

  • זמן

  • שימוש במקלדת ועכבר

  • מאמץ הקוגניטיבי

  • מאמץ פיזי

  • ...


Slide40 l.jpg
מדדי השמישות המשתמשים?העיקריים

תועלת (Effectiveness)

  • האם המערכת מפיקה בדיוק את התוצאה הנדרשת?

  • האם היא מספקת ערכים מוספים כלשהם?


Slide41 l.jpg
מדדי השמישות המשתמשים?העיקריים

עקומת למידה

כמה זמן ומאמץ נדרש בכדי להבין כיצד להשתמש במערכת באופן אפקטיבי


Slide42 l.jpg
מדדי השמישות המשתמשים?העיקריים

התמודדות עם טעויות משתמשים

  • מניעת טעויות

  • סיוע בהתאוששות מטעויות


Slide43 l.jpg
מדדי השמישות המשתמשים?העיקריים

סיפוקSatisfaction) )

מה החוויה הסובייקטיבית של המשתמשים?

האם הם מרוצים, מבולבלים, חווים תסכול או נהנים?


Slide44 l.jpg
סיכום: מדדי השמישות העיקריים המשתמשים?

  • יעילות (efficiency)

  • תועלת (Effectiveness )

  • עקומת למידה

  • מניעת טעויות משתמשים והתאוששות מטעויות

  • סיפוק (Satisfaction)


Slide45 l.jpg
בעיית שמישות לדוגמה המשתמשים?

Office 2007

Office 2010

Where the **** ismy “File” Menu ?!



Usefulness value l.jpg
שימושיות המשתמשים?Usefulness, Value


User control l.jpg
שליטת משתמש המשתמשים?User Control


Slide49 l.jpg
מה נראה היום? המשתמשים?

שאלה לדיון

  • למה חיוני לספק למשתמש

  • תחושת שליטה?


Slide50 l.jpg
משתמשים רוצים להרגיש בשליטה המשתמשים?

למה חיוני לספק למשתמשים תחושת שליטה?

  • להקטין חשש משימוש במערכת

  • לבנות אמון

  • לספק חווית שימוש טובה


Slide51 l.jpg
כיצד לספק תחושת שליטה? המשתמשים?

התאמת המערכת לניסיון הקודם ולעולמות התוכן שהמשתמשים מכירים

לדוגמה:

  • מה משמעות הצבעים אדום וירוק?

  • מה משמעות הצבעים אדום וירוק עבור סוכן בורסה?


Slide52 l.jpg
כיצד לספק המשתמשים?תחושת שליטה?

תצוגה ברורה של מיקום המשתמש בתהליך העובדה

  • איפה אני נמצא?

  • להיכן אני יכול להתקדם מכאן?

  • מה אני יכול לעשות כאן

  • כיצד אני יכול לחזור למקום ממנו באתי?

  • לדוגמה...


Slide53 l.jpg
כיצד לספק המשתמשים?תחושת שליטה?

מיקום המשתמש - דוגמה


Slide54 l.jpg
כיצד לספק המשתמשים?תחושת שליטה?

מניעת טעויות ע"י הנחיות ברורות

http://www8.hp.com/us/en/support-drivers.html


Slide55 l.jpg
נגישות המשתמשים?


Slide56 l.jpg
נגישות המשתמשים?

נגישות: התאמת ממשק למשתמשים בעלי לקויות

  • מי כאן מגדיר את עצמו "משתמש בעל לקויות" ?

  • אילו לקויות?

  • איזה אחוז מהמשתמשים הינו "משתמשים בעלי לקויות"?

  • האם החוק הישראלי מחייב התאמת אתרים למשתמשים בעלי לקויות?

  • דוגמהלבעיה:


Slide57 l.jpg
אסתטיקה המשתמשים?


Slide59 l.jpg
אסתטיקה המשתמשים?


Slide60 l.jpg
אסתטיקה המשתמשים?


Findability l.jpg
זמינות המידע המשתמשים?Findability


Slide62 l.jpg
כמה פשוט למשתמש לאתר מידע המשתמשים?

נגישות: התאמת ממשק למשתמשים בעלי לקויות

  • מי כאן מגדיר את עצמו "משתמש בעל לקויות" ?

  • אילו לקויות?

  • איזה אחוז מהמשתמשים הינו "משתמשים בעלי לקויות"?

  • האם החוק הישראלי מחייב התאמת אתרים למשתמשים בעלי לקויות?

  • דוגמהלבעיה:


Slide63 l.jpg
הנאה המשתמשים?


Slide64 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?


Slide65 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?

לא כיף!


Slide66 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?


Slide67 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?


Slide68 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?


Slide69 l.jpg

יתרונות ממשק מהנה המשתמשים?

מה נראה היום?

  • משתמשים נוטים לגלות סלחנות כשהם נהנים.

  • התאהבות במערכת.

  • הנעה חזקה לפעולה.


Slide70 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?

  • “Fun is the easiest way to

  • change people’s behavior”


Slide71 l.jpg

הנאה לפעולה המשתמשים?

מה נראה היום?

  • הנאה = הנעה


Slide72 l.jpg

בנק הפועלים | מצגת מחקר המשתמשים?

עולם הבנקאות והפיננסים

5


Slide73 l.jpg

בנק הפועלים | מצגת מחקר המשתמשים?

עולם הבנקאות והפיננסים

5


Slide74 l.jpg

בנק הפועלים | מצגת מחקר המשתמשים?

עולם הבנקאות והפיננסים

5


Slide75 l.jpg

נגישות

זמינות המידע

  • שמישות

אסטטיקה

הנאה

שימושיות




Slide78 l.jpg
מישהו יודע מה זה? טובהאיך משתמשים בזה?


Slide79 l.jpg

מחיר: טובה45 יורו


Slide80 l.jpg

מסחטת טובה המיץ של דוד משוק הכרמל

מחיר: 10 שקלים (1+1)


Slide81 l.jpg

מה נראה היום?

לדיון

  • למה חיוני להכיר את הקונבנציות?


Slide82 l.jpg

היתרונות לשמירה על קונבנציות טובה

מה נראה היום?

  • הסתמכות על פתרונות שעובדים ונבדקו בעבר.

  • הסתמכות על למידה קודמת של המשתמשים.

  • צמצום טעויות.

  • חסכון בזמן בתהליכי האפיון, העיצוב והפיתוח.


Slide83 l.jpg

מה נראה היום?

לדיון

  • מה החסרון בשמירה על

  • קונבנציות?


Slide84 l.jpg

מודעות לקונבנציות טובה

מה נראה היום?


Slide85 l.jpg

מודעות לקונבנציות טובה

מה נראה היום?


Slide86 l.jpg

מודעות לקונבנציות טובה

מה נראה היום?


Slide87 l.jpg

מודעות לקונבנציות טובה

מה נראה היום?


Slide88 l.jpg

למה לא לשמור על קונבנציות? טובה

מה נראה היום?

  • חדשנות.

  • קונבנציות שלא עובדות (שמירה על טעויות).


Slide89 l.jpg

מודעות לקונבנציות טובה

מה נראה היום?

שימו לב!

  • אנו חייבים לבחור את הקונבנציות המתאימות

  • למשתמשים שלנו.


Slide90 l.jpg

בחירת הקונבנציות הנכונות טובה

מה נראה היום?

שימו לב!

  • אנו חייבים לבחור את הקונבנציות המתאימות

  • למשתמשים שלנו.

  • שם:

  • *


Slide91 l.jpg

בחירת הקונבנציות הנכונות טובה

מה נראה היום?

שימו לב!

  • אנו חייבים לבחור את הקונבנציות המתאימות

  • למשתמשים שלנו.

  • Name:

  • ((mandatory


Slide92 l.jpg

שבירת קונבנציות | טובהfeta

מה נראה היום?


Slide93 l.jpg

שבירת קונבנציות | קלמנטינה טובה

מה נראה היום?


Slide94 l.jpg
עקביות טובה


Slide95 l.jpg

עקביות טובה

מה נראה היום?


Slide96 l.jpg

עקביות טובה

מה נראה היום?


Slide97 l.jpg

עקביות טובה

מה נראה היום?


Slide98 l.jpg

יתרונות הממשק העקבי טובה

מה נראה היום?

  • מניעת תסכול ובלבול.

  • מאפשר למשתמשים ללמוד ולהבין את המערכת.

  • צמצום טעויות.

  • ייעול האפיון והפיתוח.


Slide99 l.jpg

יצירת ממשק עקבי טובה

מה נראה היום?

1

  • אובייקטים דומים צריכים להתנהג ולהראות דומה.

  • אובייקטים בעלי פונקציונאליות או תוכן שונה

  • צריכים להיראות שונים בבירור.

2


Slide100 l.jpg

עקביות טובה

מה נראה היום?

דוגמה רעה


Slide101 l.jpg
פשטות טובה


Slide102 l.jpg

פשטות טובה

מה נראה היום?

  • "Keep it simple, Stupid!"

Kelly Johnson (engineer)


Slide103 l.jpg

יצירת ממשק פשוט טובה

מה נראה היום?

שאלה לדיון

  • איך יוצרים ממשק פשוט?


Slide104 l.jpg

יצירת ממשק פשוט טובה

מה נראה היום?

  • התאמה להרגלי משתמשים.

  • מינימליזם – מיעוט רכיבים, צמצום פונקציונאליות, צמצום צמתי החלטה.

  • עיצוב פשוט.


Slide105 l.jpg

עומס ויזואלי טובה

מה נראה היום?

  • עומס ויזואלי


Slide106 l.jpg

עומס ויזואלי טובה

מה נראה היום?

  • עומס ויזואלי


Slide107 l.jpg

קוים פשוטים פלטה נכונה טובה

מה נראה היום?


Slide108 l.jpg

ריווח ועימוד טובה

מה נראה היום?


Slide109 l.jpg
להכיר את המשתמשים טובה

נעים מאוד


Slide110 l.jpg

מי מסתתר בצד השני? טובה

מה נראה היום?


Slide111 l.jpg

אתם טובה

לא

המשתמשים!


Redundancy l.jpg
גמישות ויתירות טובה (Redundancy)


Slide113 l.jpg

גמישות ויתירות טובה

מה נראה היום?

למשתמשים שונים יש הרגלי עבודה שונים.


Slide114 l.jpg

גמישות ויתירות טובה

מה נראה היום?


Slide115 l.jpg
סיכום טובה


Slide116 l.jpg

סיכום טובה

מה נראה היום?

  • מהי "חווית משתמש" ומי עוסק בה

  • למה משתלם להשקיע בתחום

  • מרכיבי חוויית המשתמש

    • שמישות

    • שימושיות

    • שליטת משתמש

    • נגישות

    • אסתטיקה

    • זמינות המידע

    • הנאה

  • כללי יסוד לאפיון ממשק איכותי

    • עקביות

    • הכרת הקונבנציות

    • פשטות


Slide117 l.jpg

המטלה השבועית טובה

מה נראה היום?

המטלה השבועית

למצוא דוגמה למערכת (אפליקציה, תוכנה,

אתר) שלא מתחשבת באחד או יותר מהכללים

שהצגנו בשיעור.

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

בצירוף הסבר לבעיה.


Slide118 l.jpg

תודה טובה :)


ad
  • Login