淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物

導語:阿里巴巴是怎麼做VR購物的?VR購物會成爲電商的未來嗎?此次公開課我們邀請到了Buy+負責人胡曉航,爲你解答所有這些疑問。

一年一度的網購狂歡節“雙十一”剛剛過去,這不僅僅是購物者的盛宴,也是各種新技術登場的時刻,其中就包括Buy+ VR購物。

有很多人喜歡網購體驗,端着手機、電腦、Pad一頁頁瀏覽商品,但也有許多人懷念線下購物,那種和姐妹一起逛街、聊天,拿起一件商品查看標籤和價格的感覺。VR購物或許就可以在這兩種體驗中找到一箇中間值,讓你同時擁有網購和實體店的體驗。

Buy+於11月1日在手機淘寶上線,一個可以用VR手機盒子體驗的購物應用,帶你穿越到世界各地的商場購物,遇到喜歡的還可以直接線上下單。

除了這個手機版,此前阿里還公佈過通過3D建模打造的HTC Vive VR購物體驗。那麼,阿里巴巴是怎麼做VR購物的?VR購物會成爲電商的未來嗎?此次公開課我們邀請到了Buy+負責人胡曉航,爲你解答所有這些疑問。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

胡曉航簡介

胡曉航,Buy+負責人,負責VR業務的探索。手淘無線技術專家,虛擬互動的負責人,給雙十一提供各種好玩的虛擬互動。

以下內容整理自胡曉航在硬創公開課上的分享:

大家好!我是來至阿里巴巴的宋五,目前負責Buy+和造物神計劃。今天從三個維度看BUY+,一是數據、二是願景、三是技術和產品。

Buy+的數據

首先簡單過一下可以公開的數據。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

這次的Buy+其實是在11月11日上線的,已經完成了整個購物鏈路,而不是停留在修demo的階段了。我們還是想去嘗試一下用戶對VR購物持有怎樣的態度。

從以上數據看出,大家對新鮮事物還是有興趣去體驗一下的。特別值得一提的是Buy+用戶的年齡分佈,還是以25-29歲的年輕人居多。以後VR的產品可能瞄準的也是這羣人。

這次整個Buy+完成了三個國家七個場景的購物,商品數的話不多就百級別。想分享的故事就是在家就可以隨時隨地買遍全球。

Buy+的願景

我們對Buy+的定義是探索極致的購物體驗,一方面,通過VR技術重建購物的環境和商品,利用合理的交互給大家提供比較真實的購物體驗;另一方面,通過每次發佈的產品去促進整個VR市場的發展,在用戶端對VR有更多的認知。所以這方面投入了很多的心血。

目前已經嘗試了PC的Buy+,在造物節的時候用HTC的VIVE做了兩個場景,一個是買包的一個是買內衣的,體驗的效果還不錯,不過那時候只是一個demo,沒有完成全鏈路。

這次的Buy+我們已經把全鏈路做通了,用戶可以在手機淘寶的APP上完成整個購物鏈路。

我們希望用簡單的方式,讓普通用戶有機會體驗到VR的東西。當然我們未來還會嘗試通過其他的手段,比如Detail AR把東西投影到現實的場景中看他的大小、形狀、顏色。還有 Detail 3D去展現全方位的商品詳情。我們還在嘗試用VR構建線下的店鋪,讓線上用戶對商家更有信任感。

Buy+的技術和產品

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

下面聊一聊大家比較關心的技術層面和產品層面的東西。我會通過以下四點展開來說:

一、爲什麼是全景視頻+手機淘寶+Cardboard 

首先,爲什麼用全景視頻和Cardboard,並且在手機淘寶上來呈現。

因爲現在Vive的方案是比較重的,除了VR設備還要買一臺PC機,做出來的方案很難有大量的用戶能夠體驗到。這樣受衆面非常窄,而且我們在造物節上做過一版Vive的體驗。這次我們的考慮是讓更多的消費者體驗到VR,所以我們選擇在移動端來實現這次的Buy+。

另外,考慮到客戶端普及度的問題,我們沒有用獨立的App去做,而是在手淘上。這樣可以讓最大的用戶羣體驗到VR購物,不需要下載用戶不認識的新App。

由於我們希望更廣泛的用戶體驗到VR購物,這也給我們的技術實現帶來了很大困難。比如我們選擇在手機淘寶App上實現,那麼如果用了一個非常大遊戲引擎,承載這些內容和交互,那會把手機淘寶App變得非常大。

爲什麼是全景視頻?因爲如果全用3D方案,建模起來需要時間成本;採用Cardboard而沒有用一體機也是從成本的角度考慮。另外,我們送出了20萬Cardboard。

二、場景建模

在全景視頻+手淘+Cardboard 的情況下,場景建模我們選擇了全景視頻,因爲成本和時間的考慮。

