UI設計原則

最近閱讀《0基礎學UI》這本書總結了一些讀書心得。分享給有需要的小伙伴。


UI設計原則:

1、清晰? 內容才是一個產品的核心。除去繁冗的裝飾,突出重點。

2、一致性: 用戶通過一致的視覺語言得到相同的認知和內部系統統一的使用體驗。

3、及時反饋: 隨時讓用戶知道自己做了什么。自己的操作引起了什么后果。

4、直接操作:讓用戶更加集中注意力完成任務,同時更容易理解這些行為產生的后果。

5、美觀:美的事物會讓人產生愉悅感,UI設計中應時刻注意美觀度。


一、清晰

? ? ? 繁雜的幾面, 不但會干擾用戶視線, 也會讓用戶查找內容困難產生視覺疲勞。除去繁冗的裝飾,突出內容。同時保證app內部的可交互性。

1、表格內字體太小、顏色過于繁雜、圖標輪廓不清晰,除了影響客戶的瀏覽外,還容易造成誤操作。

2、內容展示是否清晰,重要的操作擺放的位置是否便與客戶操作。

3、層級之間的路徑是否被用戶感知。


二、一致性

? ? ? ? 用戶通過一致的視覺語言得到相同的認知和內部系統統一的使用體驗。讓用戶對app有熟悉感,降低使用成本。

1、優秀的UI,其結構應該清晰明朗,布局一致,色調一致,視覺風格統一、控件尺寸統一。

2、ios標準一致,是否使用了系統提供的控件、視圖和圖標。

3、是否按照用戶所預期的方式整合了設備特性,文案是否一致措辭與風格。

4、同樣的圖標是否表意相同,在不同的位置執行操作是否使用同樣的反饋,是否符合用戶預期。


三、及時反饋

? ? ? ? 長時間的空白狀態或者響應慢,會使得用戶離開應用。 隨時讓用戶知道自己做了什么。自己的操作引起了什么后果。

1、反饋包括視覺反饋(動效)、觸覺反饋(震動)、聽覺反饋(聲音)。每一種反饋方式都不能單獨存在,需要相互協同。才能達到最好的效果。

2、精致的動效會給人帶來有意義的反饋,幫助應用闡明行為。同時pp更有深度,讓用戶使用時產生驚喜,方便了解功能。浮動窗口從下層升起,點擊關閉時向下收回。這? ? ? 樣有利于用戶感知到它的層級關系。

3、保證視覺與觸覺同步。讓使用及時得到反饋。聽覺與觸覺反饋需要開發者自行同步。

4、盡量避免警告反饋,要讓用戶覺得自己的體驗被打斷是值得的。盡量讓用戶對警告作出相應的反饋。

5、保證用戶的決策權。可以為用戶提出建議或警告,但是不能為用戶做出決定。避免? ? ? ? ? 讓用戶在不必要的結果之間,做出平衡。


四、直接操作

? ? ? ? 用戶在屏幕上直接操作對象,能讓它們更加集中注意力完成任務,同時也更容易理解這些行為產生的后果。

1、? 3D touch,最新的直接操控手勢。使用時盡量讓3D touch的觸發與程序內部的操作相融合。同時注意不可以在peek里設置按鈕。

2、標準手勢包括:點擊,拖拽,輕掃,滑動,雙擊,捏,觸控屏按住,搖。作為一般? ? ? ? ? 規則,使用常用手勢。減少學習成本。


五、美觀

? ? ? ? UI設計是對圖形用戶界面的美術設計,是對設計師的基本訴求。美的東西會讓人產生愉悅感,在UI這設計中應時刻注意美觀度的加強。

1、檢查顏色搭配是否和諧,圖標是否清晰精致,設計語言是否一致。

2、布局是否一致,結構布局是否清晰,視圖尺寸是否舒適,整體視覺規范是否統一。

3、界面質感是否到位,設計風格是否符合用戶定位。


本人是個UI新手,第一次發文,喜歡的小伙伴可以持續關注,希望跟你們一起成長。

本文多數資料來源于《0基礎學UI》作者田海。有興趣的小伙伴可以看一下。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,963評論 6 542
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,348評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,083評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,706評論 1 317
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,442評論 6 412
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,802評論 1 328
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,795評論 3 446
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,983評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,542評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,287評論 3 358
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,486評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,030評論 5 363
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,710評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,116評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,412評論 1 294
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,224評論 3 398
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,462評論 2 378

推薦閱讀更多精彩內容