18
Дек

UX в долгосрочной перспективе

источникmedium.com
авторDmitry Kovalenko

и возможные решения его создания

Всех продуктовых дизайнеров прежде всего волнует (я надеюсь) следующие вопросы:

  • Как построить прочные отношения между продуктом и пользователем?

  • Как увеличить коэффициент удержания клиентов (CRR)?

  • Как улучшить процесс онбординга пользователей?


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

«Отношения между пользователем и продуктом должны развиваться, как развиваются отношения людей, с дня знакомства до брака» — Раул Сен, продуктовый дизайнер, Spotify.

Первое знакомство с UX

Первое свидание в мире дизайна это начало знакомства с UX. Это процесс ознакомления с продуктом и осознание того, как он работает и как им пользоваться. Если вы сразу не объясните что к чему, или нечаянно перегрузите пользователя информацией — он скорее всего будет для вас потерян. Если не на этапе регистрации, то после точно.

Первое знакомство с UX может быть разделено на две части: видимая и не видимая пользователю. Грубо говоря:

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

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


Давайте взглянем на простой пример. Когда вы впервые заходите в некоторые крупные социальные сети, после регистрации лента новостей (или сообщений) будет содержать определенный контент специально для вас. Он основан на вашей электронной почте, контактах, и иногда даже на фотографиях из вашего телефона.

Другой пример — Spark Mail от Readdle, над которым я работал в течение последних 18 месяцев. Вот несколько простых вещей, которые мы в Readdle можем узнать после регистрации пользователя:

  • хранит или сразу удаляет прочитанные письма;

  • использует GMail папки или Mailbox списки;

  • продвинутый или обычный пользователь, основываясь на количестве писем в день.


Таким образом мы можем адаптировать интерфейс под каждого пользователя.

Окей. Первые несколько свиданий это достаточно короткий период в отношениях, так? Но что же дальше? Как потом удержать пользователя? Что делать? Вот тут то и начинается UX в долгосрочной перспективе.

UX в долгосрочной перспективе

Как и первое знакомство, UX в долгосрочной перспективе можно разделить на несколько частей. Но в этой статье я хотел бы рассмотреть одну из них. Мы, дизайнеры, должны применять дизайн возможных решений к нашему продукту, чтобы со временем укрепить отношения между ним и пользователем. Я имею ввиду самообучение на основе авто-анализа, сделанного со стороны продукта.

Чтобы было понятно, давайте посмотрим на некоторые, уже существующие примеры.

Mailbox

С функцией Auto-Swipe

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

Mailbox от Dropbox. Предложение для автоматического архивирования писем.

Pocket

Раздел рекомендаций

Здесь вы найдете статьи, отобранные специально для вас. Они основаны на ключевых словах из названий статей и тегов, ранее добавленных вами, и статей, добавленных другими людьми. Но у них сейчас есть одна проблема — они не проверяют список повторений. Но это уже другой случай.

Pocket. Раздел рекомендаций

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

Давайте начнем со Spotify и их разделом Activity и ленту друзей.

Spotify

Раздел Activity и лента друзей

За последние 3 года активного использования, я никогда не заходил в раздел Activity и никогда ни на кого не подписывался. Естественно у меня возникает вопрос, почему я до сих пор вижу этот раздел? Как и ленту друзей, которая занимает много места на экране? Почему я до сих пор получаю предложения от друзей?

Spotify. Раздел Activity и лента друзей.

Да, да, я знаю. Это часть самого продукта, приложение Spotify или что бы это ни было. Но если я не пользуюсь этим 3 года, вы действительно думаете, что я вдруг начну?

И да, вы можете сказать: «Блин, чувак, не будь идиотом. Зайди в Настройки, найди нужные пункты и отключи их. Это же просто!».

Spotify. Настройки. Место, где друзей можно отключить.

И я вам отвечу: «Нет. Все не так просто! Во-первых, вы заставляете меня думать (читали „Не заставляйте меня думать“ Стива Круга? пожалуйста, сделайте это!). Затем, мне нужно перейти к Файлы > Личные настройки или нажать (cmd +, в случае, если я знаю это сочетание клавиш), потом мне нужно прочитать ВСЕ пункты в меню настроек и найти нужный. И я даже не знаю точно, существует ли этот пункт вообще. Я должен тратить свое время и напрягать мозги. Я не хочу этого делать...»

