第1章什麼是UI設計——UI的前世今生 001



1.1什麼是UI 002



1.2UI的發展歷程 003



1.2.1語言命令用戶界面 004



1.2.2圖形用戶界面 004



1.2.3多媒體用戶界面 005



1.2.4多通道用戶界面 006



1.2.5虛擬現實人機界面 007







第2章UI設計的原則與理念 013



2.1需要靈活應用的七大定律 014



2.1.1費茲定律 014



2.1.2席克定律 018



2.1.3操縱定律 022



2.1.4泰思勒定律 026



2.1.5奧卡姆剃刀原理 028



2.1.6神奇數字7±2法則 033



2.1.7接近法則 034



2.2完形組織法則的六個概念 035



2.2.1圖形-背景關繫法則 035



2.2.2鄰近法則 039



2.2.3相似法則 041



2.2.4閉合法則 046



2.2.5延續法則 047



2.3Shneiderman 界面設計八大黃金法則 049



2.3.1八大黃金法則 049



2.3.2Shneiderman 8大黃金法則在蘋果UI設計上的應用 051







第3章UI設計基礎 057



3.1UI文字、圖片和圖標設計 058



3.1.1UI設計中字體的使用 058



3.1.2UI設計中圖片的使用 065



3.2UI色彩設計 073



3.2.1UI設計中的色彩基本知識 074



3.2.2UI設計中的色彩情感 078



3.2.3UI配色方式 080







第4章網頁UI設計——細節的完美主義 103



4.1網頁UI基本概念 104



4.2網頁UI設計原則 104



4.2.1以用戶為中心 104



4.2.2視覺美觀 105



4.2.3主題明確 106



4.2.4內容與形式統一 110



4.2.5有機的整體 110



4.3UI版式設計的形式美 112



4.3.1主次關繫 114



4.3.2虛實對比 115



4.3.3比例尺度 115



4.3.4對稱與均衡 116



4.3.5對比與調和 117



4.3.6節奏和韻律 118



4.3.7量感 119



4.3.8空間感 119



4.3.9尺度感 122



4.4細節設計之著陸頁：直達OR迷宮 123



4.4.1著陸頁的概念 123



4.4.2轉化率的意義 123



4.4.3著陸頁的構成 125



4.4.4如何提升著陸頁的轉化率 127



4.4.5案例 130



4.5細節設計之“關於我們”：走心，纔能打動用戶 133



4.6細節設計之彈窗：“不速之客”帶來的驚喜 136



4.6.1減少干擾 137



4.6.2與現實世界相關聯 138



4.6.3追求極簡 140



4.6.4選擇適當的彈窗種類 142



4.6.5視覺一致性 144



4.7細節設計之404頁面 145



4.8網頁UI極簡設計——無勝有 148



4.8.1極簡設計的要點 150



4.8.2極簡設計技巧 153



4.9電商網站UI設計案例 156







第5章移動端UI設計——“行走”的藝術 161



5.1移動UI 162



5.2移動端UI設計原則 162



5.2.1一致性原則 162



5.2.2信息量少而準原則 163



5.2.3語言通俗原則 163



5.2.4顏色合理搭配原則 163



5.2.5布局合理化原則 164



5.3從桌面端到移動端內容遷移的用戶體驗優化 164



5.3.1每屏隻完成一項任務 164



5.3.2精簡並優化導航體繫 165



5.3.3基於搜索引擎的設計模式 166



5.3.4更大的字體 166



5.3.5意義清晰的微文案 167



5.3.6去掉不必要的特效 168



5.3.7尺寸適配 168



5.4Google Material Design 169



5.4.1Material Design的設計原則 170



5.4.2Material Design體繫 171



5.4.3Material Design引領的UI設計趨勢 192



5.5APP UI設計 196



5.5.1APP UI版式設計 197



5.5.2APP細節設計——登錄頁 213



5.5.3案例視覺社交網站Pinterest APP設計
221







參考文獻 228

UI就是用戶界面的簡稱，UI設計屬於工業產品設計的一個特殊形式，其具體的設計主要是針對軟件，通過對軟件涉及的人機交互、操作邏輯等多個內容加以分析，實現軟件優質的應用價值。隨著智能化電子產品的普及，帶有液晶屏顯示的產品將越來越多，也就意味著越來越多的產品設計需要UI設計。隨著“UI”熱的到來，近幾年國內很多從事手機、軟件、網站、增值服務等企業都設立了這個部門，還有很多專門從事UI設計的公司也應運而生，軟件UI設計師的待遇和地位也逐漸上升。



在當今互聯網和信息技術快速發展的時代，人們的生活經歷著各種無法預想的變化。產品設計由物質設計向非物質設計轉變已經開始了，而且必將成為未來產品設計的主流，一個UI大時代即將到來。伴隨著互聯網長大的一代正在成為社會的主流，並以他們特有的視角和思考問題的方式影響著社會的發展，也對用戶界面設計與體驗產生著不可估量的影響。



UI設計需具備良好的實用功能。好的UI設計，可以讓軟件富有個性，彰顯品位，同時也能讓軟件在使用的過程中充分體現出舒適感和操作的簡便化，符合當代用戶自由時尚的追求，凸顯出軟件的準確定位及自身特點。UI設計覆蓋面廣，並且涉及多種學科知識，因此對設計師提出了更高的技術要求，需要他們在掌握基本的學科知識的基礎上，拓寬知識面，應用綜合知識和技能，滿足用戶高品質的設計需求。



本書緊扣時下熱門的用戶界面設計趨勢，主要講解了什麼是UI設計，UI設計的原則與理念，UI的文字、圖片和圖標設計，網頁UI設計，移動端UI設計五大方面的內容。本書旨在普及用戶界面設計的相關前沿理念，全面闡述用戶界面設計在網頁及移動端兩大主流設計領域的具體表現和所需掌握的專業技能。



本書圖文並茂、簡單易懂，采用理論與商業應用案例分析相結合的方式，使用戶能夠更輕松地理解和應用，培養讀者在用戶界面設計方面分析問題和解決問題的能力。



本書結構清晰、內容翔實，為廣大讀者詳細解讀了用戶界面的設計理念與方法，是一本用戶界面設計的導論級讀物。通過學習這些寶貴的設計經驗與設計方法，讀者同樣可以創造出觸動人心的用戶界面設計。



本書由陳根編著。陳道雙、陳道利、林恩許、陳小琴、陳銀開、盧德建、張五妹、林道娒、李子慧、朱芋錠、周美麗等為本書的編寫提供了很多幫助，在此表示深深的謝意。



由於作者水平及時間所限，書中不妥之處，敬請廣大讀者及專家批評指正。







編著者