SlideShare a Scribd company logo
U X & U I . П Р О Д У К Т О В Ы Й Д И З А Й Н Д Е Н Ь
Дмитрий Осадчук
UXD ПРОЦЕСС
LEAN UX,
УРОВНИ UX
01
Lean UX, Уровни UX, UXD процесс
iOSSmartTV Android Watch UI Oculus VR
SAP UI5MetroUI SiteCore Sharepoint
HybrisHTML5 WebSphere Bootstrap …
ОБИЛИЕ ТЕХНОЛОГИЙ
И ПЛАТФОРМ
Артемий Лебедев
В любую секунду любой проект готов на 100%, хотя проработанность может быть и
на 4%.
В зависимости от имеющегося времени проект можно прорабатывать до пикселя, а
можно оставить на стадии концептуальной зарисовки.
Раньше автор прорабатывал проекты на 97%. Оптимизировал картинки, подгонял
микроны и шлифовал поверхности. Теперь автор получает удовольствие от того, что
почти любую дизайнерскую задачу умеет решать за время формулирования задачи.
То есть, когда клиент закончил рассказывать, что ему нужно, у нас уже есть решение.
Получается, что время тратится только на нужную степень прожарки, а общий вид
стейка всегда ясен.
§ 167. МЕТОД
ПРОГРЕССИВНОГО
ДЖИПЕГА
26 ноября 2010
Lean UX, Уровни UX, UXD процесс
«5 уровней опыта
взаимодействия»
Джесс Гарретт
Джесси Джеймс Гаррет
Один из основателей компании Adaptive Path (UX-
консультации), Сан-Франциско.
«Авария на дороге. Она произошла из-за того, что водитель на
секунду отвлёкся, чтобы убавить громкость радиоприемника.
Ему пришлось отвести взгляд от дороги, так как на ощупь
отличить ручку громкости от других невозможно.».
ОПЫТ
ВЗАИМОДЕЙСТВИЯ
Контекст использования это ситуация в которой пользователь
взаимодействует с сайтом/объектом/системой. И 
действительно, в машине за рулём контекст использования
даже простого телефона совершенно другой нежели дома на 
диване. Это очень важный момент над которым стоит думать
при проектировании чего-либо.
КОНТЕКСТ
ИСПОЛЬЗОВАНИЯ
User experience (пользовательский опыт) определяется
использованием и поведением продукта в реальном мире. UX
имеет решающее значение для успеха сайта. Если ваши
пользователи не имеют положительного опыта взаимодействия
с вашим сайтом, вероятность того, что они вернутся,
значительно снижается.
Признавая этот важный факт, автор пишет: «Весь опыт
взаимодействия должен быть результатом сознательного
решения с вашей стороны». Это означает, что: «Нужно
принимать во внимание все возможности, каждое действие,
которое может совершить пользователь и понимать ожидания
пользователей на каждом шагу, на протяжении всего
процесса.»
ПОЛЬЗОВАТЕЛЬСКИЙ
ОПЫТ
5Уровней опыта
взаимодействия
1. Поверхность
Уровень поверхности представляет собой
внешний вид продукта с точки зрения конечного
пользователя, то есть набор текста, картинок,
ссылок, форм, вкладок, кнопок и прочего. Проще
говоря графический дизайн сайта.
2. Компоновка
Под поверхностью находится уровень компоновки,
представляющей конкретную реализацию
абстрактной структуры продукта. На этом уровне
решаются вопросы наиболее эффективного
расположения различных элементов UI.
Компановка это прототипирование. Расположение
кнопок, вкладок, фотографий и текстовых блоков.
Компоновка проектируется так, чтобы организация
этих элементов была максимально эффектной
и эффективной, то есть чтобы вы запомнили
логотип и смогли найти кнопку с корзиной, когда
она понадобится.
3. Структура
Структура определяет, как пользователи попадают
на страницу и куда они могут направиться дальше.
Описывается взаимное расположение страниц
веб-сайта, программных форм, окон и др. То есть
он отвечает на вопросы “откуда”, “куда” и “как”
сможет перемещаться пользователь. Эффективная
структура облегчает навигацию и делает её
интуитивно понятной для пользователей.
4. Набор возможностей
Уровень набора возможностей представляет из
себя простое перечисление набора
функциональных возможностей, которые будут
доступны для пользователей. Способ реализации и
взаимной организации этих возможностей будет
описан детальнее уже на уровне структуры.
Перечисление функциональных возможностей
образует уровень набора возможностей сайта.
Некоторые сайты, торгующие книгами, позволяют
пользователям сохранять адрес, чтобы не
пришлось указывать его повторно. Вопрос,
включена ли эта (или любая другая) функция в
список функций сайта, как раз относится к
возможностям сайта.
5. Стратегия
Стратегия включает в себя не только то, что хотят
получить от сайта его владельцы, но и то, что хотят
получить пользователи (цели и потребности
пользователя).
Самый глубокий и наиболее абстрактный уровень
представленной модели. На этом уровне
необходимо получить ответы на вопросы,
касающиеся желаний и ожиданий относительно
будущего программного продукта, как со стороны
потенциальных пользователей, так и заказчика.
Ответы на эти вопросы будут сформированы и
представлены в виде конкретного списка на
уровне набора возможностей.
Диапазон решений
Выбранное решение
Решения на следующем уровне только после предыдущего
Взаимосвязь уровней
Эти уровни являются взаимосвязанными и
взаимозависимыми. Каждый следующий выбор
ограничивает наш следующий уровень. Начиная с
более абстрактных понятий (стратегия и
планирование) мы постепенно приходим к более
конкретным понятиям (визуальное оформление).
Гаррет определяет проблемы, влияющие на опыт
взаимодействия на каждом этапе.
Решения принятые на нижних уровнях нельзя
считать железобетонными и их можно подвергать
переоценке если того требуют верхние уровни. И
так же переходить к верхним уровням желательно
когда у вас есть база в виде нижних уровней.
Гибкость методологии, все дела.
Этапы
Общие результаты окажутся
неудовлетворительными, если
начинать следующий этап только
когда закончится предыдущий.
Общий прогресс получается
быстрее и правильнее если
работка на каждом уровне
заканчивается до того, как
заканчивается на следующем.
Lean UX, Уровни UX, UXD процесс
MVP (от англ. minimum viable product — минимально жизнеспособный продукт) —
простейший работающий прототип продукта, которым тестируют спрос до
полномасштабной разработки. Такой подход страхует предпринимателя от
невостребованности конечного продукта и потери потраченных на разработку
ресурсов. MVP позволяет минимальными усилиями собрать информацию, чтобы
доработать продукт под запросы целевой аудитории или вовсе от него отказаться.
Самое сложное в разработке MVP — найти оптимальное соотношение затрат и
качества.
MVP
— MINIMAL VIABLE PRODUCT
Сложность MVP зависит от продукта — в некоторых случаях, достаточно провести
кампанию в AdWords или Директ, а в некоторых обязательна разработка рабочего
прототипа. Для тестирования гипотез путем получения информации от
пользователей могут быть использованы следующие инструменты и техники:
Интервью.
Beta landing page.
Сплит-тесты.
Рекламные кампании.
Краудфандинг.
Демонстрационные видео.
Блог.
Цифровой прототип.
Бумажный прототип.
Однофункциональный продукт.
Страница предзаказа.
ТЕСТИРОВАНИЕ MVP
Lean UX, Уровни UX, UXD процесс
Lean UX, Уровни UX, UXD процесс
Lean UX, Уровни UX, UXD процесс
- Интервью с любыми людьми. Вы сразу поймете, есть ли рынок для вашего продукта.
Если ваш продукт для специфической аудитории — расспросите ее.
- Создайте блог или страничку в Facebook, посмотрите, как реагирует аудитория,
много ли у вас читателей, сколько людей ставят лайки и т.д.
- Воспользуйтесь сервисом Quora — задайте там вопрос.
- Сделайте презентацию, покажите ее знакомым, доработайте. Вы можете отправить
ее нескольким инвесторам и собрать от них фидбек.
- Сделайте простую Landing Page c формой регистрации, посмотрите, сколько
наберется регистраций, привлекает ли ваша идея много людей?
- Поговорите с потенциальными клиентами на предмет «За что вы готовы были бы
платить». Можно сделать небольшую демонстрацию продукта перед аудиторией или
даже начать кампанию на Kickstarter (или на русском аналоге).
ПРИМЕРЫ MPV
Lean UX, Уровни UX, UXD процесс
Закон Парето
Drew Manning
Принципы бережливого UX-дизайна
Когда мы следуем методу тощего UX-дизайна, есть несколько
моментов, на которые стоит обратить внимание:
Мы понимаем целевую аудиторию и ее проблемы.
Мы создаем MVP (Minimum Viable Product — минимально
жизнеспособный продукт).
Мы работаем короткими итерациями.
Мы постоянно тестируем нововведения на пользователях и,
если что-то не так, быстро откатываемся.
Мы работаем командой: UX-проектировщики, дизайнеры,
разработчики и тестировщики работают вместе и постоянно
обмениваются мнениями и задачами.
ОТ MVP К LEAN UX
Как происходит работа с минимально жизнеспособным продуктом, с
MVP? Мы берминимально жизнеспособный продукт и постепенно на него
наращиваем мясо, мышцы, жир — новые функции и свойства.
Если мы работаем по бережливому принципу с минимально
жизнеспособным продуктом, мы должны:
Сформулировать видение продукта.
Сформулировать бизнес-задачи.
Сформулировать роли пользователей, понять их задачи и цели.
Соорудить прототип продукта.
Протестировать его.
Начать всё заново.
КАК РАБОТАТЬ С MVP
Спасибо за внимание
и понимание.