但也出現了一些困難,因爲選擇了全景視頻後,環境的清晰度下降了,空間移動也變得困難。

這兩塊在接下來的商品建模和交互方式方面我也會講到。

三、商品建模

商品建模方面,之所以有沒用3D模型,是因爲受到了交互方式的侷限。Cardboard搭配手機,即使是完完整整的3D模型,交互方式也無法發揮3D模型應有的作用。比如,把3D模型拿過來,近距離地看,走動,都不行。所以這些用的是360度環拍的照片,每隔一定角度我們取一張照片。

有一個事情工作量非常大,就是在場景中旋轉的照片需要把背景變成透明的,起初的時候覺得比較簡單,通過綠幕拍完直接摳掉就好了,但實際情況並沒有這麼理想。

所以這部分投入了非常大的工作量。

四、交互方式

交互方式上,主要只有一個交互方式,就是盯住觸發按鈕。很多人發現的是其實Cardboard上點擊的按鍵也是可以用的,但我們沒有宣傳。對於新事物,教用戶更多的新交互方式也是有教育成本和風險的,一次教太多,用戶反而可能不知所措。

因爲已經是基於手機+全景視頻了,所以交互上沒有特別好的方式讓你體驗到PC上Vive的體驗,沒法拿着商品,也沒法走動。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

Buy+裏標註的商品

不知道大家注意到一個細節沒有,採用了全景視頻以後,停下來商品總是能標定得非常準確。如果在純3D的模型裏這是非常簡單的,但現在是一個視頻,要每時每刻都知道物品在哪裏,是非常有難度的。

假設一個視頻每秒有60幀,是60張圖片,如果用手工一張一張去標商品在哪裏,這個工作量肯定是接受不了的。

最後我們嘗試了一些方案,碰到過的“坑”這裏分享一下:

1、圖片識別

作爲技術人員,我們首先想到的是做圖片識別。有一個標定的圖片,然後跑算法,一幀一幀去算,看每張圖片裏是不是有你想要的物品。

但是這個方案經過討論以後很快就被否定,也沒有去嘗試,因爲走到每個位置時看到的物品的面都不一樣,這給圖像識別帶來很大難度。而且很多商品在場景中看上去並不是那麼大,對圖像識別的要求實在太高,按照目前的技術無法實現。

2、顏色識別

於是我們想到了一個辦法,把整個全景視頻拍兩遍,第一遍正常拍,第二遍在有商品的位置用一個有特殊顏色的物品代替。然後用顏色的識別來取出商品相應的位置;

這裏有兩個難點,首先兩次拍攝的速度必須是一樣的,另外需要把場景中特殊顏色的位置全部用圖像算法摳出來。

我們真實嘗試時發現了兩個問題,一是如果代替物很小,在整個圖片中的像素表現是不夠的;二是很容易被其它顏色干擾,比如燈光,每個商店的燈光不一樣,而且環境中可能會有與物體顏色一樣的東西。經過多次嘗試後發現,這個方案也是不可行的。因爲我們對現場的燈光跟環境基本沒有控制力。

3、轉換座標系

這時我們又嘗試了另外一個方案,我們開始拍的時候把視頻的第一幀拿出來,所有物體離攝像頭的距離都測出來。然後根據攝像頭的勻速運動判斷商品下一幀會在什麼位置。

這個方案理論上蠻通的,但實現的時候也遇到很大技術困難,首先是勻速運動的問題,這個用軌道車可以解決。第二點,整個座標系轉化的問題,測量時一個很小的誤差會導致座標系轉化(平面座標轉化爲三維座標)產生很大的誤差。還有,每個攝像頭的參數不一樣,這導致每次座標系轉化的參數都要重新通過數據去訓練。

我們嘗試去訓練Insta 360的一個設備,最後訓練完拿到座標系的參數,誤差還可以。但是後來嘗試其它攝像頭,發現這個參數是完全不可用的。到此我們的第三種方案也基本可以認爲是不可行的。

空間移動方案

這次我們完成了兩個方向的全自由移動,原理也是蠻簡單的,我們把一個視頻拍完以後,轉成一個倒播的視頻。只需要在正向走動的時候播正向的視頻。

3D商品的展示和交互體系

3D商品的展現,我們選擇了一個蠻實用的方案,就是每個物品環拍一圈,然後每隔一定度數取一張照片,把它形成一個連播的文件。用戶進來的時候,就默認先播一圈,但這裏也有蠻坑的事情。如果商品和背景需要融合得很好的話,需要把背景摳成透明的。我們做了幾百個商品,每個商品都有很多張圖片,基本上屬於不能完成的工作量。

我們通過綠幕的手段,結合一些圖片提取的方法讓效率變得很高,最終把這件事情完成。