Никто не хочет тратить время и напрягать мозги, если на это нет необходимости.

Итак, какое же возможное решение в этой ситуации? Дизайнеры Spotify могут разобраться с этим с помощью одного диалога. Причем через 2 месяца использования.

Spotify. Возможное решение того, как Лента может быть отключена пользователем.

Spotify

Качество потока данных

После того как вы заплатили за Премиум Аккаунт вы сможете изменить качество потока данных (320 кбит/с). Но! Единственное место, где вы будете уведомлены об этом...Настройки. То есть сначала вам надо зайти туда. Затем Настройки > Качество потока данных > И в Потоке изменить качество до самого высокого. Тогда вы увидите всплывающее окно с сообщением, что эта функция доступна только для Премиум Аккаунта.

Spotify. Настройки. Достаточно долгий путь для изменения стриминга.

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

Spotify. Возможное решение того, как можно изменить качество потока.

Да, я понимаю, в этом случае многие станут выбирать самое высокое качество, что повлияет на нагрузку сервера Spotify. Но я хотел бы напомнить о том, что мы говорим здесь лишь о возможных решениях. И все.

В любом случае, будет приятно услышать любой фидбек от дизайн команды Spotify, Тобиаса ван Шнайдера и Стенли Вуда.

Поехали дальше.

Photoshop

Третий уровень вложенности

Допустим, вы часто используете Gaussian Blur Filter. Для каждого отдельного случая, вам нужно сделать следующее: Filters > Blur > Gaussian Blur. В этом случае есть два возможных решения, как мы можем помочь пользователю.

  • Очевидно, что можно сделать раздел «Часто используемые» и добавить туда Gaussian Blur или любой другой элемент, который долго открывать. Да, вы можете мне сказать: "Подождите, но это почти тоже самое, как "Недавно используемые"...Так в чем смысл?«. А смысл в том, что недавно используемый это постоянно меняющийся список, который не предназначен для долгосрочного использования. Каждый элемент в списке часто используемых основан на количестве применений. Так что, если Gaussian Blur используется 800 раз, а Обрезать только 320, очевидно, что фильтр должен быть на первом месте.


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

  • И / или более сложное для разработки и реализации решение, но гораздо более удобное для пользователя в долгосрочной перспективе. Представьте: шорткат из списка для фильтра, сразу после того, как его использовали еще раз. Было бы круто, правда?


Возможное решение для Photoshop, как шорткат может быть легко применен пользователем.

Photoshop

Комбинация действий

Давайте копнем еще дальше. Кто помнит эту комбинацию клавиш в Photoshop?

Cmd+A > Cmd+C > Cmd+N > Enter > Cmd+V > Cmd+Shift+Alt+S > Enter

Да, копия-вставить-сохранить для Web. Иногда я нажимал эту комбинацию по сто раз в день!

Итак, давайте представим себе идеальный мир, где Adobe внедрила хитрый способ для отслеживания комбинации действий которые вы чаще всего используете в течении дня. И в случае, если вы повторили тот же комбо, скажем, в десятый раз за последние 2 часа, Photoshop покажет вам следующий диалог. Это можно сделать в настройке действий для данного комбо и следующим шагом будет предложение вариантов шоткатов для этого действия.

Возможное решение того, как сохранить часто использьзуемые комбинации.

Анимации

AppleWatch уведомления

Теперь давайте поговорим немного об анимации. Анимация может быть:

  • воспитательная — научить пользователя (например, как объекты перемещаются);

  • декоративная — для повышения эмоционального эффекта от UI;

  • систематическая — скрыть системные процессы (загрузка, выбор и т.д.).


В этом году я был на частном превью AppleWatch в AppleLabs в Лондоне. Моей миссией было проверить расширение Spark Mail у AppleWatch и сами часы. Уведомления, в частности. Даже тогда я спросил себя: «Черт, почему каждый раз, получая новое уведомление, я должен смотреть эту анимацию 1.5 секунды?». Мне надоело это через 10-15 уведомлений. Кроме того, глаза постоянно двигаются, потому что автоматически реагируют на приложение, а это плохо...

