技術(shù)資訊
互聯(lián)網(wǎng)設(shè)計(jì)敏捷迭代
2008-11-20 12:05:00
做互聯(lián)網(wǎng)設(shè)計(jì)最重要是為了運(yùn)營(yíng),藍(lán)圖和文檔好比做作業(yè)打草稿、畫畫先描白,經(jīng)驗(yàn)豐富可以考慮先省下這步驟。因?yàn)槿绻槐憩F(xiàn)在具體web-based原型上,藍(lán)圖、文檔再好也無法快速切入開發(fā)流程,做為有大局觀的Producer應(yīng)該盡快意識(shí)到這點(diǎn)。
UED團(tuán)隊(duì)合作與開發(fā)流程優(yōu)化是以前在雅虎做產(chǎn)品同事寫的,雅虎團(tuán)隊(duì)的產(chǎn)品工程師們技術(shù)好,而且有來自美國(guó)團(tuán)隊(duì)的協(xié)作經(jīng)驗(yàn)傳承,做前端編程一直是他們的強(qiáng)項(xiàng)。但傳統(tǒng)瀑布模型進(jìn)程必然要面對(duì)“前松后緊”問題,根源在于設(shè)計(jì)、技術(shù)團(tuán)隊(duì)要互相等。因此,如果規(guī)避必須從觀念上做出調(diào)整:快速產(chǎn)出、快速迭代,也就是軟件工程里的Agile and Iterative Development。
以前我也常抱怨做互聯(lián)網(wǎng)設(shè)計(jì)沒譜,一是資源緊、二是變化快。項(xiàng)目周期和人手似乎永遠(yuǎn)都無法滿足,來自內(nèi)部考慮不周、外部競(jìng)爭(zhēng)壓力雙方的需求變更頻繁。其實(shí)這就是互聯(lián)網(wǎng)設(shè)計(jì)的常態(tài),接下來提到的方法,分為三個(gè)大步驟,版本僅供參考。
Alpha.快速完成核心功能開發(fā)
這里“藍(lán)圖”只是個(gè)代名詞,也許只有些藍(lán)圖片段,或規(guī)劃片段。曾經(jīng)我們?cè)诶习遛k公室開會(huì),根據(jù)頭腦風(fēng)暴結(jié)果、會(huì)議記錄直接做原型。這么說可能有點(diǎn)一覺回到解放前的感覺,事實(shí)如此,第一步很關(guān)鍵,但質(zhì)量不重要。
因?yàn)殚_始就期望得到完善想法是不可能的。比如,你開會(huì)描述個(gè)東西,讓同事提意見,可能大家什么都說不出來。但只要你動(dòng)手做出具體原型,同事親自測(cè)試體驗(yàn)之后,意見噼里啪啦一大堆就來了。在這層意義上,絕大多數(shù)原型是炮灰也應(yīng)該。
最初工作用自己最熟悉、最快速的手法完成,別讓開發(fā)團(tuán)隊(duì)等。當(dāng)然,這部分代碼質(zhì)量將直接影響以后的迭代工作量,根據(jù)時(shí)間靈活安排。不要考慮的過于復(fù)雜,總結(jié)起來有三點(diǎn):
盡早用web原型評(píng)估設(shè)計(jì)質(zhì)量
制作避免過早陷入web結(jié)構(gòu)和表現(xiàn)細(xì)節(jié)
設(shè)計(jì)避免過早陷入功能細(xì)節(jié)
每個(gè)業(yè)務(wù)都會(huì)有核心功能,也就是用戶的核心需求,基本上做產(chǎn)品前都會(huì)考慮清楚??赡芎诵墓δ軆?nèi)還會(huì)有核心模塊,意思就是逐步提煉,找準(zhǔn)關(guān)鍵點(diǎn)下手,這樣才能搭好框架。也許經(jīng)過幾次迭代后,這部分工作已經(jīng)是個(gè)可以跑起來的低保真產(chǎn)品,頗具alpha版本規(guī)模。
Beta.迭代完成固化需求功能開發(fā)
搭框架不要下手太狠,別自以為經(jīng)驗(yàn)豐富把盤子搞大。因?yàn)閯偛耪f了,互聯(lián)網(wǎng)產(chǎn)品靈活最重要,雖然需求變化是經(jīng)常的事,但我們要把風(fēng)險(xiǎn)控制在最低點(diǎn)。接下來在已有框架內(nèi),用同心圓放大的模式,按優(yōu)先級(jí)實(shí)現(xiàn)輔助功能迭代,直至需求固化。
與此同時(shí),產(chǎn)品設(shè)計(jì)團(tuán)隊(duì)除了對(duì)低保真原型的繼續(xù)支持,還應(yīng)并行完善和提煉高保真原型,并且著手對(duì)產(chǎn)品規(guī)范中復(fù)用模塊的持續(xù)化整理,主要分為三部分:
web呈現(xiàn)效果迭代。先做圖再切效率太低,因此我是直接用css美化低保真原型,通常這步可以把效果做的很得體。實(shí)在有必要,最后再截屏用photoshop處理細(xì)節(jié)并完善css。
web結(jié)構(gòu)和表現(xiàn)迭代。我自己可以完成html framework, css framework兩大塊。
web行為迭代。需要工程師協(xié)助完成javascript framework。
也就是說,在包括beta版本以及之前,重中之重是實(shí)現(xiàn)功能需求層的良好用戶體驗(yàn)??稍L問性、兼容性、可用性、標(biāo)準(zhǔn)化、搜索引擎友好這些具體指標(biāo)不要過早引入到應(yīng)用開發(fā)中,讓它們都在高保真原型的迭代內(nèi)準(zhǔn)備就緒。
比如可用性,做低保原型時(shí)盡量用最容易的方式解決問題,不要過早追求“用戶體驗(yàn)”玩花樣。大量的js互動(dòng)效果和ajax異步加載會(huì)給原型維護(hù)、迭代測(cè)試帶來大麻煩。
再比如標(biāo)準(zhǔn)化,良好結(jié)構(gòu)的web頁面,很受應(yīng)用開發(fā)工程師歡迎,樣式表則無傷大雅。因此我們可以多花功夫先處理html結(jié)構(gòu),節(jié)省時(shí)間讓css樣式表與功能開發(fā)并行迭代優(yōu)化。
Release.模塊化迭代提升用戶體驗(yàn)
至此如果一切順利的話,應(yīng)用程序已經(jīng)模塊化并測(cè)試通過,設(shè)計(jì)規(guī)范也已經(jīng)模塊化、并有針對(duì)性的給出了高保真原型界面標(biāo)準(zhǔn)。用戶體驗(yàn)的具體指標(biāo),已經(jīng)在高保真原型的迭代中測(cè)試通過。
經(jīng)驗(yàn)豐富的Producer可能都了解,成熟網(wǎng)站真正模塊化后的內(nèi)容其實(shí)不多,無非頭、尾、導(dǎo)航、頁簽、表格、列表、搜索等等。傳統(tǒng)方法流程的沒有把操作體驗(yàn)與功能體驗(yàn)割裂開來,以至于來回折騰,反復(fù)做了大量工作才讓產(chǎn)品模塊化。根據(jù)設(shè)計(jì)規(guī)范迭代提升用戶體驗(yàn)有兩步:
先處理界面視覺效果,比如分情況美化數(shù)據(jù)表格、文章列表等。
再處理界面交互效果,比如可以把某些跨頁流程改為層異步加載等。
永遠(yuǎn)記住不可能一步到位,花本錢的創(chuàng)意設(shè)計(jì)要用保守方案,用戶體驗(yàn)是奢侈的。對(duì)多數(shù)應(yīng)用開發(fā)工程師來說,使用樣式表控制表現(xiàn)是件神奇而時(shí)髦的事情。光禿禿的一個(gè)架子,加上css馬上就能風(fēng)光起來,并且還不影響已經(jīng)開發(fā)出來的程序,有點(diǎn)不可思議。
其他
敏捷設(shè)計(jì)思路同樣來自前輩們總結(jié)過的軟件工程思想,只不過換在了設(shè)計(jì)支持角度。真正的敏捷設(shè)計(jì)必然與開發(fā)綁在一起,只在產(chǎn)品階段的砍掉文檔、砍掉步驟、砍掉管理對(duì)全局影響不明顯。
對(duì)產(chǎn)品團(tuán)隊(duì)來說,應(yīng)該不斷利用等待空閑調(diào)整規(guī)劃,用任務(wù)分解、故事板等專業(yè)手法出文檔優(yōu)化結(jié)構(gòu)。敏捷設(shè)計(jì)關(guān)鍵不在技術(shù)有多高深莫測(cè),而是動(dòng)作要跟得上節(jié)奏,前后銜接得當(dāng),才可能把時(shí)間一點(diǎn)點(diǎn)摳出來。不墨守陳規(guī),把專業(yè)方法打散使用,融會(huì)貫通于每個(gè)思考點(diǎn)。
UCD翻譯小組的同學(xué)們已將Boxes and Arrows的這篇Prototyping with XHTML譯成中文,操作細(xì)節(jié)和心得很豐富,關(guān)于快速迭代總結(jié)的相當(dāng)好。類似方法我們也已實(shí)踐近兩年,并且主導(dǎo)執(zhí)行過兩款大型產(chǎn)品,核心思想超過90%重合,以上補(bǔ)充了部分本地化快速產(chǎn)出經(jīng)驗(yàn)。
原文說“只需要花費(fèi)幾個(gè)小時(shí),學(xué)習(xí)一下網(wǎng)上眾多的在線教程,你就可以立即開始書寫xhtml?!笔聦?shí)上即使計(jì)算機(jī)背景的同學(xué),沒有兩三年功力,要實(shí)現(xiàn)兼顧前后的無縫協(xié)作都很困難,搞不好還會(huì)返工增加工作量。但長(zhǎng)遠(yuǎn)來看,這樣的訓(xùn)練很有意義,用web方式做web-based產(chǎn)品設(shè)計(jì)的優(yōu)勢(shì)將更垂直的專業(yè)、體系化發(fā)展。
Spend just a few hours following any of the innumerable online tutorials and you’ll be writing XHTML markup in no time.
團(tuán)隊(duì)成員越少,溝通效率越高;每人承擔(dān)越多,整體風(fēng)險(xiǎn)越低。這是行云流水的產(chǎn)品、技術(shù)并行迭代的優(yōu)勢(shì)體現(xiàn)??傊龑?duì)瀑布模型進(jìn)程深刻認(rèn)識(shí),方法流程得靠團(tuán)隊(duì)的內(nèi)力來推動(dòng)。
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務(wù)——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿足預(yù)期到走向卓越
- [2023-04-11 09:17:49] H5頁面設(shè)計(jì)開發(fā)——移動(dòng)端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務(wù)支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項(xiàng)目
- [2021-03-05 10:34:45] 移動(dòng)互聯(lián)時(shí)代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢(shì)?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計(jì)
- [2020-12-16 16:55:32] 建設(shè)一個(gè)常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2009-03-02 18:03:00] 主流互聯(lián)網(wǎng)公司的產(chǎn)品項(xiàng)目流程 以及UE設(shè)計(jì)師的
- [2015-01-21 09:04:02] 您怎么看待2015中國(guó)互聯(lián)網(wǎng)發(fā)展趨勢(shì)?
- [2011-10-15 17:12:43] 青島網(wǎng)站設(shè)計(jì)者怎樣利用互聯(lián)網(wǎng)宣傳自己
- [2009-03-23 22:11:00] 互聯(lián)網(wǎng)表單設(shè)計(jì) 第四章 標(biāo)簽(3)右對(duì)齊標(biāo)簽
- [2008-11-05 18:06:00] 互聯(lián)網(wǎng)產(chǎn)品的交互設(shè)計(jì)方法(UPA2008講稿)
- [2009-02-18 10:45:00] 互聯(lián)網(wǎng)表單設(shè)計(jì)—第一章 表單設(shè)計(jì)(1)
- [2008-11-11 11:39:00] 互聯(lián)網(wǎng)設(shè)計(jì)操作參考
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計(jì)解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計(jì)解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 科技企業(yè)網(wǎng)站設(shè)計(jì)解決方案 電子家電網(wǎng)站設(shè)計(jì)解決方案 食品行業(yè)網(wǎng)站設(shè)計(jì)解決方案 集團(tuán)公司網(wǎng)站設(shè)計(jì)解決方案 企事業(yè)單位網(wǎng)站設(shè)計(jì)解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 健身運(yùn)動(dòng)網(wǎng)站設(shè)計(jì)解決方案 美容與化妝品網(wǎng)站設(shè)計(jì)解決方案 建筑設(shè)計(jì)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 物流行業(yè)網(wǎng)站設(shè)計(jì)解決方案
TAGS關(guān)鍵字
建站常識(shí) 青島好的網(wǎng)站優(yōu)化公司 審美 青島高端網(wǎng)站建設(shè)公司哪家好 網(wǎng)站動(dòng)畫 圖形網(wǎng)格 青島flash網(wǎng)站 企業(yè)網(wǎng)站建設(shè) 網(wǎng)站SEO 青島海洋投資集團(tuán) 手機(jī)網(wǎng)站 網(wǎng)站建設(shè),手機(jī)網(wǎng)站 交互設(shè)計(jì) css 版面布局 手機(jī)端的網(wǎng)站 網(wǎng)站建設(shè)的步驟有哪些 青島高端網(wǎng)站設(shè)計(jì)公司哪家好 色彩心理學(xué) 青島網(wǎng)頁制作 青島輪胎網(wǎng)站設(shè)計(jì)公司 青島網(wǎng)站營(yíng)銷 蘋果系統(tǒng) 網(wǎng)站設(shè)計(jì)資訊 企業(yè)網(wǎng)站 響應(yīng)式設(shè)計(jì) 網(wǎng)站優(yōu)化 網(wǎng)站策劃 搜索引擎 網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè)