Современный подход к проектированию

1. 1 С О В Р Е М Е Н Н Ы Е М Е Т О Д И К И П Р О Е К Т И Р О В А Н И Я

2. 2 П Л А Н В С Т Р Е Ч И Проектирование: задачи, современные подходы, ограничения Юзабилити: какие задачи в рамках проектирования выполняет «юзабилити» Чему хотите научиться/можете научиться Познакомимся

3. 3 М Е Н Я З О В У Т Д И М А 8 лет опыт работы по юзабилити-проектам Банки, E-com, ГОС, Телеком, Страхование , платежные сервисы, СМИ Сайты, интернет-банки, личные кабинеты, АТМ, мобильные приложения, внутренние системы, IVR, терминалы, поисковые проекты

4. 4 А В А С ? Кто руководил юзабилити-проектами, которые включали проектирование? Кто разрабатывал прототипы самостоятельно? Профиль сервисов: сайты, интернет-банки, личные кабинеты, АТМ, мобильные приложения, внутренние системы, IVR, терминалы, поисковые проекты

5. 5 Ч Т О Х О Т И Т Е ? ищу идеи для своего сервиса ищу идеи для своего сервиса повышаю компетенции работаю над собственным проектом думаю, что курс структурирует информацию узнаю как управлять различными аспектами проект: в частности, пользовательскими качествами узнаю, как принимать бизнес-решения хочу преподавать

7. 7 «Нам стыдно показывать интерфейсы наших терминалов.» «Мы видим, как стоит два терминала, у одного два человека, у другого – никого. Мы хотим быть лучше конкурентов.»

8. 8 «Новая версия 8.1. системы слишком похожа на старую. Мы боимся, что и ей не будут пользоваться»

10. 10 № 1 . П Р О Е К Т И Р О В А Н И Е И Б И З Н Е С Какие предпосылки к проекту встречали?

11. 11 F B 2

12. 12 B A B Y A P P

13. 13 Я Н Д Е К С . Т Р А Н С П О Р Т

14. 14

15. 15 № 2 . П Р О Е К Т И Р О В А Н И Е И П Р И В Ы Ч К И Какие примеры знаете, когда проектирование меняет привычки?

16. 16 Г О С У С Л У Г И

17. 17 М О Б И Л Ь Н Ы Й Б А Н К

18. 18 Ч А С Ы «Analysts estimate that 50 percent of business applications will be accessed via mobile devices over the next couple of years. »

19. 19 № 3 . П Р О Е К Т И Р О В А Н И Е И Т Е Х Н О Л О Г И И Какие примеры знаете, когда технологии делают дорогое доступным массово?

20. 20

21. 21 Ч Е Л О В Е Ч Е С К О Е П Р О Е К Т И Р О В А Н И Е Потребности бизнеса, пользователей и разработчиков Потребности или идея Внедрение Оценка дизайна с привлечение пользователей Разработка дизайна 3 4 Определение требований 2 1

22. 22 Ц Е Л Е С О О Б Р А З Н О С Т Ь viability feasibility desirability Innovation

23. 23 Ф О К У С Technology First User Needs Mobile First «Do one thing and do it well» Paul Graham

24. 24 «Necessity is often not the mother of invention. In many cases, it surely has been just the opposite. When humans possess a tool, they excel at finding new uses for it. The tool often exists before the problem to be solved»

25. О Ц Е Н И Т Е ?

26. 26 О Ц Е Н И Т Е ?

27. 27 З А Д А Ч И И У С Л О В И Я Какие задачи решаются? В каких условиях? Какое количество? Кто этим пользуется?

28. 28 И З У Ч А Е М Д Е Я Т Е Л Ь Н О С Т Ь

29. 29 «Проектирование — это всегда личное. В этом его сила и слабость».

30. 30 М И С С И И «Simplify your life» «…создаёт сервисы и продукты, повышая при этом качество жизни в целом.» Повысить уровень жизни за счет доступности ИТ технологий( )

31. 31 К А К А Я М И С С И Я В В А Ш Е Й К О М П А Н И И ?

32. 32 П О Л Ь З О В А Т Е Л Ь С К И Й И Н Т Е Р Ф Е Й С Приоритет в сценариях взаимодействия Элементы управления и их поведение Представление (визуализация для GUI) данных Разбиение на экраны / страницы / окна и спецификация переходов между ними Интерфейсные тексты Графический дизайн, Анимация Режимы и состояния интерфейса Опыт пользователей меняется

33. 33 Applied Psychology Product design UX design Visual design Copywriting Information Science Service design Business Analysis Computer Science Human Computer Interaction Interaction design

34. 34 Ч Т О П О Ч И Т А Т Ь ?

