Только AliExpress мог взять День холостяка, студенческий праздник с оттенком грусти, и превратить его за несколько лет в Международный день шоппинга. Вот уже несколько лет 11.11 легко и непринуждённо конкурирует с «Чёрной пятницей», захватывая весь мир. Разумеется, лидер ритейла такой силы и такого потенциала не мог обойти вниманием современные технологии. В последнее время AliExpress не просто увлекся модными гаджетами и приложениями, но и начал на них много зарабатывать. Очень много. Недавно наша компания Fibrum создала платформу, послужившую основой для виртуального магазина AliExpress. В этой статье я расскажу об особенностях этой платформы VR-магазинов. Кстати, для нашей платформы очки не нннада. Ну почти.
Многие знают, что 11 ноября китайцы, увлеченные магией цифр, отмечают День холостяка, так как эта дата собирает вместе четыре единицы (11.11). В последние годы в День холостяка проходит всё больше распродаж в интернет-магазинах, и 11 ноября становится китайской «Черной пятницей». Поэтому наш совместный с AliExpress проект и был приурочен ко дню онлайн-шоппинга в Поднебесной.
Сам AliExpress уже тестировал VR-магазины в 2016 году. Коммерческий успех этого эксперимента в прошлогоднюю «Черную пятницу» был феноменальным – VR-магазины посетили 8 млн человек. Неудивительно, что AliExpress решил продолжить в том же духе, только теперь уже в России.
Вот так выглядят VR-магазины AliExpress для пользователей из Австралии, Америки и Японии.
Первый проект Alibaba немного отличался от российского тем, что был реализован c применением технологии дополненной, а не виртуальной реальности. О проекте можно посмотреть репортаж CNN.
3 ноября 2017 года мы осуществили пробный запуск виртуального магазина AliExpress в нашей стране. А 7 ноября магазин Tmall в виртуальной реальности заработал в полную силу: в 11 российских городах была размещена реклама с QR-кодами, по которым можно было перейти в магазин с VR-товарами AliExpress.
В 2015 году наша компания стала победителем совместного конкурса стартапов «Сколково» и AliExpress, и мы получили право разместить VR-шлемы Fibrum Pro на китайской торговой площадке. Так началось наше сотрудничество с AliExpress. Оно было успешным, и это стало решающим при выборе подрядчика для создания виртуальных магазинов в России.
Кстати, в 2016 году состоялась личная встреча основателя Alibaba Джека Ма с CEO Fibrum Ильёй Флаксом во время Всемирного интернет-форума в Китае. Мы подарили свой VR-шлем Джеку Ма. Хотя беседа была не очень долгой, за это время Илья и Джек успели поговорить о наших продуктах.
По скану QR-кода или по прямой ссылке покупатель заходит в магазин, выбирает один из трех отделов (виртуальные комнаты «Техника», «Детям» и «Мода») и оказывается среди виртуальной продукции.
Пользователь перемещается по виртуальному магазину, направляя взгляд в нужную сторону и активируя кнопку с пиктограммой ног.
Чтобы выбрать товар, пользователь задерживает на нем взгляд, что вызывает загрузку ретайкла (указателя в центре взгляда), после чего открывается сцена с close-up — детальным просмотром товара и его характеристик с возможностью покрутить его по оси Х, а также добавить в корзину.
Фактически, пользователю не нужен шлем виртуальной реальности (доступ возможен с обычного браузера), но для более полного погружения в VR я бы посоветовал всё же надеть шлем – так интереснее. Главное, чтобы шлем был совместим с вашим телефоном.
Чтобы увлечь покупателя, мы использовали механику игры и придумали разные «фишки».
За каждое действие (даже за входы и выходы из комнат) пользователю начисляются геймификационные баллы.
Если поймать кота, который «гуляет» по Tmall, можно «заработать» купон на $2-4. Носиться по комнатам за животным не придется. В нашем магазине нет звукового сопровождения, и только кот выдаёт свое присутствие очередным «мяу». Когда пользователь слышит «кота», он должен «словить» его взглядом, чтобы получить скидку.
За наведение смартфона на стеклянный куб, который есть в каждой комнате, пользователь получал приглашение на оффлайн-мероприятие Tmall, которое прошло в Москве у торгового центра «Атриум». Набирая баллы, пользователь приобретает особый статус, которым можно поделиться в социальных сетях.
В комнатах также поставили «Тинькофф сундук»: открыв его, покупатель может получить бонус на приобретение товаров.
Коллеги из AliExpress настаивали, чтобы мы все сделали в браузере, так как это намного удобнее традиционной модели с созданием отдельного приложения, использовать которое можно только со шлемом виртуальной реальности. Web-VR более доступен, и это стало решающим фактором. Тогда это казалось почти невозможным. Тем более, за месяц, который нам дали на всё про всё.
Мы рискнули, хотя и понимали, что подобных решений никто не делал и по ходу будет много проблем.
По итогам консультации со специалистами AliExpress мы написали техническое задание, в рамках которого начали разработку. От AliExpress мы получали фотографии товаров и на их основании делали 3D-модели. В целом процесс 3D-моделирования был довольно стандартным, за исключением необходимости преобразовывать полученные файлы в специальный формат, который используется в фреймворке. Например, вот так выглядит модель комнаты с расположенными в ней предметами.
На стороне клиента также был создан дизайн холла и комнат, всплывающих окон с игровыми достижениями и некоторые другие графические элементы. Техническая же реализация проекта была полностью на нашей стороне.
Над платформой работали восемь специалистов: три дизайнера, два разработчика, тестировщик, менеджер по продукту и арт-директор. Менеджер по продукту курировал вопросы взаимодействия с AliExpress. Арт-директор отвечал за визуальную составляющую.
В итоге у нашей команды получилось очень сложное технологическое решение с несколькими комнатами, геймификацией, с VR-режимом в браузере с любого телефона.
Платформа для VR-магазина AliExpress разработана с нуля при использовании HTML-фреймворка A-Frame для создания сайтов виртуальной реальности (технология также известна как Web-VR). Основная технология отрисовки — WebGL.
Поскольку виртуальная реальность в проекте для AliExpress реализована в виде веб-приложения, работающего в браузере, ресурсы для него распределяются иначе. А раз нет необходимости создавать тяжёлые графические элементы, производительность у него выше, чем у классических VR-решений.
Для отслеживания движений человека в нашем решении для AliExpress используются только внутренние датчики телефона: акселерометр и гироскоп. Мы также учли существование телефонов без гироскопа и обошли это ограничение, реализовав управление движениями пальцев по экрану. Систем трекинга положения человека в пространстве этот проект не подразумевает.
Я не раз слышал жалобы пользователей, попробовавших VR, на задержки при повороте головой и нечеткое изображение. К магазину AliExpress все это не имеет отношения, поскольку он разрабатывался на основе Web-VR и не является приложением, которое устанавливается напрямую из магазина. Недостаточное расстояние между объектами (тоже частая жалоба VR-пользователей) в этом проекте опять же не является большой проблемой: мы выявили подобное на стадии тестирования, слегка переставили объекты на полках, и стало комфортно.
Слабые места проекта и главные наши «грабли» – это неполная поддержка Web-VR браузерами современных смартфонов. Web-VR все еще активно развивается, дорабатывается, и некоторые особенности могут быть реализованы при помощи полифилов. Соответственно, стопроцентная работоспособность функционала не может быть гарантирована и должна тщательно тестироваться.
В AliExpress говорят, что в случае успеха нашего решения они рассмотрят возможность запуска полноценных виртуальных магазинов в других странах, так как открытие и содержание магазинов нового формата стоит в разы дешевле обычных точек продаж, а разместить их можно без привязки к торговым центрам или магазинам.
Fibrum же получил очень ценный опыт разработки Web-VR проектов, который впоследствии можно масштабировать на другие проекты. Мы надеемся, что пример AliExpress вдохновит российские компании более активно использовать виртуальную реальность в качестве канала продаж.
А пока мы работаем над другим проектом — запуском нового приложения, в котором можно выбрать эмоцию и испытать её, отправившись в приключения в виртуальной реальности. О нем мы, конечно, тоже расскажем читателям Хабра. Но в следующий раз.
Первые эксперименты с другой реальностью
Многие знают, что 11 ноября китайцы, увлеченные магией цифр, отмечают День холостяка, так как эта дата собирает вместе четыре единицы (11.11). В последние годы в День холостяка проходит всё больше распродаж в интернет-магазинах, и 11 ноября становится китайской «Черной пятницей». Поэтому наш совместный с AliExpress проект и был приурочен ко дню онлайн-шоппинга в Поднебесной.
Сам AliExpress уже тестировал VR-магазины в 2016 году. Коммерческий успех этого эксперимента в прошлогоднюю «Черную пятницу» был феноменальным – VR-магазины посетили 8 млн человек. Неудивительно, что AliExpress решил продолжить в том же духе, только теперь уже в России.
Вот так выглядят VR-магазины AliExpress для пользователей из Австралии, Америки и Японии.
Первый проект Alibaba немного отличался от российского тем, что был реализован c применением технологии дополненной, а не виртуальной реальности. О проекте можно посмотреть репортаж CNN.
3 ноября 2017 года мы осуществили пробный запуск виртуального магазина AliExpress в нашей стране. А 7 ноября магазин Tmall в виртуальной реальности заработал в полную силу: в 11 российских городах была размещена реклама с QR-кодами, по которым можно было перейти в магазин с VR-товарами AliExpress.
Почему AliExpress выбрал Fibrum
В 2015 году наша компания стала победителем совместного конкурса стартапов «Сколково» и AliExpress, и мы получили право разместить VR-шлемы Fibrum Pro на китайской торговой площадке. Так началось наше сотрудничество с AliExpress. Оно было успешным, и это стало решающим при выборе подрядчика для создания виртуальных магазинов в России.
Кстати, в 2016 году состоялась личная встреча основателя Alibaba Джека Ма с CEO Fibrum Ильёй Флаксом во время Всемирного интернет-форума в Китае. Мы подарили свой VR-шлем Джеку Ма. Хотя беседа была не очень долгой, за это время Илья и Джек успели поговорить о наших продуктах.
Как выглядит VR-магазин
По скану QR-кода или по прямой ссылке покупатель заходит в магазин, выбирает один из трех отделов (виртуальные комнаты «Техника», «Детям» и «Мода») и оказывается среди виртуальной продукции.
Пользователь перемещается по виртуальному магазину, направляя взгляд в нужную сторону и активируя кнопку с пиктограммой ног.
Чтобы выбрать товар, пользователь задерживает на нем взгляд, что вызывает загрузку ретайкла (указателя в центре взгляда), после чего открывается сцена с close-up — детальным просмотром товара и его характеристик с возможностью покрутить его по оси Х, а также добавить в корзину.
Фактически, пользователю не нужен шлем виртуальной реальности (доступ возможен с обычного браузера), но для более полного погружения в VR я бы посоветовал всё же надеть шлем – так интереснее. Главное, чтобы шлем был совместим с вашим телефоном.
Покупатели – геймеры
Чтобы увлечь покупателя, мы использовали механику игры и придумали разные «фишки».
За каждое действие (даже за входы и выходы из комнат) пользователю начисляются геймификационные баллы.
Если поймать кота, который «гуляет» по Tmall, можно «заработать» купон на $2-4. Носиться по комнатам за животным не придется. В нашем магазине нет звукового сопровождения, и только кот выдаёт свое присутствие очередным «мяу». Когда пользователь слышит «кота», он должен «словить» его взглядом, чтобы получить скидку.
За наведение смартфона на стеклянный куб, который есть в каждой комнате, пользователь получал приглашение на оффлайн-мероприятие Tmall, которое прошло в Москве у торгового центра «Атриум». Набирая баллы, пользователь приобретает особый статус, которым можно поделиться в социальных сетях.
В комнатах также поставили «Тинькофф сундук»: открыв его, покупатель может получить бонус на приобретение товаров.
Техническая реализация
Коллеги из AliExpress настаивали, чтобы мы все сделали в браузере, так как это намного удобнее традиционной модели с созданием отдельного приложения, использовать которое можно только со шлемом виртуальной реальности. Web-VR более доступен, и это стало решающим фактором. Тогда это казалось почти невозможным. Тем более, за месяц, который нам дали на всё про всё.
Мы рискнули, хотя и понимали, что подобных решений никто не делал и по ходу будет много проблем.
По итогам консультации со специалистами AliExpress мы написали техническое задание, в рамках которого начали разработку. От AliExpress мы получали фотографии товаров и на их основании делали 3D-модели. В целом процесс 3D-моделирования был довольно стандартным, за исключением необходимости преобразовывать полученные файлы в специальный формат, который используется в фреймворке. Например, вот так выглядит модель комнаты с расположенными в ней предметами.
На стороне клиента также был создан дизайн холла и комнат, всплывающих окон с игровыми достижениями и некоторые другие графические элементы. Техническая же реализация проекта была полностью на нашей стороне.
Над платформой работали восемь специалистов: три дизайнера, два разработчика, тестировщик, менеджер по продукту и арт-директор. Менеджер по продукту курировал вопросы взаимодействия с AliExpress. Арт-директор отвечал за визуальную составляющую.
В итоге у нашей команды получилось очень сложное технологическое решение с несколькими комнатами, геймификацией, с VR-режимом в браузере с любого телефона.
Платформа для VR-магазина AliExpress разработана с нуля при использовании HTML-фреймворка A-Frame для создания сайтов виртуальной реальности (технология также известна как Web-VR). Основная технология отрисовки — WebGL.
Поскольку виртуальная реальность в проекте для AliExpress реализована в виде веб-приложения, работающего в браузере, ресурсы для него распределяются иначе. А раз нет необходимости создавать тяжёлые графические элементы, производительность у него выше, чем у классических VR-решений.
Для отслеживания движений человека в нашем решении для AliExpress используются только внутренние датчики телефона: акселерометр и гироскоп. Мы также учли существование телефонов без гироскопа и обошли это ограничение, реализовав управление движениями пальцев по экрану. Систем трекинга положения человека в пространстве этот проект не подразумевает.
Я не раз слышал жалобы пользователей, попробовавших VR, на задержки при повороте головой и нечеткое изображение. К магазину AliExpress все это не имеет отношения, поскольку он разрабатывался на основе Web-VR и не является приложением, которое устанавливается напрямую из магазина. Недостаточное расстояние между объектами (тоже частая жалоба VR-пользователей) в этом проекте опять же не является большой проблемой: мы выявили подобное на стадии тестирования, слегка переставили объекты на полках, и стало комфортно.
Слабые места проекта и главные наши «грабли» – это неполная поддержка Web-VR браузерами современных смартфонов. Web-VR все еще активно развивается, дорабатывается, и некоторые особенности могут быть реализованы при помощи полифилов. Соответственно, стопроцентная работоспособность функционала не может быть гарантирована и должна тщательно тестироваться.
Итоги и перспективы
В AliExpress говорят, что в случае успеха нашего решения они рассмотрят возможность запуска полноценных виртуальных магазинов в других странах, так как открытие и содержание магазинов нового формата стоит в разы дешевле обычных точек продаж, а разместить их можно без привязки к торговым центрам или магазинам.
Fibrum же получил очень ценный опыт разработки Web-VR проектов, который впоследствии можно масштабировать на другие проекты. Мы надеемся, что пример AliExpress вдохновит российские компании более активно использовать виртуальную реальность в качестве канала продаж.
А пока мы работаем над другим проектом — запуском нового приложения, в котором можно выбрать эмоцию и испытать её, отправившись в приключения в виртуальной реальности. О нем мы, конечно, тоже расскажем читателям Хабра. Но в следующий раз.
