Itsuki Lin
文學少年 & 神話少女
4 min readDec 19, 2016

--

因為剛好公司有需要所以就整理了 UI Designer 的學習資源。
主要是針對做 Web Design 的 UI Designer 來開的單子,程度大概落在於:

  1. 具備基本的設計能力與美學
  2. 有 Web Design 設計與刻版的基礎經驗
  3. 過去多用 Photoshop / Illustator 進行設計

清單上主要是在補強設計師普遍基礎功夫跟底子不紮實、不知道該如何持續進修設計習慣等問題,也有附上一些會影響到 UI 設計與思考的 UX 基礎知識文章,以及 Sketch 等實做上會用到的工具教學資源。

如果是前端很強、UI 很強、程度跟經驗足夠到想學 UX 來強化 UI 能力等 Lv 的設計師就不適用這份清單。
至於 UX Designer 學習資源清單……這有點難開,要我開我會直接說右轉 AlphaCamp 比較紮實 XD

設計基礎通識(必讀)

中文文案排版指北 https://github.com/sparanoid/chinese-copywriting-guidelines

  • 統一中文文案、排版的相關用法,降低團隊成員之間的溝通成本,增強網站氣質。

PIXEL PERFECT PRECISION HANDBOOK 3

  • 《紀念碑谷》開發商 ustwo 所分享的 UI / UX 設計指南
  • PDF http://us2.co/2dJGBSj
  • iBook http://us2.co/2dJHme9
  • 其實是個簡報形式的小書,字少圖多翻一翻還算快看完。如果看日文速度快的話可以看日文版。

Web UI Design

Google Web Fundamentals 《Design & UI》 (必讀)https://developers.google.com/web/fundamentals/design-and-ui/

  • 至少看過上面兩部份《Responsive design》跟《Basics of UX》,其他部份可以等實際上碰到再翻閱

【書籍】響應式網頁設計學習手冊 http://www.taaze.tw/sing.html?pid=11100729127

  • 有從零開始做過 RWD 網站的話先看 Part 1 跟 Part 3 ,再看 Chapter 10 以前的各章節
  • 沒有的話請從 Chapter 1 念到 Chapter 10

Visual Design

訂閱 or 時常逛下面的 Blog

安裝 Panda 或 Muzli 外掛,有空就看看

【書籍】好設計,4個法則就夠了 http://www.taaze.tw/sing.html?pid=11100754046

  • 非視覺設計背景必看必看必看

Front-End Design

學習 CSS 版面配置(必讀) http://zh-tw.learnlayout.com/

【線上課程】CSS Cross-Country https://www.codeschool.com/courses/css-cross-country

工具相關

Sketch

Bootstrap

--

--

Itsuki Lin
文學少年 & 神話少女

好的創意跟設計是「結合多種領域並要求細節與規劃」的產物。