35. 35 [Глава 11] Beyer H., Holtzblatt K. Contextual design: defining customer-centered systems. – Elsevier, 1997 — http://goo.gl/uamLDu [Глава 6] Cooper A., Reimann R., Cronin D. About face 3: the essentials of interaction design. – John Wiley & Sons, 2007 — http://goo.gl/iQETK4 Hackos J.T., Reddish J.C. User and Task Analysis for Interface Design. – Toronto: John Wiley & Sons, 1998 — http://www.amazon.com/User-Task-Analysis- Interface-Design/dp/0471178314 Hammer M. Reengineering Work: Don't Automate, Obliterate // Harvard Business Review 68 (4), 1990. PP. 104-112. — http://goo.gl/PB6VBa 1. ПРОЕКТИРОВАНИЕ ДЕЯТЕЛЬНОСТИ [Главы 4, 7] Mayhew D.J. The Usability Engineering Lifecycle: A Practitioner's Handbook for User Interface Design. – Morgan Kaufmann, San Francisco, 1999. — http://goo.gl/vtnSDC

36. 36 [Главы 4, 7] Mayhew D.J. The Usability Engineering Lifecycle: A Practitioner's Handbook for User Interface Design. – Morgan Kaufmann, San Francisco, 1999. — http://goo.gl/vtnSDC Quesenbery W., Brooks K. Storytelling for user experience: Crafting stories for better de-sign. – Rosenfeld Media, 2010. — https://goo.gl/EW8hzX 2. ПРОЕКТИРОВАНИЕ ИНФ. АРХИТЕКТУРЫ Rosenfeld L., Morville P. Information architecture for the world wide web. – O'Reilly Media, Inc., 2002. Spencer D. Card sorting: Designing usable categories. – Rosenfeld Media, 2009. — https://goo.gl/eaah6Q Mullet K., Sano D. Designing visual interfaces: Communication oriented techniques. – Englewood Cliffs NJ : SunSoft Press, 1995. — http://goo.gl/1UcSIE 3. ГРАФИЧЕСКИЙ ДИЗАЙН ПОЛЬЗ. ИНТЕРФЕЙСОВ

37. 37 White J. V. Editing by Design: for designers, art directors, and editors: the classic guide to winning readers. – Skyhorse Publishing Inc., 2003. — http://goo.gl/rIJyJN Williams R. The non-designer's design book. – Pearson Education, 2014. — http://goo.gl/1aniEy

38. 38 К О Н Ц Е П Т У А Л Ь Н О Е П Р О Е К Т И Р О В Н И Е

39. 39 П А Р А Л Л Е Л Ь Н О Е П Р О Е К Т И Р О В Н И Е

40. 40

41. 41 F R O N T - E N D D E S I G N W O R K

42. 42 П Р О С Т Р А Н С Т В О Р Е Ш Е Н И Й

43. 43 “The ultimate solutions to problems are rational; the process of finding them is not”  — J.P. Guilford

44. 44 О Т Р Ы В О К И З Д С «Интерфейс – совокупность средств и методов, при помощи которых пользователь взаимодействует с продуктом»

45. 45 З А Д А Ч А Спроектировать пользовательский интерфейс АРМ руководителя для планшета и настольного ПК

46. 46 «А есть ли еще более общий вопрос на который я не обратил внимание»?

47. 47 Чем ниже (уже/конкретнее) вопрос располагается в иерархии, тем ближе мы к детальному проектированию

48. 48 «Главной особенностью дизайн- мышления, в отличие от аналитического мышления, является не критический анализ, а творческий процесс, в котором порой самые неожиданные идеи ведут к лучшему решению проблемы.»

49. 49 Юзабилити будет востребовано, покуда проектирование будет включать творческую часть работы

50. 50 К А К И Е М Е Т О Д Ы О Ц Е Н К И Э Ф Ф Е К Т И В Н О С Т И Р Е Ш Е Н И Й В Ы З Н А Е Т Е ?

51. 51 — «О, Боже, кто это вам сделал?»  — «Что там?»  — «Все НАДО переделать»

52. 52 П Р А В И Л А Ш Н Е Й Д Е Р М А Н А Стремитесь к логичности Для опытных пользователей должен быть быстрый способ (сокращения, горячие клавиши, макросы) Должна быть информативная обратная связь Диалог должен быть законченным Обработка ошибок должна быть простой Должен быть простой способ отмены действий Пользователь должен чувствовать, что все под его контролем Как можно меньше загружайте кратковременную память

53. до 5 раз склоны к покупке доп. услуг в 3 раза реже готовы к смене в 41 раз дешевле через прило- жение Удобство интерфейса влияет на бизнес-эффективность банковских сервисов

54. С Р А В Н И Т Е Л Ь Н О Е Т Е С Т И Р О В А Н И Е Обещание заплатить Информирован клиент Информировано 3 лицо Некорректный номер Ответ машины Поиск клиента Новая система Старая система 54

55. И с с л е д о в а н и е C h a n g e S c i e n c e 55

56. 56 Чем выше «юзабилити» сайта, тем выше конверсия (количество выполненных задач). Они связаны линейно.

57. 57 И Н Т Е Р Н Е Т - Б А Н К И Н Г

58. И С С Л Е Д О В А Н И Е O P T I M A U S A B I L I T Y 58 0 25 50 75 100 AKZ ASB BNZ KiWi bank MY WW O SUS Score Total # of Features Usability Issues