More Related Content

Viewers also liked

Сайдпроекты БВШД 2016
Сайдпроекты БВШД 2016Сайдпроекты БВШД 2016
Сайдпроекты БВШД 2016
Igor Silkin
 
Ожидания от продукта
Ожидания от продуктаОжидания от продукта
Ожидания от продукта
Ivan Mikhailov
 
UX Research для интенсива UX&UI Британская Школа Дизайна
UX Research для интенсива UX&UI Британская Школа ДизайнаUX Research для интенсива UX&UI Британская Школа Дизайна
UX Research для интенсива UX&UI Британская Школа Дизайна
Ksenia Sternina
 
BHSD - Systematic design process
BHSD - Systematic design processBHSD - Systematic design process
BHSD - Systematic design process
Andrew Sundiev
 
Основы быстрого прототипирования
Основы быстрого прототипированияОсновы быстрого прототипирования
Основы быстрого прототипирования
Mitya Osadchuk
 
Design. Mobile.
Design. Mobile.Design. Mobile.
Design. Mobile.
Slava Yashkov
 
Дизайн в хаосе
Дизайн в хаосеДизайн в хаосе
Дизайн в хаосе
Artur Kasimov
 
Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...
Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...
Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...
Yury Vetrov
 
WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...
WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...
WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...
Yury Vetrov
 
