起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識百度AR小游戲設計過程全揭秘——《砸金豬積福氣》
2019年春節，百度出了一款砸金豬積福氣的AR小游戲嗎，并獲得了非常不錯的互動數據以及用戶的稱贊。而本文就還原了百度AR團隊如何做出這款游戲的過程。
2019年春節，百度AR團隊策劃了一款砸金豬積福氣的AR小游戲，助力百度地圖“回家有圖，一路是?！边\營活動。
項目歷時兩個月，從內容創意到設計開發，交互、視覺、模型、動畫多個設計師高度配合，在春節來臨前，給百度地圖的用戶帶來了不一樣的新奇游戲體驗。
當然在設計制作過程中也遇到了很多問題和困難，我們通過本次的流程梳理和問題思考，把AR設計師做項目時的設計過程總結下來，希望能對大家有一些幫助和啟發。
Step1：背景&分析
春節作為地圖全年最重要的節點，希望在活動中融入AR技術，通過小游戲吸引地圖用戶關注活動，增加互動量，同時展示百度的AI能力。
我們參考往年地圖DAU數據，根據用戶使用行為提煉出三個階段：
- 第一階段是用戶已經有歸家意圖，即已經設定明確目的地。
- 第二階段為旅途中
- 第三階段為已經到達目的地，完成團聚。
同時為了滿足活動送用戶歸家紅包的訴求，我們提取出豬年、旅途、路線規劃、紅包等關鍵詞，進行游戲內容搭建。
Step2：游戲內容創意
在主要關鍵詞確認之后，我們展開討論與發散。
首先是豬年關鍵詞。
結合地圖春節期間派發歸家獎金的活動計劃，將豬年與獎金這兩個關鍵詞相結合，想到了砸豬型存錢罐的概念。
融入路線、旅途、終點等關鍵詞，最終決定的玩法是將游戲場景放置在真實環境中，福豬在場景中沿著規劃路線向終點前進，途中用戶砸到福豬可以獲得歸家紅包。
在方案創意階段AR設計師會同步與開發溝通可實現方案，考慮角色和地形在AR環境中的真實效果。
場景在開始設計前會實物模擬放置在實景中的位置，考慮高度、大小、位置等虛擬坐標與真實坐標對應后，確定可實現方案展開地形設計。
Step3：設計流程與執行
1. 設計流程
本次項目周期較為緊張，游戲方案確定后，交互和視覺同步開始進行設計；并與開發驗證AR環境中的可實現方案，模型、動畫根據視覺進展第一時間開展工作，驗證AR引擎能力，提前解決問題。
2. 設計執行
1.1 角色設定
最終的福豬外形選定了一只站立的豬。沒有用豬型存錢罐的原因是我們想讓豬在豬年站起來，飛奔著向前跑，并將存錢罐里錢幣的概念轉變成豬豬背著的福袋。這樣可塑性比較強， 背上福袋的豬豬體積上增大后在AR場景中也更醒目一些。
基礎形象確定之后，就可以根據角色的自身性格和功能進行多個角色的細節設計了，并會考慮在游戲和AR環境中角色的可識別性和視覺效果，根據反饋調整最優視覺效果。
1.2 角色建模
形象確定下后就開始進行模型的制作，在模型制作過程中，AR項目的建模流程是區別于傳統建模流程的。
首先第一步模型創建的過程中，模型師要先考慮用基本的幾何形態完成模型的創建，符合AR的面數控制，在簡模通過技術的性能測試后，再根據視覺要求進行細化。
后面的步驟中也是，模型師每做一步都需要對當前的效果進行測試，模型效果在引擎中的不確定性非常高，需要隨時結合真實場景進行修改測試。
回到模型創建，模型師拿到原畫設定后對整體效果進行梳理，從三個方向對模型進行創建。原畫給出了X軸方向的整體視覺效果，Y軸方向決定身高比例，Z軸方向決定身材比例和動畫的活動范圍。
模型師從最簡單的多邊形模型一步步驗證引擎效果進行細化的過程，建模得到驗證后，會逐漸增加細節，并開始其他角色的模型制作。
在用建模測試過引擎的性能后，對模型進行逐一的細節優化，并進行貼圖的繪制。
最終渲染效果：
列舉兩個模型階段的常見的問題：
一個是引擎渲染效果與三維渲染不一致，一個是pod格式的問題。
都是引擎沒辦法100%還原模型效果的問題，這時候需要設計師在有限的引擎能力下找到平衡的點，
最大程度對齊效果，如果效果我們實在沒辦法接受，還會推動進行技術上的更新，達到更好的效果。
2.1 場景設定
場景在視覺設計的階段就會將金豬行進的路線進行詳細規劃，與rd溝通場景放置在真實空間中的實現方案，對整個場景在真實空間中的效果有一個基本的預期，心中有數。
場景的各個細節都需要詳細說明，場景建模和技術都會根據這些細節的點進行在三維和真實空間中的坐標系設定。
2.2 場景建模
場景的建模工作流程基本與角色建模的流程相似，也是先出建模、驗證技術能力，再確認能力后進行。
細化：
最終場景的局部圖，整體效果圖
列舉兩個場景制作的問題：
第一個是貼圖在引擎中不顯示，雖然我們已經做過很多case，但是每次都會有新的問題出來。以往的傳統制作經驗并不能完全解決AR引擎中的問題，我們只能在一步步在探索中解決問題。
第二個問題也是場景在引擎中的渲染問題，我們推動技術實用gltf格式，獲得了更好的視覺效果。
三維與技術的共同開發流程基本是一個循環，雖然我們建立了很多規范也沉淀了很多方法，但是像我前面提到的，在AR的制作過程中，一直都會有新的問題新的挑戰，是一個不停發現問題、解決問題的過程。
3.1 動畫設計
角色和場景的模型制作完畢后，就是動畫師的工作，動畫師做為設計的最后一環，與開發的對接最為密切，很多問題會出現在這一步。
比如游戲使用slam無法控制用戶游戲視角，動畫制作從傳統的一個機位變成全方位，每一個角色的動作都需要360度無穿幫，需要動畫師多次調整和規范。
拿到制作好的角色模型，首先要對角色特點進行分析，確定動畫風格（寫實or卡通）為對應的角色設計適合他性格特點和情景的動作，包括肢體動態，表情動態。
接下來進行動畫制作，動畫制作分為幾個階段：layout，blocking，animation，final。
在制作過程中，動畫師會從節奏感、重量感和彈性增強角色動態細節。嘗試加入重量感來增強福豬跑步時上下顛
簸的感覺，符合福豬本身的重量。在彈性設計上會更加夸張，跳躍時有一個慣性的伸縮，加強福豬Q彈的質感。
動畫制作完畢后將動畫文件導出fbx文件和貼圖，生成gltf文件與開發共同做效果測試。
最終動態效果：
最終的模型、動畫輸出給開發后，并不表示設計師的工作已經結束，而是開始不停的遇到問題，解決問題，設計師需要很強的問題解決能力，在有限的技術可實現范圍內把效果做到最好。
4.1 界面設計
游戲界面延續使用3d形象，在不同結果的彈窗中使用不同的福豬，游戲內的所有元素統一設計為3d效果。
游戲最終效果：
https://v.youku.com/v_show/id_XNDI0NTc1NjIzMg==.html?spm=a2h3j.8428770.3416059.1
Step4：項目總結
2019年的春節，在大家的努力下福豬項目按時上線百度地圖，有付出就肯定會有收獲，在制作期間我們的設計獲得肯定并吸引到贊助商助力，上線7天砸金豬互動量達千萬。
雖然游戲設計過程中遇到了很多困難，但是辦法總比困難多，組內設計師也形成了一套高效配合的工作方法和流程。
在諸多條件限制下，設計師很遺憾對太多效果不得不做取舍，不過這也是AR小游戲的開始，未來還有很多可以優化的方面，為玩家提供更多可能性。
作者：百度人工智能交互設計院（Baidu AI Interaction Design Lab）
本文由 @百度人工智能交互設計院 原創發布于人人都是產品經理，未經許可，禁止轉載
題圖來自Unsplash, 基于CC0協議
??
百度官方賬號么