掃福得福背后,支付寶AR紅包的技術創新與故事

mikemaxu 7年前發布 | 9K 次閱讀 支付寶 軟件架構

春節期間,支付寶的「掃福得福」活動火爆異常。AR是一種新的交互方式,與傳統營銷方式相比,可以使用戶更深入地參與互動,給用戶帶來新體驗。而支付寶紅包,寄托著用戶對未來的期盼,因此其團隊就考慮將AR與紅包相結合,探索一種新的玩法。在AR領域走在前面的支付寶,其AR紅包的技術選型、技術架構及其背后的技術故事都有哪些?

寫在前面

2004年12月12日,我加入雅虎中國,也加入了互聯網大軍。至今,我還依稀記得,當時心中那種對互聯網的敬畏之情。2009年,在雅虎的四年外企生活一晃而過,我有幸加入支付寶團隊,并參與支付寶無線支付。從那之后,我每天都要接受無線浪潮的洗禮,人生軌跡從此也發生了巨變。

今天是我到阿里的第4096天,談起“紅包”,讓我回憶起了,2015年參加第一次支付寶春節口令紅包項目,團隊獲得螞蟻金服CEO大獎;2016年負責識別猴子,開始具有了AR雛形,后續又提出了兒童時代“集卡片”玩法,可謂集五福前身;2016年開始建造支付寶AR系統,全面支撐了2017年AR實景紅包、AR掃福等一系列活動……

提到AR紅包,這是我們團隊的一次大膽創新,現在就來和大家分享一下支付寶AR紅包背后的技術和故事。

支付寶AR紅包背景

AR的發展和舊玩法

AR是增強現實技術的簡稱,其歷史可以追溯到1968年——哈佛大學電氣工程副教授薩瑟蘭,發明了名為“達摩克利斯之劍”的頭戴式顯示設備。

1998年,在當時的體育轉播圖文包裝和運動數據追蹤領域領先的公司Sportvision,在橄欖球賽的電視轉播上使用了AR技術,將得分線疊加到了屏幕中的球場上。此后,AR技術開始被用于天氣預報——將計算機圖像疊加到現實圖像和地圖上面,從那時起,AR才真正地開始了其爆炸式的發展。

1999年,增強現實開發工具ARToolKit便問世了,很多開發者加入這個行業,推動領域向前發展。目前Microsoft、Google、Apple等公司都在AR領域進行了大規模投入,旨在推動下一代視窗交互系統的變革。

為什么要做支付寶AR紅包

AR是一趟奔馳的列車,從個人到團隊,從團隊到公司,都希望搭上這趟列車,但是如何搭上,用何種技術搭上都是新的挑戰。

AR是一種新的交互方式,與傳統營銷方式相比,可以使用戶更深入地參與互動,給用戶帶來新體驗。而支付寶紅包,寄托著用戶對未來的期盼,因此團隊就考慮將AR與紅包相結合,探索一種新的玩法。

AR新玩法

2015年,我們開始關注AR這個領域,當時為2016年制定的一個新春紅包方案就是用手機識別猴子。這個方案讓大家有了AR的感覺,項目組也想做一些AR的創新玩法。但是,由于當時相關技術儲備不足,就放棄了。

方案雖然放棄了,但探索AR的新玩法這件事,深深地烙在了我們的心里。2016年一開春,我們創新組就開始儲備相關技術知識:識別跟蹤算,OpenGL、3D渲染引擎,建模能力,AR體系架構,等等。這些相關技術也陸續在小視頻美顏、人臉貼圖等社交場景進行了實踐,為后續AR相關技術快速成型提供了保障。

如何推進AR的新玩法呢?當時,我們團隊定下了兩個目標,一是找一個小場景落地AR概念,二是在春節紅包上使用AR技術,后者是我們的年度終極目標。

2016年的“中秋節掃月亮”,算是支付寶在AR領域的第一次嘗鮮,體驗和反響還不錯。邁出這第一步之后,各種業務需求也接踵而來,AR新玩法也越來越多——雙12線下商圈“掃雙12集四寶”的活動,2017年春節AR實景紅包,掃可口可樂福娃領紅,掃福集福……

支付寶AR紅包帶來的挑戰

