EDUCATION CENTER
Other products
Get to know devtodev`s other products: an analytics platform for game developers, an analytics consulting, and outsourced customer support in games.
Invisible Mechanics of VR Projects: Create Players Experience
RU
Virtual reality differs from any types of creating game experience. Find out a case study from VR designers.
Published
17.04.2019
|
Павел Совушкин

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

Материал подготовлен Павлом Совушкиным в рамках дистанционной образовательной программы ​«Основы разработки игр в виртуальной реальности», который  поможет вам перейти от теории к практике создания VR-приложений. Павел занимается User Experience дизайном в студии ArtVr, и в своей статье для образовательного центра devtodev Павел делится своими размышлениями вокруг VR-технологий и рассказывает обо всех этапах работы над проектом для Третьяковской галереи, в котором посетитель музея мог примерить на себя роль художницы Натальи Гончаровой.

Статья авторская, мнение автора может не совпадать с мнением редакции Образовательного центра devtodev.

Приемы создания опыта до VR и в VR

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

Создание опыта в живописи

Живопись можно свести до набора приёмов. Часть из этих приёмов направлена на то, чтобы контролировать внимание смотрящего. Образы на полотне выстраиваются таким образом, чтобы направить взгляд зрителя  по нужной траектории. Художник контролирует, как изображенное будет увидено, и таким образом рассказывает историю.

Контроль внимания зрителя (в VR - игрока) - это то, о чем автор никогда не должен забывать, это основа и центр всего в каждой истории.

Создание опыта в кино​​

С изобретением  кино количество каналов, через которые зритель воспринимает историю, увеличилось, появились время и монтаж: изображения начали двигаться и сменять друг друга.  Теперь потребовался способ думать об этом движении так, чтобы контролировать результат воздействия и опыт аудитории. Первопроходцы в кино поняли, что, выстраивая образы в определённой последовательности, можно контролировать смысл, который воспринимает зритель.

Создание опыта в виртуальной реальности

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

МЕТОДОЛОГИЯ UX/VR: КАК УВИДЕТЬ НЕВИДИМЫЙ КОРАБЛЬ

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

Для создания опыта в виртуальной реальности нужно специальное мышление и нужны специальные методы, которые позволят нам увидеть невидимое. Представляю вашему вниманию методологию UX/VR. Первый ее этап - увидеть невидимое.

Как увидеть невидимое

Представьте, что вы входите в ангар. Вы знаете, что внутри стен этого ангара собирают корабль. Но есть одна тонкость - этот корабль невидимый. Именно таким невидимым кораблём и является проект на этапе создания.  

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

Как это возможно?
Первый шаг - занять позицию, с которой мы смотрим на проект.

Позиция

Позиция определяет содержание, которое мы видим в нашем невидимом корабле. Вставая в разные позиции, мы видим разное содержание. Так, смотря на наш невидимый корабль с разных сторон, мы обнаруживаем разные его части: штурвал, паруса и так далее. Но если мы видим каждый раз только части, то как нам собрать целое?

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

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

Роль

Как режиссёр (прибегнем к терминологии кино), вы управляете вниманием команды. Вы направляете их мышление на части невидимого, чтобы они увидели там такие детали, которые вам недоступны.

Помещение нужной роли в нужную позицию - другой важный шаг в создании проекта.

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

Отношение

Но где же в этой схеме мы? А нас, режиссёров виртуальной реальности, там нет. Мы находимся в суперпозиции. Мы смотрим со стороны и видим всю картину. Наша задача: организация, руководство и управление. Через людей мы проявляем образ проекта, который находится у нас в мыслях. 
Мы словно обходим вокруг проекта, смотря на него с разных позиций. Увидев проект с разных сторон, мы получаем его цельный образ.
Я называю такой метод работы UX сканированием, который аналогичен процессу создания 3D-копии по реальному объекту. Чтобы сделать точную копию реального объекта, можно сделать снимки всех его сторон - и тогда программа сможет из снимков собрать виртуальную 3D-копию.

UX-сканирование

Обойдя вокруг проекта один раз, узнаёшь его состояние. Состояние проекта постоянно меняется. Изменения несут люди и процессы. Изменения можно контролировать разумом.  

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

VR-проект для Третьяковской галереи (практический кейс)

Автор книги «Искусство геймдизайна»  Джесси Шелл предложил видеть содержание проекта в четырёх частях: История, Механика, Технология и Эстетика. Приведу пример, как метод элегантного дизайна может работать.

В 2018 году вместе с командой ArtVR я сделал проект о художнице Наталье Гончаровой для Третьяковской Галереи,  который стоит в постоянной экспозиции прямо в здании Третьяковской галереи, и после опыта в виртуальной реальности посетитель может пройтись по залам музея и увидеть настоящие картины художницы. 

Наталья Гончарова - художница, сделавшая большой вклад в русский авангард, большая частью её живописи - натюрморты.  

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

Мы решили, что дадим игроку возможность самому создавать натюрморты в стилистике Гончаровой. Мы взяли предметы с её картин и воссоздали их в виртуальной реальности.

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

Затем поместили все объекты с натюрмортов в студию, а перед игроком поставили холст.

Игрок может взять любой объект в виртуальные руки и выставить свой собственный натюрморт.

Вот с этого момента я разберу один шаг наших размышлений чуть подробнее. Итак,  перед нами встает вопрос: “Как изображение будет появляться  на холсте?”

Давайте вернёмся к методологии. Встаём в разные позиции, смотрим на задачу.

История. В работе художника есть жест, который называется методом визирования. Наверняка вы его видели. Художник выставляет карандаш перед собой и, закрыв один глаз, так примеряется к размерам объекта, чтобы перенести его на полотно. Жест узнаваемый, соответствует образу художника, пробуем применить в механике.

Механика.  Делаем прототип. Выбираем для вызова механики Touch Pad под большим пальцем. Игрок нажимает кнопку - и рядом с его виртуальной рукой появляется рамка. Всё, что попадает в рамку,станет частью картины, когда игрок отпустит кнопку.  

Параллельно возникают вопросы со стороны Эстетики. Создаётся впечатление, что у нас в руках рамка фотоаппарата, а нам нужно более художественное восприятие этого действия.  

Решаем задачу Эстетики через Технологию: пишем шейдер, который стилизует картинку в момент выбора ракурса в карандашный рисунок. Собираем всё вместе, тестируем.

Получилось интересно. Механика и Эстетика работают. Проверяем, как всё смотрится с позиции Истории - эксперты музея сообщают , что для работ Гончаровой свойственно размещение натюрмортов на столе. Ок. Возвращаемся к решению задачи. 

Технология. Изображение попадало на холст, потому что к виртуальной руке была привязана невидимая камера, которая получала изображение окружения и накладывала его на холст. Отсоединяем невидимую камеру от руки и размещаем её в комнате так, чтобы камера смотрела на стол. Настраиваем ракурс. Ставим в студию холст на мольберте, на которой в реальном времени отражается всё, что происходит на столе.

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

Эстетика. Теперь по содержанию изображение больше похоже на работы художницы. Но ведь Гончарова не рисовала реализм. Объекты на её картинах написаны в жанре авангардизма. Как мы можем решить эту задачу?

Технология. Можем сделать дубликат каждого объекта в стилистике Гончаровой. Один объект у нас будет настоящий, и он будет находиться в фотореалистичном окружении игрока, а искажённый объект будет появиться уже на холсте. Делаем несколько объектов. Проверяем.

Некоторые технические процессы при создании модели занимают много времени, а некоторые занимают еще  больше. Например, исказить пропорции можно быстро, а вот нарисовать текстуры уже сложнее и дольше. Считаем, сколько у нас уйдёт времени, чтобы сделать такую же работу для всех объектов. Получаем цифру - видим, что такое технологическое решение нам не подходит.

Как ещё можно сделать все объекты в комнате в стилистике Гончаровой? Можно написать нейронную сеть. Пробуем. Обучаем нейросеть на работах художницы, встраиваем ее в рабочие процессы Unreal Engine (программа, внутри которой собирается проект в виртуальной реальности). Смотрим результат. Получается интересно, но просчёт занимает слишком много времени. От момента, как человек поставил объект на стол перед невидимой камерой, до изменённого изображения на холсте задержка в 35 секунд. Переводим часть вычислительных процессов в облако - теперь просчёт занимает 2 секунды. Это всё ещё много. Нам нужно, чтобы игрок сразу видел результат своих действий. Как можем это решить?

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

Хорошо. А как мы поймём, что игрок доволен своей картиной и решил её опубликовать? Самый простой способ - это прицепить где-нибудь рядом с холстом кнопку «Опубликовать», и по ее нажатию мы бы проявляли картину. Но такое решение с точки зрения Эстетики не совсем гармонично. Все эти кнопки, виртуальное меню и прочее не сильно вяжется с работой художницы. Какое элегантное решение будет удовлетворять Эстетическую сторону и решать наши вопросы в Механике?  

Добавим в студию Гончаровой ещё один физический объект - «Кисть художницы».

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

Для Механики решение с добавлением кисти несёт ещё один положительный момент. Когда необходимое действие в виртуальной реальности не ограничивается «нажатием кнопок», а предлагает игроку движение, что в итоге работает на погружение лучше . Особенно хорошо такие механики работают, когда движения узнаваемы. Натяжение тетивы лука, взмах мечом, размахивание рук при беге - всё это пример узнаваемых движений, которые легли в основу множества игр в виртуальной реальности. Я назвал подобный подход к дизайну Анимационными механиками.    

Взяв кисть в руки, игрок начинает закрашивать холст. Водит рукой, совершая плавные движения в воздухе. Как мы увидели позднее при запуске проекта на площадках - это механика действительно хорошо сработала. Посетители музея, проходя мимо экспозиции с виртуальной реальностью, видели людей, которые проходили опыт. Даже видя , что именно делает человек в виртуальной реальности, посетители узнавали их жесты и тоже загорались желанием попробовать. Я не эксперт в том, как работает человеческий мозг, но думаю, что подобное поведение связано с тем, что называется «зеркальные нейроны». Человек видит, как другой человек что-то делает, представляет, как бы он самостоятельно делал эти движения, и это привлекает к проекту, а затем работает на качество погружения, внутри опыта.   

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

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

Тестируем все варианты и выбираем наиболее подходящую по ощущению модель. Прекрасно.

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

Смотрим на решение с позиции Технологии. Делаем математическую модель таким образом, что когда игрок проносит руку через виртуальный холст, кисть остаётся на поверхности холста. Кисть повторяет движения руки, даже если физически рука находится за поверхностью полотна. У игрока создаётся впечатление, что объекты в виртуальном мире обладают физическими свойствами. Как ещё мы можем усилить ощущения от взаимодействия между кистью и полотном?

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

Можем ли мы ещё как-то усилить этот момент? Посмотрим на ситуацию с позиции Истории. Нам нужно выделить момент написания картины эмоционально. Хотелось бы создать чувство, близкое к вдохновению, которое испытывает художник, создавая картину.

Пишем музыку. В своих проектах мы используем подход, который называется «Адаптивная музыка». Она меняется в зависимости от того, что делает игрок. В момент, когда игрок прикасается кистью к картине, эмоциональность музыки нарастает,  чем быстрее игрок водит кистью, тем большее влияние он оказывает на музыку.

Что ж, получается хорошо. Можем ли мы усилить ощущение от написания картины ещё каким-то образом? Смотрим на вопрос с позиции Эстетики.  Мы с вами уже договорились, что когда игрок рисует на холсте, карандашный шейдер растворяется, а за ним проявляется цветная живопись в стилистике Натальи Гончаровой. Но как именно растворяется карандашная пелена? Исследуем вопрос и делаем растворение таким, чтобы оно напоминало растекание акварельной краски. Пробуем - ощущается отлично!

Мы с вами прошли большой путь. Осталось несколько мыслительных шагов, чтобы в результате у нас получилась прекрасная работа. Через площадку в Третьяковской галерее каждый день проходят 250 человек, создающих свои картины. В конце опыта мы даём возможность сохранить картину и опубликовать в Instagram. Нам нужно, чтобы картины каждого игрока отличались друг от друга. Как мы можем это сделать?

Посмотрим на задачу через Эстетику. На столе перед игроком есть скатерть. Делаем так, чтобы при каждом запуске проекта рисунок на этой скатерти был разный. Что-нибудь ещё?  Мы видим, что человек, проходя опыт, часто берёт для натюрморта объекты, которые находятся ближе к нему. Делаем дополнение в логике проекта - при каждом запуске “кладем” объекты в разные места студии Гончаровой. В результате у нас получаются отличные друг от друга картины.

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

Помните шаг, на котором мы тестировали, каким образом лучше  стилизовать реалистичные объекты под работы Гончаровой? Полностью создавать модели с текстурами выходило слишком долго. Но вот делать копию объекта  и искажать его контуры занимало совсем немного времени. Делаем невидимые для игрока копии каждой модели, и когда нейронная сеть начинает перерисовывать реалистичную картинку под стилистику Гончаровой, мы даём ей на обработку искажённые копии объектов. Так мы ещё на шаг приблизились в эстетике к желаемому результату.  Чтобы наш карандашный шейдер принёс нам ещё большую пользу, подмешиваем его к изображениям, с которыми работает нейронная сеть, - и у нас в результате получаются контуры вокруг объектов, характерные для живописи Гончаровой.

Взмах кисти -  и мы создали с вами опыт. Спасибо, что мы подумали с вами вместе. Приходите в Третьяковскую галерею на Крымском валу в Москве и создайте свою версию картины великой художницы.

Подробнее узнать про проект можно на сайте студии ArtVR.

Подробнее ознакомиться с принципами разработки проектов в  виртуальной реальности можно на двухмесячном онлайн курсе Высшей школы бизнес-информатики НИУ ВШЭ «Основы разработки игр в виртуальной реальности». А если у вас есть желание пообщаться напрямую с автором статьи, пишите ему по электронной почте.

Read more