這一次，設(shè)計(jì)夾的主編-曉黑同學(xué)為大家整理了史上最全面的APP和Web交互流程圖的標(biāo)準(zhǔn)畫法，非常的全面，結(jié)合的自己的項(xiàng)目經(jīng)驗(yàn)，把交互流程圖做的更加清晰，在后面，還為大家整理一般的web設(shè)計(jì)模式及APP設(shè)計(jì)模式，以便使得我們的設(shè)計(jì)過程更加的高效。

信息架構(gòu)圖對于一個(gè)產(chǎn)品起到了至關(guān)重要的作品，產(chǎn)品越復(fù)雜，信息架構(gòu)越重要，比如淘寶APP這種體量的產(chǎn)品，信息架構(gòu)做的是否合理，直接關(guān)系著產(chǎn)品的邏輯，及運(yùn)行效率，所以對于產(chǎn)品的信息架構(gòu)在做創(chuàng)意設(shè)計(jì)階段就需要考慮去清楚。

先來看下基本的信息架構(gòu)圖的形式，如下圖，有些圖的小編就不解釋了，如果看不清楚的話，點(diǎn)擊放大觀看，在看不清，那就到設(shè)計(jì)夾的網(wǎng)站（www.sezign.com）下載高清圖

APP交互流程表達(dá)

APP 交互流程圖的表達(dá)方式，在這里包括了界面的之間的信息流動連接，還有非常的重要的交互設(shè)計(jì)說明，我們在平時(shí)的做設(shè)計(jì)的時(shí)候，一定要養(yǎng)成良好的標(biāo)注習(xí)慣，設(shè)計(jì)的過程中，需要把所有用戶操作的可能性都要考慮清楚才行。

Web交互流程圖表達(dá)

對于Web呢，信息架構(gòu)一般會比APP信息架構(gòu)要復(fù)雜的多，因?yàn)閃eb端能夠承載的信息量更大，可兼容的程序更加的復(fù)雜，所以對于企業(yè)級的網(wǎng)站或者軟件，比如微軟的OFFICE辦公軟件，就是一個(gè)非常非常復(fù)雜的信息架構(gòu)圖，每一個(gè)功能組件的交互邏輯，構(gòu)成了整體，而且要是每一塊的內(nèi)容協(xié)調(diào)好，這是相當(dāng)?shù)牟蝗菀椎摹?/p>

下面這些圖，都是我們一般性的交互流程表達(dá)，同樣的情況，也是需要表達(dá)清楚信息流之間的關(guān)系，及每一部分信息說明，這個(gè)在平時(shí)接觸項(xiàng)目時(shí)就應(yīng)該養(yǎng)成規(guī)范的習(xí)慣，繪制交互流程圖的時(shí)候。

APP一般常用的界面設(shè)計(jì)模式

界面模式非常重要，他是在經(jīng)過很多次驗(yàn)證總結(jié)出來的結(jié)果，對于界面設(shè)計(jì)的應(yīng)用呢，可以很快的產(chǎn)出產(chǎn)品的原型，以便能夠快速的迭代。

Web一般常用的界面設(shè)計(jì)模式

界面模式非常重要，他是在經(jīng)過很多次驗(yàn)證總結(jié)出來的結(jié)果，對于界面設(shè)計(jì)的應(yīng)用呢，可以很快的產(chǎn)出產(chǎn)品的原型，以便能夠快速的迭代。

至于這些圖，小編我就不解釋了，相信大家都能夠看懂

來源：設(shè)計(jì)夾