Talk by Yoram Rosner (5IVE - innovation & ux) at UXI Live 2013 הרצאתו של יורם רוזנר

2. By © nikoretro
http://www.flickr.com/photos/bellatrix6/3796109344/in/photostream/

3. By © nikoretro
http://www.flickr.com/photos/bellatrix6/3796109344/in/photostream/

4. By © Michael Kwan
http://www.flickr.com/photos/beyondtherhetoric/4705467128/in/photostream/

5. © Nissan
http://www.caranddriver.com/photos-07q3/107620/nissan-mixim-concept-photo-120425

6. © Suzuki Ionis
http://green.autoblog.com/photos/suzuki-ionis-fuel-cell-concept/

7. By © Pop Culture Geek
http://www.flickr.com/photos/popculturegeek/4534097974/in/photostream/

8. © Tron: Legacy (2010)
22362676http://vimeo.com/

9. “It's not how you feel about the
design or experience — it's how the
product makes you feel about
yourself.“
— John Kiehle, RKS Design

10. © Peugeot
http://www.peugeot.pt/noticias/sxc-concept/

11. From: Superman Returns © Warner Bros. LTD
http://wwws.warnerbros.co.uk/supermanreturns/

12. ‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬
‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬ ‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬

13. 5481://www.integritystaffing.com/blog/?p=http

15. ‫תקי‬ ‫הכל‬ ‫הא‬ ‫החלט‬ ‫אחד‬ ‫במבט‬.
‫לא‬ ‫א‬:
1.‫בתו‬ ‫זהה‬10‫שניות‬:
‫א‬.‫התקולי‬ ‫הרכיבי‬ ‫כמות‬
‫ב‬.‫מביניה‬ ‫ביותר‬ ‫החמורה‬ ‫התקלה‬ ‫רמת‬
‫ג‬.‫התקולי‬ ‫מהרכיבי‬ ‫מושפעי‬ ‫שירותי‬ ‫אילו‬
2.‫ביותר‬ ‫החמורה‬ ‫התקלה‬ ‫של‬ ‫בפרטי‬ ‫העמק‬.
3.‫הלאה‬ ‫וכ‬---
‫תרחיש‬-‫שרתי‬ ‫חוות‬ ‫לניטור‬ ‫דשבורד‬

16. ‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬
‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬ ‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬

17. ‫תקי‬ ‫הכל‬ ‫הא‬ ‫החלט‬ ‫אחד‬ ‫במבט‬.
‫לא‬ ‫א‬:
1.‫בתו‬ ‫זהה‬10‫שניות‬:
‫א‬.‫התקולי‬ ‫הרכיבי‬ ‫כמות‬
‫ב‬.‫מביניה‬ ‫ביותר‬ ‫החמורה‬ ‫התקלה‬ ‫רמת‬
‫ג‬.‫התקולי‬ ‫מהרכיבי‬ ‫מושפעי‬ ‫שירותי‬ ‫אילו‬
2.‫ביותר‬ ‫החמורה‬ ‫התקלה‬ ‫של‬ ‫בפרטי‬ ‫העמק‬.
3.‫הלאה‬ ‫וכ‬---
‫תרחיש‬-‫שרתי‬ ‫חוות‬ ‫לניטור‬ ‫דשבורד‬

18. ‫הא‬ ‫החלט‬ ‫אחד‬ ‫במבט‬‫תקי‬ ‫הכל‬.
‫לא‬ ‫א‬:
1.‫בתו‬ ‫זהה‬10‫שניות‬:
‫א‬.‫כמות‬‫הרכיבי‬‫התקולי‬
‫ב‬.‫רמת‬‫החמורה‬ ‫התקלה‬‫מביניה‬ ‫ביותר‬
‫ג‬.‫אילו‬‫מושפעי‬ ‫שירותי‬‫התקולי‬ ‫מהרכיבי‬
2.‫העמק‬‫החמורה‬ ‫התקלה‬ ‫של‬ ‫בפרטי‬‫ביותר‬.
3.‫הלאה‬ ‫וכ‬---
‫תרחיש‬-‫שרתי‬ ‫חוות‬ ‫לניטור‬ ‫דשבורד‬

