UI設計，全稱User Interface，作為近年設計行業的新貴，越來越多的人投身於UI設計這一行，UI設計的種類很多，其中有幾類是我們日常生活中最常見的和作為設計師最應該瞭解的。
1.GUI
圖形用戶界面（Graphical User Interface，縮寫為 GUI）又稱圖形用戶接口，是指採用圖形方式顯示的計算機操作用戶界面。
手機移動端App產品
電腦端產品
遊戲操作界面
智能家電
圖標設計
車載系統
數碼產品
軟件產品
2.WUI
WUI是Web User Interface的縮寫，即網頁設計。
移動端網頁
電腦端網頁
H5活動頁面
3.IXD
Interaction Design即交互設計，縮寫為IXD。交互設計定義的是人和機器的相互“交流行為”，機器包含軟件設備，同時也包含硬件設備。
交互行為是在兩個或者多個個體之間進行相互配合，並且達到某種目的，而交互設計則是為了讓整體過程更順暢、更完善。
信息架構
交互原型圖
頁面佈局
4.UE/UX
User Experience即用戶體驗，縮寫為UE/UX，是用戶在使用產品的過程中建立起來的一種純主觀感受。
用戶調研
用戶心理分析
產品體驗優化
思考並創造讓用戶喜歡的產品
用戶需求研究
UI設計和其他設計不同，不是會用軟件工具繪製幾個圖像，就稱為UI設計了。
它需要設計師具備大量的學科知識，包括認知心理學、設計學、語言學和統計學等，這些知識在界面設計中扮演著重要的角色。
就拿我們平常最常見的卡券來說，它的設計看似簡單，但也暗藏了很多要點，今天數藝君就以卡券設計為例，和大家一起探討探討。
卡券界面設計
卡券界面多出現於大眾消費類和營銷類APP中，常以列表形式出現，可以根據活動內容設計不同風格。
卡券列表：
設計卡券列表時，既要保證每個活動廠商的LOGO可以凸顯出來，又不能影響界面的一致性。
另外，如果採用單色模式設計，視覺效果一致；如果採用彩色模式設計，要考慮顏色的搭配。看似簡單的界面，實際上包含了很多設計技巧。
卡券列表界面操作實例：
01 新建文檔，設置“寬度”為750像素，“高度”為1334 像素，完成後單擊“確定”按鈕。
02 導入導航欄，將其拖曳到畫布頂部，也可獨立創建導航欄，設置“寬度”為750像素，“高度”為88像素，或創建狀態欄，設置“寬度”為750像素，“高度”為40像素。
03 使用“圓角矩形工具”繪製圖形，設置“半徑”為20像素，“填充”顏色為（R:255，G:96，B:163）。
04 選擇“橢圓形工具”，然後按住Shift 鍵繪製圓形，接著設置“填充”顏色為（R:246，G:90，B:80）。
05 使用“橢圓形工具”創建3個圓形，繪製一個擴散效果，並將圓形圖層移動到紅色圓形下方，再設置“填充”顏色為白色。
06 分別選中白色圖形，設置大圓的圖層“不透明度”為6%，中圓的圖層“不透明度” 為10%, 小圓的圖層“不透明度”為16%。
07 導入LOGO圖片，拖曳到圓上，再按快捷鍵Ctrl+Alt+G添加剪貼蒙版效果。
08 使用“文字工具”輸入文本，選擇合適的字體和字號。
09 使用“矩形工具”繪製圖形，然後按住Shift 鍵繪製正方形，接著選擇正方形，按快捷鍵Ctrl+T進入自由變換模式，再旋轉45度後進行縮放，最後按快捷鍵Ctrl+E進行合併。
10 選擇“直接選擇工具”，然後選中菱形，在選項欄設置“操作路徑”為“減去頂層形狀”，接著設置“填充”顏色為（R:181，G:102，B:255）。
11 雙擊繪製的圖形，然後在彈出的對話框中選擇“投影”選項，接著設置“不透明度”為6%，“距離”為12像素，“大小”為0像素，再單擊“確定”按鈕，最後設置圖層的“不透明度”為96%。
12 使用“文字工具”輸入文本，選擇合適的字體和字號，再將繪製好的項目編組。
13 將編組項目水平向下複製多份，然後使用同樣的方法繪製其他的列表項目。
14 使用“文字工具”完善界面，至此，卡券列表就繪製完成了。可以通過變換顏色拓展出不同商戶的優惠券，是個很有代表性的頁面練習。
或許你要問，UI設計師分類這麼多，哪一類更適合自己呢？數藝君推薦您看看BIGD出品的這本《UI設計啟示錄：創意＋對比＋實戰》。
市面上與Photoshop有關的書籍多以介紹如何修圖為主，傾向於講解修圖工具的使用，針對UI的書則較少。
而本書的特點是能讓大家看得懂、學得會，且不會覺得枯燥，讀者可以邊翻看手裡的書，邊通過計算機進行實踐學習，避免了“只會照著書做，自己創作時卻一頭霧水”的問題。