剛纔提到功能上線在手淘,像這種超級app對包的大小非常敏感,導致我們沒法用一些現成的遊戲引擎。裏面所有UI和交互都是我們自己用Open GL研發的。

我們構建了自己的座標體驗,事件的調度體系,UI複用還有粒子系統,動畫系統和事件檢測機制。

Buy+項目的開發投入和內容製作

整個項目做了3個月左右,我們做了所有的開發、嘗試,在3個國家取了7個場景。最後把場景和Buy+的產品融合起來。

各方都是並行開始的,在還沒有開發完產品的時候通過討論和技術的實現就已經定了內容的方案,內容組的同事就已經出發去拍攝了,開發組的同事還在開發,需求偶爾還會有一些變更。

可以想像,在這種情況下做出的內容要和系統完全匹配的難度是非常高的。

這裏不得不提一些拍攝內容的注意點,現在市面上拍攝有兩個設備用得比較多,一個是GoPro一個是360,使用場景也不一樣。GoPro的貨櫃間距要求會大一點,大概1點多米,360的話間距小一點,每邊是0.6-0.8米的樣子。

比如拍日本藥妝店,貨櫃放的非常近,因爲安全距離的問題很難拍,所以用了360的攝像頭,當然360的攝像頭肯定沒有GoPro那麼好。

還有拍攝VR視頻時建議能用靜止就靜止,如果一定要移動,就穩穩勻速移動,不然有轉彎或不是勻速的話,戴上去一分鐘大家就會暈得要死。

這就是選擇手機上做VR購物引起的問題,現在手機上沒有好技術來實現空間移動。

由於安全距離的問題,對小商品的細節描述會遇到問題,比如貨櫃上的手錶會看不清楚。

最後我們用子場景來解決,也就是走到一個區域時,我們讓你進入另外一個場景,這個場景是全景圖片,這個時候商品細節表現會好一些。

剛纔一些注意點好多剛開始定方案時是沒想到的,到實際拍時,技術的同學跟過去才發現這些問題,也導致了產品上非常多的一些反覆。

最後我們大概投入了7、8個市場運營和技術人員完成內容拍攝和後期製作,投入了大概20個開發人員把底層產品開發完畢,可以想像過程有多少緊張。

本地開發的適配問題

除了工作量跟沒有經驗可以借鑑外,其實還有一個蠻重要的問題,這次所有開發用的是原生Native,而不是H5的方案。由於雙十一所有的產品都要做一程度的保密,所以沒辦法做大規模灰度驗證。因爲按以往的開發慣例和經驗,Native的東西上線需要做一些線上的灰度,讓線上一些真實的用戶來發現一些隱藏的問題。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

Buy+在手淘裏的入口

既然不能去做線上灰度,如何保障線上技術穩定呢?我們做了幾個方面的事情,首先,我們適配了目前70幾款主流的設備,保證其在這些設備上的運行是沒有問題的。

並且每一次改版都需要重新去適配,因爲也不知道改版對兼容性會造成什麼樣的問題,特別是Android,它有4.X、5.X、6.X,甚至7.X的系統,在每個版上的表現是不一樣的,適配問題上真的是投入了巨大的人力物力。

另外,我們做了很多的降級預案,比如我們把性能比較差的機器直接列入了降級名單,讓它看全景的圖片,而不是像現在看有標定又有移動的全景視頻方案。

當然,所有的機型都可以加白名單和黑名單,也準備了很多降級開關,比如萬一崩潰比較多,而且是針對某些機型的話,也可以順手將這些機型降成全景圖片,甚至屏蔽其玩Buy+。

聽起來加白名單黑名單這件事很簡單,其實並不是這樣。特別針對Android來說,不可能將市面上所有機器都做一輪適配,行的加白名單,不行的黑名單,這個事情是幾乎做不到的。白名單的事每年都在提,但根本沒多少用處,因爲不可能將所有機器都列出來。

唯一可能採用的方案就是黑名單,但也有問題,就是隻能發現一款加入一款,這樣很難確保線上不會出現大面積崩潰。這次我們基本上把Android 4.X以下的機器都降級了。Android上還有部分機器陀螺儀不行,這部分也全部降級了。

ios也不是完全沒有問題,如果操作系統升上10.0時也會遇到陀螺儀調不同接口返回的情況不一樣。

總之,如果採用Native的方案,要保證線上儘量少的崩潰,需要考慮的問題是非常多的。其實到上線的最後一刻,我們還是沒有信心說這個東西上去完全沒有問題,不會出現大面積崩潰,當然最後的結果驗證我們的努力是沒有白費的。

全鏈路購物

最後一點技術的問題,提一下全鏈路購物的事情,大部分的VR從業者開發的同學不是特別瞭解交易鏈路和支付鏈路的事情,它其實是一個蠻龐大和複雜的系統。舉個簡單的例子,做一個商品詳情,看上去展現的東西並不多,測試的同學會告訴你這裏面有幾千個Test Case,大家可以感受一下它的複雜度。

