使用者介面設計 - 最初學習

前言

如自己不是從事視覺、平面設計的話，以一個不專業的角度，去思考網頁畫面的編排或是整體的設計，是相當不容易的，一個沒有美術的底子，只能多去看看各網站的畫面編排，不能做到自己的獨特風格(style)，比較像是混搭風(東湊西湊)，還有對顏色的不了解，之後將學習設計之路的基礎吧。

多紀錄實作過程，將會增加印象。

網頁設計軟體

將使用Adobe XD使用，軟體設計都是以螢幕開發所設計的，設計與開發樣式會有一致性

初談圖片格式

常見格式分為點陣圖與向量圖，點陣圖與向量圖優缺點

• 點陣圖
  優點：各點(像素)會記錄一個獨立的顏色，影像表現上會顯得較為豐富
  缺點：縮放可能會有失真，縮放到不符合自己比例時將會失真

• 向量圖
  優點：點線數學方程式，沒有尺寸限制，任何尺寸都可以變換
  缺點：色彩複雜程度沒很高

顏色

• RGB (Red Green Blue)，俗稱三原色
  以紅、綠、藍，顏色為主，疊加會越亮
  色彩色階 0 ~ 255

• CMYK，印刷四色
  以青、洋紅、黃、黑，顏色為主，疊加會越暗
  色彩色階 0 ~ 100

解析度

影像當中，像數數目多寡，數目越高影像品質越好，分別PPI和DPI
PPI - pixels for inch 每英吋有幾像數 (電腦顯示)
DPI - dots per inch 每英吋有幾個點 (印刷輸出)

1920 x 1080 (桌機)
768 x 1024 (平板)
360 x 240 (手機)

字體

• 歐文字體
  • 襯線體
  • 無襯線體
• 漢字
  • 黑體(宋體)
  • 明體

結語

下回再繼續練習！！