Вступление Часть 8
Это Часть 8 из серии уроков по созданию интерактивного интерьера SVOYA при помощи WebGL/PlayCanvas.
Для тех, кто не читал предыдущие части, вот демонстративное видео.
В этой серии уроков мы сделаем интерактивную презентацию интерьера, которую можно просматривать в реальном времени через веб браузер.
Доступ к материалам, такие как: модели в формате "FBX", запеченные текстуры и другое, вы можете получить оформив подписку на Patreon.
Patreon - 3DGROUNDЭкран загрузки
Остался последний штрих, чтобы довести наш проект до идеала. Сделаем красивую заставку с анимацией во время загрузки проекта.
Перейдите в "Settings", затем в "Loading Screen" и нажмите "+ Create Default". Введите название "loading". Переместите только что созданный "loading.js" файл на панели "Assets" в папку "script".
Отредактируйте файл "loading.js" удалите весь существующий код, скопируйте и вставьте код приведенный выше. Сохраните изменения.
Запустите проект по кнопке "Play". Отлично, у нас появился новый стильный экран загрузки. Круто!
Я не буду описывать как изменялся код "loading.js", скажу лишь, что для его редактирования нужно обладать знаниями "JavaScript", "HTML" и "CSS". Если у вас возникнут вопросы, как адаптировать код под свои нужды, обращайтесь ко мне на Patreon.
Patreon - 3DGROUNDЗаключение
Я снял видео с веб-браузера, получилось не хуже, чем делать рендер анимации 😉
Проект получился действительно классным, интерактив дарит новый опыт и впечатления. Проекты такого типа несомненно заслуживают своей ниши, поскольку это дешевле и проще чем на Unreal Engine. Вы просто предоставляете ссылку клиенту и интерактив будет работать на десктопных компьютерах, мобильных устройствах, телевизорах, на Windows, Linux, iOS, Android, без какого-то специального ПО, везде, где работает веб-браузер.
Мультиплатформенность и маленький вес проекта (всего 40 Мб), позволяет открывать проект даже на слабых устройствах с плохим интернет-соединением.
Главная особенность Playcanvas, в том, что над проектом может одновременно работать несколько людей, доступная документация, много примеров реализации различного функционала и бесплатные1 Гб пространства.
Если, вам интересны такие уроки, поддержите меня на Patreon!
Patreon - 3DGROUNDНу, а теперь давайте насладимся результатом.
Бонус
Также, уже доступен продвинутый урок по добавлению больше интерактивности интерьеру SVOYA.
Это более комплексный урок, который затрагивает важные темы:
- Создание видеотекстуры для материала TV, а также возможность управлять Play/Pause при помощи UI-кнопки;
- Смена цветов шкафов по нажатию UI-кнопки;
- Создание материалов для дивана, имитирующего Falloff, смена материалов дивана по нажатию UI-кнопки;
- Адаптация под мобильные устройства, добавление Joystick;
- Улучшение loading.js для адаптации под мобильные устройства.