當然商品詳情這種還算比較簡單,如果涉及到優惠價格體系和支付寶鏈路的話,裏面的複雜度不是幾個人或者某幾個團隊可以搞清楚。所以這次開發都有核心的業務團隊參與了,比如支付有支付專業的團隊幫助開發,支付寶的同學也過來跟我們一起做VR適配。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

Buy+裏的支付環節

即使是這樣,其實在完成整個交易鏈路的時候還是遇到了蠻多問題,比如優惠方案是怎麼樣的,在Buy+渠道只能有Buy+的優惠,但是你會發現,一旦給了他優惠,在其它地方搜索了Buy+的商品也會有優惠價格。這樣種種交易鏈路上的問題都要一個個去趟開。

造物神計劃

整個造神計劃,我們的宗旨是,讓新的內容產生得更加容易。目前還是聚焦在3D模型的建模上,只有更好的3D場景和商品,我們才能在VR領域走得更遠。所以這次雙十一上,我們也藉助buy+重啓了造神計劃。希望和大家一起把3D建模這件事情做到極致。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

目前我們推出了3種不同級別的解決方案,第一種是DIVA(Digital Interactive Visual Augmentation數字化交互視覺增強)。

它在手機淘寶上已經開始應用了。核心的技術其實也是通過180軸的轉動,拍照片、視頻,再提取裏面的關鍵幀,根據陀螺儀的信息顯示裏面的關鍵幀,可以大幅度提升商品和用戶的交互過程。

第二種方案,我們採用的方案是視頻掃描方案。這種方案相對於上一種方案的成本可能會高一些。掃出一個商品,價格可能在200-300元左右,爲這個掃描我們還是做了很多平臺化的事情。比如我們所有的的掃描、貼圖、計算、模型計算都把它放在了雲端,不需要你去買一個特別好的PC機去承載這些東西。

淘寶Buy+負責人胡曉航:從技術和產品維度看Buy+ VR購物 | 硬創公開課

光場方案

最後一種方案,是還在“寓言”中的方案——光場掃描。這個方案對建模難度非常高的商品是有比較好的效果。舉個例子說,如果你用3D掃描儀去掃出來的手機可能只能做出iPhone的亞黑色,但用光場的技術去做,可以做出iPhone的亮黑色。

這是一個造神計劃的邀約鏈接:http://zao.alibaba.com,大家有興趣的話可以一起參與到3d建模中來。

問答環節

網易遊戲工程師:爲什麼Buy+現在採用的移動方式沒有選用VR應用中常見的那種瞬移的方式——就是看向哪個點,就瞬間傳送到那個點?

胡:如果用瞬移的方式,無論從場景採集的複雜度和眩暈度來講,我覺得可能都比這種直線移動會好一點,畢竟我在體驗的時候覺得,移動過程中加載的那些視頻資源挺浪費的,因爲我只會盯着地面移動,而且停下來的位置有時離商品很遠,不如預設幾個點來的好。

網易遊戲工程師提的方案我們考慮過。我們現在沒有用3D場景,但是我們考慮過用全景圖片。一個場景一個場景的跳躍移動,這個在我們的降級方案裏面用了,我們覺得這個的自由度沒有視頻的好。視頻的移動是去模擬正常的逛店鋪的感覺。

怎麼平衡瞬移和模擬正常移動兩種方案的優劣,和如何進一步優化,我們現在也已經有了新的方案會去嘗試。

雲治(Buy+產品負責人):瞬間移送最好要有模型,純全景圖或視頻是沒有空間定位的。場景最大的問題在於你要真實感,現階段比較低成本靠譜的就是全景圖和全景視頻,缺陷是沒有空間定位。如果用場景模型,有了空間定位,缺點是很難建模到照片級別的真實感,或者手工優化成本太大。不過目前我們已經找到同時具備照片質量+空間定位的低成本方案了。

三星研究院研究員:1、 “光場掃描“具體什麼設備?2 、全景視頻拍攝用什麼設備移動的?

胡:商店裏面是軌道車,不能用軌道車的地方就是人的頭盔上安裝拍攝設備,用電動車。

三星研究院研究員:商品的照片級渲染如何能夠降低後期人工修正成本,是否可以讓廣大商家自行增加?

雲治:在商品方面,商家沒有這方面的技術能力的,一般都是找ISV。你們就理解一個最簡單的邏輯,商家的商品拍攝通常都是寄給ISV來拍攝的,然後ISV回傳素材,商家把素材發佈到線上。這樣成本、效率、質量都是要考慮的部分。在場景方面,現在的全景店鋪還沒有到說成本有多少的時候,基本上屬於探索階段,商業的價值還沒有說清楚。

雷鋒網原創文章,轉載請註明來源出處

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章