一区二区三区日韩精品-日韩经典一区二区三区-五月激情综合丁香婷婷-欧美精品中文字幕专区

分享

聊聊線框圖——為線框圖多留點時間

 命運之輪 2012-05-09

注:heidi寫這系列的專業(yè)文章,并不說明目前heidi做得有多好,相反,每當(dāng)我發(fā)現(xiàn)自己做得不夠好時或者遇到問題時,都喜歡反思并總結(jié),可是由于以前養(yǎng)成的不良習(xí)慣,導(dǎo)致我最終寫出來的東西總是像專業(yè)教程,這也導(dǎo)致會有一些小朋友誤認為我是專業(yè)人士,其實真的不是這樣,我寫出來未必是專業(yè)文章(有時只不過表現(xiàn)如此),我只是覺得這個話題值得探討,值得分享,也值得自己繼續(xù)努力而已。所以,也請不要四處轉(zhuǎn)載。


-—————————————————————低調(diào)的分割線——————————————————

線框圖是交互設(shè)計師必不可少的產(chǎn)出物,它在交互設(shè)計師的工作中扮演了如此重要的角色,以至于交互設(shè)計師經(jīng)常被認為是個畫線框圖的,但是無論是設(shè)計師本人還是項目組成員,對于線框圖存在的意義未必有足夠的認識。
  • 項目為何需要線框圖?
  • 為什么不縮短周期,直接跳轉(zhuǎn)到視覺設(shè)計呢?
對于設(shè)計師而言,疑問一樣存在:
  • 線框圖給我們帶來什么價值?
  • 在我們想進行線框圖培訓(xùn)時,疑問有:
  • 不就是畫個草圖嗎?還需要學(xué)習(xí)?
如果大家都把線框圖理解成“草圖”,那么按照正常邏輯,草圖的產(chǎn)出一定是比視覺稿更快而不是更慢才對,但是在很多項目里,為何線框圖的時間反而花費得更多?

這往往會引起不解,因為在多數(shù)人看來,線框圖也就是個沒有任何視覺加工過的簡單簡陋粗暴不美觀的草稿,加上我一再聲稱做線框圖的工具是10分鐘就可以上手搭建線框圖的超白癡工具,而線框圖本身就完全無需精雕細琢刻意加工,那么,為何會在線框圖階段停留那么久?其他人都在干嘛?時間都花在哪里?

在我自己回顧過去的項目或者看手里的項目時,我也發(fā)現(xiàn),為何過去的線框圖階段都比較長?而目前在做的項目,由于資源靠自己去安排,自己預(yù)安排的資源,比如只有3天,實施過程中發(fā)現(xiàn)太緊張,遠遠不夠?
再細想一下,發(fā)現(xiàn)也許這三天,我用了1天半就搭建了一個滿足基本需求的線框圖(從商業(yè)需求來講,這是大家能夠預(yù)計到的主要的頁面),但是在1天半后,我開始進行多種方案的探索與創(chuàng)建,然后發(fā)現(xiàn)更多分支流程與異常處理頁面,之后,我完全沒有為線框圖的討論與確認留下充分的時間!

而,線框圖如果做出來不是讓大家來爭論和確認的,而是僅僅做出來給大家過目一下就移交了,基本上,線框圖已經(jīng)失去了原本存在的價值。

時間都花到了哪里?

并非所有的項目都需要線框圖,但是如果需要線框圖,那么線框圖就需要多留一些時間,不要單純從最終的線框圖產(chǎn)出物的“樣子”去評估需要多少資源。

