02. ux layers
DESCRIPTION
Вторая лекцияTRANSCRIPT
Введение в Пользовательский Опыт
Лекция 2Vladimir Tomberg, PhD
Эстонский Университет Прикладных Наук
по Предпринимательству Майнор
Сентябрь 2014
Pic
ture
sou
rce:
htt
p://
user
cent
ered
cont
ent.
com
ДОКЛАДЫ ПО ПРЕДЫДУЩИМ ЗАДАНИЯМ
5 минут на доклад+
дискуссия
О ВАЖНОСТИ ПОЛЬЗОВАТЕЛЬСКОГО ОПЫТА
Преданность клиентов
О ВАЖНОСТИ ПОЛЬЗОВАТЕЛЬСКОГО ОПЫТА
ЕДИНСТВЕННЫЙ МАГАЗИН В
ДЕРЕВНЕVS
ИЗОБИЛИЕ МАГАЗИНОВ В
ГОРОДЕ
О ВАЖНОСТИ ПОЛЬЗОВАТЕЛЬСКОГО ОПЫТА
Почему потребитель выбирает определенные магазины, а в некоторые не ходит, даже если
они находятся рядом?
СПОСОБЫ ИЗМЕРЕНИЯ ПРЕДАННОСТИ ПОЛЬЗОВАТЕЛЯ
• Возврат инвестиций (roi);• Уровень конверсии;• Количество брошенных корзин с покупками
УРОВЕНЬ КОНВЕРСИИ
• Какой процент пользователей переходит на следующий этап отношений ?1. персональная учетная запись, 2. подписка на рассылку, 3. и т. п.
УРОВЕНЬ КОНВЕРСИИ
• Важность уровня конверсии:увеличение уровня конверсии на 0,1 % может привести к 10 % увеличению объемов продаж
УРОВЕНЬ КОНВЕРСИИ
3 подписавшихся на рассылку
из 36 посетителей=
уровень конверсии 8,33 %
Дизайн Ориентированный на Пользователя
(USER-ORIENTED DESIGN)• Привлекательный и эффективный опыт
взаимодействия называют дизайном, ориентированным на пользователя;
• Разрабатывая продукт необходимо думать о пользователе на каждом этапе
МОДЕЛЬ ОПЫТА ВЗАИМОДЕЙСТВИЯ ГАРРЕТА
• Опыт взаимодействия является результатом множества крупных и мелких проектных решений о том, как сайт выглядит, как себя ведет и какие действия позволяет совершать;
• Эти решения, опирающиеся друг на друга, формируют опыт взаимодействия и влияют на все его аспекты
ЧЕМ ПОЛЕЗНА МОДЕЛЬ ОПЫТА ВЗАИМОДЕЙСТВИЯ?
• Зависимость уровней взаимодействия важна для проектирования;
• Решения принимаемые на каждом уровне сужают диапазон выбора уровнем выше
ЗАВИСИМОСТЬ УРОВНЕЙ ВЗАИМОДЕЙСТВИЯ
• Выход за границы допустимого на верхнем уровне требует пересмотра решений принятых на нижних уровнях
ТЕРМИНЫ ПРИВОДЯЩИЕ К ЗАМЕШАТЕЛЬСТВУ
ПРИЧИНА – ДВА РАЗНЫХ ПОДХОДА К ВЕБ
ПОДХОД ОСНОВАННЫЙ НА СОЗДАНИИ ПРОГРАММНОГО ОБЕСПЕЧЕНИЯ
ПОДХОД ОСНОВАННЫЙ НА РАСПРОСТРАНЕНИИ ИНФОРМАЦИИ
ПРОБЛЕМЫ ДВОЙСТВЕННОСТИ ВЕБ
• Технический подход против информационного;
• Невозможность соотнести конкретный сайт ни с приложением, ни к гипертекстовым информационным пространством;
• Отсутствие общей терминологии
РАЗДЕЛЕНИЕ МОДЕЛИ НА ДВЕ ЧАСТИ
РАЗДЕЛЕНИЕ МОДЕЛИ НА ДВЕ ЧАСТИ
УРОВЕНЬ СТРАТЕГИИ• Потребности пользователей– это
цели аудитории сайта;• Необходимо понимать, чего хочет
аудитория и как эти пожелания согласуются с другими ее потребностями;
• Цели сайта могут быть бизнес-целями («заработать миллион долларов на Интернет-продажах в этом году») или какими либо иными («информировать избирателей о кандидатах, участвующих в ближайших выборах»);
• Часто называют «целями бизнеса»
УРОВЕНЬ СТРАТЕГИИ
УРОВЕНЬ НАБОРА ВОЗМОЖНОСТЕЙ
• На программной половине стратегия преобразуется в набор возможностей путем создания функциональной спецификации – подробного описания функциональных возможностей процесса
• На информационной половине возможности равнозначны требованиям к контенту – это описание различных элементов содержимого, которые необходимо создать
УРОВЕНЬ НАБОРА ВОЗМОЖНОСТЕЙ
УРОВЕНЬ СТРУКТУРЫ
• На программной половине этого уровня возможности приобретают структуру благодаря проектированию взаимодействия (IA), в процессе которого мы определяем, как система будет вести себя в ответ на действия пользователей
• В информационном пространстве структура определяется информационной архитектурой – организацией элементов содержимого в пределах информационного пространства
УРОВЕНЬ СТРУКТУРЫ
УРОВЕНЬ КОМПОНОВКИ
• Интерфейс для информационного пространства появляется в ходе разработки дизайна навигации, в результате чего мы имеем набор экранных элементов, позволяющих пользователю перемещаться по информационной архитектуре.
УРОВЕНЬ КОМПОНОВКИ
• На обеих половинах уровня компоновки используется информационный дизайн – представление информации в таком виде, который облегчает ее восприятие
• У программных продуктов компоновка также включает в себя дизайн интерфейса – организацию элементов интерфейса, позволяющую пользователям взаимодействовать с функциями системы
УРОВЕНЬ КОМПОНОВКИ
УРОВЕНЬ ПОВЕРХНОСТИ
• Визуальный дизайн отвечает за внешний вид конечного продукта
УРОВЕНЬ ПОВЕРХНОСТИ
РЕЗУЛЬТАТЫ РАЗНЫХ ЭТАПОВ РАБОТ
DELIVERABLES
ОСНОВНЫЕ РЕЗУЛЬТАТЫ РАБОТЫ UxD ИНЖЕНЕРА − “КАРТА СОКРОВИЩ”
Source: http://semanticstudios.com
ИСТОРИИ
• Хорошая история о пользовательском опыте может помочь людям увидеть проблему или возможность, мотивировать к действию, и задержаться в памяти людей надолго, после ее представления
ИСТОРИИ СЕГОДНЯ ЭФФЕКТИВНЕЕ, ЧЕМ КОГДА-ЛИБО РАНЕЕ
• Мы перегружены информацией. Хорошая история выделяется из информационного шума;
• Личная история выглядит реальнее, чем абстрактные концепты, статистика или логические аргументы;
• Истории захватывают людей на эмоциональном уровне, создавая более глубокую, интимную связь;
• Истории запоминаются: люди забывают факты, но помнят истории
ЭЛЕМЕНТЫ ХОРОШЕЙ ИСТОРИИ ВКЛЮЧАЮТ
• Четкие начало и конец;• Ясное сообщение;• История аутентична;• История релевантна;• Привлекательность (часто присутствует
драма или интрига)
ПРИМЕР ХОРОШЕЙ ИСТОРИИ:РЕЧЬ СТИВА ДЖОБСА НА ВЫПУСКНОМ ВЕЧЕРЕ
УНИВЕРСИТЕТА СТЭНФОРДSource: youtube.com
STORYBOARDS – КОМИКСЫ
STORYBOARDS – КОМИКСЫ
STORYBOARDS – КОМИКСЫ
СЛОГАНЫ
• Концептуальные выражения, порождающие аналогии и стратегии опыта, призывающие к новому осмыслению известных концепций
• “Friendster for dogs.” (Dogster)• “Flickr for video.” (YouTube)
• “We network networks.” (Cisco)• “The Firefox of media players.” (Songbird)• “Massively Multiplayer Online Learning.”
(Grockit)
ПРИМЕРЫ СЛОГАНОВ
ПЕРСОНАЖИ
• Архетипы пользователей, их поведение и цели, призванные напоминать дизайнеру, то он не пользователь, и служить бесценным компасом для проектирования и разработки
СЦЕНАРИИ
• Помещение пользователя в реальную ситуацию позволяет проверить, как система подходит для реальной жизни
• Обзор и описание документов и объектов является предварительным условием для эффективной структуры и организации;
• Результат (обычно таблица с описью) – признак прилежания и усердия
ОПИСЬ КОНТЕНТА
АНАЛИТИКА
• Позволяет получить информацию о реальном опыте пользователей в случае наличия системы
БУМАЖНЫЕ ПРОТОТИПЫ
• От бумажных прототипов к предварительной-альфа версии
• Работающая модель сопровождается быстрыми итерациями и эмоциональным вовлечением, показывая как продукт выглядит и воспринимается
ПРОГРАММНЫЕ ПРОТОТИПЫ (MOCK-UPS)
• Подходят, как быстрая замена бумажным прототипам;
• Позволяют реализовать автоматизацию и ускорить процесс прототипирования и тестирования
myBalsamiq и moqups
http://www.balsamiq.com/products/mockups/mybalsamiq
https://moqups.com
ЗАДАНИЕ НА ДОМ• Основано на идее из предыдущего задания;• Описать свою уникальную точку зрения на проблему: что
отличает ваш подход к решению проблемы от существующих?
• Сгенерировать две идеи, как будет работать ПО;• Нарисовать два storyboard (комикса), в которых
иллюстрировать свои идеи;• Каждый storyboard должен помещаться на листе бумаги а4,
использовать черный фломастер;• На основе комикса подготовить первые версии прототипа из
бумаги или при помощи по (см. Предыдущий слайд);• Выложите описание, комиксы и прототипы в свой блог через
LePress (задание №2)