《龍族幻想》UI設計分享——以夥伴招募為例

P&G發表於2020-11-09
《龍族幻想》是祖龍第一款UE4引擎的遊戲,做為UI設計師,大家很開心能參與這樣一款遊戲。

在做遊戲內介面設計的時候,我們也希望能嘗試一些更具情景化,更有代入感的介面設計方向。

大多數遊戲公司,因為專案人員數量有限,崗位沒有太多細分,互動的部分一般是由策劃和UI設計師共同去做的,這就需要ui設計師本身有全流程的設計思維。

視覺的設計和包裝要服務於功能需求,介面的操作流程是否順暢,最終方案是否能夠落地實現等等,都需要在設計介面的時候考慮到。

話不多說~直接入正題~

先歸納下基本流程:

基本流程

  • 分析需求(遊戲世界觀,使用者定位,競品分析,關鍵詞分析)
  • 視覺框架概念(出風格草圖,確立大方向,建立統一視覺語言)
  • 確定介面風格(打磨風格稿)
  • 訂立規範(保障專案風格的統一,減少人員溝通成本)

確定風格後,來看下具體介面的設計流程:

具體流程

  • 功能分析(確認功能玩法,操作流程,給介面資訊重要度分級,清晰邏輯關係)
  • 細化設計(介面,圖示等細化)
  • 輸出說明(字色標註,補充說明)
  • 跟進實現效果(拼圖是否正確還原效果圖,遊戲實際操作時是否有問題,並及時調整)

上面每一個單獨點都有很多可延展開來說的東西,篇幅有限,所以這次我們先從龍族的招募介面為例,來說下介面具體的設計思路吧~

夥伴招募

最初期的版本方案

  • 核心需求:貼合小說原著,進行有儀式感的夥伴招募。
  • 包裝的背景:根據小說,路鳴澤像一個有上帝視角的角色,他具有操控他人夢境的能力,改變夢境的同時也能改變現實。
  • 包裝細節:主題圍繞夢境;招募方式:開啟夢境&構築夢境。

《龍族幻想》UI設計分享——以夥伴招募為例

《龍族幻想》UI設計分享——以夥伴招募為例

《龍族幻想》UI設計分享——以夥伴招募為例
上圖角色為網路素材

最初方案的問題是代入感不夠,遊戲特徵表現不足,還是比較普通的抽卡介面,顯得誠意不足,雖然從視覺製作到功能實現完畢,但反饋不夠好,所以全部推翻重做。

新方案

  • 核心需求:增強代入感,儀式感,弱化傳統抽卡感。
  • 在思考新風格的過程中,大家頭腦風暴,提出了很多有趣的設計點。我們從小說的故事背景中提取了一些可與招募系統關聯的情節和要素;比如跟路鳴澤簽訂電子契約、從城市電話廳撥打電話、卡塞爾學院的懸賞幫助論壇等等。最終以卡塞爾學院執行部,執行任務時招募專員進行展開設計。以“指紋求助”做為整個包裝的出發點,再逐漸豐滿整個設計的內容。

以下是當時頭腦風暴過程中的部分手稿草圖:

《龍族幻想》UI設計分享——以夥伴招募為例

《龍族幻想》UI設計分享——以夥伴招募為例

首先情景預想:貼合小說原著背景,在龍族小說中發生一些事件時,校長作為一個引導者,指引著大家前進的方向。他自身帶有集結成員的屬性。所以場景發生定位在校長昂熱的辦公室。

然後根據包裝總結一些關鍵詞:凌亂的辦公桌、電話、卡塞爾學院的學生證、堆疊的檔案、世界樹、混血種、龍紋、檔案袋、條形碼、指紋等元素。

最終呈現的夥伴招募效果如下:

招募首頁

《龍族幻想》UI設計分享——以夥伴招募為例

選擇攜帶夥伴

《龍族幻想》UI設計分享——以夥伴招募為例

求助指紋選擇

《龍族幻想》UI設計分享——以夥伴招募為例

指紋輸入

《龍族幻想》UI設計分享——以夥伴招募為例

召喚夥伴動畫

《龍族幻想》UI設計分享——以夥伴招募為例

高階指紋效果

《龍族幻想》UI設計分享——以夥伴招募為例

好的遊戲能引起玩家的情感共鳴,能讓玩家的情緒在該釋放的時候得到宣洩,介面設計也是一樣。

從故事背景,世界觀,場景,角色,武器等設計中提煉概括更有代入感,更能和玩家產生情感聯動。

設計的靈感可以從各種藝術形式中汲取。多玩好的遊戲,多看其他藝術領域的知識,提高審美和眼界。

只有持續的儲備和更新知識庫,才能在這個競爭激烈的行業拉長職業生命週期。

以上就是關於介面設計的一點淺見,感謝大家看到這裡~謝謝


來源:祖龍娛樂美術中心
原文:https://mp.weixin.qq.com/s/sYfP7mLpD-1KDM93jSZ6ww

相關文章