59. 61 П А Р Н О Е С Р А В Н Е Н И Е Задача – определить, какой дизайн более привлекателен для пользователей. Подходит для задач, когда все решения сравнимого качества, и нельзя прийти к общему экспертному мнению. Просим пользователей сравнить варианты: каждый вариант сравнивается с каждым попарно и многократно. Мы вычисляем среднюю оценку для каждого варианта. Достаточно 100-300 респондентов, каждый вариант сравнивается с каждым 3-4 раза (чтобы учесть колебание индивидуальных оценок). Результат – рейтинг привлекательности графического дизайна.

60. 62 Р Е З У Л Ь Т А Т Нормализованная оценка Вероятность выбора Нормализованная оценка Вероятность выбора Нормализованная оценка Вероятность выбора Вариант 1 0,45 67% 0,6 73% 0,43 67% Вариант 2 -0,23 42% -0,43 33% -0,18 43% Вариант 3 0,19 57% 0,26 59% 0,1 54% Контрольный -0,41 34% -0,43 34% -0,35 36% ГЛАВНЙ ЭКРАН СПИСОК ПРОДУКТОВ ПЛАТЕЖ П О П А Р Н А Я О Ц Е Н К А , N = 73

61. 63 Р Е З У Л Ь Т А Т Нормализованная оценка Вероятность выбора Нормализованная оценка Вероятность выбора Вариант 1 0,49 69% 0,5 69% Вариант 2 -0,42 34% -0,25 41% Вариант 3 0,2 57% 0,18 57% Контрольный -0,27 39% -0,43 34% КЛИЕНТЫ БРС, N = 14 НЕ КЛИЕНТЫ БРС, N = 59 П О П А Р Н А Я О Ц Е Н К А , N = 73

62. 64 К О М М Е Н Т А Р И И темный, мрачный 10 плохо читается текст 4 цвет нравится 3 иконки не нравятся 2 красивый 2 понятный 2 не в стиле банка 1 слишком много разделов 1 простой 1 легкий 1 спокойный 1 ВАРИАНТ №2

63. 65 G O M S Goals, operators, methods and selection rules — информационная модель, позволяющая провести моделирование выполнения той или иной задачи пользователем и на ее основе оценить качество интерфейса.

64. 66 П Р И М Е Р Р А С Ч Е Т А нажатие клавиши K = 0, 2 c указание P = 1, 1 c перемещение H = 0, 4 c ментальная подготовка M = 1, 3 5 c ответ R

65. 67 П Р И М Е Р Р А С Ч Е Т А 1. Выбрать тип документа 2. Ввести идентификатор документа 3. Ввести фамилию 4. Считать карту клиента 1. Перенос правой руки на цифр. клавиатуру 2. Ввод 4-х цифр 3. Ввод 6-ти цифр 4. Ввод 7-ми цифр 1. Перенос правой руки на основную клавиатуру 2. Ввод n символов 1. Нажать кнопку «Запустить терминал» 2. Провести картой по считывающе му устройству 1. «Карта +Документ» 2. «ФИО +Документ» 1. Навести указатель мыши 2. Нажать левой кнопкой 4. Ввод 7-ми цифр 5.Нажа ть «Enter» 3. Нажать «Enter» 4. Нажать левой кнопкой мыши 3. Навести указатель мыши на нужный тип документа 2. Нажать левой кнопкой мыши 1. Навести указатель мыши на выпадающий список 1. Способ идентификации 0.Идентификация клиента 2. Ввод параметров идентификации

66. 68 В Ы В О Д Ы Проектирование — процесс или деятельность. Эту деятельность можно декомпозировать и управлять на каждом этапе. Юзабилити превращает эмоциональные/творческие решения (я так думаю, я так чувствую, я эксперт) в бизнес-решения (это востребовано, так удобно пользователям, такой дизайн пользователи выберут чаще и им понравится больше).

67. 69 U S A B I L I T Y B E N C H M A R K I N G

68. 70 О Ц Е Н И Т Е С О Д Е Р Ж А Н И Е Проектирование — процесс или деятельность. Эту деятельность можно декомпозировать и управлять на каждом этапе. Юзабилити превращает эмоциональные/творческие решения (я так думаю, я так чувствую, я эксперт) в бизнес-решения (это востребовано, так удобно пользователям, такой дизайн пользователи выберут чаще и им понравится больше).

69. 71 О Ц Е Н И Т Е С О Д Е Р Ж А Н И Е Хорошо ли описаны проблемы? Правильно ли выбраны методы? Понятно ли описание методов? Правильно ли применены методы? Вы смогли бы воспроизвести исследование? Насколько достоверными вам кажутся результаты? Интересны ли результаты?

70. 72 С П А С И Б О d.silaev@usabilitylab.net Mob: + 7 926 492 05 50 Skype: silaev_usabilitylab

Современный подход к проектированию

Esté a ler uma amostra.

Confira estes a seguir

Современный подход к проектированию

Mais Conteúdo rRelacionado

Quem viu também gostou (10)

Semelhante a Современный подход к проектированию (20)

Mais de Дмитрий Силаев (20)

Mais recentes (20)