用頁面的個數(shù)去評估工作量,在視覺設(shè)計師也許是適用的——建立在產(chǎn)品視覺風(fēng)格確定的前提下。
(視覺設(shè)計師的資源也需要劃分成兩段,一段用來做探索,確定產(chǎn)品風(fēng)格,比如主題色,質(zhì)感,圖文比例與用圖風(fēng)格等,這個階段也有比較大范圍的評審與確認,所以時間上反而會比具體的頁面視覺設(shè)計來得更長),前端工程師也可以用頁面?zhèn)€個數(shù)與復(fù)雜程度去預(yù)估需要多少天,但是對于交互設(shè)計師,這比較是個難題。只有交互設(shè)計師將需求討論清楚,自己將頁面流程圖畫好,將各種分支情況考慮清楚,腦子里才會逐漸對需要多少個頁面形成概念,哪些頁面需要更高的單頁面交互設(shè)計形成概念,而當(dāng)他完成這一步,交互的大部分工作都已經(jīng)做完了,剩下的單純?nèi)ピO(shè)計各個頁面,占據(jù)了線框圖階段的很少的時間。更多的時間是花在什么上?

討論——評審——討論——評審——確認

是的,線框圖的作用之一是用來吵架的承載物,交互設(shè)計師為線框圖確認需要召開很多次評審會(視項目不同而不同),直至大家對線框圖達成共識,然后在有的公司,還需要對線框圖本身進行可用性測試以發(fā)掘更多問題。
若線框圖不拿來吵架,評估,確認,而是就是為視覺設(shè)計師搭搭架子,那么線框圖真的就失去了存在的價值。

80%和20%

交互設(shè)計師可能會有20%的精力真正花在線框圖本身的制作上,而且他也認為這也許是沒有什么技術(shù)含量的。剩下的80%的精力,用在:

——需求的了解與討論,“我認為這個標記出現(xiàn)在搜索結(jié)果頁,也許并不是合理的場景……”“為什么只針對××?xí)T類型開放這個功能?”在商業(yè)初始需求確認后,交互設(shè)計師與產(chǎn)品經(jīng)理是配合最緊密的兩個角色,他們需要將商業(yè)需求一步步細化,落實到具體的頁面與功能的實現(xiàn)上。需求越清楚,以后的階段就會越高效。這個階段,交互設(shè)計師還需要借助site map,頁面流程圖(page flow),或者故事板等等工具,來幫助自己和項目組了解產(chǎn)品需求。

有時,工作量絕對不想看起來那么少,產(chǎn)品經(jīng)理需要把做什么和為什么描述清楚,他們會在“做什么”時也會講一下“如何做”,但是很多產(chǎn)品經(jīng)理并不或者被要求不要深入太多解決方案細節(jié),但是交互設(shè)計師不一樣,必須從宏觀到細節(jié),將產(chǎn)品的交互邏輯認認真真仔仔細細思考清楚,細枝末節(jié)的東西如果不關(guān)心,到了項目進行過程中,還一定會被開發(fā)工程師追著補充各種流程中的頁面。

——創(chuàng)造性的方案探索與嘗試,“如果我這里換一種交互方式,會怎么樣?”“還有更好的實現(xiàn)辦法嗎?”“縮短一步操作會怎么樣?”“印象中好像曾經(jīng)有個網(wǎng)站采用了一種更加高效的方法,我想想看?”所有設(shè)計師都有精益求精的“特質(zhì)”,或者“毛病”,我們需要做這種自我激發(fā)的頭腦風(fēng)暴。
從設(shè)計來看,設(shè)計本身就意味著方案的篩選與確認:也許最后設(shè)計師在確認會上只給出了一到兩種方案,但是大多數(shù)設(shè)計師在自己的電腦里或者大腦里嘗試過很多方案。


設(shè)計本身是一種在期望和限制下進行的探索,并且將探索后的成果實施。交互設(shè)計師需要不斷圍繞需求與期望,進行探索并在逐步的限制中,縮小設(shè)計范圍。他做的是他應(yīng)該做的,他不應(yīng)該將過多的問號傳遞給視覺設(shè)計師,視覺設(shè)計師本身也需要進行探索與限制,但是我們更加期望他們的天賦應(yīng)用到品牌感、質(zhì)量感、專業(yè)感、情感化設(shè)計的探索上,而不是分散精力到產(chǎn)品邏輯的思考中去。

