“模板化”——這也許是視覺設(shè)計(jì)師通常最不愿意聽到的概念，先入為主的會(huì)產(chǎn)生“批量生產(chǎn)”、“體力活兒”、“限制思維”等概念，總之都比較負(fù)面。但為什么在這里要講這個(gè)問題，不僅僅是站在視覺設(shè)計(jì)的角度，更多的是從產(chǎn)品整體包裝營運(yùn)進(jìn)行考慮的。產(chǎn)品通過“模板化”的運(yùn)用，讓整體形象和用戶體驗(yàn)都能較好的保持一致。那么，留給設(shè)計(jì)師的只有機(jī)械的執(zhí)行么？不，即使模板化，也要有我們獨(dú)特的見解，就拿會(huì)員項(xiàng)目近期發(fā)生的一次嘗試說起吧。
模板化專區(qū)，這個(gè)由來已久的概念先行于會(huì)員的游戲?qū)^(qū)。在此不得不提一下之前的游戲?qū)^(qū)。會(huì)員游戲?qū)^(qū)主要是為QQ會(huì)員身份的用戶提供一些“優(yōu)先體驗(yàn)”、“游戲試玩”、“禮包發(fā)放”等功能，根據(jù)不同的游戲有不同的特權(quán)體驗(yàn)。之前都是不同的游戲?qū)^(qū)設(shè)計(jì)不同的交互和視覺，加上重構(gòu)的周期大概是4-5個(gè)工作日，再加上程序和測試，視覺設(shè)計(jì)師接到需求到產(chǎn)品上線，至少是一周多的時(shí)間。
最早提出模板化概念，大概有這么幾個(gè)原因：
- 需要讓用戶在視覺上感覺更整體化，更專區(qū)化。之前不同的風(fēng)格，更容易讓用戶覺得像某某活動(dòng)，少了專區(qū)的感覺。
- 優(yōu)化整個(gè)項(xiàng)目周期。模板化專區(qū)后，交互固定了，視覺設(shè)計(jì)師只需基于基本框架再根據(jù)不同游戲替換不同風(fēng)格的質(zhì)感和色彩，節(jié)約了重新創(chuàng)意時(shí)間。
但是這種想法剛誕生的時(shí)候，大家并不是都特別贊同，主要有這些顧慮：
- “游戲”這個(gè)題材，本身是跳躍的，活潑的，它有自己的個(gè)性，自己的風(fēng)格，千篇一律的模板化設(shè)計(jì)，會(huì)不會(huì)使用戶審美疲勞，失去對該游戲的好奇心。
- 模板化后能節(jié)約到更多的也許只是交互的工作量，視覺設(shè)計(jì)師為了盡量追求全新的視覺體驗(yàn)，肯定要在質(zhì)感和細(xì)節(jié)上下很多功夫，這樣一來，制作的同事也要重新切圖，時(shí)間到底能節(jié)約多少？
不過，帶著這些疑問，我們還是進(jìn)行了初步的嘗試。
首先是“QQ飛車”這個(gè)項(xiàng)目，擺在我們面前有兩個(gè)問題是值得考慮的：
- 第一，要讓頁面視覺統(tǒng)一，突出專區(qū)概念，那我們專區(qū)和專區(qū)之間一定要有相似性，這樣才能讓用戶印象根深蒂固。
- 第二，要突出游戲特色，讓每個(gè)游戲和游戲之間有足夠的視覺沖擊力吸引用戶，那設(shè)計(jì)一定不能千篇一律，要有變化，有特點(diǎn)。這兩條猛的一看好像剛好矛盾，我們只有找尋一個(gè)平衡點(diǎn)，盡可能兩邊都滿足到。
對于每個(gè)游戲有不同風(fēng)格，不同質(zhì)感，這是無可厚非的，那要形成統(tǒng)一，除了基本交互一樣，還想到要定義一個(gè)專區(qū)的統(tǒng)一元素，那就是游戲?qū)^(qū)的logo，但后來由于感覺單獨(dú)的logo形式比較喧賓奪主，就換成插卡形式。淡化了它在形式上的表現(xiàn)，但依然達(dá)到了統(tǒng)一元素的作用。
第一個(gè)專區(qū)順利上線了，視覺設(shè)計(jì)和重構(gòu)加一起也是一周左右的時(shí)間，還看不出時(shí)間優(yōu)化上的成效，第二個(gè)專區(qū)的需求很快到來，由于有了前期的模板，原本3天左右的視覺設(shè)計(jì)時(shí)間，只用了1天就搞定交給重構(gòu)，雖然質(zhì)感，色彩都有很大變化，但由于基本框架不用動(dòng)，時(shí)間還是大大節(jié)省了。
[Page: ]
目前”模板化專區(qū)”已試運(yùn)行了1個(gè)多月，這里隨機(jī)采訪了兩位參與過此項(xiàng)目的設(shè)計(jì)師。
設(shè)計(jì)師1：妖精
在“會(huì)員游戲?qū)^(qū)”還沒實(shí)行模版化的時(shí)候，幾乎每次的設(shè)計(jì)需求都要花上一天的時(shí)間與產(chǎn)品討論交互稿，然后收集資料完善交互。由于產(chǎn)品經(jīng)理想法天馬行空，很多時(shí)候也不能完整的表現(xiàn)在交互上，造成視覺設(shè)計(jì)稿完成后，還需要反復(fù)修改很多次，這樣需求制作時(shí)間就延長了，也影響到之后的一系列制作上線時(shí)間。
今年2月，游戲?qū)^(qū)開始對制作一套專門的模版行探討和研究，如何把會(huì)員自己特有的想法和既有各個(gè)游戲的類型做融合。這是一個(gè)可以肯定和堅(jiān)持的路線，即提高各環(huán)節(jié)工作效率、又滿足各種用戶，何樂而不為？模板交互的產(chǎn)生，經(jīng)過了很多討論和修改，讓專區(qū)的表現(xiàn)更加準(zhǔn)確，更加完美?，F(xiàn)在游戲?qū)^(qū)有了自己的模板。
第一：
模板作為提高效率的有效工具，設(shè)計(jì)師只要根據(jù)每個(gè)游戲的風(fēng)格類型再與模版相結(jié)合。讓我們把時(shí)間花到精致細(xì)節(jié)，優(yōu)化質(zhì)感上。模板化并沒有抑制設(shè)計(jì)師對視覺的想法，它讓設(shè)計(jì)師必須去想怎么讓不同的游戲網(wǎng)頁設(shè)計(jì)能和模板相融合，而不至于產(chǎn)生千篇一律相同的網(wǎng)頁，反而對設(shè)計(jì)師的要求更高了。
【絲路英雄模板 & 穿越火線模板】
第二:更好的團(tuán)隊(duì)合作。
在模板的產(chǎn)生后，產(chǎn)品與設(shè)計(jì)師思想上的融合溝通的時(shí)間大大節(jié)省了。產(chǎn)品能最快提供到所有需要的資料和內(nèi)容，設(shè)計(jì)師也能用半天的時(shí)間把設(shè)計(jì)稿完成，大家可以減少很多不必要的錯(cuò)誤，提升產(chǎn)品質(zhì)量和工作效率。在重構(gòu)的時(shí)候，模板化的代碼配合，更是能體驗(yàn)到它的好處，廢棄代碼越來越少，互相之間也難以閱讀問題也沒有了。
最后，說說個(gè)人對模板化在會(huì)員活動(dòng)中的未來發(fā)展想法。會(huì)員有許多不同活動(dòng)的頁面，生活的、游戲的、功能特權(quán)的。怎么讓用戶看到這些頁面第一反映就知道這是會(huì)員的活動(dòng)？如何讓會(huì)員不同活動(dòng)有著統(tǒng)一的聯(lián)系和關(guān)聯(lián)，成為會(huì)員的一大特征？模板化就了一個(gè)必然的思考。它能讓同一種類型的活動(dòng)用另一種新的形式在用戶面前展現(xiàn)，而有不缺一種“系列”的感覺。這樣對會(huì)員以后發(fā)展更多特權(quán)活動(dòng)帶來了有利的設(shè)計(jì)支持。它能節(jié)省設(shè)計(jì)，重構(gòu)，開發(fā)的時(shí)間。提高設(shè)計(jì)師的思考能力，也能讓每個(gè)活動(dòng)有另一種的創(chuàng)新有序的設(shè)計(jì)和執(zhí)行。
我們必須清楚活動(dòng)內(nèi)在的共同之處，然后做好交互設(shè)計(jì)，不斷優(yōu)化模板，這樣才能更好的做好會(huì)員活動(dòng)模板化道路。其實(shí)目前，會(huì)員在不同的活動(dòng)中都逐漸實(shí)行這樣的方法。在優(yōu)先體驗(yàn)的特權(quán)活動(dòng)中，就采用了模板化的設(shè)計(jì)模式。在看不同優(yōu)先體驗(yàn)內(nèi)容的活動(dòng)中，既能看到它們的特權(quán)特性的展示，又能讓人覺得這是一套統(tǒng)一的特權(quán)體驗(yàn)，而且在不斷更新新的內(nèi)容。
[Page: ]
設(shè)計(jì)師2：三可
模板化之前，對游戲?qū)^(qū)的定位依舊是當(dāng)成常規(guī)活動(dòng)來做，風(fēng)格多樣。這樣的好處是能夠充分展現(xiàn)各游戲的風(fēng)格氛圍。然而也少不了很多弊端：原則上一個(gè)游戲?qū)^(qū)的視覺設(shè)計(jì)需要2天左右，包括首頁和子頁。但設(shè)計(jì)稿難免會(huì)有修改，除了單純視覺上的修改外，再加上產(chǎn)品本身存在很大的不可控因素，產(chǎn)品經(jīng)理的傳達(dá)會(huì)存在誤差等等，這些都會(huì)導(dǎo)致頁面內(nèi)容的反復(fù)導(dǎo)致設(shè)計(jì)稿的反復(fù)。如華夏頁面一個(gè)模塊的內(nèi)容就如此反復(fù)。
如此一來，一個(gè)專區(qū)的實(shí)際視覺設(shè)計(jì)周期會(huì)達(dá)到3-4天。
模板化之后，最大的感受就是從起初的反復(fù)修改到如今的基本上一天之內(nèi)就能把稿子定下來。大大提高了工作效率。也使得各個(gè)游戲?qū)^(qū)更加統(tǒng)一。拿穿越火線游戲?qū)^(qū)來說，之前沒模板花的時(shí)間是3.5，其中除首頁外還有3個(gè)子頁面。由于交互內(nèi)容的不斷變更而導(dǎo)致的內(nèi)容區(qū)域板塊調(diào)整，首頁總共出了4個(gè)版本，如圖所示。
【四稿對比圖】
然而新專區(qū)完成所有頁面只用了1天，工作效率大大提高。音速專區(qū)，基本上產(chǎn)品經(jīng)理只用發(fā)一個(gè)需求文件就可以。修改也從起初的大調(diào)到微調(diào)。
游戲?qū)^(qū)的模板化對于設(shè)計(jì)師來說可能少了一些個(gè)人的發(fā)揮空間，然而從產(chǎn)品整體的設(shè)計(jì)風(fēng)格上來說得到了統(tǒng)一。也減少了后期重構(gòu)和開發(fā)的投入，大大節(jié)約了成本。從視覺設(shè)計(jì)上來講，一個(gè)模板類的東西，會(huì)對視覺的展現(xiàn)會(huì)有一定的約束性，每個(gè)游戲的風(fēng)格不同，用一樣的模塊表現(xiàn)不同的游戲除了樣式上的變化就沒有更多的設(shè)計(jì)發(fā)揮空間，比如說一些不規(guī)則模塊等比較自由的設(shè)計(jì)排版，模板化會(huì)讓頁面陷入死板的僵局。但模板化對產(chǎn)品本身帶來的好處是顯而易見的，也是游戲?qū)^(qū)化的趨勢。
現(xiàn)在看來，模板化專區(qū)，的確是一勞永逸的辦法。相信我們會(huì)慢慢的完善。
對于模板化專區(qū)的未來，也許不只是運(yùn)用在游戲?qū)^(qū)，以后生活專區(qū)，某某頻道專區(qū)都有可能涉及，所以在“模板”的定義要更加的靈活，我們可以進(jìn)行更詳細(xì)的分類，還是拿游戲?qū)^(qū)來說，現(xiàn)在都是統(tǒng)一交互不同設(shè)計(jì)，以后也許我們根據(jù)游戲類別來進(jìn)行交互的改動(dòng)，比如rpg的是一種交互，射擊的又是一種交互，盡可能給用戶帶來統(tǒng)一性的同時(shí)創(chuàng)造更大的視覺沖擊力。
那么，對于“模板化”概念的意義是毋須質(zhì)疑的，視覺設(shè)計(jì)師作為整個(gè)環(huán)節(jié)中的一部分，也起著舉足輕重的作用，我們不會(huì)是單純的視覺執(zhí)行者，更負(fù)有項(xiàng)目推動(dòng)，產(chǎn)品完善的重要使命。
