Русский 
Вступление Часть 5
Это Часть 5 из серии уроков по созданию интерактивного интерьера SVOYA при помощи WebGL/PlayCanvas.
Для тех, кто не читал предыдущие части, вот демонстративное видео.
В этой серии уроков мы сделаем интерактивную презентацию интерьера, которую можно просматривать в реальном времени через веб браузер.
Доступ к материалам, такие как: модели в формате "FBX", запеченные текстуры и другое, вы можете получить оформив подписку на Patreon.
Patreon - 3DGROUNDНастройка проекта в Playcanvas
Если, вы не зарегистрированы в Playcanvas, это можно легко сделать на их сайте.
PlaycanvasСоздайте новый "Blank Project", затем откройте "Editor".
Настройки
Перейдите в настройки.
Настройки "Editor".
В "Physics", нажмите "Import Ammo". После чего, у вас создастся папка "Ammo" в "Assets".
Настройки "Rendering".
Assets
Создайте следующие папки в "Assets".
Перейдите в "Store".
В "Store", отсортируйте контент по тегу "Script".
И добавьте в проект следующие скрипты: "FXAA Post Effect", "Bloom Post Effect", "Vignette Post Effect", "Brightness/Contarast Post Effect". Затем в "Assets", переместите их в папку "script".
Player
Удалите из сцены "Box", "Camera", "Light" и "Plane". Создайте новый "Entity" с названием "Player". Этот "Entity" будет перемещаться по сцене, реагировать на "collision" объекты и вид будет у нас от первого лица.
Создайте в "Player" новую камеру.
Сделайте следующие настройки камеры.
Добавьте компонент "Script" в камеру и добавьте скрипты: "bloom", "fxaa", "vignette", "brightnessContrast". Со следующими настройками.
Теперь для "Entity" - "Player", добавьте два компонента: "Collision" и "RigidBody". Со следующими настройками.
Затем я взял скрипт "First Person Movement" со страницы официального мануала Playcanvas.
https://developer.playcanvas.com/en/tutorials/first-person-movement/И немного адаптировал код, так чтобы не исчезал курсор мышки. Код данного скрипта, я прикрепил ниже. Можете воспользоваться им.
Загружаем скрипт в Playcanvas, закидываем в папку "script". Назначаем для "Entity" - "Player" новый компонент "Script", в котором выбираем "firstPersonMovement".
Указываем настройки, как на скриншоте выше. Не забудьте указать параметр "camera" это "Entity" - "Camera", которую мы создали в "Player".
Cubemap
Добавим "cubemap", которая будет использоваться для бликов. Нажмите на "Store", отсортируйте по тегу "Skybox" и добавьте в проект "Golden Hour Helipad HDR Cubemap".
Перенесите добавленные файлы из корня "Assets" в папку "cubemap".
Заключение
В этой части мы проделали сложную работу по настройке сцены и "Player", а тем временем наши текстуры уже запеклись. В следующей части мы добавим модели в сцену и будем настраивать некоторые материалы.
{{comment.text}}