Статьи

Начало работы с дополненной реальностью и мета

Мета была в новостях недавно после долгожданного выступления TED на прошлой неделе, демонстрирующего их следующую гарнитуру дополненной реальности, Meta 2. Это было фантастическое время для моей первой статьи о разработке гарнитуры дополненной реальности Meta в Unity! Если у вас одна из оригинальных гарнитур Meta и вы откладываете создание приложений AR, то сейчас самое время отряхнуть эту гарнитуру и заняться разработкой!

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

Что вам нужно

Чтобы следовать этому уроку, вам понадобится следующее:

  • Meta 1 Developer Kit — они распроданы, поэтому, если вам не повезло иметь его, вам нужно найти друга, которому он принадлежит, или подождать Meta 2!
  • Unity 5.2.1 (32-разрядная версия) или Unity 5.2.2 (64-разрядная версия). Мета-поддержка Unity 4 скоро заканчивается, поэтому к этому моменту лучше перейти на Unity 5! Я бы рекомендовал скачать по ссылкам Meta, о которых мы расскажем ниже.
  • Windows 8.1 или Windows 10 — к сожалению, Mac OSX не поддерживается, а поддержка Windows 7 постепенно прекращается.

Загрузка Unity и Meta SDK

Самый безопасный способ получить правильные версии Unity и Meta SDK — отправиться в Meta Dev Center . Отсюда вы можете скачать последнюю версию Meta SDK:

Загрузка последней версии Meta SDK

Как только он загрузится (или сделайте это одновременно, если у вас гораздо более быстрый Интернет, чем у меня!), Прокрутите вниз, чтобы загрузить 64-битный или 32-битный Unity в зависимости от вашей операционной системы:

Загрузка 64-битного или 32-битного Unity

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

Создание нашего первого проекта

Когда мы впервые открываем Unity, на экране приветствия есть опция для запуска нового проекта в правом верхнем углу. Нажмите «Новый», чтобы начать новый проект:

Создание нового проекта, нажав Новый

Затем мы называем наш проект (вы можете назвать свой, как вам больше нравится, мы использовали «Pretty Butterfly») и выбираем, где вы хотите сохранить его на своем компьютере. Убедитесь, что вы выбрали 3D в левом нижнем углу! Когда будете готовы, нажмите «Создать проект»:

Настройка наших настроек проекта Unity

Прежде чем делать что-либо еще, неплохо было бы назвать и сохранить исходную сцену. Для этого перейдите в File> Save Scene as… .

Сохранение нашей начальной сцены, Файл> Сохранить сцену как

Мы добавляем новую папку для наших сцен в папку «Активы» проекта под названием «Сцены»:

Создание новой папки для нашей сцены

Затем назовите нашу сцену «ButterflyScene» — вы можете назвать свою как угодно!

Называя нашу сцену

Импорт Meta SDK

Теперь, когда у нас есть сценарий, сохраненный и готовый, пришло время импортировать в Meta SDK, который мы скачали ранее. Для этого мы нажимаем Активы> Пакет импорта> Пользовательский пакет… :

Импорт пользовательского пакета через активы, пакет импорта, пользовательский пакет

Перейдите через вашу файловую систему к Meta SDK. Для меня это было в C: / Program Files (x86) / Meta / Meta SDK . В этой папке мы выбираем пакет «Meta» Unity:

Выбор пакета Meta Unity

Через некоторое время загрузки появится окно со всеми найденными активами Meta SDK. Убедитесь, что все проверено и нажмите «Импорт»:

Импортирование мета-пакета, гарантирующего, что все проверено

Если в Unity появляется сообщение «Этот проект содержит скрипты и / или сборки, использующие устаревшие API», это нормально. Просто нажмите «Я сделал резервную копию. Преуспевать!»

Да я сделал бэкап

Теперь мы должны увидеть две новые папки, «Meta» и «MetaPackage», в нашем проекте:

Мета активы теперь видны

Добавление MetaWorld в наш проект

