WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail.Ru Group

Yury Vetrov
Yury VetrovHead of Portal UX at Mail.Ru Group
Юрий Ветров из Mail.Ru:


  Design Thinking
Тренинг от Stanford d.School для Mail.Ru Group
О чем этот рассказ?


— Jeremy Utley и Perry Klebahn провели
  двухдневный тренинг по Design
  Thinking для Mail.Ru Group.
— Что это за подход и для чего он
  используется.
— Основные этапы процесса и методы,
  использующиеся по ходу поиска и
  решения проблемы.
— Как и какую задачу мы решали по ходу
  тренинга. Подход в действии.


2
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
О тренинге




4
В первой половине сентября к нам в Mail.Ru
приезжали Perry Klebahn и Jeremy Utley из
Стэнфордской d.School с тренингом Design Thinking.




      Perry Klebahn             Jeremy Utley



5
Задачей тренинга было перепроектирование
―holiday experience‖ в самом широком смысле. Не
давалось никаких ограничений – важно было
решить задачу как можно интереснее.




6
Это были два дня сверхплотной работы, в ходе
которых мы испробовали методологию Design
Thinking на практике и изучили новые методы
проектной работы.




7
Было круто! Несмотря на то что все дико устали за
эти рабоче-выходные дни, каждый проникся тем
продуктом и процессом его решения, который
получился в итоге.




8
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
Что такое Design Thinking?




10
Design Thinking – это подход к созданию новых
продуктов, когда задача нетривиальна и плохо
описана.




11
За счет чего решаются такие задачи? Хорошо
поставленный итеративный процесс решения и
постоянного пересмотра изначальных установок.




12
Основы подхода были заложены в Стэнфорде в
80х. Его евангелистами являются выходцы оттуда –
компания IDEO и учебная организация d.School.
Они и приехали к нам.




13
Хороший пример подхода в действии – история про
африканские больницы. Команду дизайнеров
попросили предложить недорогие в производстве
поддоны для новорожденных, которые можно часто
менять при ограниченном бюджете.




           Версия 1                 Версия 2



14
Дизайнеры долго работали над задачей и в итоге
создали действительно недорогое и эффективное
решение. А когда они приехали протестировать
продукт, больница оказалась полупустой.




15
Почему? Жители деревень часто не могли добраться
до больницы. После пересмотра исходной проблемы
был предложен другой продукт – недорогие одеяла,
которые сохраняют младенцев в тепле даже в
холодной пустыне.




16
Есть масса других историй удачного применения
подхода на практике. Это говорит о том, что Design
Thinking работает и может быть применен в нашей
работе.




17
Обзор процесса




18
5 этапов процесса Design Thinking знакомы любому
проектировщику интерфейсов – по сути, это те же
исследование, продумывание концепции,
проектирование и тестирование. Но есть нюансы.




19
Акцент на постоянном пересмотре изначальной


1   проблемы. Ее первое понимание как правило
    поверхностно, но только знание сути и всех
    нюансов позволяет найти лучшее решение.




    20
Как следствие – стремление как можно быстрее


2   ошибиться, получив первый вариант решения.
    Важно как можно чаще получать результат, для того
    чтобы можно было оценить его и доработать.




    21
Четко прописанный набор методов и практик,


3   которые позволяют пройти процесс решения задачи
    от начала до конца. Это значит, что у теории есть
    мощная практическая база.




    22
Ориентация на командную работу. Именно в


4   команде проще охватить весь спектр возможных
    решений и более объективно оценивать выбранные
    варианты.




    23
Множество управляемых брейнштормов с


5   методами выбора лучших решений из массы
    предлагаемых. Так можно охватить все пространство
    решений, не ограничиваясь поверхностными идеями.




    24
В начале тренинга мы потратили час на
«разогревочную задачу» – перепроектирование ―gift
experience‖. Это позволило увидеть весь процесс и
подготовиться к решению основной задачи.




25
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
1   Empathize




    27
Задача первого этапа – понять пользователя. Кто
он, какие у него потребности, проблемы, желания,
чувства, мысли, настроения?




28
Потребности пользователя описываются в формате
«Что, Почему и Как». Важно понимать, почему
существует такая потребность и как она решается
сейчас.




29
Для этого необходимо провести серию интервью с
представителями целевой аудитории. И задавать
им правильные наводящие вопросы. Есть несколько
правил продуктивного общения.



     — искать реальные истории
       из жизни;
     — говорить о чувствах и
       ощущениях;
     — спрашивать, почему
       произошло то или иное
       событие.

30
Для обкатки навыков интервью к нам привели
группу потенциальных пользователей. Мы
научились вести конспекты, направлять разговор в
нужное русло, выискивать интересные истории.




31
Дальше тренеры отправили нас в поле – на Красную
площадь – узнавать, как находившиеся там туристы
проводят отпуска. Дождливый день усилил проблему
интервьюера – большинство отказывается
разговаривать с незнакомыми людьми.




32
Мы нашли свой подход к людям – предлагали
сфотографировать их взамен на пару вопросов.
Причем после ответа на первый даже не хотевшие
общаться прохожие втягивались в дискуссию.




33
Зато самая тяжелая на подъем компания оказалась
наиболее ценным источником знаний – компания из
троих едущих в Европу молодых людей, бывших в
Москве проездом на пару дней.




34
Этап не зря называется "empathy" – истории,
которые рассказывают интервьюируемые, здорово
помогают прочувствовать важность каких-то вещей,
событий или моментов для них.




35
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
2   Define




    37
На втором этапе мы ищем проблему, которую будет
решать наш продукт. Точнее, пытаемся глубже и
тоньше понять то видение проблемы, которое мы
сформировали на старте проекта.




38
Для этого мы провели небольшой брейншторм –
записали на стикерах все, что говорил наш
пользователь и разделили эти заметки по
нескольким категориям.


     цитаты и ключевые слова    мысли и убеждения
 что мы видим и слышим




                                              как мы ощущаем то, что
                                              чувствует пользователь
     действия и поведение         чувства и эмоции




