UI設計原則

2022-05-08 12:51:15 字數 2579 閱讀 8379

原則1:使用者介面應該是基於使用者的心裡模型,而不是基於工程實現模型

就是把後台本來很複雜的事情通過設計符合使用者日常生活中常用的瀏覽方式或操作方式。其實這一點是設計師把生活中的細節和資料結合的凝聚點,使用者的心理模型抓的越準,介面就會越優秀。

#左邊介面#:大眾點評新版的**的搜尋就比之前改得更符合使用者心裡模型;#右邊介面#:食神搖搖的搖動手機找餐廳更加符合大眾使用者的心裡,大家應該都有那種中午不知道去哪家餐廳就餐,那麼就搖一搖來隨機抽出乙個附近的餐廳。

2:培養用使用情景的思方式做設計3:盡量少的戶輸入,盡量多出參考

4全域性航需要一直存在,最好還能預覽其他模動態的反不打斷任務流

模態彈出框的書面名稱在iphone os中稱作:alert-box,在android os中稱:pop-up box, 我們都知道彈框會打斷任務流,所以在有限的螢幕上怎樣讓這些彈框弱化,或者說優雅、紳士的提醒使用者,這個需要設計師來定義。

模態是指介面中只有提醒彈框才具有可互動行為,其他一切都不可操作;非模態不會把提醒做成彈框,可能會處理成list notification, toast list等方式來提醒使用者。

gmail是第乙個把刪除的模態彈框設計成list notification這種方式的,提醒使用者撤銷剛才的刪除操作,這種非模態的處理,讓刪除的流程更加順暢和輕鬆自如。

k歌達人第二版的彈框就是模態處理,介面很不友好,使用者在k歌過程中要被打斷三次才能發表一首自己唱的歌曲,所以降低了使用者的參與度。

原則6:不要讓使用者等待任務完成,使用者還要發現更多有意思的地方

原則8:為了程式響應的速度,設計有時候需要擔任掩護的作用

科技並不是萬能的, 技術依然是移動網際網路應用程式最需要優化和完善的,作為技術的盟友我們設計人員也需要輔佐他們,讓使用者覺得程式原本就應該是這麼執行的。特別是程式響應的速度很多時候不光是技術的問題,與網路環境也有很大的關係,這時候設計人員需要考慮這些客觀存在的情況,幫助程式來掩護這些瑕疵,讓使用者感覺到在使用時是流暢的。

#隨後實現# instagram帖子「贊」 不管對參與者還是帖子作者都是激發其積極性活躍社群氛圍的重要功能,所以在程式的響應方面一定要具有可用,易用的特性,我們看左圖中,「贊」的按鈕已經現實「已贊」,同時我們看紅色框內的「菊花瓣」就知道後台在loading贊的資料,所以這就是設計的巧妙之處,先讓使用者感知到程式是非常快速的,而不是等loading完之後再顯示「已贊」;

#提前傳輸# instagram中發布帖子的時候,使用者處理完**點選「上傳」按鈕就看到中間的介面,這時候介面是讓使用者去為自己的帖子輸入乙個主題,或者去設定分享等功能,同時我們可以看到紅色框中的「菊花瓣」,很明顯後台已經開始傳輸剛才上傳的**了,所以當使用者在點選「完成」時,資料只需要上傳剩下的一部分,讓使用者感知上傳很迅速;

#邊唱邊完成# 把伴奏和使用者的歌聲合成為一首**時需要後台處理大量的資料,如果分步做就要讓使用者等待比較長的合成時間,為了讓使用者不用枯燥的等待合成,我們需要後台在使用者唱歌的同時,後台就已經開始把唱過的伴奏和歌聲合成。

以上八項原則是我在工作中體會比較深刻的互動設計原則,希望能對**到這篇博文的朋友有所幫助。當然設計原則是隨著時間的變化而不斷變化的,所以也請各位朋友完善和補充,謝謝!

UI設計原則 Material Design

什麼是material?環境 material屬性 高度和陰影 animation 真實的動作 互動相應 有意義的轉場動畫 打動使用者的細節 style 色彩 圖示 影象 文字排版 書寫 layout 準則 單位和長度 度量與邊框 結構 自適應 components 底部視窗 bottom shee...

UI設計原則詳述

介面是使用者作業系統的視窗,而不是介面控制使用者。因此介面一定要適合使用者操作軟體的習慣,這是最基本的要求。介面的合理性既提倡外美內秀,又強調恰如其分。以使用者為中心應遵循以下要點 1 使用者扮演主動角色,在需要自動執行任務時,允許使用者進行選擇或控制它的實現方式 2 採取互動式和易於感應的視窗,使...

UI設計原則 Material Design

什麼是material?環境 material屬性 高度和陰影 animation 真實的動作 互動相應 有意義的轉場動畫 打動使用者的細節 style 色彩 圖示 影象 文字排版 書寫 layout 準則 單位和長度 度量與邊框 結構 自適應 components 底部視窗 bottom shee...