- 相關(guān)推薦
如何畫交互設(shè)計流程圖
流程圖是產(chǎn)品經(jīng)理和交互設(shè)計師都必須掌握的技能,一張流程圖可以省去需求文檔和交互設(shè)計文檔的很多文字描述,本文為大家介紹有關(guān)畫交互設(shè)計流程圖的相關(guān)內(nèi)容。就跟隨百分網(wǎng)小編一起去了解下吧,想了解更多相關(guān)信息請持續(xù)關(guān)注我們應(yīng)屆畢業(yè)生考試網(wǎng)!
流程圖的基本構(gòu)成。
從上面幾張圖可以看到,流程圖由特定的圖形構(gòu)成,但具體的樣子由圖本身的目的和閱讀者的閱讀習(xí)慣(或約定)來決定,所以使用的圖形并不是固定的,比如有人用圓形表示開端和結(jié)束,有人則用圓角矩形,有人有云團表示其他流程的引用,有人用矩形加文字來表示,形式不重要,達(dá)到描述的效果而閱讀者能讀懂才是最重要。設(shè)計流程圖也遵循這個原理。
設(shè)計流程圖。
設(shè)計流程圖長得并不特別,跟全世界流程圖都差不多,也同樣是作為一種表達(dá)工具存在。區(qū)別只在于描述的對象和組成的內(nèi)容不一樣。設(shè)計流程圖的一大重點是面向表現(xiàn)層,也就是說,描述的是界面(或叫屏幕)的變化,是用戶看到的界面的行為流。什么行為呢,界面之間的跳轉(zhuǎn)邏輯,也就是導(dǎo)航邏輯。
導(dǎo)航是信息架構(gòu)的一部分(教科書把信息架構(gòu)劃分為組織、導(dǎo)航、標(biāo)簽、搜索四個系統(tǒng)),當(dāng)然是交互設(shè)計的重要一環(huán),導(dǎo)航的設(shè)計思路就能用流程圖表達(dá)出來(或者也可以說用流程圖來輔助設(shè)計吧),這也是個人覺得設(shè)計流程圖的最重要運用。
從圖中可以看出構(gòu)成:
a 界面。
一個矩形代表一個界面,這個流程中用戶走過兩個界面(登錄頁和首頁),因為表達(dá)的是界面的跳轉(zhuǎn),界面是用戶實實在在接觸到的媒介,非界面的內(nèi)容,不要出現(xiàn)。
b 動作。
矩形之間也就是界面之間加上一個觸發(fā)動作,比如從界面A點擊下一步按鈕,到達(dá)界面B,“點擊下一步”就是連接這兩個界面的關(guān)鍵動作,需要標(biāo)示出來,上圖例子就是“單擊提交按鈕”。
c 條件。
一個動作之后可能有多種“是/否”的結(jié)果,則在矩形之間、動作之后加上一個或多個判斷菱形。如上圖的檢驗賬號密碼是否輸入正確。
【如何畫交互設(shè)計流程圖】相關(guān)文章:
交互設(shè)計新手該如何學(xué)習(xí)03-02
被忽略的交互設(shè)計本質(zhì)11-16
交互設(shè)計初體驗11-16
網(wǎng)頁設(shè)計中常見的交互設(shè)計錯誤11-20
交互設(shè)計原則有哪些12-20
交互設(shè)計的用戶行為模式詳解11-16
響應(yīng)交互式網(wǎng)頁設(shè)計12-03
畫教學(xué)設(shè)計02-26