39
Это нужно для того чтобы построить модель POV
(point of view) – ключевой посыл, описывающий
проблему пользователя. Он описывает потребности
в похожем на user stories формате.




     Пользователь
     имя или тип персонажа

     Потребность
     описание потребности

     Инсайт
     мотив к действию




40
POV активно используется в ходе всего процесса
для постановки задач и проверки решений.
Проблема – ключевое требование при работе над
продуктом и ее постановка крайне важна.




41
Для получения POV нужно найти паттерны в
записях брейншторма, убрать оттуда явные
отклонения и отметить противоречия.


     цитаты и ключевые слова    мысли и убеждения
 что мы видим и слышим




                                              как мы ощущаем то, что
                                              чувствует пользователь
     действия и поведение         чувства и эмоции




42
После мы собрали наш первый POV по
изначальной «формуле». Для нашего персонажа он
получился простым и понятным, но вызвал массу
споров по поводу точной формулировки.


                                    первая версия


     Компания молодых людей
     хочет

     спонтанности
     для того чтобы

     оставаться независимыми и
     клевыми


43
На этом первый день закончился, хотя несмотря на
усталость, мы продолжили спорить о точной
формулировке уже в баре.




44
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
3   Ideate




    46
На третьем этапе нам нужно понять пространство
возможных решений проблемы. Важно предложить
как можно больше вариантов, чтобы в дальнейшем
выбрать или собрать из них лучшее.




                                               test
     empathize   define

                          ideate   prototype




47
Основной метод работы – управляемый
брейншторм. Участники процесса максимально
широко описывают возможные идеи по поводу
персонажа, а затем фильтруют этот поток.




48
Для каждого из слов в нашем POV команды
предлагали десятки синонимов, ассоциаций,
близких по духу слов и понятий. За полчаса мы
плотно заполнили стикерами три маркерных доски.




49
Что делать с этими тремя сотнями мыслей? Есть
отличный метод KJ (автор – Kawakita, Jiro), который
помогает разобраться с результатами брейншторма.
Он еще часто называется диаграммой родства.




                   Kawakita Jiro



50
Каждому участнику дается всего несколько стикеров,
которыми он отмечает понравившиеся идеи.
Ограниченность выбора заставляет задуматься и
коллективное решение сбалансировано.




      “Most likely to   “Most likely to   “Most breakthrough
      succeed”          delight”          if …”




51
Компания UI Engineering провела сравнительный тест
– собрала 15 групп по 10 специалистов и дала им одну
и ту же задачу. Выбор был почти идентичным,
несмотря на то что группы не общались.




52
В нашем случае нужно было выбрать самую
реалистичную, самую восхитительную и самую
прорывную при определенных условиях идеи. Но
набор параметров может быть и другим.




53
6 человек из нашей команды действительно выбрали
всего несколько идей из трех сотен. Этот набор мы
снова отфильтровали, пока не получилась слаженная
картина, характеризующая нашего пользователя.




54
Теперь можно было обновить POV на основе более
широкого понимания проблемы. Мы добавили
деталей и нюансов к портрету нашего персонажа –
они помогли нам в поиске интересного решения.


                                     вторая версия
     Компания молодых людей
     хочет
     вырваться из обыденности и
     рутины
     для того чтобы
     уйти от денежных и
     общественных обязательств и
     ограничений


55
Картина прояснилась и в голову сразу стали
приходить решения. А идеи из большого
брейншторма, которые не пошли в работу,
пригодились на следующем этапе.




56
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
4   Prototype




    58
На четвертом этапе мы начинаем заниматься
реализацией продукта – делается его прототип. У
всех уже есть его примерное видение и огромное
желание наконец-то поработать руками.




59
У прототипа есть сразу несколько задач, которые
делают его одним из самых полезных этапов
работы над продуктом.



     — лучше понять проблему и
       пользователя;
     — подумать руками, опробовав
       идею на практике;
     — подготовиться к
       тестированию;
     — вдохновить других людей
       идеей продукта.


60
Важная задача прототипирования – отбрасывание не
подходящих концепций. Можно проверить идеи на
практике задешево, а сама методология поощряет
ошибки – мы учимся и лучше понимаем проблему.




61
Прототип может отражать одну или несколько граней
продукта. Мы делаем массовый сервис, а значит у
него есть потребители и контекст использования, а
также владельцы и процесс обслуживания.




62
Можно показывать внешний вид продукта – на что


1   он похож, как выглядит.




    63
Можно показывать принцип работы продукта – как


2   он выполняет свою основную задачу, возможно ли
    это технически.




    64
Можно показывать процесс взаимодействия


3   пользователя с продуктом – как это происходит, по
    каким сценариям.




    65
Перед созданием прототипа необходимо определить,
какие из граней продукта мы будем проверять с его
помощью. Лучше сконцентрироваться на одной – так
проще проверять и улучшать изолированный аспект.




66
Рабочим материалом может быть все что угодно.
Тренеры принесли нам кучу ненужного на вид хлама –
мячики, канцелярские принадлежности, игрушки и т.п.
Но это не помешало делать из них быстро интересные
и понятные при хорошем презентации вещи.




67
Мы выбрали две наиболее интересные идеи и
разделились на подкоманды. Наша тройка взяла
концепцию «Страна All-Inclusive» – остров с массой
развлечений, где все бесплатно после покупки тура.




     — Страна All-Inclusive;
     — Лотерея путешествий-
       квестов.



68
В качестве прототипа мы решили сделать карту
этого острова. В ходе работы воспользовались
методами, опробованными на предыдущих этапах.



     1.   С помощью брейншторма определили
          набор мест и заведений. Многие из идей
          пришли из интервью с пользователями.
     2.   Сгруппировали заведения по
          тематическим зонам, назвав их странами
          и городами.
     3.   Проработали схемы перемещения между
          городами, сделав их отдельным
          способом развлечения.
     4.   Продумали, как туристы будут
          добираться на остров и уезжать оттуда.


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




