活動中心：活動整合方案

網易｜2021年11月

活動中心是為遊戲《永劫無間》設計活動整合方案

這平台讓玩家容易地找到遊戲活動，讓開發者減少多餘的開發，以及為運營者提供低成本的運營方案。提升可及性、精簡開發流程以及優化遊戲推廣，為實現更高效、使用者友好的遊戲體驗作出了貢獻。

時長

1個月
(非連續)

角色

交互設計

介面拼接

工具

Figma,

Unity

時間軸

9個

月

28份

交互文檔

36個

手柄配置

37份

介面拼接

我由2021年8月加入《永劫無間》的開發團隊，直到2022年5月離開，在這9個月的時間裡，我完成了28個交互設計、36份手柄配置及37份設計的介面拼接。而這個設計在2021月的11月份開始，在12月1日上線。第一週接到策劃提出的需求後，完成了交互文檔並交付給GUI和開發，待開發完成一部分後，我負責把GUI的視覺設計稿使用Unity實現，最後再交付給動效並由QA測試效果。

開發流程

《永劫無間》是 24工作室和雷火用戶體驗中心（雷火UX）共同研發的遊戲，由網易發行。

作為雷火用戶體驗中心的成員，我負責交互設計和介面拼接。

成果成果成果成果成果成果成果

成果

培養用戶習慣

提升視覺一致性

增加開發效率

背景背景背景背景背景背景背景

背景

永劫無間（Naraka：Bladepoint）是一款動作冒險類大逃殺遊戲

發行：

國服版發行於 8 July, 2021.
現支持13種語言的全球版，發行在 Steam 於 2021年8月12日.
永久免費版本發行於 2023年7月13日，作為慶祝兩週年。

獎項：

2021年 Golden Joystick Awards 最佳多人遊戲提名
2021年 Steam Best Game You Suck it 提名
2021年 Best of Steam Top Sellers, Top New Releases

平台：

Window

Xbox

PlayStation5

問題問題問題問題問題問題

問題

活動對於提升玩家參與度至關重要

遊戲活動是免費遊戲至關重要的元素，透過創造興奮和期待來培養參與度，鼓勵玩家與遊戲互動。

越來越多的活動加大了對玩家和開發者的挑戰

在遊戲上線三個月後，為了保持玩家參與度，我們定期推出與各種節慶相應的活動，比如聖誕節和新年。而不同類型的活動由不同的策劃人員策劃，常見的即時解決方案是直接將它們直接堆疊在首頁的各角落。然而，這個臨時的解決方法會對玩家和開發者造成一些問題。

對於玩家

首頁太多不同樣式的入口，導致畫面雜亂

同類型活動在不同地方出現，用戶無法快速找出活動

對於開發者

視覺設計師（GUI）需要為每個新活動設計新的圖標，並且只是短暫地用於活動上線期。

開發人員需要重複開發類似的元件模塊以及新的介面。

目標

group

幫助玩家更容易地找到想要的活動，並簡化流程使他們能培養習慣。

developer_mode_tv

減輕開發者重複設計和開發類似的圖標、模塊、頁面的負擔。

競品分析競品分析競品分析競品分析競品分析競品分析競品分析競品分析

競品分析

參考的遊戲是有相似的運營方式而不是遊戲類型

《永劫無間》的直接競品通常是會想到《Apex 英雄》或是《絕對求生》等大逃殺遊戲，然而，他們的運營方式相對較為輕量，比起中國的手機遊戲有很多不同類型的活動（如節日打卡等），他們比較少活動以及運營頻率較低。因此，中國的手機遊戲的運營方式更能被我們玩家理解和接受。

優先參考中國日活(DUA)相對高的手機遊戲

當要參考中國的手機遊戲時，我們優先考慮日活比較高的遊戲，因為相信這些遊戲保證了遊戲各方面的品質，而我們會著重分析他們在活動的介面上如何處理。

Genshin Impact

原神

Honor of Kings

王者榮耀

League of Legends: Wild Rift

英雄聯盟：激鬥峽谷

開放世界、動作角色扮演遊戲 (RPG)

多人線上快節奏競技遊戲 (MOBA)

大逃殺 (BR)、大型多人連線第一身射擊類別遊戲 (MMOFPS)

圖標

圖標
「活動」

長方形
「活動進行中」
最近活動的圖片

長方形
「活動」
最近活動的圖片

一層菜單

兩層菜單

開放世界、動作角色扮演遊戲 (RPG)

多人線上快節奏競技遊戲 (MOBA)

圖標

圖標
「活動」

一層菜單

兩層菜單

多人線上快節奏競技遊戲 (MOBA)

大逃殺 (BR)、大型多人連線第一身射擊類別遊戲 (MMOFPS)

長方形
「活動進行中」
最近活動的圖片

長方形
「活動」
最近活動的圖片

兩層菜單

小結

各種單一活動散落在首頁各處

把活動都收進活動中心

在大廳顯眼的位置放置入口按鈕，風格和其他按鈕一致

使用1到2層菜單，分類不同活動類型

