UI/UX：畫 icon 的心路歷程
憑感覺摸索
當初想畫一套自己的 icon，一開始憑著自己的感覺畫，將 icon 繪製在 32*32px 的範圍中，乍看之下感覺很不錯～但仔細看！有ㄧ種輕飄飄、高低不一的感覺。
擺在畫面上更是明顯感受到不協調！（汗顏）
閱讀規範
後來仔細閱讀 material design 的規範，Keyline Shapes 元素，為了讓圖形元素一致，且能靈活的定位，所建立的明確規範。通過使用這些核心形狀作為指導，可以保持 icon 一致的視覺比例。
某些形狀存在特定的 keylines：圓形，正方形，矩形，正交和對角線。這些基本形狀有助於統一 Google 系統圖標並規範它們在圖標網格上的位置。
檢討並重新繪製
檢討
我將 icon 放在 Keyline Shapes 元素上方檢視，可以看到每個 icon 都沒有在紅色基準線上。這才恍然大悟！原來看起來不協調的原因就是出在這啊！！
重新繪製
按照紅色基準線重新繪製一組新 icon，也將 icon 比例以 24*24px 繪製。
利用規範基準線的方式繪製，不再是左邊推一點、右邊推一點的憑感覺，而是有依據的繪製。
將重新繪製好的 icon 擺放至畫面上，字體和 icon 都做了調整後，畫面看起來比第一次協調許多。
讀懂規範後，讓我繪製 icon 的速度提升，也更能掌握繪製上的細節！
這段時間自己摸索畫 icon 的一套方式，也許不夠全面，也請各位大大指教了！
Keyline Shapes 下載
免費素材下載 → sketch版keyline
參考文章規範：https://material.io/design/iconography/product-icons.html#