Sketch
SketchSketch
Выбор метрики
Выбор метрикиВыбор метрики
Выбор метрики
Ivan Mikhailov
 
Ponomarenko_BHSAD_Intensive_calligraphy
Ponomarenko_BHSAD_Intensive_calligraphyPonomarenko_BHSAD_Intensive_calligraphy
Ponomarenko_BHSAD_Intensive_calligraphy
Mike Ponomarenko
 
CodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуре
CodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуреCodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуре
CodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуре
Yury Vetrov
 
BHSD MAIL.RU UI/UX 2016 Single interface
BHSD MAIL.RU UI/UX 2016 Single interfaceBHSD MAIL.RU UI/UX 2016 Single interface
BHSD MAIL.RU UI/UX 2016 Single interface
Tema Gladkov
 
Анимация БВШД 2016
Анимация БВШД 2016Анимация БВШД 2016
Анимация БВШД 2016
Igor Silkin
 
BHSD - Design systems: from UI kit's to living guidelines
BHSD - Design systems: from UI kit's to living guidelinesBHSD - Design systems: from UI kit's to living guidelines
BHSD - Design systems: from UI kit's to living guidelines
Andrew Sundiev
 
BHSD MAIL.RU UI/UX 2016 Restrictions
BHSD MAIL.RU UI/UX 2016 RestrictionsBHSD MAIL.RU UI/UX 2016 Restrictions
BHSD MAIL.RU UI/UX 2016 Restrictions
Tema Gladkov
 
Юзабилити-тестирование
Юзабилити-тестирование Юзабилити-тестирование
Юзабилити-тестирование
Анна Преображенская
 
Styleguides for mobile
Styleguides for mobileStyleguides for mobile
Styleguides for mobile
Владислав Поляков
 
Design Management
Design ManagementDesign Management
Design Management
Stan Ru
 

Viewers also liked (20)

Сайдпроекты БВШД 2016
Сайдпроекты БВШД 2016Сайдпроекты БВШД 2016
Сайдпроекты БВШД 2016
 
Ожидания от продукта
Ожидания от продуктаОжидания от продукта
Ожидания от продукта
 
UX Research для интенсива UX&UI Британская Школа Дизайна
UX Research для интенсива UX&UI Британская Школа ДизайнаUX Research для интенсива UX&UI Британская Школа Дизайна
UX Research для интенсива UX&UI Британская Школа Дизайна
 
BHSD - Systematic design process
BHSD - Systematic design processBHSD - Systematic design process
BHSD - Systematic design process
 
Основы быстрого прототипирования
Основы быстрого прототипированияОсновы быстрого прототипирования
Основы быстрого прототипирования
 
Design. Mobile.
Design. Mobile.Design. Mobile.
Design. Mobile.
 
Дизайн в хаосе
Дизайн в хаосеДизайн в хаосе
Дизайн в хаосе
 
Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...
Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...
Design Weekend Ярославль 2014: Юрий Ветров — Продуктовый дизайнер. Современно...
 
WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...
WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...
WUD2011: Юрий Ветров — Design Thinking. Тренинг от Stanford d.School для Mail...
 
Sketch
SketchSketch
Sketch
 
Выбор метрики
Выбор метрикиВыбор метрики
Выбор метрики
 
Ponomarenko_BHSAD_Intensive_calligraphy
Ponomarenko_BHSAD_Intensive_calligraphyPonomarenko_BHSAD_Intensive_calligraphy
Ponomarenko_BHSAD_Intensive_calligraphy
 
CodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуре
CodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуреCodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуре
CodeFest2015: Ю.Ветров — От дизайн-команды к дизайн-культуре
 
BHSD MAIL.RU UI/UX 2016 Single interface
BHSD MAIL.RU UI/UX 2016 Single interfaceBHSD MAIL.RU UI/UX 2016 Single interface
BHSD MAIL.RU UI/UX 2016 Single interface
 
Анимация БВШД 2016
Анимация БВШД 2016Анимация БВШД 2016
Анимация БВШД 2016
 
BHSD - Design systems: from UI kit's to living guidelines
BHSD - Design systems: from UI kit's to living guidelinesBHSD - Design systems: from UI kit's to living guidelines
BHSD - Design systems: from UI kit's to living guidelines
 
BHSD MAIL.RU UI/UX 2016 Restrictions
BHSD MAIL.RU UI/UX 2016 RestrictionsBHSD MAIL.RU UI/UX 2016 Restrictions
BHSD MAIL.RU UI/UX 2016 Restrictions
 
Юзабилити-тестирование
Юзабилити-тестирование Юзабилити-тестирование
Юзабилити-тестирование
 
Styleguides for mobile
Styleguides for mobileStyleguides for mobile
Styleguides for mobile
 
Design Management
Design ManagementDesign Management
Design Management
 

