QQ歡樂斗地主UI界面設計分享

　　Hello，大家好，我是無線新人設計師echo，第一次做項目分享心情雞凍的hold不住。出爐不久尚未烤熟經驗尚淺歡迎拍磚。

　　Symbian的夕陽時代，無線手機休閒游戲卻依托著越來越強大平台、大展拳腳的設計為我們帶來了許多意想不到的創意和驚喜，字裡行間都透露著設計師的細致與智慧。

　　歡樂斗地主作為一款年代比較久遠的產品，是我們休閒游戲線的核心，也是是用戶規模最大的產品之一。從2004年12月發布首款斗地主游戲到現在的多 個平台多款游戲，內容不斷豐富，形式不斷改進，用戶不斷增加。盡管目前手機游戲和平台種類越來越多，android、iPhone、pad等俨然已經成為 用戶寵兒，可是對於一直伴支持著老諾(諾基亞)的用戶、一路伴隨著無線產品發展的Symbian和我們這個多年塑造起來的品牌形象，如何在殘酷競爭中依然 小心維護品牌特色，用心呵護品牌、放大品牌效應、盡可能滿足最廣泛的用戶隨手掏口袋就可以體驗游戲就格外重要。

　　主角出場——歡樂斗地主形象的全新設計：

　　歡樂斗地主&(普通)斗地主作為無線產品部歷史最悠久的游戲，2011年一個重要的工作是完成形象的重新設計和統一，其中斗地主會在選定的形象上 保持精簡，而歡樂斗地主會在選定的形象上做精細化、豐富化表現;從而形成“手機斗地主”這個整合的品牌。作為主角的人物形象的重新設計是實現豐富與更新品 牌的重要任務之一。

　　人物形象設計的同學dodola和maymei在立項前期關於人物設計做了很多嘗試和突破性的設計：

　　由於歡樂斗地主這款游戲老少皆宜、年齡覆蓋層面比較廣泛，游戲本身短期內的版本也不適合做顛覆性風格變化，因此需要延續歡樂斗地主之前版本基本的溫 和細膩風格路線，全新人物造型與細節刻畫的需要更加精細，差異過大反而不合適。作為游戲原型的設計，可在允許個性存在的前提下，造型與色彩方面偏向“中 庸”便於用戶最廣泛的接受。

　　首階段的稿子在設計組內進行投稿，大家一致決定對初次投稿先進行設計組組內評審，總結修改意見並進行初次優化方案後，把篩選的方案交由產品組和休閒游戲大 組評審，確定最後的形象。經過了多次的PK和優化，最後確定的新形象設計造型風格大氣，農民的憨態可掬和地主的富貴華麗顯得生動有趣;整體顏色明快鮮亮， 並且做了很多豐富動作和表情的延展;形體上地主與農民進行了統一，在簡化多余線條的情況下，增加了細節裝飾的設計，可愛又不過於誇張的人物想象生動表現了 我們游戲的休閒與趣味性——於是我們的新形象誕生了!

　　游戲UI重新設計：

　　新角兒上場必然要搭新舞台，人物形象確定後游戲新UI的設計也緊隨而來。產品需求對游戲UI設計的定位是：

　　產品建議運用輕松、活潑的元素突出游戲“歡樂斗”氛圍;可以吸收前一版本優秀項目經驗，不過色彩方面可捨棄一直沿用老版的藍色系，做出大膽新鮮的嘗試，傳達新的視覺感受。

　　下面我們可以比較看看新版本在老版本的基礎上有哪些新的嘗試和改進：

　　(1)新版游戲的布局和交互參考上一版本的歡樂斗地主設計

　　視覺方面，老版一局游戲下來都是以穩重安靜的深藍色系為主，長時間游戲眼睛也不易疲勞;傳統圖案巧妙的卡通化，帶有明顯古典風格又不失可愛，很值得借鑒。 不過根據產品強調“更新”、最大化的體現游戲“輕松休閒”的定位，我們不妨嘗試運用兩種有明顯偏向性的色彩冷暖搭配，相較於上一版本整體單色系設計會更輕 松活潑;更重要的是可以利用色彩心理暗示讓用戶有更流暢舒適的游戲體驗。比如只是簡單起引導用戶快速進入游戲的部分(登錄、分區、玩家信息、結算等界面) 可采用紅、黃為主色的暖色調;而需要長時間集中注意力盯著的打牌界面可以采用舒適的深綠或藍綠色為主的冷色調。

　　(2)在裝飾元素上熟悉的民間元素的運用

　　想到休閒類游戲難免就會讓我們聯想到古老的木桌、幕簾，樹蔭、屏風、悠哉的茶館等場景，民俗休閒味濃厚，也突出人們游戲心理時的各種返璞歸真，清新自然格 調。尤其在炎炎夏季，這些元素的出現總能帶給人絲絲清涼舒爽之意。所以在整個游戲界面設計中采用木桌、卷軸、幕簾為元素或者細節的裝飾點綴，一方面，作為 傳統視覺元素它們有其自身豐富的語言與情感傳達，有其獨特的表現手段與可能性。特別是在設計過程中開放的思維方式與想象力的加入讓它們更加飽滿;另一方 面，更貼近本身的休閒感與親和力的定位。

　　(3)整個游戲盡量做到簡潔輕快。簡化桌面元素，弱化非功能性的設計元素以排除視覺干擾，使用戶更集中專注於游戲的體驗。

　　(4)針對V3資源利用率低的不足，在保證界面美觀大方的前提下盡量用最合適簡潔的表現手法來配合程序員、前端工程師去完成整個產品的實現，比如以下情況：

　　作為設計新人要學習的地方還有很多，如何更好的理解產品需求、如何最大化避免平台對設計表現的限制使實際產品實現後的形態最優等問題……，如在V3 或V5等較低端平台上，讓程序去實現一個色值填充或者簡單拼接他肯定會毫不費力實現，但是平台的局限性和設計界面樣式多樣化，特別是面對大面積的復雜樣式 的運用，程序運行就會很糾結了，因為資源的大小對游戲能否順利運行有著直接的影響。因此除了初期的風格稿，設計實現的過程中就盡量不要有太多不符合程序邏 輯的樣式，一些多透明多漸變的樣式可以直接通過程序來設定，這樣可以減少圖片的應用。

　　V3歡樂斗地主項目結束已有一段時間了，游戲發布後依然在同平台同類產品中獲得我們老用戶的接受與肯定，再次感謝所有參與項目的同學的辛苦努力。

　　來源：http://wsd.tencent.com