UI/UX 介紹

UI

• 使用者介面(user interface)
• 扮演人與機器之間的橋樑，汽車的方向盤，讓使用者覺得一目了然、好用，使用時外在的部分

UX

• 使用者經驗(user experience)
• 人遇上產品產生的想法，使用時內在的部分
  • UX Designer 主要找出使用者對產品的觀感跟心理認知
• 亨式番茄醬：醬料用到最後一滴時不好擠出來，改良包裝

  AIDMA 法則
  改變使用者的心理狀態：觀感、企業形象
  關注>感興趣>記憶>行動
  

對 UI 的迷思

• 只要會用軟體就是懂 UI?
  • 否
  • 設計系統規劃的過程
  • 接收使用者經驗反饋
• 學好平面設計就能做 UI?
  • 風格一致、配色穩定
  • 動態及互動設計
  • 產品使用流程：合理、不會讓使用者困惑
  • 心理學

Figma

快捷鍵

• Frame Group 可用於 RWD，設定每個元件固定的位置
  
• 遮色片
  

字體

• 中文字體
  • Noto snas 思源黑體
  • Noto serif 思源宋體
• 簡繁
  • SC 簡
  • TC 繁
• Icon
  • Font Awsome
  • 須注意版本
    
  • copy glyph 貼到 figma 內

元件

• 本尊是實心，分身是空心
• 複製方式：alt+滑鼠移動 或 從 assets 拉出來
• Detach instance 解開跟本尊的連結