狼人殺作為聚會必備推理類桌游非?；鸨耙蝗肜强由钏坪＃瑥拇斯?jié)操是路人”。

一局APP自研時下最火的線上桌游【一夜狼人殺】，這款桌游不同于以往邏輯推理版狼人殺，沒有夜里死亡，適合休閑娛樂，滿足每個人的參與感，更像是真相探索游戲。

本文以制造積極情緒、打造體驗峰值為設(shè)計目標，設(shè)定游戲世界觀，構(gòu)建游戲故事背景，繪制精美插畫，賦能魔力特效，打造標桿小游戲。解密小游戲設(shè)計秘籍，接下來讓我們揭開小游戲設(shè)計的神秘面紗吧。

1

故事背景-設(shè)定世界觀 代入故事情境

歡迎來到一夜狼的世界，夜幕降臨，一群身懷絕技的冒險者們準備在幽暗的森林里度過一夜，明天即可到達森林中心，那里的古堡中有古老家族遺留下的寶藏和數(shù)不盡的財富。但隊伍中一直隱藏著狼人和他的同伴，他們準備在今晚發(fā)動襲擊，伺機奪取寶藏。幸存的幾位冒險者在夜里暗中施展絕技，要在到達古堡的前一天，揪出隱藏許久的狼人，以保證能夠順利取得寶藏……

 

游戲設(shè)計-情景化設(shè)計 體驗游戲樂趣

結(jié)合故事背景設(shè)定，以易用性原則為基礎(chǔ)，加入情景化設(shè)計，在【觸發(fā)期】制造驚喜感，合理布局，明晰操作，快速上手游戲；【興奮期】代入沉浸感，黑白場景切換，沉浸游戲；【結(jié)束期】凸顯成就感，高光時刻，強視效感知，勝負判定。

美式輕寫實風(fēng)格，以游戲背景與角色設(shè)定為依托，提取古堡、巖石、沙漏等關(guān)鍵元素貫穿整個游戲界面設(shè)計。

卡牌設(shè)計-精進主美視覺 刺激感官神經(jīng)

卡牌作為整個游戲的靈魂，代表玩家的身份，同時也會做成實物卡牌周邊，作為獎品發(fā)放給玩家。身份角色設(shè)定：共計9個角色，分為三大陣營。好人陣營：預(yù)言家、守夜人、搗蛋鬼、強盜、失眠者、酒鬼；狼人陣營：狼人、爪牙；第三陣營：皮匠。

人物形象根據(jù)角色職業(yè)技能進行設(shè)定；設(shè)計風(fēng)格為強氛圍感的美式魔幻風(fēng)格，突出卡牌氛圍感并保證人物清晰度，角色比例選擇展示腰部以上，角色以正面和四分之三面為主，角色的姿態(tài)和樣貌根據(jù)角色設(shè)定具體設(shè)計；三大陣營以邊框和氛圍顏色做區(qū)分，同陣營邊框（除道具外）不變；卡牌設(shè)計包含底框、邊框、角色，道具設(shè)計在邊框頂端兩側(cè)，根據(jù)角色替換。

卡片設(shè)計拆解

三大陣營設(shè)計

卡背設(shè)計

動效設(shè)計-制造積極情緒 打造峰值體驗

運用動效手段在游戲的關(guān)鍵節(jié)點打造峰值體驗，刺激用戶游戲情緒，快速帶入游戲人物和情節(jié)。

[觸發(fā)期]-[情緒帶入階段]

引發(fā)好奇心，極具儀式感的動畫（發(fā)牌和確認身份）推動用戶快速進入游戲氛圍，感知游戲。

[沉浸期]-[情緒沉浸階段]

流暢的操作體驗和反饋、場景轉(zhuǎn)場動畫提升游戲沉浸感與趣味性。

[結(jié)束期]-[情緒滿足階段]

通過整場的懸念鋪設(shè)，在最終的結(jié)果公布緩解來到情緒的高峰時刻。

游戲體驗情緒變化曲線

a.情緒代入階段

儀式感渲染-模擬牌桌發(fā)牌，卡牌掉落的過程，表現(xiàn)卡牌質(zhì)感和厚度在現(xiàn)實世界中的感受，身份確認動效添加強烈的反轉(zhuǎn)效果刺激用戶，不同陣營不同的色彩傾向強化對抗感知。

b.情緒沉浸階段

游戲體驗沉浸感-流暢簡單的操作體驗和環(huán)節(jié)轉(zhuǎn)場動畫明確游戲進度，降低游戲難度給玩家?guī)淼慕箲]情緒，強烈的操控感與燒腦懸疑玩法結(jié)合，使游戲體驗心流曲線趨于專注、樂趣、享受。動效平緩削弱視覺刺激保證玩家的專注。

游戲體驗心流區(qū)間

場景切換

白天黑夜場景用日月升起和場景氛圍的變化提示玩家環(huán)節(jié)的轉(zhuǎn)換，在平緩的游戲感受中自然的進入下一環(huán)節(jié)，沉浸在游戲線索思考和角色代入中，仿佛一切變化都是理所當然而不會因為意料之外的事件發(fā)生導(dǎo)致分心。

c.情緒滿足階段

游戲體驗情緒高峰時刻-經(jīng)過正常的懸念鋪設(shè)，最終在結(jié)果展示環(huán)節(jié)用強烈的光感和卡片破壞動效，引導(dǎo)用戶產(chǎn)生強烈的成就感和刺激感。并在此環(huán)節(jié)中游戲情緒達到了高峰時刻。

動效如何落地？

動效設(shè)計過程中運用了粒子插件、輝光插件，以及一些偽3D的技法。為了保證落地效果，技術(shù)使用游戲引擎開發(fā)，設(shè)計師采用拆解組合標注的方式交付研發(fā)-動效標注（代碼實現(xiàn)，如位移、簡單粒子效果）+序列幀&MP4視頻。最終達到了80%還原度。

寫在最后

作為第一款自研游戲，我們分為三條線：UI、主美、動效，緊密協(xié)作，聯(lián)合研發(fā)同學(xué)還原設(shè)計效果。游戲上線后，取得了一定的熱度，大大提升了一局的日活躍量。后續(xù)我們會繼續(xù)將業(yè)務(wù)目標與設(shè)計目標相結(jié)合 ，逐步迭代，提高游戲體驗。

原文地址：百度MEUX（公眾號）

作者：文娛平臺用戶體驗

轉(zhuǎn)載請注明：學(xué)UI網(wǎng)》游戲UI設(shè)計項目分析–狼人殺

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( m.sillybuy.com )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)