新玩法自然會帶來新挑戰,不說別的,單單用怎么樣一種方式呈現AR紅包,就是非常大的挑戰。

大多數AR的玩法都是針對預設的2D圖片,離線訓練好識別模型,然后在此基礎上實現識別互動。由于是2D圖片并且預先驗證過,因此能較好的保證識別的效果。

支付寶AR實景紅包算是業界的一次大膽嘗試。用戶自由選擇真實3D場景,拍攝一張圖片作為線索圖,其他人根據線索圖到指定位置拍攝圖片進行比對。而這種方式呈現AR紅包,自然也對圖像匹配的算法性能提出了新的挑戰,主要涉及如下方面。

AR實景紅包的技術選型

  1. 算法魯棒性:由于針對真實的3D場景拍照,匹配算法需要容忍一定的遮擋和角度、距離、光線、圖片質量等的變化;
  2. 計算復雜度:由于在終端上進行實時匹配,算法的復雜度不能太高,否則會導致用戶尋找紅包時間變長,手機功耗消耗過大等問題;
  3. 手機流量:移動端應用需要考慮用戶的流量問題,需要在數據大小和識別率之間做好平衡;
  4. 手機兼容性:對擁有億級用戶的支付寶而言,機型特別是Andriod機型分布很廣。對于我們3D模型渲染帶來了很大的挑戰,需要制定完善的兼容性方案,確保AR功能的正常使用。

AR紅包的初期方案也和很多已有的產品類似,僅依靠LBS和手機陀螺儀來進行互動:用戶在某個位置發一個紅包,其他人到達這個地點后打開攝像頭,朝著某個方向拍攝就能看到別人發的紅包。這個方案由于僅依賴LBS和手機陀螺儀,方案比較成熟,但主要存在兩個問題:

  1. 定位精度:產品初期的定位是讓附近的人領取紅包(比如附近幾十米的人或者同一層樓的人),這對近距離定位要求就很高。內部也討論了很多潛在的方案,比如結合WiFi定位、室內定位等等,但都不是很通用或者不成熟,沒有很好的解決方案;
  2. 主觀體驗:由于GPS和陀螺儀的數據本身就存在較大的誤差,位置定位和用戶動作都無法精確度量,用戶體驗不太好,沒有真實的藏?找的體驗。

因此在AR紅包中,我們希望能夠重新設計交互方式,提出了圖片匹配方案。在發紅包時,用戶對著場景拍攝一張圖;其他人想要領取紅包,必須到達該位置并且對著同一場景拍攝,只有位置和圖片匹配才能領取,大大增加了精確度和用戶趣味性。最終該方案被采納,誕生出了AR實景紅包。

AR實景紅包最終的技術架構

AR實景紅包

整個AR實景紅包由兩個場景組成:一是藏紅包,用戶對著某場景拍一張圖,將紅包藏在這個場景里面;二是找紅包,用戶在地圖頁選擇一個紅包,通過線索圖走到對應地點,打開攝像頭拍攝進行圖片比對,匹配成功后領取紅包。

藏紅包

并不是所有的場景都適合藏紅包,比如白墻到處可見,會造成線索圖不唯一的情況。因此在藏紅包時,我們會校驗當前場景是否滿足預設要求。藏成功后,拍攝的圖片會傳到服務端處理:一是將圖片轉成特征碼用于圖片匹配,二是生成一張線索圖用于找紅包。

找紅包

根據用戶當前的位置,服務端會下發附近的紅包信息。用戶通過紅包列表可以選擇領取某一個紅包,此時客戶端會到服務端拉取該紅包的特征碼和線索圖。線索圖在本地展示,提示用戶紅包的樣子。特征碼用于客戶端本地實時比對。用戶找紅包時,將攝像頭采集的圖像轉換成特征碼,與服務端下發的紅包特征碼進行比對,如果本地匹配成功,則把圖片信息傳到服務端做二次校驗來防止作弊。服務端校驗通過后,紅包就可以領取了。

掃福得福

在掃福字得福卡的活動中,為了解決高并發的問題,采用了客戶端+服務端并行處理的架構體系,可支持兩種識別方式:

所有圖片都傳至服務端做處理,這樣識別精度更高,但是服務器端能處理的數量有限;二是先走客戶端檢測,客戶端無法識別的再上傳服務端。客戶端檢測能力稍弱,但將計算能力分散到各終端,能極大緩解服務端的壓力。

