引言

千篇一律的以具象原畫或全彩人物模型為主要視覺形象的游戲網頁設計已經不能充分體現新一代網游的魅力，當我們從更宏觀的角度去審視《Dragon OathⅡ》這款游戲時，發現進入了一次對武俠新境界的思考。

項目簡介

該游戲取材于華人作家金庸小說，背景設定于公元11世紀的古代中國，被定義為"依附光影魔力而創造的東方夢幻世界"。也是搜狐暢游采用自主研發的CycloneⅣ高級引擎描繪出來的有別于其他傳統武俠的一次再升華。

項目所表達情感

武俠的感受也許是黑夜細雨中走入山門的劍客，也許是輕功掠過湖面激起的陣陣漣漪，甚至一陣清風，一片落葉，正是這些極具影響感官體驗的寫意元素，構成了人們對"武俠"最直觀的意象。

受中國功夫和影視作品的影響，西方對中國功夫存在誤解，這在近年來東方元素的西方網游中亦有體現，中國功夫不單是表面的拳腳格斗，中國功夫更多的是展現一種精神境界和戰斗美感，Dragon OathⅡ欲傳達的正是這種精神與意念。

項目分析

1、目標定位

在把握住原有老玩家的基礎上拓展對武俠有感觸的新玩家，這些新玩家中以80、90居多，他們對游戲的畫質和場景以至于劇情的要求會更高，所以我們采用新的表現形式和高品質的畫面效果來增加用戶的粘性，使其對該游戲具有文化認同感和品牌的認知度。在這里新的風格和新的感官刺激就浮現出來了。

2、關鍵詞

經過前期大量的市場調研與數據的分析后，我們為此次概念站確定的視覺關鍵詞為"唯美的東方新武俠"，唯美來自用CycloneⅣ高級引擎帶起來的光影盛宴，新武俠則是挖掘于古老中國一代代傳下來的武學精神境界。

3、情緒板分析法

設計創意之前是需要大量去收集和整理一些與之相關的圖片、文字和視頻等資料，來豐富和支撐創意的延續性，從中抓住幾個中心點進行的延展。（例如我們下面整理過的一些資料）

頭腦風暴過后的一些主要表現唯美武俠的關鍵詞，進而對關鍵詞進行搜索。

唯美、夢幻、淡雅、星空、云 等等

唯美帶給人一種夢幻般感受，是一種追求絕對的純粹的美，有些現實中看不到的情景。在這款游戲里我們就能把夢幻變成現實。

俠客、酒器、刀劍、馬匹、水墨、竹林等等

PS:我們做了很多前期的準備，準備越充分接下來的設計創意會更有說服力。不至于在最后改設計稿的時候沒有了靈感和沒有了設計的呈現，因為設計沒有不改的，所以希望大家能抗到最后。

4、項目提供素材

水墨寫意角色

文案

兇—當整個世界都與我為敵，我的眼中只剩殺戮！
墮—念極樂，一念修羅。佛心已碎，我只求一場解脫！
蝶—我已經躲了很久。這一次，就由我來守護！

素材整合

由于我們表現的角色是以黑白水墨為主的角色，所以上面收集的以具象畫面的圖素不能直接采用，需要繼承和延續唯美武俠風的精神—美的浪漫和粗狂的俠客情懷。

視覺表現：

根據我們拿到的角色與文案進行接下來的設計創意：

1.黑白為主的水墨寫意；
2.潑墨式的視覺沖擊；
3.結合墨滴和中國紅為設計元素；

4.角色之間近中遠景的聯系；
5.海報性質的元素整合，突出游戲的氣氛。

對水墨的手法進行研究

優點：水墨具有柔性的表現力，視覺沖擊力強
缺點：水墨用多會使頁面發污發堵，并且水墨無骨，難以駕馭

表現形式：暈染、潑灑、噴濺、留白保證頁面通透能更好的呼吸

草稿設計嘗試

"兇"

草稿1:

畫面中用縱向方式對頁面進行分割，以半身水墨人設為主視覺，給人一種人物即將要走出畫面的感覺，與之對應的方向采用了墨跡暈染開的視覺方式與血液進行融合，充分體現出了緊張的氣氛。

