交互設(shè)計(jì)應(yīng)注意的細(xì)節(jié)

2015-5-12    用心設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)m.sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

每一個(gè)扁平化界面設(shè)計(jì),都是我們的心靈碰撞致力于最棒的 metro ui 設(shè)計(jì)

來(lái)源:莫貝網(wǎng)

 如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請(qǐng)點(diǎn)這里


交互設(shè)計(jì)應(yīng)注意的細(xì)節(jié)

當(dāng)交互設(shè)計(jì)師 完成一份自以為詳盡的交互輸出物,前端的開(kāi)發(fā)結(jié)果總是不那么另人滿意。交互會(huì)抱怨:為什么會(huì)做成這樣呢,很多常識(shí)性的東西也會(huì)做錯(cuò)。顯然因?yàn)轭I(lǐng)域不同,對(duì) “常識(shí)”的理解不盡相同,我們不能把希望寄托在前端工程師的可用性覺(jué)悟上。所以交互設(shè)計(jì)師必須站在對(duì)方的角度,在提交輸出物前補(bǔ)充交互細(xì)節(jié),以免日后不必 要的迭代。

 

1.列表項(xiàng)目為空時(shí)的顯示效果。比如“購(gòu)物車”里沒(méi)有東西時(shí),該如何顯示。否則開(kāi)發(fā)會(huì)讓屏幕空白。

 

2.當(dāng)頁(yè)面或應(yīng)用會(huì)向后臺(tái)下載數(shù)據(jù)較慢時(shí),載入過(guò)程的提示。如果我們不說(shuō),技術(shù)不會(huì)考慮載入時(shí)的信息反饋,會(huì)讓頁(yè)面呈現(xiàn)假死的狀態(tài)。

 

3.當(dāng)按鈕、圖標(biāo)、鏈接等不可用時(shí),怎樣呈現(xiàn)給用戶(a.消失 b.disable+文案改變c.disable+tip d.非模態(tài)或嵌入式提示 e.點(diǎn)擊后出現(xiàn)模態(tài)對(duì)話框)。如果我們不說(shuō),技術(shù)會(huì)采用最簡(jiǎn)單且一般來(lái)說(shuō)體驗(yàn)最差的方式—模態(tài)對(duì)話框,甚至什么提示都沒(méi)有。

 

4.應(yīng)用或者一些偏操作的網(wǎng)絡(luò)產(chǎn)品,對(duì)話框內(nèi)的按鈕,如“確定”“取消”。需要有一個(gè)默認(rèn)選中,支持鍵盤enter操作。

 

5.每個(gè)圖標(biāo)都要加上tip,尤其是用戶可能不明白的拖動(dòng)操作。

 

6.在文檔中規(guī)定系統(tǒng)出錯(cuò)的提示該如何呈現(xiàn),提示的文案中不能帶有技術(shù)性描述(如錯(cuò)誤類型:XXX)。如果我們不規(guī)定,技術(shù)會(huì)自己添加一些出錯(cuò)的模態(tài)浮層,使用技術(shù)性的語(yǔ)言。

 

7.文本長(zhǎng)度超過(guò)標(biāo)準(zhǔn)被截?cái)鄷r(shí),該如何顯示。

 

8.鼠標(biāo)的響應(yīng)范圍,如列表項(xiàng)目,radioBtn ,checkbox等。一般來(lái)說(shuō),響應(yīng)范圍大點(diǎn)好。如果我們不說(shuō),技術(shù)只會(huì)使用默認(rèn)設(shè)置,如radioBtn的響應(yīng)范圍就只是前面那個(gè)點(diǎn)。

 

9.修改文本框內(nèi)容,在獲取焦點(diǎn)時(shí),是全選還是將插入點(diǎn)放在文本末尾。

 

如果用戶很可能會(huì)重新輸入整個(gè)值,則應(yīng)在獲取輸入焦點(diǎn)時(shí)選擇全部文本。如果用戶更有可能進(jìn)行編輯,則應(yīng)將插入點(diǎn)放在文本末尾。

 

10.下拉框,列表框的默認(rèn)定位,比如生日。如果我們不說(shuō),技術(shù)會(huì)默認(rèn)在“1900”年。

 

11.如果是客戶端,或是流式網(wǎng)頁(yè)布局,要提供多種分辨率下的展示。

 

12.在移動(dòng)客戶端,多點(diǎn)觸摸,手勢(shì)的操作和動(dòng)畫過(guò)程,顯得尤其重要。

 

13.用戶操作成功或失敗的反饋,超時(shí)的反饋,系統(tǒng)崩潰的反饋等等。

 

14.移動(dòng)客客戶端橫豎屏的不同顯示方式,網(wǎng)絡(luò)狀況差時(shí)的交互反饋。

 

—— The End ——

分享本文至:

日歷

鏈接

個(gè)人資料

存檔