流程流程流程流程流程流程流程流程

流程

架構

線框圖

佈局佈局佈局佈局佈局佈局佈局

佈局

首頁

設計前

各種單一活動散落在首頁各處

設計後

把活動收進活動中心，以提高首頁空間利用率

選項1、2

如果放在選項1、2這種顯眼的Banner型入口，需要經常更換圖片元素，導致開發成本增加

選項3

選項3更多是用於短期資訊的緩衝區，所以會避免太會搶眼。然而活動中心作為常駐入口，需要與這類按鈕區分開。

選項4

選項4在組隊大廳和開始遊戲的入口之間，能在等待遊戲時能得到玩家注意所以這會是前面三個選項中的折中選擇，有效地成為活動中心的永駐入口。

活動中心

近期熱點

近期熱點會使用廣告圖的方式呈現，希望以大的視覺衝擊吸引玩家，而且會和一進入遊戲的圖片輪播彈窗同步內容，以達到引流的效果。

一進入遊戲時的圖片輪播彈窗

近期熱點：活動中心的第一個頁籤

常更新的內容

使用圖片輪播的方式去展示最新的限時活動

不常更新的內容

常駐活動

分兩種尺寸，並可以自由排列組合，使畫面更加整潔和靈活，可支持3~5張廣告圖片，讓策劃和根據不同的運營需求去調配，比較重要的佔比較大的空間，或內容比較多時就用最多的格數。主要展示版本公告、問卷、常駐活動、反外掛等活動。

活動

如何分類這些舊活動？

在第一個頁籤(近期熱點)之後，我們根據現有的活動進行分類，並將它們整理到不同的頁籤中，以方便玩家瀏覽和訪問

同類型的活動放到同一個頁籤

將現有的活動分類到同一頁簽中，讓玩家能夠根據活動類型快速尋找他們感興趣的活動

限時福利活動

對於活動

完成局內任務為主，透過獎勵去吸引玩家熟悉遊戲更多不同的玩法

綁定有禮

對外活動

與第三方應用的活動，希望透過外部社群增加使用者黏性。

三種不同的佈局

為日後頁面提供模版，以保證一致性和更好的擴展性

視覺產出視覺產出視覺產出視覺產出視覺產出視覺產出視覺產出

視覺產出

根據三種不同的頁面佈局，視覺設計師設計了以下的頁面。同類型的頁面有高度一致度所以可以通過只更換背景圖來快速推出新的活動

(a) 基本佈局

覆用率最高的介面；完成活動指定任務賺取活動道具，再使用活動道具換取奬勵，如特定的皮膚時裝等。

例如：
任務＋兌換活動、輪換活動、雙任務活動、英雄預熱活動等。

(b) 有三級頁籤

除了任務和兌換活動外，還有一些更複雜的活動，會包含像列表的信息，無法在一頁內展示，則會通過增加三級頁簽在裡面操作。

例如：
祈福活動、使者活動

(c) 有按鈕

這是相對簡單的佈局，會在右下方有按鈕簽到完成。

例如：
簽到活動

遊戲手柄遊戲手柄遊戲手柄遊戲手柄遊戲手柄遊戲手柄遊戲手柄

遊戲手柄

除了電腦的鍵盤滑鼠輸入外，也支持手柄的操作，為後續在不同遊戲平台（Xbox, PS5）的遷移舖墊。

Window

PS5

XBOX

鍵盤 + 滑鼠

遊戲手柄

按鍵數量

更多按鍵，更多客製化設置

精確度

精確度高，尤其是在第一人稱射擊遊戲(FPS)和策略遊戲中

舒適度

對於某些使用者來說，長時間會話可能會不太舒服

簡易度

對於某些玩家來說可能較難上手

懸浮態

具有懸停(hover)狀態，直接透過滑鼠點擊確認

按鍵數量

較少按鍵，較少客製化設置

精確度

控制流暢，但在某些類型中可能缺乏精確度

舒適度

長時間玩時更舒適

簡易度

通常更簡單直觀

懸浮態

無懸停(hover)狀態；介面上需要新增選取狀態，並按確認鍵進行最終確認

Window

鍵盤 + 滑鼠

按鍵數量

更多按鍵，更多客製化設置

精確度

精確度高，尤其是在第一人稱射擊遊戲(FPS)和策略遊戲中

舒適度

對於某些使用者來說，長時間會話可能會不太舒服

簡易度

對於某些玩家來說可能較難上手

懸浮態

具有懸停(hover)狀態，直接透過滑鼠點擊確認

PS5

XBOX

遊戲手柄

按鍵數量

較少按鍵，較少客製化設置

精確度

控制流暢，但在某些類型中可能缺乏精確度

舒適度

長時間玩時更舒適

簡易度

通常更簡單直觀

懸浮態

No hover state; on the interface, a selected state needs to be added, with a confirmation key pressed for final confirmation

遊戲手柄按鈕解釋

以PlayStation的遊戲手柄為例，根據頻率有分三個梯次

梯次一

使用的頻率比較高，多是全局固定的操作