В наших новых активах у нас есть префаб «MetaWorld», который предоставит нам всю необходимую нам камеру Meta и функции взаимодействия. Если вы новичок в Unity — префабы в основном похожи на объекты-шаблоны, которые можно повторно использовать в нескольких проектах и ​​сценах для совместного использования функциональности.

Самый простой способ добавить это в нашу сцену — это поиск в окне «Проект». Введите «MetaWorld», и он должен отфильтровать наши активы, чтобы показать нам, чего мы хотим. Перетащите сборник «MetaWorld» в иерархию вашего проекта (где у вас есть «Основная камера» и «Направленный свет»):

Перетаскивание в MetaWorld Prefab

Фактическим местоположением префаба «MetaWorld» для тех, кто интересуется, является Meta / MetaCore / Resources / Prefabs / MetaWorld.prefab .

Объект «MetaWorld» — это наше представление сцены в дополненной реальности, представляющее нашу гарнитуру Meta. Убедитесь, что он расположен в {0, 0, 0} и не имеет вращения. Это наша камера, поэтому мы можем удалить существующую «Основную камеру». Мы также можем удалить «Направленный свет»:

MetaWorld позиционирование на нашей сцене

Добавление нашей бабочки

Самый чистый способ организовать нашу сцену — создать новый пустой игровой объект, который будет включать остальные наши элементы. Для новичков в Unity это создает удобный и простой контейнер для наших объектов. Для этого перейдите в GameObject> Create Empty .

Создание пустого игрового объекта

Мы переименовываем этот объект в «Butterfly App» и гарантируем, что он расположен в {0, 0, 0} без вращения. Это важно, поскольку все объекты, помещенные в него, будут использовать позицию родительского объекта в качестве основы.

Переименуйте его в приложение Butterfly

Чтобы получить модель красивой бабочки, мы посетим Unity Asset Store. Если вы не любитель бабочек (маловероятно, но вы никогда не узнаете!), Вы можете загрузить практически любую модель, чтобы это работало. Эксперимент прочь!

Мы нажмем на вкладку «Магазин активов», рядом с нашими вкладками «Сцена» и «Игра», затем введем «бабочка» в поле поиска:

В поисках бабочки

Если немного прокрутить, мы найдем хороший бесплатный, который отлично подойдет для нашей демонстрации:

Бесплатная бабочка скачать

Нажмите «Скачать», чтобы начать загрузку файлов для нашей бабочки:

Бабочка скачать

В появившемся окне импорта убедитесь, что все проверено (как мы это делали при импорте в Meta SDK), и нажмите «Импорт»:

Импорт бабочки

Если мы вернемся в корень нашей папки «Активы», то теперь мы можем увидеть новую папку с нашими новыми активами бабочки!

Наши новые активы бабочки

В этой новой папке мы перейдем к Активам> GruffysAnimatedButterfly> Prefab . Теперь мы перетаскиваем префаб «butterfly2» в наш пустой игровой объект «Butterfly App».

Ввод бабочки в сцену

Вы можете поиграть с позиционированием бабочки, если хотите. Лучшее положение, которое я нашел, — это сдвинуть положение Z от камеры на 0,4, но X и Y останутся на 0. Я повернул бабочку на оси Y на 150 и масштабировал ее по всем осям на 0,05. Масштаб может определенно быть любым, если вы хотите большую бабочку, не стесняйтесь увеличивать ее (но вам, возможно, придется переместить ее немного назад по оси Z, чтобы увидеть ее правильно, если вы слишком велики) !).

Бабочка позиционирование

Если вы еще этого не сделали, удалите «Направленный свет», который поставляется со сценой Unity — он нам не понадобится.

Предоставляем наши мета-возможности бабочки

Чтобы иметь возможность подбирать и перемещать нашу бабочку по сцене, нам нужно, чтобы сама бабочка была «MetaBody». Это компонент, который поставляется с Meta SDK и его легко добавить к любому объекту в Unity.

Чтобы превратить любой объект Unity в объект с поддержкой MetaBody, нажмите на объект (например, в нашем случае «бабочка2»), нажмите «Добавить компонент» справа и найдите «метатело». Нажмите «MetaBody», когда появится:

