Что не так с часами, поясом и тарелкой в виртуальной реальности: проблемы в создании VR-интерфейса Facebook Spaces
Перевод материала ведущего дизайнера проекта соцсети в виртуальной реальности Facebook Spaces Кристофа Тозьета.
Новый тип интерфейса
Одна из самых сложных задач, с которой столкнулась наша команда, — это дизайн пользовательского интерфейса приложения Spaces. В отличие от традиционных проектов — дизайна для десктопа или мобильных платформ, где мы можем положиться на уже существующие элементы UI и модели взаимодействия, которые дизайнеры выработали за годы работы, — для виртуальной реальности нам ещё предстоит эти модели найти.
При создании дизайна интерфейса мы поставили себе цель — добиться, чтобы пользовательский интерфейс способствовал общению, а не вставал у него на пути. Мы могли бы создавать интерфейсы, которые максимально используют пространство и при этом изолируют человека, пока тот сосредоточен на выполнении действия.
Но вместо этого мы искали такие интерфейсы и взаимодействия, которые дадут людям возможность достигать целей, при этом находясь в пространстве с друзьями и продолжая общение. Мы хотели, чтобы пользовательский интерфейс ощущался скорее как что-то временное и полезное, не прерывающее опыт.
Для того чтобы пользователи могли отличать реальные объекты от объектов из пользовательского интерфейса, мы почти сразу начали использовать в своём UI голографический визуальный язык. Это позволило нам визуально отделить интерактивные элементы от остального окружения.
Также в своих пользовательских интерфейсах мы стали более гибко подходить к вопросам физики и времени, потому что у людей уже сформировалось представление о том, что голограммы легки и эфемерны.
Создавая Facebook Spaces, мы встретились с небольшим количеством интерфейсов и взаимодействий, которые стоят упоминания. Некоторые из них не стали успешными, и от них пришлось отказаться, другие показали себя хорошо. Далее мы поделимся концептами, которые протестировали для решения некоторых задач, и выводами, к которым пришли.
Виртуальный стол
В самом начале мы строили прототипы, в которых люди могли свободно бродить по пространству. Мы попробовали различные решения проблемы передвижения в пространстве и несколько различных видов пространств. И быстро осознали: самая большая проблема такого подхода — в том, что поговорить с кем-то очень сложно. Когда люди получали возможность свободно двигаться в пространстве, они, как правило, терялись и даже не пытались взаимодействовать друг с другом.
В другом эксперименте мы создали инструмент, где пользователи смогли бы создавать вместе музыку на большой виртуальной клавиатуре. Хотя процесс был весёлым, люди всё равно не взаимодействовали друг с другом.
Мы наблюдали за общением людей в реальном мире и нашли новое решение — виртуальный стол, который мог бы стать опорой для разговора.
На конференции F8 в 2016 году мы первый раз попробовали создать виртуальный стол, вокруг которого люди могли собираться, ставить или брать с него предметы. Мы попробовали поиграть с размерами и формой (квадрат, прямоугольник, большой, маленький, прозрачный, непрозрачный и так далее). Больше всего нам понравился круглый голографический стол, за которым могут комфортно разместиться четыре человека.
Основная навигация
Часы виртуальной реальности
Один из первых интерфейсов, над которым мы начали работать, — UI основной навигации. Нашим первым прототипом стали VR-часы, которые прикреплялись к виртуальной руке пользователя. Из них открывалось меню верхнего уровня приложения. Главная проблема таких часов — сложно нажимать на кнопки устройства, которое прикреплено к постоянно двигающейся руке.
И сама рука быстро уставала, так как приходилось высоко поднимать локоть, чтобы интерфейс был читаемым. Так мы поняли, что на часах лучше размещать небольшую временную информацию с ограниченным взаимодействием (например, уведомления). Но располагать здесь сложные интерфейсы вроде главной навигационной системы — неудачное решение.
Виртуальный ремень с инструментами
Так как ремень прикреплён к вашему телу, он является частью личного пространства. Он появляется каждый раз, когда вы смотрите вниз на него, и позволяет сделать выбор или взять предмет одной рукой, что казалось неплохим решением.
Но спустя несколько дней использования такого решения мы поняли, как некомфортно для шеи постоянно смотреть вниз на ремень с инструментами. Также это решение было сложным для тех, кто пользуется приложением сидя, потому что взаимодействуя с ремнём, они постоянно натыкались на свои ноги.
Виртуальный друг
Виртуальным другом мы назвали предмет, который можно двигать и ставить в любое место. Нажатие на этот предмет открывает радиальное меню вокруг него, что даёт доступ к подпунктам меню.
У такого подхода было множество плюсов.
- Взаимодействовать с интерфейсом можно одной рукой и без спешки — благодаря тому, что он привязан к реальному миру.
- Вы сами можете выбирать положение интерфейса в пространстве, носить его с собой и так далее.
- Двигать UI весело, это вызывает восторг, особенно когда подпункты меню открываются так, как будто они на пружине, и забавно тянутся и подпрыгивают за основным меню.
Но и недостатков тоже немало.
- Решение с радиальным меню означало, что вам придётся много раз поднимать руку, чтобы нажать на различные подпункты меню и получить то, что вам нужно. Рука быстро устаёт, и вообще это довольно неэффективно.
- Открывался 2D-интерфейс, а значит, вам пришлось бы поворачиваться, чтобы увидеть его, или он мог открыться в такой позиции, что мы не могли гарантировать комфортное взаимодействие с ним.
- Свободное перемещение интерфейса также означало, что пользователь может где-нибудь потерять инструмент.
- Сложно выработать мышечную память при взаимодействии с трёхмерным UI, если вы постоянно меняете его положение и ориентацию.
Виртуальная платформа
Получив результаты прошлых исследований, мы разработали первую версию виртуальной платформы — трёхмерный интерфейс, закреплённый на столе, что позволяет легко и быстро получить доступ к контенту и при этом не вынуждает слишком далеко передвигаться.
У этого решения были те же плюсы, что и у ремня, но при этом не было главного неудобства: платформа не вынуждала вас смотреть вниз. Основной проблемой была варьируемость размеров и объём пространства, которое платформа занимала на столе. Плавающие сферы также мешали взаимодействию пользователя с предметами, лежащими на столе.
Виртуальная тарелка
Идея с виртуальной тарелкой заключалась в том, чтобы создать на столе интерактивную поверхность с внешним и внутренним кругами, которые структурировали бы информацию. Внутренний круг также мог становиться областью, в которой появлялись трёхмерные предметы, например, выбранный инструмент или контент.
Так же, как и с первой виртуальной платформой, основным недостатком этого решения было количество пространства, которое тарелка занимала на столе. Мы хотели решить эту проблему, добавив кнопку «открыть-закрыть» рядом с краем стола. Ещё одна сложность состояла в том, чтобы передать связь с исходным пунктом меню любого интерфейса, который открывался после того, как пользователь сделает выбор. С таким концептом это было непросто.
Виртуальная платформа 2.0
Новое решение было своего рода союзом между первой платформой и тарелкой: трёхмерная платформа с 2D-интерфейсом на ней, которая может проецировать интерфейс или предмет прямо перед вами и может быть спрятана прямо в стол, если не нужна.
Есть несколько причин, по которым это решение сработало.
- Казалось, люди сразу понимали, как взаимодействовать с таким интерфейсом. Его сходство с планшетом показывало, что можно коснуться пальцами выбранного пункта.
- Аналогия с проектором тоже очень хорошо передавала связь интерфейса с пунктом меню, и было понятно, как включить или выключить интерфейс, или как переключаться между интерфейсами.
- Перед пользователем было задействовано минимальное количество пространства, это давало ощущение контроля и не мешало взаимодействию.
Центр трансляции (Display Center)
Нам предстояло решить ещё одну проблему: как показывать медиаконтент другим людям в комнате. Из опыта с первыми прототипами мы выяснили, что правильно было бы превращать выбранный контент в трёхмерный предмет. Держать фотографию или сферу в руке — похоже на реальность, а передать их другу вполне естественно.
Но мы также хотели найти способ показывать контент так, чтобы каждый в комнате мог комфортно его посмотреть. Первое взаимодействие, которое мы придумали, — приклеить сферу к своему лицу, чтобы активировать просмотр контента.
И хотя это довольно весело, догадаться, что нужно делать, было не так уж и легко. Кроме того, мы видели, как в первые разы пользователи били контроллерами по своим VR-шлемам. И мы по-прежнему ощущали необходимость транслировать 2D-фотографию или видео на большой экран, где каждый мог бы комфортно просмотреть контент.
Наше решение — центр трансляции: круглая зона в центре стола, которая активируется, когда вы бросаете в неё контент, и начинает автоматически проигрывать его. Фото или видео-360 внезапно становится вашим окружением, а 2D-контент проецируется на большой экран.
Проецируемый контент люди могут контролировать дистанционно с помощью своей платформы. Завершить проецирование можно как с платформы, так и просто убрав контент из центра трансляции.
Wrist UI
Ещё одной сложной для нас задачей было понять, как взаимодействовать с определённым предметом в пространстве. После нескольких концептов мы создали Wrist UI, это контекстуальный интерфейс, который появляется на внутренней стороне запястья, когда вы держите предмет, и показывает кнопки действий, которые могут быть применены к этому предмету. Это своего рода клик правой кнопкой мышки на настольном компьютере.
И этот интерфейс показал себя очень хорошо, его было легко найти, понять и начать использовать. Сложнее было сделать так, чтобы UI, вылетающий из вашей руки, хорошо смотрелся. Аналогия с голограммой в этом случае оказалась полезной, потому что лучше видеть, как голограмма проецируется на ваше предплечье, чем понимать, что к невидимому предплечью прикреплён непрозрачный предмет.
Виртуальные часы 2.0
Когда мы работали над первым прототипом VR-часов — главной системой навигации, — мы поняли, что концепт виртуальных часов лучше использовать для быстрого и простого взаимодействия, чтобы не заставлять пользователя держать руку на весу долгое время. А ещё мы узнали, что поднимать запястье, чтобы получить информацию — это быстро и волшебно.
Помня о своих находках, мы пересмотрели интерфейс часов, чтобы он служил центром уведомлений. Когда друг присылает пользователю сообщение в Messenger, пытается дозвониться или прислать приглашение присоединиться к пространству, его контроллер вибрирует, а часы издают сигнал, привлекая внимание. Подняв запястье, пользователь может прочитать уведомление и предпринять быстрое действие.
Развивающаяся система
Вместе эти совершенно разные интерфейсы позволяют людям найти своих друзей, получить доступ к контенту и инструментам, показать видео или фото людям, которые находятся в их пространстве, и оставаться на связи с внешним миром. Это всего лишь наши первые попытки решения некоторых из этих задач, и весьма вероятно, что большая их часть, если не все они, в будущем будут заменены более функциональными решениями.
Дальняя дорога
Создание первой версии Facebook Spaces было очень сложным, весёлым и благодарным временем в моей карьере. У меня появился шанс взяться за что-то амбициозное и одновременно весёлое вместе с командой талантливых и увлечённых людей.
Работа с виртуальной реальностью и пугает, и волнует, потому что нельзя положиться на навыки, которые ты вырабатывал многие годы. Так что приходится выбираться из зоны комфорта, чтобы приобрести новые знания. А разработка виртуального опыта для социальной сети оказалась сверхсложной, потому что чрезвычайно сильно ощущение присутствия и погружения, очень много возможностей и трудностей.
Но как и во всём, что касается Facebook Spaces и всей сферы виртуальной реальности в целом, это всего лишь первый шаг — начало длинного пути. И я рад быть частью этого.
#дизайн #VR #UI
© vc.ru
