Константин Горский — «Дизайн интерфейсов»

17,354 views
17,257 views

Published on

Published in: Technology
1 Comment
12 Likes
Statistics
Notes
No Downloads
Views
Total views
17,354
On SlideShare
0
From Embeds
0
Number of Embeds
15,869
Actions
Shares
0
Downloads
42
Comments
1
Likes
12
Embeds 0
No embeds

No notes for slide

Константин Горский — «Дизайн интерфейсов»

  1. 1. Дизайн интерфейсовКонстантин Горскийруководитель службыдизайна веб-интерфейсов
  2. 2. Photo © yandex
  3. 3. Photo © yandex
  4. 4. 5 ФронтендФото пользователя moriza с сайта flickr.com
  5. 5. 6 Дизайнеры — люди творческиеФото пользователя moriza с сайта flickr.com
  6. 6. Про что дизайнеры нередко забываюткак всё будет выглядеть в старых браузерах?что произойдет, когда мы подставим реальныеданные?особенно если эти данные не будут вмещатьсякакими будут анимации, ховеры и переходы?как должна вести себя страница при измененииразмеров окна браузера?7
  7. 7. Хорошо дизайнит тот,кто дизайнит последним.— Артём Поликарпов8
  8. 8. Что такое дизайн
  9. 9. 1 »?фото: Adobe
  10. 10. 2 англ. design — проектировать, чертить, задумать, а также проект, план, рисунок художественное конструирование предметного мира; разработка образцов рационального построения предметной среды 11
  11. 11. People think that the designers are told, Make it look good! Thats not what we think design is. Its not just what it looks like and feels like. Design is how it works.12
  12. 12. Дизайн — это сознательныеи интуитивные усилияпо созданию значимого порядка.13
  13. 13. Дизайн — это создание.14
  14. 14. Бизнес жизнеспособность Люди привлекательность Технологии осуществимость15
  15. 15. Что такое хороший дизайн?16
  16. 16. 10 принципов хорошего дизайна Дитера Рамса17
  17. 17. фото SmartMarmot с сайта flickr.com 1218
  18. 18. фото SmartMarmot с сайта flickr.com 1319 18
  19. 19. фото donchris!™ с сайта flickr.com 1420
  20. 20. Процесс дизайна
  21. 21. 1 2 3 4 5Исследование Интерпретация Идея Эксперимент Эволюция 22
  22. 22. 1 Исследование Photo by evie22 @ flickr.com Изучение истории Изучение рынка Наблюдения Этнографические иссл. Интервью экспертов Статистика Вдохновение 23)
  23. 23. 2 Интерпретация Пересказ историй Упорядочивание Анализ Заключения и выводы Постановка задачи Обозначение рамокPhoto from ideo.com 24
  24. 24. 3 Формирование идей Мозговые штурмы Креативные техники СовершенствованиеPhoto from ideo.com 25
  25. 25. 26
  26. 26. 27
  27. 27. 28
  28. 28. 29
  29. 29. 30
  30. 30. 31
  31. 31. ` 4 Эксперименты Макетирование Прототипирование Оценка Юзабилити-тестыPhoto from ideo.com 32
  32. 32. 33
  33. 33. 34
  34. 34. 36
  35. 35. Достаточно ли картинки?37
  36. 36. Достаточно ли картинки?Действие состоит из следующих этапов:1. Формирование цели2. Формировние намерения3. Определение конкретных действий4. Выполнение действий5. Восприятие нового состояния системы6. Интерпретация изменений7. Оценка результата38
  37. 37. Достаточно ли картинки?Хороший дизайн:1. Нагляден2. Имеет ясную концептуальную модель3. Указывает возможные действия4. Позволяет легко выполнить действия5. Говорит, находится ли система в необх. сост.6. Имеет хорошее соотв. между сост. и его отобр.7. Имеет внятную обратную связь39
  38. 38. 40
  39. 39. 41
  40. 40. 42
  41. 41. Дизайн должен подсказывать,какие действия возможныв данный момент.Дизайн должен быть наглядным.43
  42. 42. Вопрос:в каком разделе я нахожусь?44
  43. 43. 45
  44. 44. 46
  45. 45. 47
  46. 46. 48
  47. 47. 49
  48. 48. 50
  49. 49. 51
  50. 50. 52
  51. 51. 53
  52. 52. Что такое юзабилити?54
  53. 53. Определение из ISO 9241-11Юзабилити — это степень эффективности,трудоемкости и удовлетворенности,с которыми продукт может бытьиспользован определенными пользователямипри определенном контексте использованиядля достижения определенных целей.Usability — the extent to which a product can be usedby specified users to achieve specified goals with efficiency,effectiveness and satisfaction in a specified context of use.55
  54. 54. Юзабилити-лаборатория56
  55. 55. Юзабилити-лаборатория57
  56. 56. Многие задачи невозможнорешить одними толькоинтеллектуальными усилиями,нужны эксперименты.58
  57. 57. 5 Эволюция Разработка Запуск Изучение СовершенствованиеPhoto from ideo.com 62
  58. 58. 63
  59. 59. 64
  60. 60. 65
  61. 61. 66
  62. 62. 67
  63. 63. 68
  64. 64. 69
  65. 65. 70
  66. 66. 71
  67. 67. 72
  68. 68. 73
  69. 69. 74
  70. 70. 75
  71. 71. 76Фото пользователя moriza с сайта flickr.com
  72. 72. 78
  73. 73. 79
  74. 74. Что дальше?
  75. 75. alistapart.com smashingmagazine.com ilovetypography.com
  76. 76. Простота — необходимое условие прекрасного.Л. Н. Толстой 87
  77. 77. Спасибо!Константин Горскийgorskiy@yandex-team.ru@k00

×