предпочесть ваше решение любому другому, потому что: 1) оно намного эффективнее всех существующих решений, 2) решает проблему, о существовании которой они могли даже не подозревать, и (или) 3) создает безусловный спрос там, где он не существовал ранее. По сути, вы создаете качественный прирост ценности за счет прихода в голубой океан рынка через инновацию ценности.
Инновация ценности в вашем предложении воплощается в виде уникального набора функций – характеристик продукта, предоставляющих преимущества пользователю. В большинстве случаев сокращение набора функций только повышает ценность. Ниже перечислены четыре «секретных» способа инновации ценности, которые я наблюдала в цифровом мире:
• Продукт предоставляет новый гибрид возможностей конкурирующих продуктов и источников влияния в области UX. Такой гибрид становится значительно улучшенной альтернативой для выполнения задачи. (Meetup + система платежей system = Eventbrite.)
• Продукт предоставляет инновационный «срез» или новую перспективу предлагаемой ценности от существующих, более крупных платформ. (Google Maps + коллективный сбор данных = Waze.)
• Продукт консолидирует ранее разрозненные аспекты опыта взаимодействия в одно простое и значимое решение. Оно удовлетворяет все потребности пользователей в некоторой области. (Vine или Instagram в том, что касается упрощенного создания и обмена видео и фотографиями на смартфонах.)
• Продукт сводит воедино два разных пользовательских сегмента для заключения сделки, которая была невозможна ранее; таким образом он производит революционные изменения в мире этих пользователей (владельцы жилья + путешественники = Airbnb).
Как видите, эти схемы не сводятся к созданию аналогов существующих продуктов. Вы должны развивать существующие решения и выводить их на новый уровень. Вокруг полно замечательных идей, которые только и ждут, когда вы обнаружите их в совершенно неожиданных местах. От вас потребуется лишь одно – внимательно изучать Интернет, словно охотник, выслеживающий добычу по следам!
В оставшейся части этой главы рассматриваются методы заимствования, которые помогут обнаружить новые возможности для инновации ценности по этим четырем схемам. Нет ничего незаконного в заимствовании возможностей и схем взаимодействия, определяющих общий подход к решению часто встречающегося типа задач. Вы будете заимствовать эти фрагменты из разных мест и объединять их в новом контексте для создания инновации ценности. Так вы не просто обойдете конкурентов, но и полностью выведете их из игры.
Четыре метода, которые будут рассмотрены ниже:
• Выявление ключевых аспектов взаимодействия.
• Использование источников влияния в области UX.
• Сравнение функций.
• Раскадровка инновации ценности.
Учтите, что эти методы больше предназначены для внутреннего использования вами или вашей командой. Их результаты далеко не всегда предоставляются заказчику.
Выявление ключевых аспектов взаимодействия
Когда перед термином стоит слово «ключевой», обычно это означает, что термин крайне важен. Это определение часто встречается в бизнес-терминах: «ключевая точка влияния», «ключевые индикаторы производительности», «ключевые участники» и т. д. Я впервые увидела термин «ключевой опыт взаимодействия» в презентации на семинаре по методологии «бережливого UX», который я вела вместе с опытным UX-гуру Лейн Хэлли (рис. 6.4).
Рис. 6.4. Презентация «бережливого UX» в Лос-Анджелесе, июль 2013 года (Лейн Хэлли стоит в левом углу и делает вид, что это не ее слайд)
На лекции Лейн показала слайд с текстом: «Минимально жизнеспособный продукт (MVP) – продукт в форме, минимально достаточной для проверки ключевых аспектов взаимодействия (предлагаемой ценности)». И хотя позднее Лейн утверждала, что этот термин придумала не она, я тут же подхватила ее определение и немедленно интегрировала его в свои методы.
Для ваших целей под ключевым аспектом взаимодействия следует понимать набор функций, определяющий инновацию ценности. Такой набор должен существовать, чтобы ваш продукт имел конкурентное преимущество. Он определяет опыт взаимодействия, который отличает ваш продукт от всех остальных. Это может быть экзотическая комбинация функций или одна особо значимая функция (как я описала в приведенном выше списке). Например, в книге Microinteractions[39] Дэн Саффер пишет, что «Twitter полностью построен на одном взаимодействии: отправке сообщения из 140 символов». И как упоминалось в главе 2, Twitter произвел настоящий переворот в общении людей по всему миру. Чтобы вам выйти на правильный путь в поиске ключевых аспектов взаимодействия, задайте себе следующие вопросы:
• Что нужно для того, чтобы продукт понравился вашим ориентировочным персонажам (вымышленным клиентам)?
• Какой момент или часть опыта взаимодействия пользователя делает продукт уникальным?
• На основании вашего конкурентного исследования и анализа, какой сценарий или функция исправляет серьезный недостаток?
• Какими обходными решениями в настоящее время пользуются ваши потенциальные клиенты для достижения своих целей?
Ваши ответы могут привести вас к ключевому аспекту взаимодействия, который в конечном итоге обернется выдающимся UX-дизайном!
Тем не менее будьте осторожны и не путайте ключевые аспекты взаимодействия со списком функций. Как упоминалось в главе 4 и показано на рис. 6.5, это произошло с одной из моих студенток, Эной, когда она сделала первую попытку определить ключевой аспект взаимодействия для сервиса «Airbnb для свадеб».
Рис. 6.5. Неправильное определение ключевых аспектов взаимодействия, данное Эной для сервиса «Airbnb для свадеб» (которое я предложила переделать)
Эна выделила шесть сложных ключевых аспектов взаимодействия, что служит явным тревожным сигналом. Если «ключевой» означает «самый важный», то как их может быть шесть? Вместо этого она создала список важных функций. Вероятно, в полноценную версию 1.0 ее продукта стоит включить все эти возможности, потому что будущие невесты, скорее всего, захотят выполнять все эти действия с сайта. Но цель ключевых аспектов взаимодействия должна быть более минималистичной. Какие функции составляют неотъемлемую часть предлагаемой ценности? Если вы снова обратитесь к Twitter, подумайте обо всех функциях, являющихся частью платформы: прямые сообщения, поставка новостей, ретвиты. Тем не менее ключевой аспект взаимодействия – 140 символов. Средством для его создания служит текстовое поле, в котором можно ввести не более 140 символов. Именно это обстоятельство отличает UX Twitter’а от всех остальных для пользователей этого сервиса.
И я предложила Эне попытаться еще раз. Я попросила ее очень хорошо подумать над тем, что она узнала из конкурентного анализа. Также я дала несколько конкретных вопросов для размышлений:
• Что самое важное может сделать клиент с вашим продуктом, чего он не может сделать с продуктами других конкурентов?
• Какую проблему вы хотите решить, которая в настоящее время не решается конкурентами?
• Как ваше решение будет отображаться на экране? В виде интерактивного интерфейса или выводимого результата? Выразите преимущества, которые увидит пользователь.
• Наконец, что будут делать клиенты после того, как они увидят этот экран? Осознают ли они ценность вашего предложения? И снова выразите преимущества в виде сценария, который будет виден пользователю.
Руководствуясь этими вопросами, Эна предложила другой, более удачный вариант (рис. 6.6).
Рис. 6.6. Вторая попытка определения ключевых аспектов взаимодействия для сервиса «Airbnb для свадеб» (одобренная мной)
Да, многие функции исчезли из второй версии; при UX-стратегии необходимо тщательно расставлять приоритеты. Вы должны сосредоточить команду и ресурсы на обязательных преимуществах продукта и безжалостно отсечь все лишнее. В данном случае Эна должна была сконцентрироваться на аспектах взаимодействия, которые отделяют ее сервис «Airbnb для свадеб» от материнской платформы Airbnb. Эти различия и должны выражаться ключевыми аспектами взаимодействия.
Однако Бита и Эна (которые в конечном итоге составили команду «Airbnb для свадеб» во время практики) поняли, что они могут предложить еще лучший ключевой аспект взаимодействия. В фазе исследования клиентов они узнали, что главной проблемной точкой для всех клиентов была организация всех поставщиков. Так как свадьба – мероприятие одноразовое (во всяком случае, так предполагается), будущей невесте приходится многое узнавать самостоятельно. Она вынуждена тратить много времени и энергии, чтобы узнать, как зарезервировать место, спланировать меню, заказать цветы, организовать парковку для гостей – и все это для одного праздника. Бита и Эна задумались над тем, не сделать ли процесс планирования ключевым аспектом взаимодействия для пользователей, интегрировав его в сервис. И они предложили свое решение, основанное на использовании источников влияния в области UX.
Использование источников влияния
В главе 5 вы узнали об источниках влияния в области UX. Они не являются прямыми или непрямыми конкурентами; их предлагаемая ценность не имеет абсолютно никакого отношения к вашей. Однако их опыт взаимодействия и функции могут помочь вам в определении инновации ценности вашего продукта. Главное – мыслить нестандартно. Помните, что одной из четырех схем инновации ценности было совмещение разнородных наборов функций? Собственно, здесь именно это и происходит. Иногда сочетание фрагментов, которые на первый взгляд не сочетаются друг с другом, приводит к невероятным результатам. Просто попробуйте без предубеждения взглянуть на ситуацию, чтобы понять, как заставить продукт или сервис, не являющийся вашим конкурентом, работать на ваши нужды.
Например, Бита и Эна нашли вдохновение в сервисе DIRECTV и платных пакетах, которые он предоставляет своим пользователям. Эта компания не имеет абсолютно никакого отношения к предложению «Airbnb для свадеб», но опыт взаимодействия по выбору телевизионных пакетов очень хорошо продуман. Очевидно, DIRECTV очень серьезно относится к UX, и Бита с Эной решили, что такой тип UX станет хорошей отправной точкой для их ключевого аспекта взаимодействия.
Для начала посетим сайт DIRECTV и посмотрим, как он представляет свои телевизионные пакеты. Взгляните на рис. 6.7; на нем можно найти ряд интересных идей относительно того, как группировать различные объекты и позволить людям настроить свой пакет. Возможно, вы даже увидите проблеск потенциально новой бизнес-модели. Смотрите внимательно. (Подсказка: это концепция готового решения.)
Рис. 6.7. Пакет DIRECTV (пример превосходного информационного дизайна)
Первое, что происходит при посещении DIRECTV, – вы вводите свой почтовый индекс. На экране немедленно появляется небольшая подборка пакетов. Она не так велика, но вполне достаточна для начала работы. Это дало Бите и Эне первую подсказку относительно того, как представить их ключевые аспекты взаимодействия: будущей невесте не следует предлагать более пяти пакетов.
Хотя все пакеты имеют одинаковый макет и структуру, они различаются по цвету фона. Это дало Бите и Эне вторую подсказку: свадебные пакеты должны представляться с очевидными признаками, по которым их можно различать. Например, они могут использовать разные цвета фона.
Пожалуй, еще лучше будет использовать узнаваемое изображение, описывающее различия между пакетами. Например, рядом с пакетом верхнего ценового сегмента может быть изображен лимузин с надписью «Молодожены» на заднем окне, а рядом с пакетом эконом-класса может быть изображен обычный компактный автомобиль. Подсказки 3 и 4 проявились тогда, когда Бита с Эной заметили, что DIRECTV упорядочивает пакеты по возрастанию цены. В ходе прокрутки списка пользователь видит, что более дорогие пакеты содержат больше предложений и занимают вдвое больше места.
Сравнение функций
Прежде чем браться за создание макетов и раскадровок, убедитесь в том, что сравнение не ограничивается одним эталоном. Исследуйте и найдите несколько (от трех до пяти) экземпляров аналогичной функции и поместите их все в один документ. Это позволит вам сравнить разные подходы к одной проблеме из области UX. Результаты сравнения могут оказаться бесполезными, а могут воодушевить вас. Тем не менее вы ищете новые модели, и вам нужно выйти за традиционные рамки, чтобы представить улучшенные средства просмотра, поиска, фильтрации, обмена и достижения пользовательских целей.
Такой подход называется сравнением функций. На первый взгляд он может показаться противоречивым, особенно если вспомнить, что в главе 5 я согласилась со Стивом Бланком, который порицает создание раздутых списков функциональных требований. Но так как сейчас вы просто используете инструменты для исследований, результаты которых не обязательно показывать клиенту, сравнение функций может сильно помочь в выявлении возможностей для инновации ценности. Этот метод достает все фрагменты головоломки из коробки и раскладывает их на столе на виду. После этого вы можете отобрать лучшие фрагменты и компоненты, чтобы построить из них новый паттерн взаимодействия. Сделайте все необходимое для заимствования элементов, а затем соорудите из них новый, улучшенный вариант UX.
Сравнение функций даже может погрузить вас в новые глубины исследования. После проведения конкурентного исследования вы создали и записали короткий список самых интересных функций ваших прямых и непрямых конкурентов (рис. 6.8). Попробуйте вернуться к этому списку – возможно, вы найдете в нем новое вдохновение.
Рис. 6.8. Функции, выделенные по результатами конкурентного исследования
Вполне возможно, что ответ лежит у вас прямо под носом. А может быть, вам нужно будет сделать еще один шаг, чтобы открыть свою инновацию ценности. Возможно, вам придется вернуться на сайты конкурентов, сделать скриншоты и внимательно изучить их.
Например, несколько лет назад межнациональная корпорация наняла меня для проектирования UX-программы для чтения книг на iPhone. Так как на рынке уже были представлены электронные книги (Stanza, eReader, Kindle, Nook), я провела конкурентное исследование и анализ. Я собрала и сохранила данные.
Я сделала скриншоты многих функций, возможностей и аспектов интерфейса: режим просмотра книги, интерфейс экрана загрузки, навигация по оглавлению, средства создания аннотаций и выделения текста. По сути, я документировала все возможности, соприкасавшиеся с ключевыми аспектами взаимодействия, которые нужно было спроектировать. Затем я импортировала все снимки в iPhoto и упорядочила их в соответствии со взаимными связями.
На последнем этапе я разместила их на больших полотнах в Adobe InDesign, чтобы провести визуальное параллельное сравнение. На основании этих сравнений я делала заметки, когда меня посещала какая-нибудь идея. На рис. 6.9 показан образец такого документа.
Рис. 6.9. Сравнение функций различных электронных книг в области выделения и добавления заметок
Процесс занял у меня не менее четырех часов, причем заказчик не просил меня этим заниматься и ничего не платил за это. Однако в результате я смогла выделить и перевести в количественную форму удачные решения, неудачные решения и просто интересные решения, которые конкуренты создавали для пользователей для выполнения тех или иных операций на базе традиционных или новомодных паттернов. Также эта работа сэкономила мне бесчисленные часы. Мне не надо было создавать дизайн проекта с нуля, потому что не приходилось изобретать велосипед. Также у такого подхода есть и другие преимущества:
• Я могла представить стандартные последовательности пользовательских операций в приложении, чтобы потом быстро создать карту приложения или сайта.
• Распознавание паттернов и стандартных решений, помогающих пользователям достичь их цели. Иначе говоря, если я хотела переманить пользователей другого приложения к своему приложению, я могла заранее определить пользовательские ожидания.
• Я избегала создания чего-то принципиально нового и лишнего усложнения пользовательского интерфейса, потому что заранее знала, что мои конкуренты делают хорошо.
• Мне не пришлось объясняться с безумными ключевыми участниками или Особо Важными Персонами, которые без каких-либо эмпирических доказательств уверены, как мне следует выполнять мою работу. При наличии хорошо проанализированных доказательств я могла управлять UX-дизайном так, как считала нужным.
Применяя сравнение функций к конкурентам и источникам влияния в области UX, вы можете сравнивать все, от визуального дизайна до дизайна взаимодействия, наборов функций и способов отображения контента. Ваша цель – избежать такого отношения к конкурентной среде, которое явно проявляет наш друг на рис. 6.10. Иногда вы можете сделать необходимые скриншоты для iPhone или Android в магазине конкурента или просто потратить деньги (от $10 до $30) на приложения. Возложите расходы на заказчика или заплатите сами и включите лишний час в счет. В конечном итоге сравнение сэкономит вам и вашему клиенту немало времени и денег. Оно поможет вам мыслить открыто, особенно после глубокого, целенаправленного исследования, которым вы занимались в главах 4 и 5.
Рис. 6.10. Игнорирование окружающей действительности напоминает страуса, который прячется от опасности, зарывая голову в песок (на самом деле страусы так не поступают)
У выхода за пределы зоны комфорта и знакомства с новым опытом есть еще один неожиданный плюс: он позволяет нам расти как личностям. Вы изменяетесь, когда нарушаете свои житейские привычки, и это открывает перед вами новые пути и новые ощущения. Например:
• Когда я занялась балетом в возрасте 45 лет, я наконец-то научилась держать спину прямо.
• Когда я занялась садоводством в возрасте 42 лет, я наконец-то научилась делать вкусный свежий салат.
• Когда я родила сына в 39 лет, я наконец-то научилась замедлять темп жизни и давать возможность случиться тому, что должно.
Свежий взгляд на повседневные события помогает нам выйти за пределы очевидного и открыть для себя новые ментальные модели.
Прорывы – как в профессиональной, так и в личной жизни – разрушают воздвигнутые нами самими стены, которые заставляют нас изобретать или строить одно и то же снова и снова.
Раскадровка инновации ценности
Итак, вы идентифицировали ключевые аспекты взаимодействия своего продукта; теперь их нужно объединить в некую связную историю. И разумеется, с учетом особого внимания к визуальным аспектам сравнения функций, для этого найдется подходящий инструмент.
Процесс раскадровки (сторибординг) существует с того момента, когда немецкий режиссер Лотта Райнигер впервые нарисовала и раскрасила раскадровку для своего мультипликационного фильма «Приключения принца Ахмеда» в 1926 году[40]. С тех пор раскадровка стала гибким инструментом, применяемым в рекламных кампаниях, комиксах, кинопроизводстве, проектировании программного обеспечения и многих других бизнес-процессах. Это объясняется тем, что раскадровка способствует визуальному мышлению. Или, как пишут авторы книги Game Storming: A Playbook for Innovators, Rulebreakers, and Changemakers[41], «[это] упражнение по визуализации [, которое] помогает участникам изобретать и создавать возможности».
Три шага к раскадровке инновации ценности
Цель раскадровки заключается в визуализации ключевых аспектов взаимодействия. Этот формат должен применяться для самых важных компонентов взаимодействия. Скажите больше меньшими средствами и завершите хэппи-эндом, в котором проблема вашего пользователя успешно решена. Я рекомендую использовать следующую схему построения (и представления) раскадровки.
Шаг 1: Создайте список панелей
Помните: вам не нужно демонстрировать все функции продукта (как ошибочно поступила Эна при первом определении ключевых аспектов взаимодействия). На панелях раскадровки вы показываете только самые «ценные» моменты путешествия пользователя. Некоторые из этих моментов повлияют на дизайн интерфейса, другие случаются в ходе автономной работы пользователя (в оффлайне). Покажите ход всего взаимодействия независимо от того, занимает ли оно 20 минут (как для Uber) или два месяца (Airbnb) в реальном времени.
Для Биты и Эны раскадровка должна была показать, как исполняется мечта будущей невесты, а не то, как работает механизм регистрации в сервисе «Airbnb для свадеб». Несколько панелей, которые они создали общими усилиями:
1. Будущая невеста ищет красивое и недорогое место для проведения свадьбы.
2. Она находит набор результатов из двух или трех предложений.
3. Она просматривает подробное описание хорошего предложения.
4. Она выбирает пакет (место, еда, цветы).
5. Она получает подтверждение резервирования/заказа/отправки данных.
6. Она выходит замуж на берегу моря!
Шаг 2: Определитесь с визуальным форматом (цифровой монтаж или наброски на бумаге)
Некоторые люди умеют рисовать. Другие (такие, как я) не смогут нормально изобразить даже простейшего человечка. Самое главное – выбрать формат, в котором вы с командой легко и быстро сделаете раскадровку. Если вы хорошо знаете Photoshop, просто соберите идеи интерфейса в графическом изображении. Не теряйте времени на каркасную модель раскадровки. Ничто не мешает вам воспользоваться фотографиями из Google или слегка видоизменить экраны, увиденные на других сайтах. Творите, рисуйте или соберите все изображения и убедитесь в том, что они имеют приблизительно одинаковые пропорции и хорошо помещаются на вашем холсте. На этой стадии незачем проектировать весь пользовательский интерфейс. Вместо этого достаточно выделить компоненты интерфейса, которые демонстрируют лучшие концепции.
Эна решила использовать подборку фотографий из Google Images. Она сделала быстрый набросок в Photoshop. Также она воспользовалась точным макетом DIRECTV для списка результатов и детализированного представления отдельных позиций, потому что сейчас ей не так важно спроектировать что-то новое – достаточно показать, как может проходить взаимодействие.
Шаг 3: Выстройте свою раскадровку на холсте и добавьте подписи под каждой панелью
Теперь проанализируйте свою раскадровку. Гладко ли идет линия повествования? Насколько она лаконична? Легко ли проследить за идеальным опытом взаимодействия клиента? Если ответы положительны, значит, созданная вами раскадровка инновации ценности успешно работает. Подписи должны быть краткими и строчными буквами – не более двух строк. И снова «лучше меньше, да лучше».
На рис. 6.11 и 6.12 представлены раскадровки, созданные Битой и Эной соответственно. Согласитесь, они неплохо передают представление о инновации ценности их продуктов.
Как я уже упоминала в начале главы, раскадровки не обязательно передаются заказчику как результат работы. В других рабочих средах существуют ситуации, в которых они чрезвычайно полезны, но сейчас они просто используются для представления идей в повествовательном контексте.