70
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
5   Test




    72
Финальный этап – тестирование получившегося
продукта. Нужно понять, насколько хорошо он
решает проблему пользователя и если нужно –
подкрутить решение.




73
Корректировки может потребовать сама постановка
проблемы. Но методология предполагает постоянный
пересмотр исходных установок. Важно выдать не
просто продукт, а решение реальной потребности.
 что мы видим и слышим




                                             как мы ощущаем то, что
                                             чувствует пользователь
74
Существует множество методов проверки решений
на соответствие потребностям пользователей. В
нашей работе это один набор, тренеры привели для
примера следующий список:



     1.   Фокус-группы
     2.   Юзабилити-центры
     3.   Веб-аналитика
     4.   Бета-тестирование
     5.   Обеды с клиентами
     6.   Пре-релизы
     7.   Опросы




75
Для тестирования нашего прототипа мы
приглашали условных пользователей, которые
пытались решить с его помощью проблему нашего
персонажа. Есть ряд нюансов в этом процессе.




76
Пользователь должен сам пройтись по прототипу,


1   прочувствовать его. Для этого нужно кратко
    презентовать продукт и дать респонденту вводную.
    Но вести его за руку по всем шагам не стоит.




    77
Стоит запоминать все, что пользователь делал с


2   продуктом – и то идеи что поняты сразу, и то что
    требовало пояснений. Это говорит о сильных и
    слабых сторонах концепции.




    78
Улучшать прототип можно прямо по ходу


3   тестирования. Это ускоряет процесс доработки
    продукта и дает возможность что-то уточнить у
    пользователя здесь и сейчас.




    79
Изначально мы решили проверить, насколько
пользователям подходит набор развлечений на
острове, интересны и комфортны ли способы
перемещения между ними.




80
Но вскоре пришлось подумать о продажах и
маркетинге продукта. А помимо карты были
созданы билеты, буклеты, промо-материалы и
другие вспомогательные артефакты.




81
В итоге мы проверили и проработали сразу
несколько граней продукта – и внешний вид, и
механизм работы, и взаимодействие с ним.




82
Нам повезло – прототип отлично подошел к POV и
описание проблемы корректировать не пришлось.
Хотя на разогревочной задаче такое случилось и
это нормально для методологии.




83
Я много читал о методике быстрого
прототипирования+тестирования и давно использую
ее первую составляющую, но все никак не получалось
попробовать на практике всю связку. И зря.




84
Скорость совершенствования продукта в таком
подходе поражает. За пару часов и несколько
итераций мы изменили прототип так, как обычно
получается сделать только за дни и недели.




85
Такой итеративный подход не заменяет
формализованное юзабилити-тестирование. Но во
многих ситуациях позволяет заметно улучшить
продукт быстро и дешево.




86
1. О тренинге
2. Что такое Design Thinking
3. Этап 1: Empathize
4. Этап 2: Define
5. Этап 3: Ideate
6. Этап 4: Prototype
7. Этап 5: Test
8. Итоговая презентация
Итоговая презентация




88
Завершающая стадия тренинга – презентация
получившегося продукта. Необходимо правильно
рассказать о проблеме и решении. Так, чтобы
аудитория поняла и хорошо приняла концепцию.




89
В процессе работы над реальным продуктом такие
презентации случаются регулярно и на каждом
этапе, поэтому умение хорошо подготовить ее не
менее важно в дизайн-процессе.




90
Репетиция презентации началась с планирования
рассказа. Важно понять, о чем и кому мы будем
говорить, что именно и как показывать. Используется
методика storytelling, которая имеет несколько плюсов.




91
История – привычный и понятный нам способ


1   подачи информации. Она умеет вовлечь слушателя
    и имеет целый ряд приемов для этого.




    92
По ходу рассказа можно найти проблемы и


2   нестыковки как презентации, так и в самой
    концепции или прототипе. А значит еще раз
    улучшить наш продукт.




    93
Это сближает команду. Мы плотно работали


3   несколько дней над интересной задачей и
    эмоционально привязались к ней. Приятно
    поделиться этим с другими людьми.




    94
Хорошая история основана на персонаже и имеет
много тонких и увлекательных деталей. А еще она
построена по классической схеме с завязкой,
развитием сюжета и кульминацией.




                              event
                  conflict




        action




95
Эти этапы хорошо ложатся на наше исследование
проблемы и поиск ее решения.




                             POV/solution
                             event
                  insight
                  conflict



        need
        action




96
Сначала мы даем слушателям понять, кто наши


1   персонажи и какие у них потребности. Это может
    быть небольшая история из жизни, причем здорово,
    если она будет наглядно показана или разыграна.



                                                     На чем
                                                  сфокусировано
                                                      наше
                                                    решение?
                                          solution
                        Чего не хватает
                                                                        Итого. Почему
                         в их жизни?          event                     это решение –
           Кто они?             need                                       лучшее?
          Какие у них                  conflict
         потребности?                                              reaction
                    user     character action         resolution




    97
Затем мы рассказываем о проблеме


2   пользователя, том чего не хватает в их жизни или
    мешает совершению чего-то важного. Так мы
    вызываем сопереживание этой проблеме.



                                                     На чем
                                                  сфокусировано
                                                      наше
                                                    решение?
                                          solution
                        Чего не хватает
                                                                        Итого. Почему
                         в их жизни?          event                     это решение –
           Кто они?             need                                       лучшее?
          Какие у них                  conflict
         потребности?                                              reaction
                    user     character action         resolution




    98
Теперь можно представить решение проблемы –


3   каким мы видим его и на чем оно сфокусировано.
    Это кульминация нашей истории – то, ради чего мы
    рассказываем ее.



                                                     На чем
                                                  сфокусировано
                                                      наше
                                                    решение?
                                          solution
                        Чего не хватает
                                                                        Итого. Почему
                         в их жизни?          event                     это решение –
           Кто они?             need                                       лучшее?
          Какие у них                  conflict
         потребности?                                              reaction
                    user     character action         resolution




    99