——設(shè)計方案的評審與確認,正如上圖所示,設(shè)計師需要分出不少精力,在設(shè)計的評審與確認上。他首先從自己的頭腦風(fēng)暴里解脫出來,從若干個方案中篩選一二,然后召集需求方、涉眾、其他設(shè)計師,進行方案的需求。有時,這樣的確認會會召開至少三輪:

  • 第一輪,線框圖初審,線框圖基本完整后,與需求方以及技術(shù)方代表就線框圖展開討論,這是不是商業(yè)方也即需求方想要的東西,線框圖滿足商業(yè)期望,確認整體結(jié)構(gòu)、頁面上對于內(nèi)容塊的定義,技術(shù)方的參與能夠就可行性方面給出意見,并且能夠根據(jù)線框圖進行初步的開發(fā)資源評估。
  • 第二輪,線框圖設(shè)計專業(yè)評審,讓更多的設(shè)計師參與討論,從交互設(shè)計層面給予更多意見。這個評審是第一輪評審的補充,在既定的商業(yè)需求上就設(shè)計本身展開討論,篩選最佳的方案。
  • 第三輪,線框圖終審,設(shè)計師在前兩輪意見中進行評估,對線框圖做一些調(diào)整,發(fā)起第三輪確認會,商業(yè)方代表與設(shè)計師代表,技術(shù)方代表,以及相關(guān)的涉眾(比如客服、銷售代表)等面前再次宣講設(shè)計方案,告訴大家本次是終審,終審確認后,將會進入視覺設(shè)計階段,到時候?qū)⒉辉僮鲚p易的結(jié)構(gòu)與內(nèi)容塊定義的調(diào)整,讓大家足夠重視并對線框圖達成一致。
在這三輪評審中,需要穿插多次小范圍的討論,比如可行性的評估,資源的評估,以及和產(chǎn)品經(jīng)理反復(fù)去討論需求和需求背后的意義??梢哉f,線框圖的作用之一,就是為了討論、確認,吵架,然后在一次次迭代與確認中,最終塵埃落定,推動項目進入下一環(huán)節(jié)。

交互設(shè)計師的挑戰(zhàn)
挑戰(zhàn)絕非在于線框圖本身如何專業(yè),或者把線框圖做得如何快,而是在于對于需求的把握、挖掘與快速呈現(xiàn),在于全程中對于各種想法的吸收與管理,在于能不能讓大家都快速明白了解設(shè)計的原因和背景,并對方案達成一致。

不要讓爭議、問題帶入到真正的實施環(huán)節(jié),比如視覺設(shè)計,比如開發(fā)。
因為從投入產(chǎn)出比來看,把架吵到線框圖階段,是最高效最合適的。

不等于商業(yè)需求討論環(huán)節(jié),有很多有創(chuàng)造力的人,卻不善于空想,對著商業(yè)需求文檔,無法讓創(chuàng)造力的腦細胞活躍起來,大家都只能對著產(chǎn)品經(jīng)理的商業(yè)方案點頭稱是,但是到了線框圖階段,具體的產(chǎn)品原型會激發(fā)更多的想法,因此這個階段,最適合進行產(chǎn)品開發(fā)過程中的第二次頭腦風(fēng)暴。

不等于視覺設(shè)計與開發(fā)環(huán)節(jié),線框修改起來是非常容易高效的。而且它故意做得如此簡陋難看,就是想把最核心的需求呈現(xiàn)給大家,這個產(chǎn)品是這樣的,而不是這個產(chǎn)品看起來是這樣的。

因為,“看”,“感覺”不可避免會帶入很多主觀的因素。同樣是紅色,有人覺得太鮮艷刺眼有人覺得熱情澎湃,而恰恰在產(chǎn)品規(guī)劃初期,我們是不希望過早去關(guān)注這些細節(jié),我們需要先解決最核心的問題。視覺稿容易一開始就讓大家陷入到各方向的討論中,有人還在思考產(chǎn)品是不是需要再增加一個功能,或者在爭論一個功能是否有足夠的價值時,已經(jīng)有人開始為“黃色”還是“紅色”爭論得不可開交。

