Этот урок является логическим продолжением двух предыдущих статей (часть 1, часть 2) про создание трёхмерных конфигураторов без использования программирования и вёрстки.

В прошлой части мы рассматривали вопрос интеграции трёхмерной части с использованием штатной системы заказов, входящей в плагин Verge3D для WordPress. Однако такой вариант подходит далеко не всем, поскольку возможности этого плагина существенно ограничены. С его помощью невозможно получить доступ к популярным платёжным системам, типа PayPal или 2Checkout, невозможно оперировать со скидками, купонами, запасами и прочими вещами, которые все привыкли видеть в популярных системах электронной коммерции.



В этой статье мы покажем, как обойти эти ограничения и интегрировать трёхмерную визуализацию непосредственно в интернет магазин на WooCommerce. К слову, на сегодняшний день это самая популярная система электронной коммерции — согласно статистике она используется в 28% всех интернет-магазинов.

Так часто бывает, что техники оптимизации, хорошо работающие для обычной десктопной или мобильной графики, не всегда дают нужный эффект в случае WebGL. В этой статье я собрал (а точнее перевёл на русский язык и изложил в текстовом виде нашу презентацию с Verge3Day) те методы повышения производительности, которые хорошо себя зарекомендовали при создании интерактивных веб-приложений.

Мы не можем представить нашу жизнь без трёхмерной анимации. С утра до глубокой ночи нам показывают всевозможные рекламные ролики, эксплейнеры, презентации продуктов и фильмы. Тысячи digital агентств и фрилансеров конкурируют друг с другом, стремясь создать наиболее привлекательный 3D-контент для своих клиентов, а те в свою очередь, пытаются продавать свои продукты миллионам потребителей.

Вот пример качественно сделанной трёхмерной анимации. Как все могли догадаться, это презентация нового iPhone XS.

В нашей предыдущей статье «Делаем 3D конфигуратор без программирования и вёрстки» мы обсудили вопросы создания 3D-магазина ювелирных изделий с использованием пакетов моделирования Blender и 3ds Max.

Сегодня мы обновим этот проект и сделаем из него реально работающий магазин. Для этого нам понадобится снабдить его следующими функциями:
 

• Вычисление цены на основе конфигурации пользователя.
• Отправка заказов для дальнейшей обработки менеджером.
• Кнопки социальных сетей (куда без них).

В конце концов, у нас будет что-то вроде этого:



Нажмите тут, чтобы запустить приложение.

Несколько месяцев назад некоторые из наших клиентов начали сообщать о проблемах с подключением к нашему хостингу WebGL-приложений Verge3D Network. Как оказалось, причиной этого были заблокированные Роскомнадзором IP-адреса Amazon Web Services.

Неприятно, конечно, но терпимо. Verge3D — десктопный тулкит, а публикация на амазоновском хостинге это приятная, но не критичная для работы фича. Тем не менее, такие события заставляют задуматься о перспективах. Собственно, эта статья содержит некоторые соображения об облачных сервисах вообще и WebGL-сервисах в частности.

3D-конфигураторы продуктов — это относительно новая тенденция в онлайн-маркетинге и электронной коммерции. Создание таких веб-приложений стало возможным вследствие быстрого развития браузерной технологии WebGL, позволяющей рисовать 3D-графику прямо на веб-страницах пользователей.

На мой взгляд, единственная проблема, которая мешает развитию этой тенденции — отсутствие эффективных инструментов. Большинство из них являются трёхмерными движками, которые могут быть очень полезны программисту, но не обычному художнику. Но есть и исключения: аддон Verge3D к пакетам 3ds Max и Blender предлагает средства, с помощью которых трёхмерные конфигураторы может сделать и обычный человек. Именно этот инструмент мы и разберём в нашей статье.

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



Кликните тут чтобы запустить конфигуратор в новом окне.

Недавно разработчики Facebook анонсировали поддержку 3D-постов. То есть теперь любой пользователь может легко загрузить низкополигональную модель в нужном формате (об этом ниже), снабдить её текстом и показывать своим друзьям и знакомым.