Финальная часть рассказа объясняет, почему это


4   решение – лучшее. Важно показать, что проблема
    действительно решена и наш персонаж изменит
    свою жизнь с помощью предложенного продукта.



                                                      На чем
                                                   сфокусировано
                                                       наше
                                                     решение?
                                           solution
                         Чего не хватает
                                                                         Итого. Почему
                          в их жизни?          event                     это решение –
            Кто они?             need                                       лучшее?
           Какие у них                  conflict
          потребности?                                              reaction
                     user     character action         resolution




    100
Изначально мы попытались выстроить рассказ на
основе процесса создания решения – с чего мы
начали, как мы пришли к текущему продукту, с
какими проблемами столкнулись по ходу работы.




101
Но такой формат оказался неподходящим – нужно
говорить о пользователе и его проблеме, а не команде
дизайнеров. Поэтому вторая версия рассказа
сфокусировалась на истории и переживаниях.




102
В ходе обкатки презентации мы успели внести еще
ряд изменений в прототип – выяснилось, что есть
нестыковки в схеме работы с продуктом. Если историю
нельзя легко пересказать, в ней есть проблемы.




103
Времени на презентацию было не так много и это
проблема многих тренингов – потратив два дня на
задачу и эмоционально привязавшись к ней, обидно
не иметь времени поделиться всем что запомнилось.




104
Хотя сами продукты были очень интересными и
необычными – от музея по ТВ для бабушек и
временных капсул до квестов с лагерем подготовки
вьетконговцев и мобильных приложений.




105
Что мы вынесли из тренинга?



                               What:


  What do you want to bring
  back from d.school           How:
  bootcamp?



                               What:


  What do you want to infuse
  into your team from the      How:
  bootcamp experience?



                               What:


  Which projects will you
  advance with Design
                               How:
  thinking after bootcamp?




106
Половина участников – менеджеры среднего и


1   верхнего звена, которые теперь лучше понимают,
    что именно мы делаем в своей работе. Нам проще
    общаться с ними и говорить на понятном языке.




    107
Почти никто не делал компьютерных и электронных


2   решений – это были продукты в широком смысле,
    часто сервисы. Mail.Ru решает повседневные задачи
    людей, в которых компьютер – лишь инструмент.




    108
Способы фильтрации результатов брейншторма


3   позволяют превратить их из просто приятного
    времяпрепровождения в мощнейший инструмент
    поиска новых решений.




    109
Правило про низковисящие фрукты особенно важно


4   для инновационных продуктов. Переосмысливать
    не только решение, но и саму проблему, не
    останавливаясь на ее простейшем понимании.




    110
По завершению презентаций тренеры обсудили с
нами способы использования полученных знаний на
практике. Получилось несколько направлений, в
которых можно двигаться.



      1.   Использование рабочего
           пространства.
      2.   Команда должна быть более
           видимой для пользователей.
      3.   Вид обновленного дизайн-процесса.
      4.   Частые быстрые эксперименты.
      5.   Новые способы взаимодействия.
      6.   Наиболее важное для улучшения
           процесса изменение процесса.



111
Было приятно видеть вас! Вопросы?



                                                                      Юрий Ветров
                                                                      www.jvetrau.com
                                                                      twitter.com/jvetrau




                                                                      www.mail.ru
                                                                      facebook.com/pages/MailRu



       Все иллюстрации, использованные в данной презентации, принадлежат их уважаемым владельцам. В случае, если вы являетесь их
правообладателем и против размещения этих иллюстраций – напишите, пожалуйста, письмо по адресу jvetrau@gmail.com и я уберу их из слайдов.
1 of 112

More Related Content

What's hot(20)

Design ManagementDesign Management
Design Management
Stan Ru13K views
PrototypingPrototyping
Prototyping
Nikolay Berezovskiy788 views
UX Strategy 101UX Strategy 101
UX Strategy 101
Anastasia Schebrova1.9K views

Similar to WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail.Ru Group(20)

CL_Kaspersky_CyberHeroes_finalCL_Kaspersky_CyberHeroes_final
CL_Kaspersky_CyberHeroes_final
Changellenge >> Capital2.6K views
Useful meetup#1 design sprintUseful meetup#1 design sprint
Useful meetup#1 design sprint
usefulagency633 views
дизайн мышлениедизайн мышление
дизайн мышление
ssuser5cadbb244 views
дизайн сессия в ммсодизайн сессия в ммсо
дизайн сессия в ммсо
Nadezhda Isaeva506 views
Дизайн исследования 2Дизайн исследования 2
Дизайн исследования 2
Евгения Черкашина777 views
Основы ведения интервьюОсновы ведения интервью
Основы ведения интервью
Vladimir Melnikov1.4K views
Efekt PrezentacEfekt Prezentac
Efekt Prezentac
Tatyana Savchyk806 views
Мастер классМастер класс
Мастер класс
OlgaBratischenko2.4K views
HSE{Worksops}: методичкаHSE{Worksops}: методичка
HSE{Worksops}: методичка
Аня Моисеева414 views
Основы проектированияОсновы проектирования
Основы проектирования
Aleksandr Ovchinnikov22K views

More from Yury Vetrov(19)

WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail.Ru Group

  • 1. Юрий Ветров из Mail.Ru: Design Thinking Тренинг от Stanford d.School для Mail.Ru Group
  • 2. О чем этот рассказ? — Jeremy Utley и Perry Klebahn провели двухдневный тренинг по Design Thinking для Mail.Ru Group. — Что это за подход и для чего он используется. — Основные этапы процесса и методы, использующиеся по ходу поиска и решения проблемы. — Как и какую задачу мы решали по ходу тренинга. Подход в действии. 2
  • 3. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 5. В первой половине сентября к нам в Mail.Ru приезжали Perry Klebahn и Jeremy Utley из Стэнфордской d.School с тренингом Design Thinking. Perry Klebahn Jeremy Utley 5
  • 6. Задачей тренинга было перепроектирование ―holiday experience‖ в самом широком смысле. Не давалось никаких ограничений – важно было решить задачу как можно интереснее. 6
  • 7. Это были два дня сверхплотной работы, в ходе которых мы испробовали методологию Design Thinking на практике и изучили новые методы проектной работы. 7
  • 8. Было круто! Несмотря на то что все дико устали за эти рабоче-выходные дни, каждый проникся тем продуктом и процессом его решения, который получился в итоге. 8
  • 9. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 10. Что такое Design Thinking? 10
  • 11. Design Thinking – это подход к созданию новых продуктов, когда задача нетривиальна и плохо описана. 11
  • 12. За счет чего решаются такие задачи? Хорошо поставленный итеративный процесс решения и постоянного пересмотра изначальных установок. 12
  • 13. Основы подхода были заложены в Стэнфорде в 80х. Его евангелистами являются выходцы оттуда – компания IDEO и учебная организация d.School. Они и приехали к нам. 13
  • 14. Хороший пример подхода в действии – история про африканские больницы. Команду дизайнеров попросили предложить недорогие в производстве поддоны для новорожденных, которые можно часто менять при ограниченном бюджете. Версия 1 Версия 2 14
  • 15. Дизайнеры долго работали над задачей и в итоге создали действительно недорогое и эффективное решение. А когда они приехали протестировать продукт, больница оказалась полупустой. 15
  • 16. Почему? Жители деревень часто не могли добраться до больницы. После пересмотра исходной проблемы был предложен другой продукт – недорогие одеяла, которые сохраняют младенцев в тепле даже в холодной пустыне. 16
  • 17. Есть масса других историй удачного применения подхода на практике. Это говорит о том, что Design Thinking работает и может быть применен в нашей работе. 17
  • 19. 5 этапов процесса Design Thinking знакомы любому проектировщику интерфейсов – по сути, это те же исследование, продумывание концепции, проектирование и тестирование. Но есть нюансы. 19
  • 20. Акцент на постоянном пересмотре изначальной 1 проблемы. Ее первое понимание как правило поверхностно, но только знание сути и всех нюансов позволяет найти лучшее решение. 20
  • 21. Как следствие – стремление как можно быстрее 2 ошибиться, получив первый вариант решения. Важно как можно чаще получать результат, для того чтобы можно было оценить его и доработать. 21
  • 22. Четко прописанный набор методов и практик, 3 которые позволяют пройти процесс решения задачи от начала до конца. Это значит, что у теории есть мощная практическая база. 22
  • 23. Ориентация на командную работу. Именно в 4 команде проще охватить весь спектр возможных решений и более объективно оценивать выбранные варианты. 23
  • 24. Множество управляемых брейнштормов с 5 методами выбора лучших решений из массы предлагаемых. Так можно охватить все пространство решений, не ограничиваясь поверхностными идеями. 24
  • 25. В начале тренинга мы потратили час на «разогревочную задачу» – перепроектирование ―gift experience‖. Это позволило увидеть весь процесс и подготовиться к решению основной задачи. 25
  • 26. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 27. 1 Empathize 27
  • 28. Задача первого этапа – понять пользователя. Кто он, какие у него потребности, проблемы, желания, чувства, мысли, настроения? 28
  • 29. Потребности пользователя описываются в формате «Что, Почему и Как». Важно понимать, почему существует такая потребность и как она решается сейчас. 29
  • 30. Для этого необходимо провести серию интервью с представителями целевой аудитории. И задавать им правильные наводящие вопросы. Есть несколько правил продуктивного общения. — искать реальные истории из жизни; — говорить о чувствах и ощущениях; — спрашивать, почему произошло то или иное событие. 30
  • 31. Для обкатки навыков интервью к нам привели группу потенциальных пользователей. Мы научились вести конспекты, направлять разговор в нужное русло, выискивать интересные истории. 31
  • 32. Дальше тренеры отправили нас в поле – на Красную площадь – узнавать, как находившиеся там туристы проводят отпуска. Дождливый день усилил проблему интервьюера – большинство отказывается разговаривать с незнакомыми людьми. 32
  • 33. Мы нашли свой подход к людям – предлагали сфотографировать их взамен на пару вопросов. Причем после ответа на первый даже не хотевшие общаться прохожие втягивались в дискуссию. 33
  • 34. Зато самая тяжелая на подъем компания оказалась наиболее ценным источником знаний – компания из троих едущих в Европу молодых людей, бывших в Москве проездом на пару дней. 34
  • 35. Этап не зря называется "empathy" – истории, которые рассказывают интервьюируемые, здорово помогают прочувствовать важность каких-то вещей, событий или моментов для них. 35
  • 36. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 37. 2 Define 37
  • 38. На втором этапе мы ищем проблему, которую будет решать наш продукт. Точнее, пытаемся глубже и тоньше понять то видение проблемы, которое мы сформировали на старте проекта. 38
  • 39. Для этого мы провели небольшой брейншторм – записали на стикерах все, что говорил наш пользователь и разделили эти заметки по нескольким категориям. цитаты и ключевые слова мысли и убеждения что мы видим и слышим как мы ощущаем то, что чувствует пользователь действия и поведение чувства и эмоции 39
  • 40. Это нужно для того чтобы построить модель POV (point of view) – ключевой посыл, описывающий проблему пользователя. Он описывает потребности в похожем на user stories формате. Пользователь имя или тип персонажа Потребность описание потребности Инсайт мотив к действию 40
  • 41. POV активно используется в ходе всего процесса для постановки задач и проверки решений. Проблема – ключевое требование при работе над продуктом и ее постановка крайне важна. 41
  • 42. Для получения POV нужно найти паттерны в записях брейншторма, убрать оттуда явные отклонения и отметить противоречия. цитаты и ключевые слова мысли и убеждения что мы видим и слышим как мы ощущаем то, что чувствует пользователь действия и поведение чувства и эмоции 42
  • 43. После мы собрали наш первый POV по изначальной «формуле». Для нашего персонажа он получился простым и понятным, но вызвал массу споров по поводу точной формулировки. первая версия Компания молодых людей хочет спонтанности для того чтобы оставаться независимыми и клевыми 43
  • 44. На этом первый день закончился, хотя несмотря на усталость, мы продолжили спорить о точной формулировке уже в баре. 44
  • 45. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 46. 3 Ideate 46
  • 47. На третьем этапе нам нужно понять пространство возможных решений проблемы. Важно предложить как можно больше вариантов, чтобы в дальнейшем выбрать или собрать из них лучшее. test empathize define ideate prototype 47
  • 48. Основной метод работы – управляемый брейншторм. Участники процесса максимально широко описывают возможные идеи по поводу персонажа, а затем фильтруют этот поток. 48
  • 49. Для каждого из слов в нашем POV команды предлагали десятки синонимов, ассоциаций, близких по духу слов и понятий. За полчаса мы плотно заполнили стикерами три маркерных доски. 49
  • 50. Что делать с этими тремя сотнями мыслей? Есть отличный метод KJ (автор – Kawakita, Jiro), который помогает разобраться с результатами брейншторма. Он еще часто называется диаграммой родства. Kawakita Jiro 50
  • 51. Каждому участнику дается всего несколько стикеров, которыми он отмечает понравившиеся идеи. Ограниченность выбора заставляет задуматься и коллективное решение сбалансировано. “Most likely to “Most likely to “Most breakthrough succeed” delight” if …” 51
  • 52. Компания UI Engineering провела сравнительный тест – собрала 15 групп по 10 специалистов и дала им одну и ту же задачу. Выбор был почти идентичным, несмотря на то что группы не общались. 52
  • 53. В нашем случае нужно было выбрать самую реалистичную, самую восхитительную и самую прорывную при определенных условиях идеи. Но набор параметров может быть и другим. 53
  • 54. 6 человек из нашей команды действительно выбрали всего несколько идей из трех сотен. Этот набор мы снова отфильтровали, пока не получилась слаженная картина, характеризующая нашего пользователя. 54
  • 55. Теперь можно было обновить POV на основе более широкого понимания проблемы. Мы добавили деталей и нюансов к портрету нашего персонажа – они помогли нам в поиске интересного решения. вторая версия Компания молодых людей хочет вырваться из обыденности и рутины для того чтобы уйти от денежных и общественных обязательств и ограничений 55
  • 56. Картина прояснилась и в голову сразу стали приходить решения. А идеи из большого брейншторма, которые не пошли в работу, пригодились на следующем этапе. 56
  • 57. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 58. 4 Prototype 58
  • 59. На четвертом этапе мы начинаем заниматься реализацией продукта – делается его прототип. У всех уже есть его примерное видение и огромное желание наконец-то поработать руками. 59
  • 60. У прототипа есть сразу несколько задач, которые делают его одним из самых полезных этапов работы над продуктом. — лучше понять проблему и пользователя; — подумать руками, опробовав идею на практике; — подготовиться к тестированию; — вдохновить других людей идеей продукта. 60
  • 61. Важная задача прототипирования – отбрасывание не подходящих концепций. Можно проверить идеи на практике задешево, а сама методология поощряет ошибки – мы учимся и лучше понимаем проблему. 61
  • 62. Прототип может отражать одну или несколько граней продукта. Мы делаем массовый сервис, а значит у него есть потребители и контекст использования, а также владельцы и процесс обслуживания. 62
  • 63. Можно показывать внешний вид продукта – на что 1 он похож, как выглядит. 63
  • 64. Можно показывать принцип работы продукта – как 2 он выполняет свою основную задачу, возможно ли это технически. 64
  • 65. Можно показывать процесс взаимодействия 3 пользователя с продуктом – как это происходит, по каким сценариям. 65
  • 66. Перед созданием прототипа необходимо определить, какие из граней продукта мы будем проверять с его помощью. Лучше сконцентрироваться на одной – так проще проверять и улучшать изолированный аспект. 66
  • 67. Рабочим материалом может быть все что угодно. Тренеры принесли нам кучу ненужного на вид хлама – мячики, канцелярские принадлежности, игрушки и т.п. Но это не помешало делать из них быстро интересные и понятные при хорошем презентации вещи. 67
  • 68. Мы выбрали две наиболее интересные идеи и разделились на подкоманды. Наша тройка взяла концепцию «Страна All-Inclusive» – остров с массой развлечений, где все бесплатно после покупки тура. — Страна All-Inclusive; — Лотерея путешествий- квестов. 68
  • 69. В качестве прототипа мы решили сделать карту этого острова. В ходе работы воспользовались методами, опробованными на предыдущих этапах. 1. С помощью брейншторма определили набор мест и заведений. Многие из идей пришли из интервью с пользователями. 2. Сгруппировали заведения по тематическим зонам, назвав их странами и городами. 3. Проработали схемы перемещения между городами, сделав их отдельным способом развлечения. 4. Продумали, как туристы будут добираться на остров и уезжать оттуда. 69
  • 70. Через несколько итераций обсуждений и доработок получилась достаточно продуманная карта, которая наглядно показала нашу идею и была готова к показу потенциальным потребителям. 70
  • 71. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 72. 5 Test 72
  • 73. Финальный этап – тестирование получившегося продукта. Нужно понять, насколько хорошо он решает проблему пользователя и если нужно – подкрутить решение. 73
  • 74. Корректировки может потребовать сама постановка проблемы. Но методология предполагает постоянный пересмотр исходных установок. Важно выдать не просто продукт, а решение реальной потребности. что мы видим и слышим как мы ощущаем то, что чувствует пользователь 74
  • 75. Существует множество методов проверки решений на соответствие потребностям пользователей. В нашей работе это один набор, тренеры привели для примера следующий список: 1. Фокус-группы 2. Юзабилити-центры 3. Веб-аналитика 4. Бета-тестирование 5. Обеды с клиентами 6. Пре-релизы 7. Опросы 75
  • 76. Для тестирования нашего прототипа мы приглашали условных пользователей, которые пытались решить с его помощью проблему нашего персонажа. Есть ряд нюансов в этом процессе. 76
  • 77. Пользователь должен сам пройтись по прототипу, 1 прочувствовать его. Для этого нужно кратко презентовать продукт и дать респонденту вводную. Но вести его за руку по всем шагам не стоит. 77
  • 78. Стоит запоминать все, что пользователь делал с 2 продуктом – и то идеи что поняты сразу, и то что требовало пояснений. Это говорит о сильных и слабых сторонах концепции. 78
  • 79. Улучшать прототип можно прямо по ходу 3 тестирования. Это ускоряет процесс доработки продукта и дает возможность что-то уточнить у пользователя здесь и сейчас. 79
  • 80. Изначально мы решили проверить, насколько пользователям подходит набор развлечений на острове, интересны и комфортны ли способы перемещения между ними. 80
  • 81. Но вскоре пришлось подумать о продажах и маркетинге продукта. А помимо карты были созданы билеты, буклеты, промо-материалы и другие вспомогательные артефакты. 81
  • 82. В итоге мы проверили и проработали сразу несколько граней продукта – и внешний вид, и механизм работы, и взаимодействие с ним. 82
  • 83. Нам повезло – прототип отлично подошел к POV и описание проблемы корректировать не пришлось. Хотя на разогревочной задаче такое случилось и это нормально для методологии. 83
  • 84. Я много читал о методике быстрого прототипирования+тестирования и давно использую ее первую составляющую, но все никак не получалось попробовать на практике всю связку. И зря. 84
  • 85. Скорость совершенствования продукта в таком подходе поражает. За пару часов и несколько итераций мы изменили прототип так, как обычно получается сделать только за дни и недели. 85
  • 86. Такой итеративный подход не заменяет формализованное юзабилити-тестирование. Но во многих ситуациях позволяет заметно улучшить продукт быстро и дешево. 86
  • 87. 1. О тренинге 2. Что такое Design Thinking 3. Этап 1: Empathize 4. Этап 2: Define 5. Этап 3: Ideate 6. Этап 4: Prototype 7. Этап 5: Test 8. Итоговая презентация
  • 89. Завершающая стадия тренинга – презентация получившегося продукта. Необходимо правильно рассказать о проблеме и решении. Так, чтобы аудитория поняла и хорошо приняла концепцию. 89
  • 90. В процессе работы над реальным продуктом такие презентации случаются регулярно и на каждом этапе, поэтому умение хорошо подготовить ее не менее важно в дизайн-процессе. 90
  • 91. Репетиция презентации началась с планирования рассказа. Важно понять, о чем и кому мы будем говорить, что именно и как показывать. Используется методика storytelling, которая имеет несколько плюсов. 91
  • 92. История – привычный и понятный нам способ 1 подачи информации. Она умеет вовлечь слушателя и имеет целый ряд приемов для этого. 92
  • 93. По ходу рассказа можно найти проблемы и 2 нестыковки как презентации, так и в самой концепции или прототипе. А значит еще раз улучшить наш продукт. 93
  • 94. Это сближает команду. Мы плотно работали 3 несколько дней над интересной задачей и эмоционально привязались к ней. Приятно поделиться этим с другими людьми. 94
  • 95. Хорошая история основана на персонаже и имеет много тонких и увлекательных деталей. А еще она построена по классической схеме с завязкой, развитием сюжета и кульминацией. event conflict action 95
  • 96. Эти этапы хорошо ложатся на наше исследование проблемы и поиск ее решения. POV/solution event insight conflict need action 96
  • 97. Сначала мы даем слушателям понять, кто наши 1 персонажи и какие у них потребности. Это может быть небольшая история из жизни, причем здорово, если она будет наглядно показана или разыграна. На чем сфокусировано наше решение? solution Чего не хватает Итого. Почему в их жизни? event это решение – Кто они? need лучшее? Какие у них conflict потребности? reaction user character action resolution 97
  • 98. Затем мы рассказываем о проблеме 2 пользователя, том чего не хватает в их жизни или мешает совершению чего-то важного. Так мы вызываем сопереживание этой проблеме. На чем сфокусировано наше решение? solution Чего не хватает Итого. Почему в их жизни? event это решение – Кто они? need лучшее? Какие у них conflict потребности? reaction user character action resolution 98
  • 99. Теперь можно представить решение проблемы – 3 каким мы видим его и на чем оно сфокусировано. Это кульминация нашей истории – то, ради чего мы рассказываем ее. На чем сфокусировано наше решение? solution Чего не хватает Итого. Почему в их жизни? event это решение – Кто они? need лучшее? Какие у них conflict потребности? reaction user character action resolution 99
  • 100. Финальная часть рассказа объясняет, почему это 4 решение – лучшее. Важно показать, что проблема действительно решена и наш персонаж изменит свою жизнь с помощью предложенного продукта. На чем сфокусировано наше решение? solution Чего не хватает Итого. Почему в их жизни? event это решение – Кто они? need лучшее? Какие у них conflict потребности? reaction user character action resolution 100
  • 101. Изначально мы попытались выстроить рассказ на основе процесса создания решения – с чего мы начали, как мы пришли к текущему продукту, с какими проблемами столкнулись по ходу работы. 101
  • 102. Но такой формат оказался неподходящим – нужно говорить о пользователе и его проблеме, а не команде дизайнеров. Поэтому вторая версия рассказа сфокусировалась на истории и переживаниях. 102
  • 103. В ходе обкатки презентации мы успели внести еще ряд изменений в прототип – выяснилось, что есть нестыковки в схеме работы с продуктом. Если историю нельзя легко пересказать, в ней есть проблемы. 103
  • 104. Времени на презентацию было не так много и это проблема многих тренингов – потратив два дня на задачу и эмоционально привязавшись к ней, обидно не иметь времени поделиться всем что запомнилось. 104
  • 105. Хотя сами продукты были очень интересными и необычными – от музея по ТВ для бабушек и временных капсул до квестов с лагерем подготовки вьетконговцев и мобильных приложений. 105
  • 106. Что мы вынесли из тренинга? What: What do you want to bring back from d.school How: bootcamp? What: What do you want to infuse into your team from the How: bootcamp experience? What: Which projects will you advance with Design How: thinking after bootcamp? 106
  • 107. Половина участников – менеджеры среднего и 1 верхнего звена, которые теперь лучше понимают, что именно мы делаем в своей работе. Нам проще общаться с ними и говорить на понятном языке. 107
  • 108. Почти никто не делал компьютерных и электронных 2 решений – это были продукты в широком смысле, часто сервисы. Mail.Ru решает повседневные задачи людей, в которых компьютер – лишь инструмент. 108
  • 109. Способы фильтрации результатов брейншторма 3 позволяют превратить их из просто приятного времяпрепровождения в мощнейший инструмент поиска новых решений. 109
  • 110. Правило про низковисящие фрукты особенно важно 4 для инновационных продуктов. Переосмысливать не только решение, но и саму проблему, не останавливаясь на ее простейшем понимании. 110
  • 111. По завершению презентаций тренеры обсудили с нами способы использования полученных знаний на практике. Получилось несколько направлений, в которых можно двигаться. 1. Использование рабочего пространства. 2. Команда должна быть более видимой для пользователей. 3. Вид обновленного дизайн-процесса. 4. Частые быстрые эксперименты. 5. Новые способы взаимодействия. 6. Наиболее важное для улучшения процесса изменение процесса. 111
  • 112. Было приятно видеть вас! Вопросы? Юрий Ветров www.jvetrau.com twitter.com/jvetrau www.mail.ru facebook.com/pages/MailRu Все иллюстрации, использованные в данной презентации, принадлежат их уважаемым владельцам. В случае, если вы являетесь их правообладателем и против размещения этих иллюстраций – напишите, пожалуйста, письмо по адресу jvetrau@gmail.com и я уберу их из слайдов.

