SlideShare a Scribd company logo
1 of 104
Download to read offline
Создаем
востребованные продукты
С чего начать и к чему стремиться
Азбука
дизайн-мышления
UX и UI
UI — средство взаимодействия с
объектом (инструментом, digital-
продуктом, everyday thing)
Средствами посыла и возврата
информации
ввод/вывод, управление/обратная связь
UI — средство взаимодействия с
объектом (инструментом, digital-
продуктом, everyday thing)
Характеризуется
UX — опыт человека,
предшествующий, сопровождающий
и оставшийся после взаимодействия
с продуктом.
UX — опыт человека,
предшествующий, сопровождающий
и оставшийся после взаимодействия
с продуктом.
UX — опыт человека,
предшествующий, сопровождающий
и оставшийся после взаимодействия
с продуктом.
Эмоции, знания, навыки…
жизнь, короче:)
Дизайн-мышление — это методика
создания нового UX…
Дзен
Дизайн-мышление — это методика
создания нового UX…
… который лучше, чем старый UX.
Дзен
UX UX
Пользователь
Опыт
1
Следующие 3 буквы
М
Ж
П
МЖП
MVP
MVP
Minimal Viable Product
Принцип создания MVP
Продукт
2
Знакомьтесь, пользователи!
Факты о пользователях
• Они разные!
Факты о пользователях
• Они разные!
• Они не такие как я!
Факты о пользователях
• Они разные!
• Они не такие как я!
• Они могут хотеть ненужные вещи.
Факты о пользователях
• Они разные!
• Они не такие как я!
• Они могут хотеть ненужные вещи.
• Они могут не догадываться, что им нужно
на самом деле.
Факты о пользователях
• Кто будет пользоваться продуктом?
Важно определить
• Кто будет пользоваться продуктом?
• Кто точно не будет им пользоваться?
Важно определить
• Кто будет пользоваться продуктом?
• Кто точно не будет им пользоваться?
• Что сделает их жизнь хотя бы чуточку легче
и светлее?
Важно определить
Аудитория
3
ОПА
3
21
Аудитория
Опыт Продукт
Методика
дизайн-мышления
А нужен ли продукт?
1. Изучайте аудиторию
и текущий UX
Дизайн-исследования
Эмпатия — понимание
эмоционального состояния другого
человека посредством сопереживания,
проникновения в его субъективный мир.
Карта эмпатии
UX: дорога до работы
Дизайн-исследование
• Как вы сейчас добираетесь до работы?
• Зачем вы это делаете? (5-10 зачем и почему)
• Что вы слышите и видите по пути на работу?
• Как себя ощущаете? Тело выдерживает дорогу?
• Нравится проводить время в дороге? Страшно?
Бесит? Какой был ваш самый лучший путь на
работу?
Карта эмпатии
Исследуйте сами
• Наблюдайте
• Общайтесь
• Проживите сами опыт пользователей
• Изучите вторичные исследования
Исследуйте сами
• Наблюдайте
• Общайтесь
• Проживите сами опыт пользователей
• Изучите вторичные исследования
Конспектируйте!
Соберите результаты
• Выделите 1-3 характерных персонажа вашей
целевой аудитории (меньше — лучше)
• Заполните карту эмпатии для каждого
• Оформите записи с исследований
Что делать с собранной
информацией?
Анализировать!
Соберите всю информацию вместе
стикеры и большая доска/стена в помощь!
Соберите всю команду вместе
обсуждайте, делитесь находками, ловите озарения
Кстати, о команде
Кстати, о команде
• Командой работать
продуктивнее;
Кстати, о команде
• Командой работать
продуктивнее;
• 3-5 человек — оптимальный
размер команды для дизайн-
мышления;
Кстати, о команде
• Командой работать
продуктивнее;
• 3-5 человек — оптимальный
размер команды для дизайн-
мышления;
• Разнопрофильная команда
— хорошо!
Кстати, о команде
• Командой работать
продуктивнее;
• 3-5 человек — оптимальный
размер команды для дизайн-
мышления;
• Разнопрофильная команда
— хорошо!
Дизайнеры, программисты,
тестировщики, уборщица, мама,
директор, сейлз, ученые, студенты,
школьники и т.д.
Роли в команде
1. Продюсер-руководитель
2. Психолог-фасилитатор
Выслушав меня, мой психолог записался к своему
3. Программист
4. Дизайнер
5. Исследователь-эмпат
Соберите всю команду вместе
обсуждайте, делитесь находками, ловите озарения
2. Сфокусируйтесь
Выберите одного персонажа
и сделайте его счастливым
Как мы можем помочь [имя
персонажа] [решить проблему]
так, чтобы (потому что)
[озарение!]
Сформулируйте задачу
Решая 1 боль 1 персонажа на
основе 1 озарения, можно прийти к
решению более широкой проблемы
и получить +10 новых озарений!
Решая 1 боль 1 персонажа на
основе 1 озарения, можно прийти к
решению более широкой проблемы
и получить +10 новых озарений!
а ещё в короткие сроки создать
рабочий сервис (MVP)
Формулировка задачи
— 50% решения!
3. Генерируйте идеи
Главный принцип
Принципы работы с идеями
• Мозгоштурм отдельно, критика отдельно!
• Всегда говори «Да, и…!»
• Записывайте идеи на стикеры и выбирайте
командой
• Выберите идеи для MVP и…
4. Проектируйте
Первые итерации
можно рисовать/лепить
что угодно!
Проектируйте, чтобы
• Быстро проверить гипотезы
• Недорого ошибиться и начать сначала
• Донести свои идеи до команды
• Сгенерировать вместе новые идеи
Инструменты UI
• Бумага и карандаш/доска и фломастеры
• Balsamiq Mockups
• Axure
• proto.io
5. Тестируйте…
… и дорабатывайте!
Резюме
Дизайн-мышление
Эмпатия
Фокусировка
Генерация
идей
Выбор
идеи
Прототипирование
Тест
Q&A time!
Почитать
• Стив Круг «Не заставляйте меня думать» (переиздание)
• Jeff Gothelf «Lean UX»
• http://tilda.education/courses/web-design/designthinking/
• UX гайдлайны iOS и Android
• 10 must read UX books
• Как писать заголовки (Максим Ильяхов)
Ещё осталось время?
Психофизиология
особенности человеческого восприятия
Правило 7 +/- 2
Меньше — лучше!
Геометрическая память
Бессознательные действия
Группировка объектов
Подобное притягивает подобное
Контраст объекта
Обратите внимание на меня!
Читаемость текста
Картинки быстрее проникают в мозг
Пример UI
Tech Talks @NSU: Lean UX и Design Thinking: как создавать востребованные продукты
Tech Talks @NSU: Lean UX и Design Thinking: как создавать востребованные продукты

