Unity 2017.2的Vuforia擴增實境AR教學,含發布成Android App

Vuforia是一套原本由高通 (Qualcomm )開發的SDK,專門針對行動裝置 (Android/iOS) 提供良好的擴增實境開發工具,於2015年被PTC收購,授權條款和收費方式也至今持續有所調整,在開發工具的支援上除了原生的iOS和Android SDK以外,也支援遊戲引擎Unity的編輯器,其便利又強大的特性長久以來也受到Unity用戶的喜愛。

Unity從2017.2版本開始直接將Vuforia整合進Unity編輯器內,因此在啟用SDK的步驟有小小的不同,但整體操作上更便利強大了,本教學小樽將以最新的Unity 2017.2版本使用Vuforia做基本的AR app開發教學,步驟會到匯出Android App。

1.即使是使用最新版的Vuforia,依舊須要使用Vuforia的官方授權(License),所以請先到Vuforia的官方網站註冊帳號,往後無論是自用或商業用,所有授權的依據都是和帳號相關,註冊啟用帳號後就可以登入囉。

2.登入後第一件事情就是要先製作我們自己的license(授權),Vuforia是靠license key來決定你的使用權限,所以請到Develop > License Manager來Get(或者商業用就按Buy)一個開發金鑰(Key)

3.點選取得金鑰後,Vuforia會問你要開發的App Name,取一個你能記得的名字(英文數字組合),這個日後都可以修改不影響你開發,主要方便你自己管理的時候辨識用的,下方會顯示你現在的方案權限,下圖是免費方案在2017年10月的授權範圍,往後都有可能變,但是Vuforia的授權基本上是不會朔及既往,所以你在甚麼時期建立的license他會按照當時的標準保留你的權利,不過可以確認的是權力當然是越來越小~要大請付錢XD

4.本範例小樽以tku作為App name,建立完成後如下圖,就會取得一個獨一無二的授權碼,等等會在Unity裡面用到~雖然露出(甚麼!?)也沒關係但是恕小樽只是要舉個栗…例子,打個薄碼意思意思,不要太興奮(喂)

5.以上是取得使用授權的第一步,接下來我們要建立辨識特徵圖片用的資料庫,Vuforia的AR辨識屬於Marker-less(無/弱標記式)的圖像辨識,也就是不用使用古早的時候AR作品常見的黑白色塊組合圖才能辨識,基本上所有圖片都能辨識,但是還是有一些但書,例如僅顏色差異是很糟的辨識依據,例如一樣的圖片只是色系不同這種…極易造成混淆,其次就是圖片過於對稱、過於扁平,或背景太過乾淨但是主體非常小…等,關於圖片的易辨識特徵Vuforia有一套公式會幫你計算分數(0~5顆星),如果想要知道甚麼是可以取得高分(高辨識度)的特徵圖像設計可以參考這篇說明,大原則就是高對比的細節越多越容易取得高分,請不要拿日本國旗來當辨識圖片。

Vuforia為了能夠妥妥的收錢(直白),關於自家特徵點的產生演算法是他們的智慧財,所以目前都沒有開放你可以自己計算特徵碼,所有要辨識的圖片都需要上傳到Vuforia的資料庫幫你建立你自己的小資料庫,所以請到Target Manager的地方Add Database,如下圖:

6.同樣的你也須要給你這個資料庫一個名字,請用英文或(和)數字,方便你自己知道你稍等要使用的特徵碼資料庫叫啥,他稍後會顯示在Unity裡面,Type的部分我們這個教學是使用Device。

7.建立完成後,你就得到一個空的資料庫,可以用來上傳你的圖片轉成Vuforia專用的特徵碼,小樽是將這個範例命名為tku,按一下Add Target來上傳圖片:

8.Vuforia現在能辨識的影像除了平面圖片以外並支援立體矩形、圓錐狀杯狀,甚至是任意3D物件(但是其實有些限制),本教學針對單一圖片做AR效果,所以選擇Single image,在File的地方點一下瀏覽選擇你電腦裡那張要當辨識圖的圖檔(jpg或png格式,大小2mb以下),下面Width輸入圖檔的寬度(單位像素),通常你找到的圖片他寬度多少pixel我們就會輸入多少pixel,主要差異在於這張圖片之後出現在畫面上的相對尺寸,說明文字在下面其實有註解,最後就是給個名字(一樣不要用中文),因為一個資料庫裏面是可以放多張圖片的,這裡的名字是方便你辨識是哪一張圖片,在Unity裡面會顯示出來,所以取一個你自己記得的名字後上傳。

9.小樽上傳了tku的校徽當作辨識圖片,上傳完成後會看到tku這個資料庫裏面多了一筆tku_logo的資料,辨識度被五星好評XD

10.接著我們可以下載這個自己的資料庫,以便導入Unity進行下一個步驟,請先勾選你要辨識的圖片,以本範例來說只有一張,往後如果你想在單一app中辨識多張圖片內容,可以在一個資料庫內上傳多張圖片,然後勾選要使用到的image target再一起按Download database,按下後Vuforia會問你要下載原生的資料庫還是Unity編輯器用的package,本教學使用Unity所以請選擇Unity Editor後按下Download,你就會下載一個你自己的特徵點資料庫的unity package了。

11.從Unity2017.2開始,Vuforia已內建在XR的套件裡面,但是預設是無選用,也就是在Unity安裝畫面選擇發布套件的畫面,最下面會多了Vuforia的選項可以勾,如果一開始沒有勾也沒關係,從工具列點選 [File] > [Build setting]呼叫出建構設定視窗,請參照下圖,首先確認已經把平台切換到Android(iOS步驟一樣),然後點一下Player settings,在右側Android setting的最下方找到新功能XR settings,Unity把一些主流AR/VR套件都整合在這裡,如果你沒有在一開始安裝Vuforia套件會像下圖這樣有一個超連結

