UI中文字色彩梯度的用戶體驗設計

中文摘要

本文以APP界面交互領域人眼視覺感知能力研究為基礎，對在自然環境下人眼對APP場景中文字的不同識別度進行了研究。通過對典型案例《QQ音樂》APP的使用場景分析，總結色彩梯度在不同使用場景下的變化規律�；�于用戶體驗設計的文字色彩梯度理論能使APP界面保持文字的有效閱讀，系統有效的色彩梯度設計方法可以從產品設計層面將APP的用戶體驗做好，幫助人們提升閱讀效率。

關鍵詞：UI設計；文字色彩梯度；用戶體驗設計；無障礙閱讀

目錄

緒 論 1

（一）研究背景 1

（二）研究現狀 1

（三）研究意義和目的 1

（四）研究思路和方法 1

一、基礎概念綜述 3

（一）基本概念 3

1.UI設計的概念 3

2.色彩梯度的概念 3

3.用戶體驗的概念 3

4.無障礙閱讀的概念 3

（二）相關理論研究情況綜述 3

1.UI設計方面的研究情況分析 3

2.色彩梯度的研究情況分析 4

3.用戶體驗的研究情況分析 4

4.無障礙閱讀的研究情況分析 4

（三）色彩梯度在UI設計中的作用和價值 4

1.色彩梯度在UI設計中的作用 4

2.色彩梯度在UI設計中的價值 4

（四）小結 4

二、文字色彩梯度的明度邊界與人眼視覺感知能力的關系分析 5

（一）人眼視覺感知的基本原理 5

（二）極端環境下的人眼的視覺感知變化分析 5

1.戶外日光環境下的有效色彩梯度范圍分析 6

2.夜間環境下的有效色彩梯度范圍分析 6

3.運動場景下的有效色彩梯度范圍分析 6

（三）文字色彩梯度的明度邊界對人眼視覺感知能力的影響 6

1.戶外日光環境下的影響分析 7

2.夜間環境下影響分析 7

3.運動場景下的影響分析 7

（四）小結 7

三、文字色彩梯度的設計方法與效果評測 7

（一）文字色彩梯度的設計方法 7

1.色彩梯度的設計 7

2.應用后的可讀性測試 8

3.應用后的極端環境測試 8

（二）UI界面的設計效果評測 9

1.測試戶外日光環境下的 UI 界面可識別性 9

2.測試夜間環境下的UI界面可識別性 9

四、典型案例分析與設計實踐總結 10

（一）色彩梯度在《QQ音樂》中的應用 10

1.QQ音樂色彩梯度的設計分析 10

2.極端環境之跑步模式的色彩梯度變化 11

3.極端環境之夜間模式的色彩梯度變化 12

4.《QQ音樂》的UI色彩梯度設計規律 13

（二）畢業設計《GitChat》UI設計實踐 14

1.項目概述 14

2.設計思路 14

3.色彩梯度在UI設計中的運用 14

結論 17

參考文獻 18