19. http://www.1to1media.com/weblog/2013/03/the_first_rule_of_big_data.html

20. ‫השאר‬ ‫כל‬‫השאר‬ ‫כל‬
‫המוקד‬‫המוקד‬

21. ‫השאר‬ ‫כל‬‫השאר‬ ‫כל‬
‫המוקד‬‫המוקד‬

22. ‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬
‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬ ‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬

24. ‫את‬ ‫הדגישו‬
‫הדופ‬ ‫יוצאי‬

25. http://www.dashboardzone.com/bmc-dashboard-monitor-everything-through-dashboards
http://www.bmc.com/products/product-listing/atrium-dashboards-and-analytics.html

26. http://www.dashboardzone.com/bmc-dashboard-monitor-everything-through-dashboards
http://www.bmc.com/products/product-listing/atrium-dashboards-and-analytics.html

27. http://Idashboards.com/

28. http://edu-news.ro/o-posibila-solutie-pentru-furtul-academic/

29. http://www.appfirst.com/devops-dashboard/index.php

30. ‫מקסמו‬
‫יחס‬ ‫את‬
‫המידע‬-‫דיו‬

32. Edward R. Tufte (1983) The Visual Display of Quantitative Information

33. Edward R. Tufte (1983) The Visual Display of Quantitative Information
‫יחס‬‫מידע‬-‫דיו‬
)‫או‬ ‫ליחס‬ ‫מעט‬ ‫דומה‬‫ת‬/‫רעש‬(

34. ‫למידע‬ ‫מוקדש‬ ‫דיו‬
‫הדיו‬‫יתר‬ ‫כל‬
:
Edward R. Tufte (1983) The Visual Display of Quantitative Information

35. — Edward R. Tufte (1983) The Visual Display of Quantitative Information
“Maximize the data‐ink ratio, within reason. Every bit of ink on a
graphic requires a reason.”
"‫מקס‬‫יחס‬ ‫את‬‫המידע‬-‫דיו‬,‫האפשר‬ ‫במידת‬.
‫כל‬‫זקוקה‬ ‫בגר‬ ‫דיו‬ ‫טיפת‬‫לנימוק‬".
Original diagram by http://www.koreaherald.com/view.php?ud=20130317000227 / Redrawn by 5IVE
2012
61.4%
61.3%
61.2%
61.6%
59.9%
2013 2015 2021 2030

36. ‫המחוג‬ ‫מחוו‬-Gauge

37. ‫המחוג‬ ‫מחוו‬-Gauge
http://www.klipfolio.com/
http://www.juiceanalytics.com/writing/dashboard-gauges-indulgence-
with-restraint/
By 5IVE, our very selves. www.5ive.co.il

38. ‫משמעות‬ ‫תנו‬
‫למספרי‬

39. ‫היה‬ ‫הרווח‬
22.5%

40. ‫ירידה‬ ‫או‬ ‫עלייה‬?
22.5%
22.5%

41. 22.5%
‫יחסי‬ ‫או‬ ‫אבסולוטי‬?
)‫וג‬ ‫ג‬ ‫או‬?(
$34.5 M

42. 22.5%
‫ההקשר‬ ‫מהו‬?
‫קודמת‬ ‫בתקופה‬ ‫המספר‬ ‫היה‬ ‫מה‬?
Last Month 19.8%

43. 22.5%
‫מקביל‬ ‫בתחו‬ ‫המספר‬ ‫מהו‬?
Rest of Company: 13.8%

44. 22.5%
‫זמ‬ ‫לאור‬ ‫המספר‬ ‫השתנה‬ ‫אי‬?
22.5%
0%
JunMayApr

45. ‫ציפיות‬ ‫בטווחי‬ ‫עומד‬ ‫המספר‬ ‫אי‬?
22.5%10% 20% 30%0%
Great!GoodOk

47. Stephen Few (2006) Information Dashboard Design, p. 26
‫ב‬‫ו‬‫גר‬ ‫לט‬-Bullet Graph
‫מראה‬:
‫למדדי‬ ‫השוואה‬
‫מקביל‬ ‫למספר‬ ‫השוואה‬
‫פיו‬ ‫סטיב‬

48. ‫ספארקליי‬-Sparkline
‫טאפטי‬ ‫אדוארד‬
‫מראה‬:
‫של‬ ‫התנודה‬ ‫צורת‬
‫המספר‬
http://www.google.com/analytics/
http://dribbble.com/shots/109505-mmx?list=searches&tag=stripe

49. 22.5%
‫מראה‬:
‫שלילי‬ ‫לטווח‬ ‫כניסה‬
‫זמ‬ ‫לאור‬ ‫דפוס‬

50. ‫עוגה‬ ‫דיאגרמת‬-Piechart
http://docs.oracle.com/cd/E16764_01/web.1111/b31974/graphs_charts.htm
http://www.infosol.com/public-sector-sample-dashboard/ (Live!)
http://www.appsbi.com/wp-content/uploads/2010/03/ordermanagementexceldashboard.jpg
http://www.irritatedvowel.com/pub/blog/CustomBarChartswiththeSilverlightToolkit_FB8C/image.png

51. ‫או‬ ‫עוגה‬ ‫דיאגרמת‬‫דיאגרמת‬‫עמודות‬?
‫מוטב‬ ‫אולי‬:‫ואולי‬:
http://dribbble.com/shots/507369-Dashboard
Redrawings by 5IVE

52. ‫עוגה‬ ‫דיאגרמת‬-Piechart

53. ‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬
‫בחרו‬
‫את‬ ‫נכו‬
‫המידע‬ ‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫על‬ ‫חשבו‬
‫תרחישי‬
‫השימוש‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫הציגו‬
‫את‬ ‫נכו‬
‫המידע‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬
‫עצבו‬
‫זה‬ ‫את‬
‫נהדר‬

54. ‫היזהרו‬
‫בתלת‬-‫מימד‬

56. ‫עוגה‬ ‫דיאגרמת‬-Piechart
http://www.engadget.com/2008/01/15/live-from-macworld-2008-steve-jobs-keynote/
)19.5‫מ‬ ‫גדול‬-21.2?(! )19.5‫מ‬ ‫גדול‬-21.2?(!

58. ‫הכיוו‬:‫שטוח‬

59. http://sush.io/

60. Metro Start Dashboard by Alex Lupse
http://dribbble.com/shots/950452-Metro-Start-Dashboard

61. www.geckoboard.com

64. ‫בצבע‬ ‫השתמשו‬
‫בחוכמה‬

65. http://www.dashboardinsight.com/dashboards/live-dashboards/perpetuum-software-sales-dashboard.aspx
http://www.perpetuumsoft.com/Demo/WebDashboard/RegionSales/RegionSales.aspx

66. http://dribbble.com/shots/652736-Unused-Design
http://dribbble.com/shots/629917-Infographic
POC Infographic by Tanveer Junayed
(Not REALLY used by The Economist… We hope.)

67. ‫וג‬...

68. ‫פונטי‬‫גדולי‬
http://ducksboard.com/

69. ‫פונטי‬‫גדולי‬
http://tryghost.org/features.html

70. ‫אייקוני‬
https://wrapbootstrap.com/theme/perfectum-responsive-admin-template-WB0PHMG9K

71. ‫אייקוני‬
http://www.fitbit.com/

72. ‫המחשת‬‫כמויות‬
http://www.kiwanja.net/media/docs/m4d-Infographic-2.jpg

73. By © nikoretro
http://www.flickr.com/photos/bellatrix6/3796109344/in/photostream/

74. ‫תודה‬!
‫וכתיבה‬ ‫מחקר‬:‫צור‬ ‫ליאור‬,‫יור‬‫רוזנר‬
‫ורעיונאות‬ ‫מחקר‬:‫ד‬ ‫ירו‬-‫גור‬
‫ואיור‬ ‫עיצוב‬:‫אלה‬")‫קוקו‬("‫כה‬
www.5ive.co.il