梯次二

使用頻率中等，在局內通常會互相搭配使用。

梯次三

頻率最低，其位置也不好按，一般用於呼叫出菜單等，再進行後續操作。

Reference

按鈕在介面上的提示

全局通用按鍵

玩家在活動中心的的操作流程一般是：查看任務→返回→完成任務→回來領取任務，而這些動作都能用全局通用的

和

完成

活動中心的按鍵

然而，每個活動有的元素，如活動說明, 物品詳情，他們屬於需要有但不常查看的內容，我們都配上不常用的

和

把

和

留給一些複雜的活動。

語言本地化語言本地化語言本地化語言本地化語言本地化語言本地化

語言本地化

遊戲現在支持13種語言切換，最常見的問題就是外語的表達會比中文在字符上長很多，沒有處理好會導致文字超出文本框。然而，不同語言的長度會有大致的比例 (見下表)，所以在介面設計時，要考慮到至少中文的2.5倍長度

中文/日文/韓語
英語
德語/法語
西班牙語/葡萄牙語
俄文

1x
1.6x
1.8x
2x
2.2x

這是中文的文字段落
This is an English text paragraph
Dies ist eine Textpassage auf Deutsch
Dies ist eine Textpassage auf Spanisch
Dies ist ein beliebiger Textabsatz auf Russisch

(參考)

收獲收獲收獲收獲收獲收獲

收獲

developer_mode_tv

平衡視覺與開發的比重

在團隊中同時負責交互設計和拼接，需要仔細平衡視覺呈現的必要性，是否會因為一些相對小的視覺效果而過大地增加開發的工作量。應進一步思考如何最有效地結合視覺設計和工程需求，以實現最佳平衡。

groups_2

大團隊的挑戰

大團隊的節奏快，排期緊湊，需要嚴格把控工作時間。規範變得尤其重要，因為有眾多團隊成員，不僅包括設計人員還有其他職能崗位，如果交付的材料沒有保持一致，會影響各環節的溝通。

brush

設計創新的挑戰

在大團隊中，由於各個環節的連動，設計創新可能不是首要任務。應該基於自身遊戲的風格，同時考慮市場上遊戲的設計趨勢，制定符合需求的創新方針。

edit_document

知識共享與傳承

考慮建立有效的知識共享機制，確保團隊內的信息能夠順利流通。提供充分的培訓和文檔，使接手的人能夠快速上手。

PROJECT

MetaPush

Web3價值消息聚合工具

GaaS

鏈遊的錢包和交易市場系統

活動中心

活動整合方案

NFT Marketplace

視覺再設計

活動中心： 活動整合方案

網易｜2021年11月

活動中心是為遊戲《永劫無間》設計活動整合方案

時長

角色

工具

時間軸

9個

28份

36個

37份

開發流程

成果

培養用戶習慣

提升視覺一致性

增加開發效率

背景

永劫無間（Naraka：Bladepoint）是一款動作冒險類大逃殺遊戲

發行：

獎項：

平台：

Window

Xbox

PlayStation5

問題

活動對於提升玩家參與度至關重要

越來越多的活動 加大了對玩家和開發者的挑戰

對於玩家

對於開發者

目標

幫助玩家更容易地找到想要的活動，並簡化流程使他們能培養習慣。

減輕開發者重複設計和開發類似的圖標、模塊、頁面的負擔。

競品分析

參考的遊戲是有相似的運營方式而不是遊戲類型

優先參考中國日活(DUA)相對高的手機遊戲

原神

王者榮耀

英雄聯盟：激鬥峽谷

和平精英

開放世界、動作角色扮演遊戲 (RPG)

多人線上快節奏競技遊戲 (MOBA)

多人線上快節奏競技遊戲 (MOBA)

大逃殺 (BR)、大型多人連線第一身射擊類別遊戲 (MMOFPS)

一層菜單

兩層菜單

原神

王者榮耀

開放世界、動作角色扮演遊戲 (RPG)

多人線上快節奏競技遊戲 (MOBA)

一層菜單

兩層菜單

英雄聯盟：激鬥峽谷

和平精英

多人線上快節奏競技遊戲 (MOBA)

大逃殺 (BR)、大型多人連線第一身射擊類別遊戲 (MMOFPS)

兩層菜單

小結

各種單一活動散落在首頁各處

把活動都收進活動中心

在大廳顯眼的位置放置入口按鈕，風格和其他按鈕一致

使用1到2層菜單，分類不同活動類型

流程

架構

線框圖

佈局

首頁

設計前

各種單一活動散落在首頁各處

設計後

把活動收進活動中心，以提高首頁空間利用率

選項1、2

選項3

選項4

活動中心

近期熱點

常更新的內容

不常更新的內容

常駐活動

活動

如何分類這些舊活動？

活動中心：活動整合方案

越來越多的活動加大了對玩家和開發者的挑戰

例如：
任務＋兌換活動、輪換活動、雙任務活動、英雄預熱活動等。

例如：
祈福活動、使者活動

例如：
簽到活動