Editor's Notes

  1. ©Mail.Ru
  2. © http://theoryandpractice.ru/seminars/19375-proektnoe-myshlenie-13-9
  3. © http://wildwashington.com/leavenworth-the-best-bavarian-holiday-town-in-the-northwest-usa/
  4. © Yury Vetrov
  5. ©Mail.Ru
  6. © http://www.designsojourn.com/sign-up-for-our-an-introduction-to-design-thinking-workshop-now/
  7. © http://www.pferdt.de/archives/572
  8. © http://www.pferdt.de/archives/572
  9. © ?
  10. © http://prolifeintn.blogspot.com/2011_08_01_archive.html
  11. © http://embraceglobal.org/
  12. © ?
  13. © Stanford d.School
  14. © http://informationalgeometry.blogspot.com/2009/09/new-updated-studioroomcom.html
  15. © Stanford d.School
  16. © ?
  17. © Stanford d.School
  18. © Stanford d.School
  19. © Stanford d.School
  20. © Yury Vetrov
  21. © Stanford d.School
  22. © ?
  23. © http://www.designthinkingmap.com/
  24. ©Mail.Ru
  25. © http://foto.rambler.ru/cameras/5549/4e7f281c-78f5-1674-cd94-5c7aab35165b/
  26. © http://korolevanepala.livejournal.com/113595.html
  27. © http://max-kostrov.livejournal.com/7883.html
  28. © http://berkanacollaborative.org/category/intergenerational/
  29. © Stanford d.School
  30. © Stanford d.School
  31. © Stanford d.School
  32. ©Mail.Ru
  33. © Stanford d.School
  34. ©Mail.Ru
  35. © Stanford d.School
  36. © Stanford d.School
  37. © Stanford d.School
  38. © Yury Vetrov
  39. © ?
  40. © Stanford d.School
  41. http://www.uie.com/articles/kj_technique/
  42. © Stanford d.School
  43. © Yury Vetrov
  44. © Yury Vetrov
  45. © Stanford d.School
  46. © ?
  47. © Stanford d.School
  48. © Stanford d.School
  49. © ?
  50. © ?
  51. © ?
  52. ©Mail.Ru
  53. ©Mail.Ru
  54. © Yury Vetrov
  55. © Stanford d.School
  56. © ?
  57. © Stanford d.School
  58. ©Mail.Ru
  59. ©Mail.Ru
  60. ©Mail.Ru
  61. ©Mail.Ru
  62. © http://larcodesign.blogspot.com/2010/12/travel-booklet-series.html
  63. ©Mail.Ru
  64. © ?
  65. ©Mail.Ru
  66. © http://moodle.epfl.ch/course/view.php?id=6881
  67. © http://www.adaptivepath.com/
  68. © http://www.u-sentric.com/services/usability-testing
  69. © Stanford d.School
  70. ©Mail.Ru
  71. ©Mail.Ru
  72. © http://www.hannahweptsarahlaughed.com/2011/08/the-storyteller-within-us/
  73. © http://talkstreetsmart.com/2011/12/15/transmedia-storytelling-how-it-matters-to-your-brand/
  74. ©Mail.Ru
  75. ©Mail.Ru
  76. © Stanford d.School
  77. © Stanford d.School
  78. © Stanford d.School
  79. © Stanford d.School
  80. © Stanford d.School
  81. © Stanford d.School
  82. © Yury Vetrov
  83. © Yury Vetrov
  84. © Yury Vetrov
  85. ©Mail.Ru
  86. © Yury Vetrov
  87. ©Mail.Ru
  88. © Yury Vetrov
  89. ©Mail.Ru
  90. © Yury Vetrov