網(wǎng)站改版案例： 阿里資訊升級項目總結(jié)
來源:網(wǎng)站推廣 2012-10-29
插播一段廣告:本項目10月10日第一期刪減版公映!10月底會發(fā)布完整無刪減版,敬請期待!發(fā)布地址:info.1688.com
序:
2年前,剛?cè)肼毎⒗镞�沒轉(zhuǎn)正就有幸參與了資訊改版項目,那可是我的產(chǎn)品處女秀,出演視覺設(shè)計師一角,當(dāng)時拿到手的就已經(jīng)是一份未上色的黑白稿以及一份飛機稿。不知道監(jiān)制是誰,也不知道導(dǎo)演是誰,更不知道其他演員是誰,老板說交給我了,就糊里糊涂的出演了。跌跌撞撞演出7.8個版本就拿去讓需求方選了,最后也是蠻順利的選了一版。然后再優(yōu)化再改改,也在那一周每天熬到個11點,最后在約定時間之前,交給負責(zé)后期的前端同學(xué),然后,然后就上線了。。。當(dāng)時的感受是:原來產(chǎn)品設(shè)計就是這樣的啊。。上線之后,不盡人意,很多東西和我想象的還是有點距離。
2個月前,也滿了2周年,我似乎發(fā)現(xiàn)我與“2”這個數(shù)字非常有緣,回頭在看看,原來我從來都不曾離開社區(qū)。這次我又接到了資訊升級的任務(wù),意料之中,經(jīng)過2年的滾打,我早想改他了,礙于“沒有資源”,幸好行巔有眼開了金口,要求資訊要更專業(yè)更海量更權(quán)威!于是乎,我就又一次出演了資訊升級項目!這次的出演真是感觸頗深了,雖然仍然是出演視覺設(shè)計師一角,但是要讓最后的作品能接近完美的出現(xiàn)在眾人面前,光只做好自己的本職是完全不夠的,當(dāng)然在這個過程當(dāng)中,如果你也遇到了像小帥和狒狒這種出色的監(jiān)制,也是可以省去非常多的時間,比如我可以不用花太多時間去糾結(jié)數(shù)據(jù)問題,打點問題,也不用想著如何去重復(fù)解釋這里為什么要這樣演的問題等等…盡管如此,也不代表我出了做好視覺,其他都不用管了,否則,視覺設(shè)計師就永遠都是美工了:不想做監(jiān)制的演員都不是好導(dǎo)演!不想做PM的體驗設(shè)計師不是好產(chǎn)品經(jīng)理!被復(fù)制了無數(shù)版本的名言用在很多地方都是很有效的。也為了更豐富自己的歷練和對項目的了解,很多事仍然要親力親為,盡管最后仍然有很多細小的問題暴露出來,但是回頭想想,如果什么都不做,最后暴露出來的問題會更多,雖然沒有做到心目中的完美,但是至少離“完美”又近了一步。
————————————————我是分割線!——————————————————
項目總流程:
*黃點所點之處都是我在這個項目流程中參與的環(huán)節(jié)。
①體驗關(guān)鍵指標:這里是項目前期小帥的專業(yè)方法論提及的5個維度,聽過分享的同學(xué)應(yīng)該都知道H-E-A-R-T:
②六度分析:這里提到的六度分析和人與人之間關(guān)系的六度關(guān)系不一樣,簡單先解釋一下這里的六度分析是一種分布式、一體化、幫助使用者對問題進行系統(tǒng)化分析的思考方式。
這里做簡單解釋,具體詳情請關(guān)注李龍的分享或者咨詢本人,聯(lián)系旺旺:lilong4174
項目前期小帥非常給力,取了資訊的數(shù)據(jù)進行分析并分享給PD,運營以及前端,為之后項目進行以及產(chǎn)品的規(guī)劃打了扎實的基礎(chǔ)。用戶調(diào)研這里分了2部分,一部分是和小帥一起參與的對資訊資深用戶進行的訪談,另外一個部分對我針對專業(yè)人士(公司內(nèi)部人員:老板,PD,運營,設(shè)計師,開發(fā))進行的簡單訪問。這2部分人員的調(diào)研加起來就產(chǎn)生了之后的信息模塊推導(dǎo)而出的信息架構(gòu)(交互稿)和最后情緒版分析產(chǎn)生的最終稿。那作為整個項目的主演視覺設(shè)計師,在這個項目總結(jié)中具體就說說對于情緒版分析到視覺稿的產(chǎn)出過程,后期前端跟進注意事項以及回顧項目最初需要考慮的問題三方面情況。好,文章過半,接下來才真走入重點…
一:情緒版分析到視覺稿的產(chǎn)出過程
情緒版:
關(guān)于情緒版的簡單步驟:體驗關(guān)鍵詞(來源于以上提及用戶調(diào)研的2部分)→關(guān)鍵詞衍生(物化,視覺以及心境的映射)→根據(jù)衍生關(guān)鍵詞搜索到的圖片→圖片色塊→生成情緒版(詳細可見資訊升級情緒版查看地址:\\nas\Alibaba\B2B\項目組\中文站UED\#應(yīng)用設(shè)計組#\資訊升級(slide貌似需要翻墻了,就用咱們的服務(wù)器吧))
結(jié)合整個設(shè)計經(jīng)驗來看:其實對于產(chǎn)品本身,尤其是視覺設(shè)計師,在要設(shè)計之前,設(shè)計師就應(yīng)該在腦海中有一個成形的視覺幻影,而情緒版正是為了這種視覺幻影做的一個很好的論證的方法,也為了視覺評審的時候為說服老板和觀點可能和你不太一致的人找一個比較有效的理由。當(dāng)然無法產(chǎn)生感覺的時候直接用情緒版也是一個非常有效的方法了。但是切記,沒有事情是絕對的!尤其是像我們這種所謂“喜歡暖色調(diào)的中國人”,或許設(shè)計一個藍色調(diào)或者冷色調(diào)的產(chǎn)品需要下定很大的決心以及能說服老板的氣場!而我雖然下定了很大的決心,可是深知氣場不夠強大,因此我也為自己留了一條后路。。。
競品分析:
在情緒版的最后面加了一個畫面,如下:
為了避免老板最后強行要用暖色調(diào)的版本,導(dǎo)致情緒版的論證方法部分失效…事實證明,這樣做并非不科學(xué),因為老板的確提了一個坑爹的要求:“在做一版暖色調(diào)的吧。。。”“嗯,那好吧。。”最后的結(jié)局可想而知。資訊嘛,當(dāng)然還是要遵循市場規(guī)律的,市場規(guī)律從何而來,競品分析!這絕對是能和情緒版一起稱作“答辯雙雄”的證詞!競品分析可以是印證情緒版分析的最后一步,因此最后還是采用了冷色調(diào)的視覺版本,也總算讓我如釋重負呼了一口氣。。也總算沒有讓我的情緒版變成坑爹的方法論。很多人可能會在競品分析的時候不知道選擇哪些維度,其實可以根據(jù)你要設(shè)計的設(shè)計稿中去抽取,例如:主色調(diào),圖片占比,是否有背景色,模塊是否有邊框,懸停色,大段落文字色等等,可以用于作為DPL的部分都可是是競品分析的關(guān)鍵要素。同理,部分提取要素即使是大部分競品所具有的,有時候老板就是希望某一點不一樣,這種情況也是會發(fā)生的,在不破壞整體效果太多的情況下,那就按老板說的去做些嘗試吧,而這種特殊情況有一定的風(fēng)向,風(fēng)險不在于是否會破壞視覺效果,而是和前端同學(xué)的合作時間點,進入下部分。
二:后期前端跟進注意事項
小插曲:第一部分的尾聲說到的,老板會對于某個產(chǎn)品有些特殊要求,比如在本次過程中遇到的,其他N多次確認都不算,最后已經(jīng)確認為最終稿的某個月黑風(fēng)高的晚上,旺旺一跳,老板說:其他看的都挺不錯,看了好久,字體顏色有點淺不夠聚焦,能否把#444改成#333,當(dāng)即虎軀一震,脫口而出:最終稿已經(jīng)確認了啊,進入前端了,在改不太好啊,老板說沒關(guān)系啊,改個色值很快的,于是我就只好硬著頭皮找前端改了,第二天,老板又覺得鏈接色有點問題,太灰了啊,要改鏈接色,當(dāng)時心里就嘀咕:尼瑪就不能一次性說完嘛,最終稿確認前怎么都不說啊。。當(dāng)然沒說出口,于是灰溜溜的找前端又想改啦,前端同學(xué)就不開心啦,就說你需求變更啊,幾次了啊,不干啊,找PD啊,不能按時上線你負責(zé)嗎,過程很揪心你懂嗎,其實我能理解前端同學(xué)改一個色值是小事,過程有些還原度不夠的又補標注重新改,某個小點改了又怕改了之后老板說要改回來,于是自己反省了一會終于經(jīng)過不懈努力以及堅持說服了老板不改這里的鏈接色了,即時要改也等項目發(fā)布之后提統(tǒng)一需求了。
總結(jié)幾個點需要在進入前端之前就要確認好的:
標注:尤其是統(tǒng)一輸出的標注要詳細,否則之后還原度不夠責(zé)任還是你的(有幾個部分要謹慎:導(dǎo)航,面包屑,模塊可編輯區(qū)域,字體顏色和大小使用情況,統(tǒng)一類型模塊間距)
按鈕:狀態(tài)必須在最終稿給前端時候就要補全,別想著前端會來問你要,自己先準備好放頁面上吧
懸停:雖然說懸停是個統(tǒng)一規(guī)范,但是務(wù)必要記住,導(dǎo)航是整個頁面特殊的存在也是使頁面與頁面之間流通的樞紐,有背景色的導(dǎo)航特別要注意,懸停色千萬別說全頁面統(tǒng)一,導(dǎo)航的懸停只加下劃線就夠了。
特殊區(qū)域:特殊情況必須另做說明,要詳細說明,否則前端就按你的統(tǒng)一規(guī)范做了。及時視覺稿上做了效果可能也未必會被發(fā)現(xiàn),還是需要注解。
日常跟進:每天抽至少2次去看看前端的設(shè)計情況,還原度問題可以當(dāng)場解決,省去一些麻煩。
三:項目最初需要考慮的問題
如果是新項目,這個不必太擔(dān)心,產(chǎn)品經(jīng)理在建立需求文檔就會規(guī)劃好這系列問題。項目升級或改版,這樣的問題會相對較多,有很多升級或者改版都不是項目原始創(chuàng)建者發(fā)起或者推進的,因此在信息的傳遞上會出現(xiàn)一些偏差。那要注意點幾個方面如下:
廣告位:在改版之前需要弄清楚整個頁面中哪些位置是本部門的,哪些更新權(quán)限是給別的部門的,這些事先一定要在設(shè)計之前就做好功課,否則會導(dǎo)致項目上線延期或者上線這塊位置與視覺稿不一致,例如本次資訊改版中首頁與detail都有部分廣告位是屬于北京雅虎負責(zé)的,tanx廣告位,還有一塊屬于如影隨形廣告位,這些位置有時候不是時時刻刻都展示出來,有時候只有某個月的幾天時間展示,因此很容易在改版設(shè)計的時候忽略。或者會誤以為是屬于本產(chǎn)品所屬部門負責(zé)。那目前的解決方案就是在簽約出去的合同之前的廣告位暫時按設(shè)計尺寸壓縮或拉長處理,暫時盡可能保持效果不要相差太大,等合同結(jié)束后改成設(shè)計稿的最終尺寸并及時給到雅虎負責(zé)人以后的新尺寸。
合作位:資訊detail當(dāng)中有部分位置給了P4P,同理,由于頁面這塊位置是直接嵌入P4P的代碼,沒有提前一定時間知會P4P我們需要升級換模板樣式,導(dǎo)致上線之后這塊位置的模塊樣式和統(tǒng)一樣式相差甚遠,也實在是破壞了氣氛,雖然有些慘不忍睹,引以為鑒,貼出來給大家過目,目前根據(jù)P4P部門的資源排期要月底才能完成新模板的匹配。
文章編輯: 365webcall網(wǎng)頁客服(www.365webcall.com)
我的評論
| 登錄賬號： | 密碼： | 快速注冊 | 找回密碼 |  |