Добавление MetaBody

В настройках, которые теперь отображаются для нашего объекта, отметьте следующее:

  • Grabbable and Move — это то, что позволяет нам подбирать и перемещать нашу бабочку по сцене.
  • Стрелка — это обеспечивает стрелку направления на Мета-интерфейсе, указывающую, где находится объект, когда его нет на экране. Это действительно полезно для объектов, которые пользователь может перемещать по сцене — поскольку люди, как правило, бросают объекты и не видят, куда они ушли! Стрела экономит много времени и путаницы!

Если мы запустим приложение сейчас, мы изо всех сил попытаемся увидеть бабочку и, возможно, немного запутаемся (я знаю, что был изначально). Это не потому, что мы сделали что-то не так в Meta SDK или в Unity. Если вы следовали шаг за шагом, вы окажетесь в той же ситуации — это связано с тем, что шейдер по умолчанию установлен на нашей бабочке, чтобы крылья гармонично вписывались в сцену.

Чтобы сделать его видимым для нашей гарнитуры Meta, мы хотим изменить этот шейдер. Для этого нажмите, чтобы развернуть игровой объект «butterfly2» в иерархии проекта и выберите «Butterfly Mesh». С этим выбранным, щелкните раскрывающийся список шейдеров справа:

Бабочка шейдер выпадающий

В появившемся меню перейдите в « Мобильный телефон»> «Частицы» и выберите «Добавка». Это дает нам другой шейдер, который заставляет наш объект бабочки сиять через нашу сцену! Гораздо приятнее, на самом деле это дает ощущение почти голограммы в дополненной реальности.

Изменение шейдера бабочки

В бою

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

Нажмите играть

Есть несколько вещей, которые вам могут понадобиться, если вы не видите бабочку, как вы надеялись:

  • Не видя свою бабочку перед собой? Возможно, вам придется обновить вид, нажав F4 — или следуйте за стрелкой!
  • Не видите два изображения рядом в гарнитуре? Убедитесь, что вы нажали кнопку 3D в левом нижнем углу окна управления Meta Developer Kit.
  • Не видите два изображения рядом в предпросмотре Unity? Нажмите F2, чтобы переключиться в параллельный режим.
  • Видите очень маленькое изображение в вашей гарнитуре? Нажмите F3, чтобы переключиться на выпрямленный вид.

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

  • Убедитесь, что вы держите ладонь перед очками, пока не увидите пунктирный желтый круг.
  • Сожмите руку в кулак, и этот круг станет зеленым.
  • Переместите свой кулак вокруг, чтобы переместить бабочку вокруг сцены.
  • Снова откройте кулак, чтобы освободить его!

Вот как выглядит моя бабочка в виде бок о бок (этот вид выглядит в 3D при просмотре через гарнитуру):

В действии с двойным зрением

Вот вид с одного экрана, чтобы показать, что увидит кто-то, кто носит гарнитуру:

В действии с одним видом

Вывод

Дополненная реальность — действительно захватывающая область, созревшая для стольких возможностей! Если у вас нет гарнитуры Meta и вы хотите принять участие, более подробная информация о гарнитуре Meta 2 должна появиться 2 марта в 9:00 по тихоокеанскому времени на веб-сайте Meta . Это мой любимый выбор для разработки гарнитуры AR! Мы надеемся, что будет много комплектов для разработчиков, когда они объявят больше деталей. Новые гарнитуры выглядят так, как будто у них будет больше поле зрения и дисплей с более высоким разрешением, чем у Meta 1. Я с нетерпением жду возможности получить пару!

Вы текущий Meta Pioneer разрабатывает на платформе? Или пионер, который теперь вновь заинтересован в том, чтобы выпустить наушники и заняться разработкой? У вас уже есть опытный образец? У вас возникла новая идея после прочтения этого? Я хотел бы услышать, что вы делаете! Дайте мне знать в комментариях ниже или свяжитесь со мной в Твиттере по адресу @thatpatrickguy .