另外,我們必須得承認,在視覺設(shè)計階段,修改的成本非常高,視覺設(shè)計師是對每一個像素精雕細琢,產(chǎn)品定位的改變,也許對于他們是“滅頂之災(zāi)”,這可能會意味著很多個頁面要重新開始設(shè)計,當(dāng)視覺設(shè)計已經(jīng)到了一定的地步時,視覺設(shè)計師對“修改”慢慢會變得有點抗拒,誰不喜歡自己生出來的孩子?如果一個視覺設(shè)計師不喜歡他生出來的孩子,那他可能不是一個合格的視覺設(shè)計師。但是交互設(shè)計師是很樂意在線框圖上進行任何的可能性的探索,他會更加包容這個階段涌入的任何想法,因為他明白這個是中間產(chǎn)物,而且看起來就不像“完美”到可以當(dāng)成自己的孩子。

總結(jié)幾句:
1. 線框圖能夠幫我們將需求具體化,從而引入更多的想法,完善產(chǎn)品;
2. 線框圖能夠幫助我們理清思路,怎么做,如何做有了更加系統(tǒng)化的認識;
3. 線框圖制作起來非常容易,因此能夠幫助我們在各種方案里評估和篩選;
4. 線框圖是用來吵架的,交互設(shè)計師需要歡迎吵架包容各種想法,更重要的是對吵架進行管理。
5. 80%的時間并非在做線框圖,而是花在需求的了解與討論、多種設(shè)計方案的頭腦風(fēng)暴與嘗試,設(shè)計的評審與確認上,但是這80%的時間投入讓剩下的20%更加高效。
6. 作為交互設(shè)計師,在那80%里提升的空間會更大,很多時候,剩下的20%是自然而然的結(jié)果。

關(guān)于線框圖還有很多問題值得討論的,比如:什么階段下開始做線框圖,線框圖制作工具與方法,幾種不同的線框圖的作用等等,就不過多討論了。以上的部分也歡迎繼續(xù)探討。

    本站是提供個人知識管理的網(wǎng)絡(luò)存儲空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點。請注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息,謹防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點擊一鍵舉報。
    轉(zhuǎn)藏 分享 獻花(0

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多

    大胆裸体写真一区二区| 成人精品欧美一级乱黄| 欧美日韩成人在线一区| 99久久国产精品成人观看| 黄色三级日本在线观看| 欧美日韩免费黄片观看| 国产丝袜极品黑色高跟鞋| 国产成人精品综合久久久看| 国产女性精品一区二区三区| 极品少妇嫩草视频在线观看| 久一视频这里只有精品| 亚洲成人免费天堂诱惑| 五月天丁香婷婷狠狠爱| 亚洲精品日韩欧美精品| 亚洲国产精品国自产拍社区| 日韩在线精品视频观看| 欧美特色特黄一级大黄片| 福利视频一区二区三区| 中文字幕区自拍偷拍区| 日韩女优视频国产一区| 日本人妻精品中文字幕不卡乱码| 日韩中文字幕免费在线视频| 亚洲男人的天堂久久a| 暴力三级a特黄在线观看| 神马午夜福利免费视频| 亚洲另类女同一二三区| 夜夜嗨激情五月天精品| 天海翼高清二区三区在线| 国产高清一区二区白浆| 久久精品国产亚洲av麻豆| 日本熟妇五十一区二区三区| 亚洲欧美精品伊人久久| 日韩女优精品一区二区三区| 亚洲男女性生活免费视频| 色无极东京热男人的天堂| 99久久国产亚洲综合精品| 美女黄色三级深夜福利| 欧美午夜一级艳片免费看| 久久99热成人网不卡| 亚洲专区中文字幕视频| 激情视频在线视频在线视频|