活動開啟后,由于用戶的積極參與,我們在活動早期就打開了客戶端識別,使得系統順利支撐了14萬次/秒的福字識別峰值,確保了整個活動的順利進行。但是客戶端的識別精度有限也導致了不是福字被是被為福字的問題,這個也是我們后續的優化方向。

如何防冒領

正常用戶要成功領取紅包,需要按照線索圖的提示找到紅包隱藏地點并完成實景拍攝,也就是說位置+圖像匹配兩個條件都需要滿足,才可以領紅包。

AR實景紅包上線之初,為了讓用戶有較好的體驗,線索圖做的比較簡潔美觀。第一版線索圖是通過添加均勻的橫條紋蒙版(類似百葉窗效果)來對原圖進行遮擋,同時確保用戶能簡單的識別出圖片。

但是,由于該方案比較簡單,部分用戶通過PS線索圖來補全被遮擋部分,后續甚至出現了自動化的PS工具。我們隨后進行了升級,每個紅包的線索圖都是動態選擇一個蒙版,蒙版還會隨機的動態旋轉/偏移等。新的線索圖方案,大大增加了自動化PS的難度,基本解決了PS的問題。

除了對付圖片的攻擊外、對于LBS篡改等其他作弊手段,螞蟻安全團隊也做了大量的防控技術手段,通過對用戶的行為數據來分析潛在的作弊用戶,也有效地攔截了大部分作弊用戶。

AR的未來

AR是一種新穎的交互形式,雖然該領域已經有了很多年的發展歷程,但技術成熟度和用戶普及度都不是很高。目前市面上的AR應用場景還是比較窄的,仍然有很多挖掘的空間,特別是結合各行業自身的特點去思考,肯定會產出很多好的創意玩法。

AR紅包正式上線時,那幾天地圖頁都是滿滿的紅包,我們也很興奮,說明大家對這個新鮮事物都很感興趣并且能夠接受。除了個人紅包玩法,很多商家對這種新型互動方式更加感興趣,也主動聯系我們。商家希望用戶通過拍攝自己的品牌Logo來加深用戶對品牌的認知,認為這是一種新穎的營銷方式,未來還會有更多的成長空間。

后續我們會朝著AR開放平臺的方向發展,提供一個開放的AR平臺讓更多商家和用戶都參與進來。同時,結合線下支付場景,圍繞用戶體驗,打造更多的創新產品。

寫在最后

第一版Windows Mobile錢包的誕生讓我完成向移動轉型,接著,我帶領團隊經歷了Symbian從鼎盛到衰退,然后又經歷了WP項目的糾結,經歷了Android從開發版到現在的家喻戶曉,經歷了iOS從奇怪的語法到后來輕車熟路……

技術在發展,而我們在不斷地創新。2013年開啟了支付寶聲波支付,2014年銀行卡識別和身份證識別用于錢包業務……同時,團隊相關算法技術、工程能力和創新思維在這個過程中也得到很大的沉淀,為連續三年參與紅包項目奠定了基礎,為今年AR紅包的新玩法奠定了基礎。能力越大,責任也就越大,既然承擔起了這份責任,我相信我們的努力定會不負使命。

作者介紹

何強(花名:何武),2001年畢業于北京工商大學,2004.12.12加入中國雅虎,參與雅虎通等客戶端研發工作。2009年轉戰支付寶無線事業部,參與支付寶第一版客戶端研發,先后負責過Symbian團隊、WP團隊、開放平臺團隊、創新團隊等。在阿里期間,參與過無線的每次變革,引領過相關新技術用于錢包應用,如:聲波用于支付、識別銀行卡用于綁卡、OCR用于實名認證、音頻處理用語音降噪、圖像處理用于美顏貼圖、AR綜合技術用于紅包等,所帶團隊連續三年承擔紅包重要角色,擅于與兄弟團隊合作,融合相關產品和技術,促進新技術落地。目前就職于支付寶多媒體創新團隊,協助主管朝山推動多媒體向前發展,探索更多新領域。

 

 

來自:http://www.infoq.com/cn/articles/story-and-technology-innovation-of-alipay-ar-hongbao

 

 本文由用戶 mikemaxu 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!