Similar to Lean UX, Уровни UX, UXD процесс

UX Design Рrocess
UX Design РrocessUX Design Рrocess
UX Design Рrocess
Darya Bolhovskaya
 
SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...
SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...
SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...
Yury Vetrov
 
Как работает UX-студия. Саша Куценко, Креативный директор Aidem.
Как работает UX-студия. Саша Куценко, Креативный директор Aidem.Как работает UX-студия. Саша Куценко, Креативный директор Aidem.
Как работает UX-студия. Саша Куценко, Креативный директор Aidem.
SPECIA
 
Как работает UX-студия
Как работает UX-студияКак работает UX-студия
Как работает UX-студия
Aidem
 
Юзабилити Сайта
Юзабилити СайтаЮзабилити Сайта
Юзабилити Сайта
Dmitry Satin
 
Юзабилити сайта
Юзабилити сайтаЮзабилити сайта
Юзабилити сайта
Dmitry Satin
 
«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...
«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...
«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...
Nikita Filippov
 
«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...
«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...
«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...
Andrew Shapiro
 
User eXperience design
User eXperience designUser eXperience design
User eXperience design
New Strategies Group
 
12 простых шагов создать свое мобильное приложение
12 простых шагов создать свое мобильное приложение12 простых шагов создать свое мобильное приложение
12 простых шагов создать свое мобильное приложение
Сергей Кравец
 
Andrey Petrov P D P
Andrey Petrov P D PAndrey Petrov P D P
Andrey Petrov P D P
rit2010
 
iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”
iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”
iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”
Lviv Startup Club
 
Как работает UХ студия
Как работает UХ студияКак работает UХ студия
Как работает UХ студия
Sasha Kutsenko
 
User eXperience design - как построить сайт для пользователей, а не для себя
User eXperience design - как построить сайт для пользователей, а не для себяUser eXperience design - как построить сайт для пользователей, а не для себя
User eXperience design - как построить сайт для пользователей, а не для себя
Andrew Yaroshenko
 
Odoo 9 новый дизайн методология юзабилити
Odoo 9 новый дизайн методология юзабилитиOdoo 9 новый дизайн методология юзабилити
Odoo 9 новый дизайн методология юзабилити
pitstop-business
 
КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)
КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)
КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)
MAL Agency
 
«Место юзабилити в процессе разработки» - Артем Костенко
«Место юзабилити в процессе разработки» - Артем Костенко«Место юзабилити в процессе разработки» - Артем Костенко
«Место юзабилити в процессе разработки» - Артем Костенко
WebChallenge
 
Андрей Солоной "Как людям бизнеса работать с программистами"
Андрей Солоной "Как людям бизнеса работать с программистами"Андрей Солоной "Как людям бизнеса работать с программистами"
Андрей Солоной "Как людям бизнеса работать с программистами"
Startup_Technologies
 
Стачка! 2016: Юрий Ветров — Дизайн с выхлопом
Стачка! 2016: Юрий Ветров — Дизайн с выхлопомСтачка! 2016: Юрий Ветров — Дизайн с выхлопом
Стачка! 2016: Юрий Ветров — Дизайн с выхлопом
Yury Vetrov
 
ИКТ 03 Проектирование интерфейсов
ИКТ 03 Проектирование интерфейсовИКТ 03 Проектирование интерфейсов
ИКТ 03 Проектирование интерфейсов
Denis Korolev
 

Similar to Lean UX, Уровни UX, UXD процесс (20)

UX Design Рrocess
UX Design РrocessUX Design Рrocess
UX Design Рrocess
 
SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...
SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...
SQA Days 2009: Контроль качества интерфейсных решений на всех этапах процесса...
 
Как работает UX-студия. Саша Куценко, Креативный директор Aidem.
Как работает UX-студия. Саша Куценко, Креативный директор Aidem.Как работает UX-студия. Саша Куценко, Креативный директор Aidem.
Как работает UX-студия. Саша Куценко, Креативный директор Aidem.
 
