Автор: MastaMan
Дата: Март 1, 2022
Обновлено: Июль 25, 2023
Вы читаете часть: 1 2 3 4 5 6 7 8

Вступление Часть 8

Это Часть 8 из серии уроков по созданию интерактивного интерьера SVOYA при помощи WebGL/PlayCanvas.

Для тех, кто не читал предыдущие части, вот демонстративное видео.



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

Доступ к материалам, такие как: модели в формате "FBX", запеченные текстуры и другое, вы можете получить оформив подписку на Patreon.

Patreon - 3DGROUND

Экран загрузки

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

loading screen settings
Loading...

Перейдите в "Settings", затем в "Loading Screen" и нажмите "+ Create Default". Введите название "loading". Переместите только что созданный "loading.js" файл на панели "Assets" в папку "script".



Отредактируйте файл "loading.js" удалите весь существующий код, скопируйте и вставьте код приведенный выше. Сохраните изменения.

Запустите проект по кнопке "Play". Отлично, у нас появился новый стильный экран загрузки. Круто!

new loading screen playcanvas
Loading...

Я не буду описывать как изменялся код "loading.js", скажу лишь, что для его редактирования нужно обладать знаниями "JavaScript", "HTML" и "CSS". Если у вас возникнут вопросы, как адаптировать код под свои нужды, обращайтесь ко мне на Patreon.

Patreon - 3DGROUND

Заключение

Я снял видео с веб-браузера, получилось не хуже, чем делать рендер анимации 😉



Проект получился действительно классным, интерактив дарит новый опыт и впечатления. Проекты такого типа несомненно заслуживают своей ниши, поскольку это дешевле и проще чем на Unreal Engine. Вы просто предоставляете ссылку клиенту и интерактив будет работать на  десктопных компьютерах, мобильных устройствах, телевизорах, на Windows, Linux, iOS, Android, без какого-то специального ПО, везде, где работает веб-браузер.

Мультиплатформенность и маленький вес проекта (всего 40 Мб), позволяет открывать проект даже на слабых устройствах с плохим интернет-соединением. 

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

Если, вам интересны такие уроки, поддержите меня на Patreon!

Patreon - 3DGROUND

Ну, а теперь давайте насладимся результатом.

scr1
Loading...
scr2
Loading...
scr3
Loading...
scr4
Loading...
scr5
Loading...

Бонус

Также, уже доступен продвинутый урок по добавлению больше интерактивности интерьеру SVOYA. 

Это более комплексный урок, который затрагивает важные темы: 

  • Создание видеотекстуры для материала TV, а также возможность управлять Play/Pause при помощи UI-кнопки;
  • Смена цветов шкафов по нажатию UI-кнопки;
  • Создание материалов для дивана, имитирующего Falloff, смена материалов дивана по нажатию UI-кнопки;
  • Адаптация под мобильные устройства, добавление Joystick;
  • Улучшение loading.js для адаптации под мобильные устройства.
Добавление интерактивности интерьеру SVOYA (Playcanvas/WebGL). Часть 1.


Вы читаете часть: 1 2 3 4 5 6 7 8
{{commentsMsg}}
  

Никто не оставил комментариев
{{comment.lastname}} {{comment.name}} {{comment.date}}
{{comment.text}}
Sponsored content