Spark Mail от Readdle. версия для Apple Watch.

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

Анимация

Игры

Теперь рассмотрим анимацию в играх.

The Hearthstone. Фанаты, не беспокойтесь, я тоже люблю эту игру :) Но я не хочу видеть, как красиво карта вылетает из запаса, как сияют искры вокруг нее и т.д. каждый раз, как я хожу. Я хочу драться! Я хочу делать следующий шаг прямо сейчас. Я хочу разбить моего оппонента как можно быстрее... Ну, вы меня поняли.

The Hearthstone. Некоторый ключевые кадры анимации.

Та же проблема есть и в других играх, таких как Cut The Rope, Megarun и т.д. У всех них одинаковые экраны с очками и заработанными звездами. И все на этих экранах движется, прыгает, качается, поднимается и прочее. Некоторые из этих анимации длятся по 4-5 секунд или даже больше, пока игрок получает конечный результат и может идти дальше. Да, некоторые игры реализовали опцию «Нажмите, чтобы пропустить». Но не все.

Megarun game. Экраны с очками.

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

Автоматизация работы

Fluix

Еще один сложный пример взят из нашего B2B (бизнес для бизнеса) продукта под названием Fluix. Расскажу о нем вкратце, чтобы было понятно о чем пример. Я начал работать над версией 2.0 6 месяцев назад. Черт, как быстро идет время...

Fluix 2.0 by Readdle. Списки людей. Ранняя итерация.

Во всяком случае, это проект SaaS в секторе B2B, который позволяет автоматизировать рабочий процесс внутри компании. Вот простой пример рабочего процесса.

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

Fluix позволяет автоматизировать подобные процессы. После установки, все будет осуществляться с помощью кнопки после каждого этапа. Одна кнопка, Карл!

Хорошо, теперь давайте вернемся к примеру. Скажем, администратор должен ежеквартально отправить одинаковый контракт 124 сотрудникам для подписи. Он берет контракт на определенный день, переименовывает его, отмечая дату, нажимает отправить и программа начинает рассылку писем 124 сотрудникам, разделенных запятыми... Или, пометив их флажками в списке контактов. Ад какой-то!

Fluix 2.0 by Readdle. Программа рассылки. Ранняя итерация.

Возможное решение здесь может быть расположено в диалоге ниже. Оно должно показываться админу, как только он отправляет первый контракт. Это диалоговое окно предложит создать группу всех сотрудников, назвать ее, установить конкретное напоминание и путь, где должны быть приняты контракты (сам файл).

Fluix 2.0 по Readdle. Быстрое и примерное решение как автоматизировать рабочий процесс.

iOS

Специальная подборка приложений

Последний простой пример и заканчиваем, обещаю.

Ваш iPhone (Android) всегда знает, где вы находитесь. Предположим, вы каждую неделю посещаете Starbucks по крайней мере 5 раз, тренажерный зал 3 раза, офис 5 раз, некоторые любимые кафе или рестораны 2 и т.д., В каждом из этих мест, вы используете конкретный набор приложений. В Starbucks — News, Facebook, Twitter. В тренажерном зале — Nike + Runner , Spotify, Strava и другие.

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

iOS 9. Специальная подборка приложений для определенных мест.

Итог

Да, конечно, такие решения стоит применять очень осторожно. Стоит принимать во внимание конфиденциальность пользователя и его безопасность. Не раздражайте и не нарушайте рабочий процесс. Будьте последовательны и своевременны.

Но если мы хотим улучшить UX надого, построить действительно прочные отношения между пользователем и вашим продуктом, то мы должны разработать UX в долгосрочной перспективе! Кроме того, с такими решениями, мы не можем упростить и повысить производительность пользователя или сэкономить его время. Мы можем сделать чище интерфейс и избавиться от лишнего шума и элементов. Таким образом уменьшить когнитивную нагрузку на мозг пользователя. Кроме того, эти решения легко менять.

И ребят, не забывайте, пожалуйста, что каждый пользователь это реальный человек. Это вы и я! Так что уважайте их.

На этом все. Спасибо за чтение. Мне очень приятно!

комментариикомментарии по теме