More Related Content

Viewers also liked

Customer Journey Map для e-commerce
Customer Journey Map для e-commerceCustomer Journey Map для e-commerce
Customer Journey Map для e-commerce
Usabilitylab
 
Customer journey map: главный инструмент проектировщика услуг
Customer journey map: главный инструмент проектировщика услугCustomer journey map: главный инструмент проектировщика услуг
Customer journey map: главный инструмент проектировщика услуг
Alexey Kopylov
 
Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...
Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...
Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...
Content Strategy Workshops
 
Aligning Your Marketing Team and Strategy with the Modern Customer Journey
Aligning Your Marketing Team and Strategy with the Modern Customer JourneyAligning Your Marketing Team and Strategy with the Modern Customer Journey
Aligning Your Marketing Team and Strategy with the Modern Customer Journey
Gary DeAsi
 
A publicar
A publicarA publicar
A publicar
mamefle
 
Aνθρώπινα Δικαιώματα
Aνθρώπινα ΔικαιώματαAνθρώπινα Δικαιώματα
Aνθρώπινα Δικαιώματα
katpapado
 

Viewers also liked (20)

SMMvoini3
SMMvoini3SMMvoini3
SMMvoini3
 
Customer Journey Map для e-commerce
Customer Journey Map для e-commerceCustomer Journey Map для e-commerce
Customer Journey Map для e-commerce
 
Customer Journey Map (CJM) - расширяем сознание и горизонт наших услуг. Макси...
Customer Journey Map (CJM) - расширяем сознание и горизонт наших услуг. Макси...Customer Journey Map (CJM) - расширяем сознание и горизонт наших услуг. Макси...
Customer Journey Map (CJM) - расширяем сознание и горизонт наших услуг. Макси...
 
Customer journey map: главный инструмент проектировщика услуг
Customer journey map: главный инструмент проектировщика услугCustomer journey map: главный инструмент проектировщика услуг
Customer journey map: главный инструмент проектировщика услуг
 
Digital Customer Journey
Digital Customer JourneyDigital Customer Journey
Digital Customer Journey
 
Customer Journey
Customer JourneyCustomer Journey
Customer Journey
 