Как работает UX-студия
Как работает UX-студияКак работает UX-студия
Как работает UX-студия
 
Юзабилити Сайта
Юзабилити СайтаЮзабилити Сайта
Юзабилити Сайта
 
Юзабилити сайта
Юзабилити сайтаЮзабилити сайта
Юзабилити сайта
 
«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...
«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...
«Шустрый дизайн: подходы к декомпозиции задач проектирования UI в Agile-коман...
 
«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...
«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...
«Шустрый» дизайн: подходы к декомпозиции проектирования взаимодействия в Agil...
 
User eXperience design
User eXperience designUser eXperience design
User eXperience design
 
12 простых шагов создать свое мобильное приложение
12 простых шагов создать свое мобильное приложение12 простых шагов создать свое мобильное приложение
12 простых шагов создать свое мобильное приложение
 
Andrey Petrov P D P
Andrey Petrov P D PAndrey Petrov P D P
Andrey Petrov P D P
 
iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”
iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”
iCamp 2015. Леонід Слов’янов “Що насправді бачить на вашому сайті відвідувач?”
 
Как работает UХ студия
Как работает UХ студияКак работает UХ студия
Как работает UХ студия
 
User eXperience design - как построить сайт для пользователей, а не для себя
User eXperience design - как построить сайт для пользователей, а не для себяUser eXperience design - как построить сайт для пользователей, а не для себя
User eXperience design - как построить сайт для пользователей, а не для себя
 
Odoo 9 новый дизайн методология юзабилити
Odoo 9 новый дизайн методология юзабилитиOdoo 9 новый дизайн методология юзабилити
Odoo 9 новый дизайн методология юзабилити
 
КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)
КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)
КАК УПРАВЛЯТЬ ДИЗАЙН-ПРОЕКТОМ (для заказчиков и исполнителей)
 
«Место юзабилити в процессе разработки» - Артем Костенко
«Место юзабилити в процессе разработки» - Артем Костенко«Место юзабилити в процессе разработки» - Артем Костенко
«Место юзабилити в процессе разработки» - Артем Костенко
 
Андрей Солоной "Как людям бизнеса работать с программистами"
Андрей Солоной "Как людям бизнеса работать с программистами"Андрей Солоной "Как людям бизнеса работать с программистами"
Андрей Солоной "Как людям бизнеса работать с программистами"
 
Стачка! 2016: Юрий Ветров — Дизайн с выхлопом
Стачка! 2016: Юрий Ветров — Дизайн с выхлопомСтачка! 2016: Юрий Ветров — Дизайн с выхлопом
Стачка! 2016: Юрий Ветров — Дизайн с выхлопом
 
ИКТ 03 Проектирование интерфейсов
ИКТ 03 Проектирование интерфейсовИКТ 03 Проектирование интерфейсов
ИКТ 03 Проектирование интерфейсов
 

