一網學是國內較早從事遠程培訓的機構，是較好的網頁設計培訓基地。創新的模式讓在職人員能夠工作學習兩不誤，省去了家里培訓點來回跑的時間。讓二三線以及偏遠地區的設計愛好者能足不出戶也享受來自一線城市老師的培訓。遠程教學可以把上課內容全程錄制，這樣方便學員課后反復復習，從而讓學員隊老師講解的內容真正做到的掌握。 做做——QQ飛車感恩三周年、QQ西游安全中心 下面我們來自己動手試一試。為主題選擇合適的“抄現實”物，并對其進行特征提煉，把握內容排版與物的關系，并注意細節搭配，讓整體更加深動。 《劍靈》武神塔介紹專題 需求分析 1.主題 是武神就上100層，“武神塔”是劍靈游戲測試新版本中推出的一個特色內容，它是一個比武場，由底層到高層，難度逐層增加。頁面的內容主要分為三部分，視頻、武神塔副本的介紹，以及七層塔中的BOSS和掉落的寶貝的介紹。需求方希望內容的呈現能夠結合武神塔的造型進行表現。 2.排版預想 為了更好的表現主題并結合塔的造型，我們選擇使用抄現實的方法，并計劃利用塔的造型來裝下這些信息。但如果將塔的造型與內容相結合我們將面臨三個問題。一，保留些塔的特征；二，文字內容放在；三，梳理幾塊內容的層次。 3.現有素材 大概理清思路后，我們來看看現有的素材，都說巧婦難為無米之炊，坦若著實無米，那那那就得自己種！開個玩笑，不過對于網頁設計來說，真正對到槍口上的素材并不多，許多時候咱都得變著法子玩。 武神塔 一張武神塔的外景，拿到素材的時候它的像素并不高，只能暫時考慮作為背景的一小部分，如果要將內容放置在塔內的話，這個素材的編輯難度比較大。 另外還有兩張武神塔的內景截圖，圖片質量不錯，但似乎對這個創意起不了太大的幫助。但姑且先留著。 BOSS 這是每層塔內的BOSS截圖，與此類似的這套圖一共有七張，這是游戲過程中的截圖，所以人物偏小，質量也不如原畫和正式輸出的3D模型高。而這些個BOSS又是內容中必需給玩家呈現的，所以揚長避短這又是一個難題。 人物 劍靈現有的游戲素材大致可以分為三種：3D、2D、GIF的惡搞Q版小動畫。 3D是一個很寫實的風格，如果將其與具體的塔造型結合并還要盛放信息內容的話，那需要繪制出與其匹配的精度，一方面操作難度比較大，另一方面也不利于信息的呈現和查閱，由于過分寫實，版式的局限性也比較大。 2D的素材相對于3D來說相對更概念化一些，但是要繪制出與其匹配精度的塔也是有一定困難的，而且對于一個小版本介紹專題來說時間也比較有限。 第三類，是劍靈的一個有愛化表現素材，是一些周邊的GIF表現，繪制簡潔，表現力強，也比較具有情感化。繪制出與之匹配的精度的塔的造型也相對比較容易。確實算是個不錯的方向。 4.總結 通過對主題、內容、素材的了解，我們就有了大概的構思。 我們將通過一個簡潔的塔造型去承載整個信息內容，并配合以Q版有愛的小動畫形像視覺活躍氣氛。 每層塔的內容安置在獨立的單層塔中，并通過七層塔的組合構成一個高聳入云的塔型 在選定方向的同時也帶來一個問題，簡約的風格和必需出現的BOSS截圖風格匹配？精度和風格之間的差異都會造成視覺的不統一。如果一時找不到答案，我們暫時把這個問題放在腦子的待處理區。策略從來不是萬全的，在大方向確定之后，許多細節的問題是在設計中一步步變法求解的。當然，這個方法并不是較好的，但卻是我們經常遇到的情況，天時地利，情投意合的情況是少有的，如果要求以萬全的策略才開工，那時間和環境都是不允許的，就像那句話么說來著，愛情就像一條河,誰不是摸著石頭過河呢?所以在大方向確定后，我們就開始嘗試動手了。 設計分解 STEP 1 減法 游戲中，武神塔擁有它復雜的飛檐造型和層次豐富的質感紋理，每層有大小不一的拱門。為了能給信息內容足夠的空間，我們將復雜的飛檐造型進行歸納，并暫時去掉了拱門，這樣我們也比較明確了信息內容的位置。 STEP 2 分塊 接下來我們就需要開始對內容進行分塊，我們知道內容大致分為三塊，視頻、副本介紹、七層塔。由于七層塔的數量較多，為了能使它與介紹和視頻內容有區別并保持七層的統一性，我們將它們進行顏色的區分。并在位置上依照塔的物理順序，由下而上從一層到七層。由于內容較長，每層塔可以做成收納的形式，以便控制長度。 STEP 3 加法 將拱門重新安置在分層塔的左側，用來安放每層比武塔的主BOSS，要主視覺的塔頂加入主視覺調節氣氛，在背景加入其它的建筑造型。并將主視覺的內容塔置于一個高聳入云的角度，體現了“是武神就上100層”的概念高度。 回頭說說先前留下的那個風格匹配的顧慮。降低寫實的游戲內截圖與相對簡約風格畫面的沖突感。瀏覽截圖我們發現，它們都是塔內的場景，并且基本上是平視的角度，于是便在畫面上開了一道立體的門，將場景安置在門后，一致的視角可以增強畫面的統一感。門的微寫實表現對截圖和塔的兩種風格進行了中間過渡，減弱了二者沖突感。 一網學，我的未來我設計。