本文作者@Danis2010 在做細節交互設計的時候,有時候明明知道,卻老偏偏漏掉一些特殊狀況的方案設計,其中又以邊緣狀況的設計遺漏為多數。作者在這裡總結了三個「凡是」,説明大家在設計需求的初期設定一些原則。
在這裡一一列舉,希望對大家也有些許説明。
一、凡是輸入,必有限制
當我們在設計中使用到輸入控制項特別是文本輸入框的時候,這個問題就來了。
字元數的限制
第一個需要面對的是字元數的限制,有的來自于產品本身的業務限制,比如微博的140個字,註冊時帳號和密碼的長度等。
有些產品看上去並不限制字元數,或者說並不給使用者交代「限制」的概念。但其實也需要限制,這種限制來自于技術方面的考慮。
比如寫郵件的時候填入的收件者個數,搜索框接受的關鍵字字數,留言板的內容等。
雖然業務不要求,但錄入的內容,可能會造成提交的困難,資料庫的臃腫,被攻擊的漏洞等,所以我們也不得不考慮「隱形的限制」,雖然邊界看不到,一旦使用者越界,還是需要有相應的解決方案。
其實郵件主題還是不能寫太長的,雖然一般不會寫這麼長
百度原來也有字數限制
輸入並不全是文本,所以我們還需要面對其他格式的輸入限制問題。
上傳檔的個數
人人網上傳照片的數量限制
上傳檔的大小
QQ郵箱附件的大小上限
上傳檔的格式
上傳照片的的時候如果使用者選了非圖片格式的檔怎麼辦?一開始就讓ta只能看圖片檔還是選中後提醒?
QQ郵箱對於exe附件的限制
這些限制也都從業務和技術兩方面考慮,比如相冊一次只能傳20張照片,升級為會員就能傳50張,這是業務限制。
用瀏覽器相冊一次只能傳20張照片,安裝外掛程式或用戶端,能傳50張,這是技術限制,考慮瀏覽器負荷。
面對以上輸入限制問題的時候,具體的解決方式當然是多種多樣的,這裡列舉一些規則:
a.如果是字元輸入,中英文字元數的計算規則。規則不一樣,設計也不一樣。
新浪微博是限制140個中文280個英文(當然還有各種其他字元空格的情況)
b.如何暗示限制?
c.違反規則的時候作何回饋?
這個問題文章下面會繼續提及。
d.輸入控制項根據容納內容的變化?
是直接用捲軸解決呢?還是伸長輸入框呢?還是兩者結合呢?等等。
出現捲軸
延長高度
<p>e.別忘了以上內容。畫一個輸入框時想想這不是一個無底洞。
二、凡是輸入,必考慮輸出
介面上的動態內容,可能來自于後臺編輯的錄入,也可能來自于前臺使用者的發表。
總之,介面上的動態內容,都是先有人輸入的。
輸入的人(特別是使用者)可能不會去考慮以後展現的效果,但作為設計師的我們,就要為使用者考慮了。
考慮超量內容的顯示
這涉及到兩個方面的考慮,先考慮輸入時候的限制,我們要知道究竟某個顯示空間究竟最多可能出現多少內容。
(當然,有時候是輸入輸出一起考慮,最終雙方平衡)。
再考慮這些內容在顯示空間裡如果顯示不完,那怎麼辦?解決方案可以是索引頁顯示局部,到詳情頁再顯示完全(總得要有個地方顯示完全的資訊)
也可以是顯示部分內容,留待更多展開顯示。
或者捲軸來拯救等等等等。
既然有超量內容,也可能有空白內容。
- 當搜尋結果為0的時候,怎麼顯示?
- 當使用者還沒收到任何消息的時候,怎麼呈現?
- 當某個分類下的商品為空的時候,怎麼辦?
這些問題也不要忘記考慮進我們的設計方案裡面。
有個說明總好過讓人家以為未載入出來
不能總是指望使用者每次都能搜出結果
另外,還有解析度,無論是移動終端(特別是android)還是電腦,我們設計的介面會出現在各種尺寸的顯示器上,這就決定了我們不得不考慮螢幕的適配問題。
- 比如一個pc上的彈出層,確定按鈕的位置要保證在第一屏的話,那得考慮主流(裡最小)螢幕高度。
- 比如一個預設的全屏應用壁紙,多大合適?用平鋪合適還是居中合適?還是自我調整?
- 比如480×800的螢幕能顯示6行清單項,在480×854的螢幕就能多顯示一行。
三、凡是成功,必考慮失敗
別想著使用者永遠都能正確操作,人非聖賢。這是個大話題,涉及到怎麼防止錯誤,錯誤後怎麼提醒,怎麼給予説明,也許以後再專門做文章吧。
在這裡想說的是,有時候做設計做昏頭了,再加上進度緊張,往往只是把正常的流程做出來了,卻忘記了,既然使用者操作了,就可能失敗。
比如註冊時表單項某些沒填,登錄時密碼帳號不符,拖動檔失敗,粘貼圖片失敗,等等等等。
載入失敗的時候
邊緣狀況並不是我們設計的主要內容,但卻又是不得不設計,它體現著產品的貼心,考驗著我們的細心,魔鬼都在細節裡,別忘了它們
特別注意:本站所有轉載文章言論不代表本站觀點,本站所提供的攝影照片,插畫,設計作品,如需使用,請與原作者聯繫,文章轉自alibuybuy