Оставаясь на нашем сайте, вы соглашаетесь с использованием файлов cookie и Политикой конфиденциальности.
Принять

Вирту-альные шоурумы и 3D-сайты

Зачем бренду интерактивный интернет-магазин, и как работает интерактивная витрина

Зачем бизнесу виртуальный шоурум

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

Это уже не будущее, а реальность электронной коммерции. Пространственная организация интерактивных проектов – это сайты нового поколения и Web3D. Потому что все идет к возможности пользователей исследовать контент в разных плоскостях.

Пока вы думаете, может быть все-таки сделать виртуальную примерку или шоурум, вот так выглядит иммерсивный шоппинг в крупнейшем интернет-магазине розничной торговли Tmall в Китае.
Иммерсивный онлайн-шопинг на платформе Tmall в Китае

Разработка виртуального шоурума

Разработка виртуального шоурума – симбиоз дизайна игровых уровней и классического визуального мерчандайзинга физического мира, потому что основные посетители – это не геймеры, а обычные пользователи.

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

Сразу после точки входа должно быть пространство, где пользователь может осмотреться, особенно, если на контрасте провести человека через небольшой тамбур. В Uncharted: The Lost Legacy (2017) много смотровых площадок с роскошным видом на какую-нибудь локацию. Еще лучше работает с вау-моментом – то, что пользователь увидит прямо напротив точки входа, должно вызвать положительные эмоции. Например, сцена с жирафами в The Last Of Us (2013).

Зрительные «якоря» должны располагаться в вершинах «золотых треугольников» максимально далеко от входа, чтобы заставить пройти по всей локации. Также по аналогии с супермаркетом: мы издали видим акцентно оформленные зоны скидок, сезонных товаров и т.д..
Цифровая копия реального магазина – это скучно для пользователя. Можно создать целый мир и невербально передавать сообщение, которое бренд транслирует на свою аудиторию.

У 3D-сайта есть сторителлинг, смысловая и сюжетная составляющая: что происходит, с кем происходит, почему происходит, в каком жанре происходит. И если оно так происходит, значит – это кому-нибудь нужно (маркетологам и продюсерам).

Укрупненно виртуальные миры могут управляться по одному из трех законов (или их комбинаций). Поэтому у каждого виртуального шоурума есть свой хронотоп – где и когда все существует, что было до этого, по каким законам все работает.

Это влияет на визуализацию: как выглядят пространство и персонажи, какие эмоции вызывают, какие фактуры и цвета используются.
жанры виртуальных миров
Визуал и жанры виртуального шоурума
Один из способов придания запоминаемости и виральности шоуруму – совмещение нескольких жанровых тематик.

Например, если смотреть в играх, то в Crysis (2007) действие происходит на тропическом острове, где инопланетный корабль потерпел крушение и заморозил джунгли. В Crysis 3 (2013) Нью-Йорк разрушен вторжением инопланетян и за годы запустения покрылся растительностью (отсылка к роману «День триффидов» Джона Уиндема, 1962 год. Впечатлительным не рекомендую читать на ночь). В Fallout 3 (2008) совместили ретрофутуризм и постапокалиптические пейзажи.

Мерчендайзинг в виртуальном шоуруме

В основе визуальной структуры виртуального представительства бренда могут быть:
  • фирменный стиль и логотип,
  • продукт/ услуга и их свойства,
  • миссия и ценности компании.

Для вдохновения посмотрим виртуальный шоурум корейского косметического бренда The History of Whoo с французским художником Пьером Мари.

В пространственной геометрии раскрыли форму логотипа бренда. В качестве основы самого пространства сделали рендер на сферическую камеру четырех сцен – Комната Небес, Комната Земли, Комната Луны и Комната Солнца, и добавили небольшое количество отдельных объектов.
В концепте пространства в метавселенной SONY с Metaverse Architecture Competition интересно разложили инновационные продукты и патенты бренда – Smart Lenses. Слоган – увидеть невидимое.

В основе планировки по этажам – оптические свойства (преломление, отражение, четкость и т.д..) и функции (оптический зум, фото- и видеосъемка) вместе со сторителлингом о развитии компании.

В качестве референсов материалов – отсылки к разработкам бренда. Наверху – шоурум с действующими продуктами компании.
Можно бесконечно наблюдать, как пользователь материализуется в центре виртуального шоурума, оглядывает ангар с расставленными по периметру объектами и выходит через минуту.

Есть несколько способов организации пространства, чтобы мягко вовлечь посетителя в просмотр цифровых экспонатов и увеличить время пребывания на локации.
  • Петля

    На сленге физических мерчендайзеров такая планировка называется «бутиковая». Покупателям гораздо удобнее передвигаться кругами, чем по рядам решетки из стеллажей: просматриваемость и отсутствие необходимости бегать вперед-назад больше располагают к покупкам.

    Характерно для локаций и игр открытого мира. Может применяться для планировки отдельных комнат. Перемещение пользователей организовано по кругу, в центре расположен «остров», препятствие. Точки входа и выхода совпадают или находятся рядом.

    Этот прием позволяет оптимизировать маршрут и избавить пользователя от долгого пути назад по местности, если на ней больше ничего не происходит – все объекты исследованы, квесты пройдены, артефакты собраны. Часто так делают в виртуальных лобби.
  • Лабиринт

    Универсальный способ, который подходит как для готовых темплейтов, так и для собственных миров. Нелинейная структура – это возможность выбора для пользователя, увлекательный процесс исследования всей площади.

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

Этапы работ

Бриф
Определяем цели, задачи и смысловую основу виртуального шоурума. Аудит сильных сторон и УТП бренда.
Концепт
Переносим смысл в форму и действия. Определяем жанр, стиль и визуал проекта. Разработка сценария поведения пользователя в виртуальном шоуруме.
2D-план
На виде сверху прорабатываем размещение объектов и траектории перемещений персонажей, объектов, пользователей.
Прототипирование
Переносим структурную геометрию в 3D-формат. Определяем масштаб, количество объектов, разрабатываем базовый интерактивный функционал. Первичное тестирование.
Контент и создание сцены
Основная разработка 3D-моделей, анимации, 2D-графики, звукового сопровождения. Сборка сцены, подключение и настройка взаимодействия, освещение, постпроцессинг, спецэффекты. Финальное тестирование.
Размещение и публикация
Ваш шоурум готов к приему посетителей.
Заказать разработку

Кейсы наших проектов

Создаем виртуальные шоурумы с взаимодействием и крутой графикой для различных устройств и WebXR в браузере с интеграцией на сайт.