(經過項目和市場的分析討論，覺得頁面缺少霸氣，沒有更充分突出人物。然后進行了下一版嘗試)

草稿2:

畫面把人物全部露出，并進行了橫版設計，讓文字部分和功能區域放在一起，使畫面信息一目了然， 用水墨龍纏繞在人物身上，表現角色的狠。

(在接下來的談論中又提到了一些關于頁面張力的問題，雖然用人物做了主視覺，但是由于人物的寫意風格，使得畫面看不出來別的任何信息。)

自己當時的想法：（好吧，開始遇到了瓶頸，這樣的問題提出來以后真是沒辦法解決了，畫面縱向和橫向都已經設計過了，接下來該往哪個方向走，張力和霸氣怎么更有效的體現）

靜下心來分析一下

頁面是由人物、主標語、環境元素構成，所以的從這幾個方面著手考慮：

1.畫面顏色把控是否得當？
2.人設完整度是否達到預期效果？
3.主標語是否略顯小，是否夠張力？
4.環境元素的融合問題？

根據上述分析，繼續了下幾稿創意

草稿3

首先把主標語放大，用水墨筆觸對字體進行加工，使之更流暢更霸氣，采用人物和文案各占畫面一半來達到視覺沖擊力。

果然這樣的創意很奏效，很快得到了大家的一直好評，不過接下來會是一些細節的調整，包括：

1.副標語的排列；
2.頁面纏繞的龍再充實些；
3.LOGO下面墨跡虛化些；
4.次要背景減弱，感覺若隱若現即可。

最終稿

設計到這里該概念站的風格就定下來了，開始進行下面頁面的處理，風格不變，手法不變，唯變的是些細節和視覺的節奏。

"墮"

稿（1）把原畫中的飛鷹弱化，突出人物的細節，取近景并增加動感模糊，讓人物有一飛沖天的感覺，用書法字反白壓在畫面的左側，沖擊畫面。

稿（2）為了能使頁面切換時，對瀏覽者有一個舒緩的過程，采用遠景拉伸，讓人和飛鷹結合，把墮字的一小部分疊加在背景里，使畫面流動起來，讓左邊書法墮字做主視覺。這也和當時規劃的中景 、遠景、遠景不謀而合。（確定稿）

"蝶"

稿（1）考慮到整站切換起來能夠有視覺差異化，這張畫面大量用了墨跡做背景，反白的蝶字會更具有說服力。

稿（2）取人物近景，與瀏覽者拉近距離，讓水墨的虛和人物五官的實對比，打動觀者，頁面中增加了兩只飛翔的小蝴蝶，更能體現出人物的柔美。

"畫"

稿（1）用兩股潑墨形式撞擊后留下來的區域，撐開畫面，以三角形為元件整合在畫面，打破方方正正，給瀏覽者一種別樣的感受。

稿（2）在原來基礎上縮小，使得在小瀏覽器上面也可一睹<>游戲的場景和原畫。

最終上線稿

地址：http://www.dragonoath2.com/

結語

大家或許都會發現，有的時候一個優秀的設計稿，最后讓改成了飛機稿，這里面的原因很多，這里就不多說了，以免被吐槽。我慶幸的是，做這個概念站能夠有一些有效的建議和意見得以實施，并得到了各方的認可，算是在長達半個多月設計辛苦份上的一次勉勵，這次不僅僅是對概念站的一次升華，也是對自己能力和想法的一次升華。

到我這里只完成了一半，接下來的事由FLANSH工程師和制作進行了一系列的動態藝術加工，讓畫面流動起來，那種大氣國際化不言而喻。

================關于暢游VC================

搜狐暢游視覺設計中心團隊。我們是從游戲和生活中汲取創意和靈感的一群設計精靈，用愛去釋放奇妙的設計魔法，描繪讓你我感動的虛擬人生。

官網博客：vc.changyou.com
新浪微博： @暢游VC
微信公眾平臺：cyou_vc
您也可以通過掃描下方二維碼快速添加：