Tips to get more customers - range of products and customer journey for reta...
Tips to get more customers - range of products and  customer journey for reta...Tips to get more customers - range of products and  customer journey for reta...
Tips to get more customers - range of products and customer journey for reta...
 
Интегрированные Рекламные Кампании - Часть I. Лекция 1.
Интегрированные Рекламные Кампании - Часть I. Лекция 1.Интегрированные Рекламные Кампании - Часть I. Лекция 1.
Интегрированные Рекламные Кампании - Часть I. Лекция 1.
 
Building A Successful Digital Customer Journey
Building A Successful Digital Customer JourneyBuilding A Successful Digital Customer Journey
Building A Successful Digital Customer Journey
 
Customer journey, пиратские метрики и лестница узнавания
Customer journey, пиратские метрики и лестница узнаванияCustomer journey, пиратские метрики и лестница узнавания
Customer journey, пиратские метрики и лестница узнавания
 
Customer Journey. Dlaczego warto mapować?
Customer Journey. Dlaczego warto mapować?Customer Journey. Dlaczego warto mapować?
Customer Journey. Dlaczego warto mapować?
 
Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...
Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...
Personalization, Customer Journey, Omnichannel: A How-to Approach with Kevin ...
 
Customer Journey Map in B2B projects
Customer Journey Map in B2B projectsCustomer Journey Map in B2B projects
Customer Journey Map in B2B projects
 
Customer Journey Mapping
Customer Journey MappingCustomer Journey Mapping
Customer Journey Mapping
 
Aligning Your Marketing Team and Strategy with the Modern Customer Journey
Aligning Your Marketing Team and Strategy with the Modern Customer JourneyAligning Your Marketing Team and Strategy with the Modern Customer Journey
Aligning Your Marketing Team and Strategy with the Modern Customer Journey
 
The Digital Customer Journey
The Digital Customer JourneyThe Digital Customer Journey
The Digital Customer Journey
 
Prasines
PrasinesPrasines
Prasines
 
A publicar
A publicarA publicar
A publicar
 
Aνθρώπινα Δικαιώματα
Aνθρώπινα ΔικαιώματαAνθρώπινα Δικαιώματα
Aνθρώπινα Δικαιώματα
 
Philips obws1
Philips obws1Philips obws1
Philips obws1
 

More from Tech Talks @NSU

Tech Talks @NSU: Путь студента в IT-бизнес
Tech Talks @NSU: Путь студента в IT-бизнесTech Talks @NSU: Путь студента в IT-бизнес
Tech Talks @NSU: Путь студента в IT-бизнес
Tech Talks @NSU
 
Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...
Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...
Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...
Tech Talks @NSU
 
Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»
Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»
Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»
Tech Talks @NSU
 
Back to the Future: Функциональное программирование вчера и сегодня
Back to the Future: Функциональное программирование вчера и сегодняBack to the Future: Функциональное программирование вчера и сегодня
Back to the Future: Функциональное программирование вчера и сегодня
Tech Talks @NSU
 
Что такое Highload? Секреты высокой нагрузки
Что такое Highload? Секреты высокой нагрузкиЧто такое Highload? Секреты высокой нагрузки
Что такое Highload? Секреты высокой нагрузки
Tech Talks @NSU
 
AOT-компиляция Java
AOT-компиляция JavaAOT-компиляция Java
AOT-компиляция Java
Tech Talks @NSU
 
Защита от атак по сторонним каналам
Защита от атак по сторонним каналамЗащита от атак по сторонним каналам
Защита от атак по сторонним каналам
Tech Talks @NSU
 
Тестировщик: ожидание vs. реальность
Тестировщик: ожидание vs. реальностьТестировщик: ожидание vs. реальность
Тестировщик: ожидание vs. реальность
Tech Talks @NSU
 
Гибкие методологии разработки ПО в реальном мире
 Гибкие методологии разработки ПО в реальном мире Гибкие методологии разработки ПО в реальном мире
Гибкие методологии разработки ПО в реальном мире
Tech Talks @NSU
 

More from Tech Talks @NSU (20)

Tech Talks @NSU: Путь студента в IT-бизнес
Tech Talks @NSU: Путь студента в IT-бизнесTech Talks @NSU: Путь студента в IT-бизнес
Tech Talks @NSU: Путь студента в IT-бизнес
 
Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...
Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...
Tech Talks @NSU: Стажировки в американских IT-компаниях. Как стать стажером, ...
 
Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»
Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»
Tech Talks @NSU: Как живется преподавателю Computer Science у «нас» и у «них»
 