Lean UX, Уровни UX, UXD процесс

  • 1. U X & U I . П Р О Д У К Т О В Ы Й Д И З А Й Н Д Е Н Ь Дмитрий Осадчук UXD ПРОЦЕСС LEAN UX, УРОВНИ UX 01
  • 3. iOSSmartTV Android Watch UI Oculus VR SAP UI5MetroUI SiteCore Sharepoint HybrisHTML5 WebSphere Bootstrap … ОБИЛИЕ ТЕХНОЛОГИЙ И ПЛАТФОРМ
  • 4. Артемий Лебедев В любую секунду любой проект готов на 100%, хотя проработанность может быть и на 4%. В зависимости от имеющегося времени проект можно прорабатывать до пикселя, а можно оставить на стадии концептуальной зарисовки. Раньше автор прорабатывал проекты на 97%. Оптимизировал картинки, подгонял микроны и шлифовал поверхности. Теперь автор получает удовольствие от того, что почти любую дизайнерскую задачу умеет решать за время формулирования задачи. То есть, когда клиент закончил рассказывать, что ему нужно, у нас уже есть решение. Получается, что время тратится только на нужную степень прожарки, а общий вид стейка всегда ясен. § 167. МЕТОД ПРОГРЕССИВНОГО ДЖИПЕГА 26 ноября 2010
  • 7. Джесси Джеймс Гаррет Один из основателей компании Adaptive Path (UX- консультации), Сан-Франциско.
  • 8. «Авария на дороге. Она произошла из-за того, что водитель на секунду отвлёкся, чтобы убавить громкость радиоприемника. Ему пришлось отвести взгляд от дороги, так как на ощупь отличить ручку громкости от других невозможно.». ОПЫТ ВЗАИМОДЕЙСТВИЯ
  • 9. Контекст использования это ситуация в которой пользователь взаимодействует с сайтом/объектом/системой. И  действительно, в машине за рулём контекст использования даже простого телефона совершенно другой нежели дома на  диване. Это очень важный момент над которым стоит думать при проектировании чего-либо. КОНТЕКСТ ИСПОЛЬЗОВАНИЯ
  • 10. User experience (пользовательский опыт) определяется использованием и поведением продукта в реальном мире. UX имеет решающее значение для успеха сайта. Если ваши пользователи не имеют положительного опыта взаимодействия с вашим сайтом, вероятность того, что они вернутся, значительно снижается. Признавая этот важный факт, автор пишет: «Весь опыт взаимодействия должен быть результатом сознательного решения с вашей стороны». Это означает, что: «Нужно принимать во внимание все возможности, каждое действие, которое может совершить пользователь и понимать ожидания пользователей на каждом шагу, на протяжении всего процесса.» ПОЛЬЗОВАТЕЛЬСКИЙ ОПЫТ
  • 12. 1. Поверхность Уровень поверхности представляет собой внешний вид продукта с точки зрения конечного пользователя, то есть набор текста, картинок, ссылок, форм, вкладок, кнопок и прочего. Проще говоря графический дизайн сайта.
  • 13. 2. Компоновка Под поверхностью находится уровень компоновки, представляющей конкретную реализацию абстрактной структуры продукта. На этом уровне решаются вопросы наиболее эффективного расположения различных элементов UI. Компановка это прототипирование. Расположение кнопок, вкладок, фотографий и текстовых блоков. Компоновка проектируется так, чтобы организация этих элементов была максимально эффектной и эффективной, то есть чтобы вы запомнили логотип и смогли найти кнопку с корзиной, когда она понадобится.
  • 14. 3. Структура Структура определяет, как пользователи попадают на страницу и куда они могут направиться дальше. Описывается взаимное расположение страниц веб-сайта, программных форм, окон и др. То есть он отвечает на вопросы “откуда”, “куда” и “как” сможет перемещаться пользователь. Эффективная структура облегчает навигацию и делает её интуитивно понятной для пользователей.
  • 15. 4. Набор возможностей Уровень набора возможностей представляет из себя простое перечисление набора функциональных возможностей, которые будут доступны для пользователей. Способ реализации и взаимной организации этих возможностей будет описан детальнее уже на уровне структуры. Перечисление функциональных возможностей образует уровень набора возможностей сайта. Некоторые сайты, торгующие книгами, позволяют пользователям сохранять адрес, чтобы не пришлось указывать его повторно. Вопрос, включена ли эта (или любая другая) функция в список функций сайта, как раз относится к возможностям сайта.
  • 16. 5. Стратегия Стратегия включает в себя не только то, что хотят получить от сайта его владельцы, но и то, что хотят получить пользователи (цели и потребности пользователя). Самый глубокий и наиболее абстрактный уровень представленной модели. На этом уровне необходимо получить ответы на вопросы, касающиеся желаний и ожиданий относительно будущего программного продукта, как со стороны потенциальных пользователей, так и заказчика. Ответы на эти вопросы будут сформированы и представлены в виде конкретного списка на уровне набора возможностей.
  • 17. Диапазон решений Выбранное решение Решения на следующем уровне только после предыдущего
  • 18. Взаимосвязь уровней Эти уровни являются взаимосвязанными и взаимозависимыми. Каждый следующий выбор ограничивает наш следующий уровень. Начиная с более абстрактных понятий (стратегия и планирование) мы постепенно приходим к более конкретным понятиям (визуальное оформление). Гаррет определяет проблемы, влияющие на опыт взаимодействия на каждом этапе. Решения принятые на нижних уровнях нельзя считать железобетонными и их можно подвергать переоценке если того требуют верхние уровни. И так же переходить к верхним уровням желательно когда у вас есть база в виде нижних уровней. Гибкость методологии, все дела.
  • 19. Этапы Общие результаты окажутся неудовлетворительными, если начинать следующий этап только когда закончится предыдущий. Общий прогресс получается быстрее и правильнее если работка на каждом уровне заканчивается до того, как заканчивается на следующем.
  • 21. MVP (от англ. minimum viable product — минимально жизнеспособный продукт) — простейший работающий прототип продукта, которым тестируют спрос до полномасштабной разработки. Такой подход страхует предпринимателя от невостребованности конечного продукта и потери потраченных на разработку ресурсов. MVP позволяет минимальными усилиями собрать информацию, чтобы доработать продукт под запросы целевой аудитории или вовсе от него отказаться. Самое сложное в разработке MVP — найти оптимальное соотношение затрат и качества. MVP — MINIMAL VIABLE PRODUCT
  • 22. Сложность MVP зависит от продукта — в некоторых случаях, достаточно провести кампанию в AdWords или Директ, а в некоторых обязательна разработка рабочего прототипа. Для тестирования гипотез путем получения информации от пользователей могут быть использованы следующие инструменты и техники: Интервью. Beta landing page. Сплит-тесты. Рекламные кампании. Краудфандинг. Демонстрационные видео. Блог. Цифровой прототип. Бумажный прототип. Однофункциональный продукт. Страница предзаказа. ТЕСТИРОВАНИЕ MVP
  • 26. - Интервью с любыми людьми. Вы сразу поймете, есть ли рынок для вашего продукта. Если ваш продукт для специфической аудитории — расспросите ее. - Создайте блог или страничку в Facebook, посмотрите, как реагирует аудитория, много ли у вас читателей, сколько людей ставят лайки и т.д. - Воспользуйтесь сервисом Quora — задайте там вопрос. - Сделайте презентацию, покажите ее знакомым, доработайте. Вы можете отправить ее нескольким инвесторам и собрать от них фидбек. - Сделайте простую Landing Page c формой регистрации, посмотрите, сколько наберется регистраций, привлекает ли ваша идея много людей? - Поговорите с потенциальными клиентами на предмет «За что вы готовы были бы платить». Можно сделать небольшую демонстрацию продукта перед аудиторией или даже начать кампанию на Kickstarter (или на русском аналоге). ПРИМЕРЫ MPV
  • 30. Принципы бережливого UX-дизайна Когда мы следуем методу тощего UX-дизайна, есть несколько моментов, на которые стоит обратить внимание: Мы понимаем целевую аудиторию и ее проблемы. Мы создаем MVP (Minimum Viable Product — минимально жизнеспособный продукт). Мы работаем короткими итерациями. Мы постоянно тестируем нововведения на пользователях и, если что-то не так, быстро откатываемся. Мы работаем командой: UX-проектировщики, дизайнеры, разработчики и тестировщики работают вместе и постоянно обмениваются мнениями и задачами. ОТ MVP К LEAN UX
  • 31. Как происходит работа с минимально жизнеспособным продуктом, с MVP? Мы берминимально жизнеспособный продукт и постепенно на него наращиваем мясо, мышцы, жир — новые функции и свойства. Если мы работаем по бережливому принципу с минимально жизнеспособным продуктом, мы должны: Сформулировать видение продукта. Сформулировать бизнес-задачи. Сформулировать роли пользователей, понять их задачи и цели. Соорудить прототип продукта. Протестировать его. Начать всё заново. КАК РАБОТАТЬ С MVP