點下後就會自動下載安裝到Unity中了。

安裝完後就多了下圖這個Vuforia Augmented Reality的項目,把他打勾起來,工具列就會出現Vuforia專用的項目了,取代過去要從Vuforia下在Unity的SDK package匯入的步驟。

12.接著到工具列GameObject > Vuforia > ARcamera產生一個專用攝影機,可以順手把原本場景上的Main Camera刪除。

13.點選ARcamera的狀態下到屬性視窗(Inspector)找到Open Vuforia Configuration,或者這個最新版本其實就是把Configuration放在勾選Vuforia時,一開始就建立在Assets中的Recources裡面。

14.找到App License Key的欄位,把你一開始申請的授權金鑰貼進來,讓Vuforia知道你有甚麼使用權限。

15.匯入你的資料庫,在Assets的地方按滑鼠右鍵Import Package > Custom Package,選擇你剛剛下載的資料庫Package。

16.導入完成後,回到Vuforia Configuration,你會看到他讀到你的database了,把你的database打勾,其下方的Active也打勾啟用它,已本範例為例,小樽方才在Vuforia平台上建立的資料庫名稱是tku,所以我可以讀入tku這個database,如果你的操作步驟正確就會看到你自己命名的資料庫名稱。

17.點擊工具列GameObject > Vuforia > Image,會在場景中產生一個Image Target,點選此物件到屬性視窗中找到Dataabase欄位

從下拉選單裡面可以看到你的資料庫名稱,選擇它之後,下方的欄位會出現你這個資料庫中所有的圖像名稱,選擇你現在要操作的圖片,以本教學為例,小樽只在tku資料夾中放了一張tku_logo的圖,所以狀態如下圖,你會看到你自己命名的資料庫和圖片。

18.接下來你可以從GameObject來建立一個3D或2D模型,或者可以到Window > Access Store 下載免費或購買付費的3D/2D物件,匯入到場景中,如果你會使用Maya/3DS MAX…等軟體,可以在3D軟體中製作自己要擴增的虛擬物件,匯出成fbx格式讓unity匯入,已本教學為例,小樽直接從Access Store 下載免費3D模型 “Unity醬” 來做為擴增物件,匯入完成後,把他按照你的image比例移動、旋轉、縮放到你想要的相對位置。最後,請把這個要擴增的物件拖曳到Image Target下方,使這個物件成為指定Image Target的子物件,Vuforia的設定基本上到此告一段落,可以按下Play玩玩看。

19.如果你發現在把玩的時候模型常常”消失”,有可能是你攝影機的Range低於你的模型尺寸,所以要非常靠近才能看到,這時候請到ARcamera選擇攝影機的Clipping Planes,Near就是最近從多少開始顯示,far就是最遠可以顯示到多遠,理論上把far的數值拉大就好,但是請記得,拉大這個數字的意義也代表裝置需要運算的可視範圍大,萬一往後嘗試單一畫面多image的AR時,可能就會感受到資源的消耗,這時候在自己折衷是否要縮短可視距離。

20.要輸出到手機觀看,要有對應的發布環境,如果是Apple的iOS平台需要Mac上的Xcode來編譯,本教學先以Android做示範,發布Android的先決條件是你的電腦已經要有安裝好Android SDK,如果你沒有也不太有把握,請直接到Android tool官網下載安裝一套即可,另外還要JDK,請到官網下載,安裝完成後,到File > Build Setting按一下Add Sense按鈕

如果你剛剛的步驟中都不曾儲存過場景,Unity會要求你立即儲存一個場景提供他發布~記得~不要用中文命名以免出怪事,Add成功後,基本上就可以build發布了,但是如果剛剛提到的SDK安裝了卻在發布的時候說找不到,請到Edit > Preferences 的設定視窗中找到External Tools頁籤,把SDK的位置指向正確的地方。

發布過程中你可能還會看到一個警告,而且還不讓你發布成功,因為Vuforia並不支援Android TV這個版本, 請到Android Setting中把這個勾勾取消。

21.如果你希望這個APP有自己自訂的名稱,在Player setting最上方,如下圖

但是Android識別app的唯一性靠的其實是package name,請到other setting設定App的識別名稱,只要這裡的名稱相同的前提下,Android都會視為同一個App,如果要更新版本只要改下面的Number即可,請不要使用預設值,可以參考最上面命名公式,例如 com.公司名稱.APP名稱。

如果你想換掉Unity的開頭圖片可以在這裡換掉,記得想要使用的圖片必須先匯入Assets內。

如果你想自訂Logo可以在這裡換掉,記得想要使用的圖片必須先匯入Assets內。

ok~基本上市面步驟都沒問題的話你肯定能成功發布第一個Vuforia App,盡情地玩耍吧~喔對了~行動裝置的運算效能目前和電腦還是有一定的差距,考慮到行動裝置的效能請勿把非常高面數的模型或者高解析度的貼圖做為虛擬物件使用,因為有可能發布的時候就被警告或拒絕…也有可能發布成功後手機無法正常開啟這個APP,如果你發現異常又不確定是否為素材問題的時候,可以先用基本幾何例如方塊或球體替代你的模型在發布看看~大概就可以確定是否是素材問題。

如果希望擴增的虛擬物體有其他互動~你就需要開始學習Unity的其他功能囉~加油~網路上優質的Unity教學滿豐富的,一定可以找到適合你的。

小樽的Unity2017.2 Vuforia教學到此告一段落~希望對你有所幫助,啾咪>_^