ДизайнУха
07
Sep

Вавилонская рыбка: интерфейс «Google Translate»

источникmedium.com
авторPendar Yousefi

Люди восхищаются волшебными созданиями и устройствами для преодоления языковых барьеров с тех самых пор, как появились языки. У нас в «Google Translate» есть возможность работать над продуктом, который поможет человечеству стать на один шаг ближе к воплощению чуда.

Открытие волшебства

Мгновенный перевод с помощью камеры и режим диалога на двух языках в реальном времени не перестают удивлять пользователей Google Translate. Помимо восхищения, эти услуги приносят пользу, помогая изучающим языки, студентам, туристам и всем остальным людям, желающим преодолеть языковой барьер.

Проблема

К сожалению, оказалось, что многие наши пользователи не знали о существовании этих функций. Впервые эта мысль пришла к нам во время проведения пользовательского опроса — люди просили добавить уже существующие функции. Проведя исследование, мы убедились, что 38 % пользователей действительно не знали об этих инструментах.

Предположение: очень маленькие иконки функций

Первые шаги

Мы предположили, что иконки функций были слишком маленькими и неочевидными. Первым побуждением было сделать их больше и заметнее, так что мы начали эксперименты над новым пользовательским интерфейсом.

Шаг первый: улучшение заметности иконок

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

Обратно к планшету

Таким образом, мы вернулись к редактированию, и спросили себя: какие минимальные изменения нужно внести в существующий привычный пользовательский интерфейс, чтобы сделать эти инструменты более заметными? Мы поправили иконки, добавили к ним текстовые обозначения, разделили голосовой помощник на две важные, но по своей сущности разные функции: диктофон и диалог.

Шаг второй: более продуманные изменения

Это сработало! У всех функций увеличилась активность пользователей — и обращений к рукописному вводу стало больше, чем раньше на 25 %! Мы даже видели посты в Твиттере от людей, полагавших, что эти функции были новыми, хотя они уже существовали несколько лет.

Улучшение UI режима общения

На этом мы не остановились. В Google Translate мы всегда задумываемся о том, как можно улучшить процесс взаимодействия пользователей с нашим приложением. Мы хотели упростить UI режима живого общения, сделать его более понятным в использовании.

В старой версии режима живого общения было три кнопки: две кнопки — слева и справа — для языка оригинала и языка перевода, и большая иконка микрофона в центре, которую мы иногда называли «волшебным микрофоном». «Волшебный микрофон» должен был распознавать, когда люди говорили, на каком языке они говорили, когда они прекращали говорить, и когда нужно начать переводить. И всё это самостоятельно, без каких-либо действий со стороны пользователей.

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

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

Перемен требуют наши сердца

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

Мы сделали кнопки ручного ввода языка гораздо больше и заметнее за счет изменения цвета и формы. Разумеется, мы сохранили «волшебный микрофон» и даже дали ему наглядную текстовую подпись. Но он уже перестал быть суперзвездой интерфейса.

В то же время мы вовлекли в процесс команду техников, чтобы убедиться, что функционал работает и с Pixel Buds. Ещё внесли незначительные коррективы в пользовательский интерфейс, среди которых, например, было отображение иконки наушников при подключении Pixel Buds.

Наш замечательный дизайнер, Лиу Лиу, предложил оригинальную идею дисплея «ice breaker» (прием, применяющийся в начале разговора для установления контакта, снятия напряжения и сближения собеседников). Из исследований пользовательского поведения Лиу заключил, что самый неловкий этап общения — это его начало. Он создал визуальный дисплей со стандартным сообщением, которое пользователь мог бы просто показать собеседнику, чтобы создать непринуждённую обстановку и начать диалог.

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