Back to the Future: Функциональное программирование вчера и сегодня
Back to the Future: Функциональное программирование вчера и сегодняBack to the Future: Функциональное программирование вчера и сегодня
Back to the Future: Функциональное программирование вчера и сегодня
 
Что такое Highload? Секреты высокой нагрузки
Что такое Highload? Секреты высокой нагрузкиЧто такое Highload? Секреты высокой нагрузки
Что такое Highload? Секреты высокой нагрузки
 
Автоматическое доказательство теорем
Автоматическое доказательство теоремАвтоматическое доказательство теорем
Автоматическое доказательство теорем
 
AOT-компиляция Java
AOT-компиляция JavaAOT-компиляция Java
AOT-компиляция Java
 
Защита от атак по сторонним каналам
Защита от атак по сторонним каналамЗащита от атак по сторонним каналам
Защита от атак по сторонним каналам
 
Как приручить дракона: введение в LLVM
Как приручить дракона: введение в LLVMКак приручить дракона: введение в LLVM
Как приручить дракона: введение в LLVM
 
Тестировщик: ожидание vs. реальность
Тестировщик: ожидание vs. реальностьТестировщик: ожидание vs. реальность
Тестировщик: ожидание vs. реальность
 
Гибкие методологии разработки ПО в реальном мире
 Гибкие методологии разработки ПО в реальном мире Гибкие методологии разработки ПО в реальном мире
Гибкие методологии разработки ПО в реальном мире
 
Tech Talks @NSU: Что есть QA и как в него попасть
Tech Talks @NSU: Что есть QA и как в него попастьTech Talks @NSU: Что есть QA и как в него попасть
Tech Talks @NSU: Что есть QA и как в него попасть
 
Tech Talks @NSU: Технологии кросс-платформенной разработки мобильных бизнес-п...
Tech Talks @NSU: Технологии кросс-платформенной разработки мобильных бизнес-п...Tech Talks @NSU: Технологии кросс-платформенной разработки мобильных бизнес-п...
Tech Talks @NSU: Технологии кросс-платформенной разработки мобильных бизнес-п...
 
Tech Talks @NSU: DLang: возможности языка и его применение
Tech Talks @NSU: DLang: возможности языка и его применениеTech Talks @NSU: DLang: возможности языка и его применение
Tech Talks @NSU: DLang: возможности языка и его применение
 
Tech Talks @NSU: Рассказ о разных профессиях в IT-индустрии, или почему не вс...
Tech Talks @NSU: Рассказ о разных профессиях в IT-индустрии, или почему не вс...Tech Talks @NSU: Рассказ о разных профессиях в IT-индустрии, или почему не вс...
Tech Talks @NSU: Рассказ о разных профессиях в IT-индустрии, или почему не вс...
 
Tech Talks @NSU: Что такое работа в техподдержке: тяжело ли живётся саппортеру
Tech Talks @NSU: Что такое работа в техподдержке: тяжело ли живётся саппортеруTech Talks @NSU: Что такое работа в техподдержке: тяжело ли живётся саппортеру
Tech Talks @NSU: Что такое работа в техподдержке: тяжело ли живётся саппортеру
 
Tech Talks @NSU: Как олимпиадное программирование не испортило мою жизнь, а т...
Tech Talks @NSU: Как олимпиадное программирование не испортило мою жизнь, а т...Tech Talks @NSU: Как олимпиадное программирование не испортило мою жизнь, а т...
Tech Talks @NSU: Как олимпиадное программирование не испортило мою жизнь, а т...
 
Tech Talks @NSU: Организация тестирования в IT-компаниях Академгородка. Карье...
Tech Talks @NSU: Организация тестирования в IT-компаниях Академгородка. Карье...Tech Talks @NSU: Организация тестирования в IT-компаниях Академгородка. Карье...
Tech Talks @NSU: Организация тестирования в IT-компаниях Академгородка. Карье...
 
Tech Talks @NSU: Мир open source — мир возможностей
Tech Talks @NSU: Мир open source — мир возможностейTech Talks @NSU: Мир open source — мир возможностей
Tech Talks @NSU: Мир open source — мир возможностей
 
Tech Talks @NSU: Методологии разработки ПО. Что на самом деле скрывается за с...
Tech Talks @NSU: Методологии разработки ПО. Что на самом деле скрывается за с...Tech Talks @NSU: Методологии разработки ПО. Что на самом деле скрывается за с...
Tech Talks @NSU: Методологии разработки ПО. Что на самом деле скрывается за с...
 

Tech Talks @NSU: Lean UX и Design Thinking: как создавать востребованные продукты