Это забавная штука в 3D: ты хочешь, чтобы она была повернута в ту сторону, или ты хочешь, чтобы она была в ту сторону.
Несомненный плюс по сравнению с фото и видео.
А если к этому добавить интерактивность, пользы будет еще больше.
Вопрос только в том, думают ли так же представители бизнеса? На этот раз речь пойдет о 3D-конфигураторах.
При этом самой консервативной и массовой частью отрасли является автопром.
Предисловие
«WebGL рулит!» — это серия статей, в которых рассказывается об интересных, актуальных и интересных веб-ресурсах, так или иначе связанных с одноименной технологией.Вы можете прочитать первый материал Здесь .
Существует множество марок автомобилей.
Много.
Товар не первой необходимости и явно куплен на длительный срок использования.
Казалось бы, автомобильные сайты должны быть не просто интересными, а находиться на пике возможностей, которые предлагает современный Интернет. Зрелищность – это все.
Никакие тексты, таблицы и изображения не могут конкурировать с «живой» картинкой.
Покупателю всегда хочется «поиграть» с будущей покупкой: оценить цвет, выбрать стиль интерьера, сменить комплектацию.
И только после этого потенциальный клиент может прийти в автосалон и выбрать автомобиль.
На практике оказалось, что многие автомобильные ресурсы отстали от жизни.
Иногда мне попадались сайты, которые требовали для просмотра презентации установить Flash Player, который на сегодняшний день немного устарел.
Любопытно, что в список таких ресурсов вошли сайты некоторых известных брендов.
Также очень часто используются технологии «псевдо-3D», где посетителю предлагают долго скучать, пока загружаются очень массивные панорамные фотографии.
Ни о каких развлечениях и тем более об интерактивности здесь, конечно, речи не идет. Однако мне удалось найти несколько интересных веб-ресурсов, предлагающих визуально качественные презентации или функциональные конфигураторы, выполненные с использованием современной технологии WebGL. Понятно, что такие ресурсы выгодно отличаются от своих мшистых собратьев.
Карвизуализатор.
плюс360градусов
Этот сайт не посвящен конкретному производителю и не имеет никакого отношения к автомобильной промышленности.
Это одно из первых приложений WebGL, предлагающее простые функции настройки.
Здесь вы можете изменить цвет машины или колес, рассмотреть машину со всех сторон, слушая музыку.
И это все.
Приложение создано на Три.
js Однако еще в 2012 году он привлек внимание.
Прежде всего, визуальная сторона.
Роскошные материалы, отражение окружающего мира на поверхности автомобиля, качественные модели.
Ни о каком фотореализме здесь, конечно, не может быть и речи.
Просто хорошая работа для того времени.
Однако уже в этой сцене есть зачатки интерактивности, что выглядит гораздо выигрышнее на фоне обычного 2D.
Pickup-center.fr
Уже есть практический пример, когда бизнес использует возможности 3D, чтобы наглядно показать покупателю «товар лицом к лицу».
Это веб-ресурс французской компании, занимающейся продажей различных пикапов.
Владельцы сайта подошли к решению проблемы очень ответственно и творчески.
Практически все представленные машины имеют свои конфигураторы.
При этом максимально используется связь между приложением WebGL и остальным сайтом.
Например, если в конфигураторе установить защиту двигателя, то рядом с ней отображается фото детали, стоимость модернизации и описание.
Таким образом, покупатель может в веб-приложении полностью собрать пикап под свои нужды, оценить внешний вид автомобиля и рассчитать стоимость покупки.
3D-конфигуратор не выглядит инопланетным предметом в этом интернет-магазине, а органично вписывается в экосистему.
Хотя есть некоторые огрехи в визуальном плане.
Никакого напыщенного фотореализма здесь нет, а навигация в приложении разочаровывает. Но, повторюсь, конфигуратор прекрасно справляется со своей основной задачей – предоставить клиенту возможность визуально собрать автомобиль нужной модификации и оценить стоимость.
Само приложение сделано с использованием Blend4Web , который очень хорошо заточен специально под различные 3D-конфигураторы.
Зная этот фреймворк, могу предположить, что для создания программной части использовался редактор визуальной логики, что значительно упрощает процесс разработки.
Nissan.co.uk
Оригинальная рекламная презентация автомобиля Nissan, опубликованная на официальном сайте производителя.
Это не конфигуратор в прямом смысле слова, хотя это интерактивное приложение.
Разработчик постарался добиться «вау»-эффекта, а не предоставить возможность что-либо изменить.
Помимо качественно сделанной модели, здесь есть и творческая составляющая.
Все начинается с необычной загрузки, когда машина собирается буквально как пазл.
Затем предлагается фантасмагория с цветами, смысл которой заключается в том, что цвет автомобиля меняется при движении мышки.
Очень быстрый, очень яркий.
Вы также можете открыть дверь и заглянуть внутрь.
Но это как побочный вариант. Презентация похожа на игрушку: веселая и радужная.
Не зря его девиз — «Играй по-своему».
К сожалению, мне не удалось определить, какой движок или фреймворк использовался для создания программы.
Automotive.products.constellium.com
Constellium — мировой производитель полуфабрикатов из алюминия со штаб-квартирой в Нидерландах.
По крайней мере, так говорит Википедия.
На официальном сайте есть замечательная презентация.
Ни для кого не секрет, что в автомобилях используется большое количество алюминия.
И не только в радиаторе, как может показаться несведущему.
Производители из Constellium решили наглядно продемонстрировать наличие алюминия в автомобиле, разобрав его.
Да Да.
Презентация позволяет разобрать автомобиль по частям, показать все алюминиевые детали и прочитать по ним контекстную справку.
В принципе, это все, на что способна программа.
Но выглядит ясно, поучительно и информативно.
К сожалению, приложение не без проблем.
Поворот камеры настроен странно.
Например, мне случайно удалось перевернуть машину, хотя она стояла на поверхности.
Но самое смешное произойдет, если вы вызовете консоль браузера (клавиша F12).
В этом случае модель сгладится.
Технически презентация была создана с использованием Единство .
chevrolet.alghandi.com
Арабские мираты, жаркое солнце и богатые, очень богатые шейхи.
Подарите им роскошные, дорогие автомобили в максимальной комплектации.
Собственно, именно для этого и предназначена следующая презентация.
Автодилер General Motors в ОА? любит своих богатых клиентов и периодически балует их интересными 3D-презентациями.
Данная презентация по сути представляет собой классический 3D-конфигуратор с возможностью выбора цвета автомобиля, смены колесных дисков, изучения интерьера салона и так далее.
Однако здесь разработчики приложения сосредоточились именно на визуальной составляющей.
В модели автомобиля все выверено до мелочей.
Очень качественные материалы позволяют передать тонкости полировки автомобиля.
Например, «черная мозаика» буквально переливается на свету.
Интересно, как разработчики добились такого эффекта? Движения камеры идеальны.
Плавная анимация, подготовленные ракурсы – все это подчеркивает машину с лучших сторон.
Кстати, это единственная найденная презентация, в которой используются постэффекты.
Так вот у камер в определённые моменты включается ГРИП (глубина резкости).
Этот 3D-конфигуратор был создан с использованием Blend4Web.
Послесловие
WebGL позволяет создавать по-настоящему интересные, красочные и реалистичные презентации.Пять представленных работ – это, конечно, не единственные представители славного племени 3D-конфигураторов.
К сожалению, их немного, несмотря на перспективы, которые открываются при их использовании.
Но я верю, что все еще впереди.
P.S. Названия подзаголовков кликабельны и ведут на страницы с приложениями.
Теги: #webgl #дизайн сайтов #3d графика #автомобили и веб-дизайн #браузеры
-
Google Инвестирует В Виртуальную Реальность
19 Oct, 24 -
Как Интегрировать Zimbra С Dlp-Системой?
19 Oct, 24
