介紹
作為一個(gè)數(shù)字產(chǎn)品設(shè)計(jì)師，我們一直在探索流程改進(jìn)和新的創(chuàng)新方法。然而隨著UX和UI不斷的發(fā)展，變得幾乎不可能考慮所有工具，輸入，輸出、美學(xué)完整性和功能，缺少對產(chǎn)品設(shè)計(jì)產(chǎn)生不利影響的元素是非常現(xiàn)實(shí)的風(fēng)險(xiǎn)?？紤]到這一點(diǎn)，我們開始了創(chuàng)建同心圓數(shù)據(jù)可視化的艱巨任務(wù)，一個(gè)可以為客戶考慮到新思路的方法。
同心圓數(shù)據(jù)可視化
包含一個(gè)15個(gè)分支的二級基礎(chǔ)圓，支持視覺元素的分類通過頻道連接信息，之所以選擇它是因?yàn)槲覀兛梢钥吹酵暾腢X和UI工具圖譜。瀏覽者的視線可以從中心向外擴(kuò)散以獲得更多信息顆粒。
下載A0尺寸的海報(bào)
如果你想下載的A0海報(bào)打印和掛在你的工作室墻上，你可以免費(fèi)下載這里。
總結(jié)
該圖表分為幾個(gè)頂級級別，這是設(shè)計(jì)師在進(jìn)行新產(chǎn)品設(shè)計(jì)前要考慮的一個(gè)跳躍點(diǎn)。下面總結(jié)一下怎樣通過我們的UI和UX輪定義一個(gè)工作流和工具集的方法。
工具
UX和UI工具將整個(gè)數(shù)字化餅狀信息圖切分成設(shè)計(jì)師整個(gè)設(shè)計(jì)過程所需要的，從線框圖到高保真模擬并通過Demo演示，這樣一個(gè)工具以適應(yīng)每一個(gè)設(shè)計(jì)師的工作需要和個(gè)人喜好。
動(dòng)作按鈕
UX和UI模式已經(jīng)形成一套固定的可被識別的常見控件庫，比如添加到購物車圖標(biāo)或其他UI控件，這些關(guān)鍵的組件庫可以支持你在設(shè)計(jì)過程中得到更好的可用性。
輸入設(shè)備
新的輸入設(shè)備不斷被大家關(guān)注。例如，新的VR護(hù)目鏡有一個(gè)按鈕來控制交互給產(chǎn)品設(shè)計(jì)師提供了新的挑戰(zhàn)。在這一個(gè)環(huán)節(jié)中，我們列出了輸入設(shè)備，幫助您集思廣益，如何使用您的產(chǎn)品。
輸出設(shè)備
由于輸出設(shè)備的不斷變化，成為另一個(gè)UI和UX設(shè)計(jì)師需要不斷考慮的，考慮到你所使用的媒體無論是電視、PC、智能手機(jī)和其他媒體像服飾或護(hù)目鏡，你應(yīng)該把你的產(chǎn)品設(shè)計(jì)與特定媒介的目標(biāo)用戶進(jìn)行分類以適應(yīng)新的輸出設(shè)備的出現(xiàn)。
用戶控件
不同標(biāo)準(zhǔn)和自定義的APP控件的形成可能來自于用戶對于使用習(xí)慣培養(yǎng)，像snapchat下拉菜單通過自定義以適應(yīng)移動(dòng)端的交互。
視覺設(shè)計(jì)
視覺設(shè)計(jì)是連接圖像、字體、色彩的頂級方法，是你設(shè)計(jì)的基礎(chǔ)。
站點(diǎn)地圖
是UX規(guī)劃的典范，有各種形式，但要取決于你希望傳達(dá)給你的團(tuán)隊(duì)和利益相關(guān)者的想法。
用戶滿意度和用戶測試
新的UX和UI服務(wù)基準(zhǔn)是進(jìn)行嚴(yán)格的產(chǎn)品測試。雖然用戶測試不是一個(gè)新的概念，但他的重要程度已經(jīng)在某些方面刺激敏捷和精益的做法，是用戶反饋的一個(gè)中心因素。在我們的圖表中覆蓋了一系列用戶測試解決方案來支持您的工作流。
原型
原型技術(shù)正在迅速成為創(chuàng)新的擴(kuò)展領(lǐng)域，像Adobe的體驗(yàn)設(shè)計(jì)產(chǎn)品，Invision 和UXPIN已經(jīng)看到明顯的增長。這些產(chǎn)品對于產(chǎn)品設(shè)計(jì)師非常方便，通過提供預(yù)編碼的功能來收集有價(jià)值的反饋，也就是說在未進(jìn)行代碼工作之前產(chǎn)品設(shè)計(jì)師可以得到一個(gè)可交互的原型。
數(shù)據(jù)分析
如果內(nèi)容為王，那么分析是其忠實(shí)的私人委員會(huì)。數(shù)據(jù)分析可以提供建議來改變內(nèi)容和設(shè)計(jì)，以滿足新的目標(biāo)和不斷改進(jìn)的途徑。
結(jié)論
我們希望我們的UI&UX信息圖表可以讓你在下一個(gè)產(chǎn)品設(shè)計(jì)中得到啟發(fā)，把他當(dāng)做一份來自Bankai的禮物送給你的工作室或小組。
原文：https://medium.com/@bankai_ux/the-elements-of-ux-ui-visualized-5140254a8b76
