對(duì)于
APP開(kāi)發(fā)公司的框架設(shè)計(jì)師來(lái)說(shuō),過(guò)渡到線框圖當(dāng)項(xiàng)目的客戶(投資人、老板)看過(guò)我們的任務(wù)流程圖并同意這正是他們想要執(zhí)行的任務(wù),我們就該進(jìn)入線框圖階段了。線框圖是產(chǎn)品的基本藍(lán)圖,用來(lái)描述網(wǎng)站或APP在每個(gè)頁(yè)面(屏幕)上的核心功能。這些線框圖會(huì)隨著我們的改進(jìn)越來(lái)越詳細(xì)。不過(guò),在第一個(gè)版本中我們只用到黑白的輪廓和形狀來(lái)暗示導(dǎo)航、文本、按鈕和圖像等元素的位置。這些線框圖應(yīng)該勾勒出我們對(duì)整個(gè)產(chǎn)品的看法,表達(dá)出最初的產(chǎn)品設(shè)計(jì)理念。下面附上一個(gè)網(wǎng)站主頁(yè)的初稿線框圖,見(jiàn)圖8。

如你所見(jiàn),這是一張非常簡(jiǎn)單的線框圖,可以看出,該頁(yè)面的內(nèi)容所支持的任務(wù)是:幫助用戶找到他們想要的產(chǎn)品并了解更多信息。
為了支持這項(xiàng)任務(wù),我們創(chuàng)建了幫助用戶訪問(wèn)不同商品的“入口”,如圖中的導(dǎo)航和主推商品的輪播幻燈。但目前我們還不知道文本應(yīng)該描述些什么,導(dǎo)航欄應(yīng)該包含什么,還有圖像應(yīng)該是什么樣子。所有這些還需要更多的討論和探索,所以我們目前只使用一些占位符,繼續(xù)向后推進(jìn)。如果是對(duì)已有網(wǎng)站或APP進(jìn)行重新設(shè)計(jì),這一步會(huì)變得更容易。不過(guò),如果這是產(chǎn)品的第一個(gè)版本,我們不應(yīng)該在一開(kāi)始就考慮太多細(xì)節(jié),這樣會(huì)擾亂我們的設(shè)計(jì)步伐。
只需想象一下頁(yè)面中需要支持任務(wù)正常執(zhí)行的內(nèi)容是什么樣子,然后將其落實(shí)到線框圖中就可以了。當(dāng)我們對(duì)線框圖逐漸增加細(xì)節(jié)進(jìn)行迭代時(shí),線框圖的保真度會(huì)隨之增加。隨著線框圖的不斷完善,我們將越來(lái)越清晰地看到應(yīng)該在哪里增加功能或添加新的內(nèi)容。我們還需要定義最優(yōu)化導(dǎo)航模型并對(duì)內(nèi)容進(jìn)行分類。現(xiàn)在應(yīng)該與開(kāi)發(fā)團(tuán)隊(duì)碰面詳細(xì)介紹當(dāng)前項(xiàng)目計(jì)劃的詳情,包括一些特殊的技術(shù)問(wèn)題或比較少見(jiàn)的功能需求。此時(shí),我們應(yīng)該弄明白網(wǎng)站的優(yōu)化方案中是否包含跨平臺(tái)(臺(tái)式機(jī)、平板電腦、手機(jī)或其他移動(dòng)設(shè)備),也就是響應(yīng)式設(shè)計(jì)?,F(xiàn)如今,這已經(jīng)成為創(chuàng)建網(wǎng)站的標(biāo)準(zhǔn)方法了。也就是說(shuō),我們要考慮在不同尺寸的顯示器屏幕上,頁(yè)面的內(nèi)容和布局應(yīng)該怎樣轉(zhuǎn)變。不過(guò),隨著移動(dòng)設(shè)備的興起,越來(lái)越多的設(shè)計(jì)師都在追求“移動(dòng)優(yōu)先”的設(shè)計(jì)方法,也就是先創(chuàng)建一個(gè)針對(duì)移動(dòng)設(shè)備進(jìn)行優(yōu)化的設(shè)計(jì),然后再設(shè)計(jì)桌面優(yōu)化版本。
無(wú)論你追求哪種設(shè)計(jì)方法,在設(shè)計(jì)線框圖階段你都要考慮到響應(yīng)式設(shè)計(jì)。不過(guò),客戶需求第一,在與客戶進(jìn)行詳細(xì)溝通得到確認(rèn)后再執(zhí)行。最近幾年,有很多關(guān)于響應(yīng)式設(shè)計(jì)與自適應(yīng)設(shè)計(jì)孰優(yōu)孰劣的話題。筆者建議廣大讀者不要盲目陷入無(wú)休止的爭(zhēng)論中。牢記,目標(biāo)是滿足用戶需求,而不是討論哪項(xiàng)技術(shù)更勝一籌。在設(shè)計(jì)初期,使用自適應(yīng)設(shè)計(jì)可以更高效地制作出目標(biāo)效果與客戶進(jìn)行溝通,這可以節(jié)省大量時(shí)間和精力??捎眯詼y(cè)試雖然這一步經(jīng)常在制作出模型之后進(jìn)行,但現(xiàn)在是時(shí)候測(cè)試一下設(shè)計(jì)的可用性了。不管我們是使用紙?jiān)?、可交互截圖還是其他方法,盡早審查我們的想法是非常重要的,這樣可以幫助我們節(jié)省更多時(shí)間來(lái)修改。如果等到完整的模型制作出來(lái)或者完全開(kāi)發(fā)完畢再進(jìn)行測(cè)試的話,我們很難再去修改核心功能。如果一定要修改的話,很可能意味著我們要全部重新設(shè)計(jì),這是極大的資源浪費(fèi),是項(xiàng)目中所有人都不希望遇到的糟糕情況。好了,
深圳APP開(kāi)發(fā)公司本文關(guān)于“APP開(kāi)發(fā)設(shè)計(jì)至如何將設(shè)計(jì)工作過(guò)渡到線框圖”的設(shè)計(jì)經(jīng)驗(yàn)就分享到這里,謝謝關(guān)注本站,博納網(wǎng)絡(luò)編輯整理。