# Figma學習日記筆記
紀錄真的開始穩定學習、操作FIGMA的過程
不穩定就算了，反正就是要做
## 目錄

1. DAY0 參考資料們
2. DAY1 臨摹練習- Figma自介小卡
3. DAY2 原子設計- App系統列內容
4. DAY3 臨摹練習App- Google Podcasts(全頁面)
5. DAY4 臨摹練習Web- UX Design World(原子設計)
6. DAY5 臨摹練習Web- UX Design World(Home、Articles、Tips、Learning Bytes)
7. DAY6 臨摹練習Web- UX Design World(Course、E-Book、Subscribe

## 正文

### DAY0 參考資料們：
Figma插件-Icon類
[Feather Icons](https://www.figma.com/community/plugin/744047966581015514/Feather-Icons)
[Material Design Icons](https://www.figma.com/community/plugin/740272380439725040)
圖示/照片都有涵蓋
[Icons8](https://www.figma.com/community/plugin/791103617505812222)

暫代圖片
[Unsplash](https://www.figma.com/community/plugin/738454987945972471)

一鍵去背
[Icons8 Background Remover](https://www.figma.com/community/plugin/997643096679511216)

設計參考手冊
[Material Design3](https://m3.material.io/)

pattern
[Toptal](https://www.toptal.com/designers/subtlepatterns/)

商用插畫
[unDraw](https://undraw.co/illustrations)

好看速成的陰影
[Beautiful Shadows](https://www.figma.com/community/plugin/1068595505353552645)

流程箭頭(選兩個frame+shift產生箭頭)
[AutoFlow](https://www.figma.com/community/plugin/733902567457592893)

假文假圖內容填充(已有假資料)
[Content Reel](https://www.figma.com/community/plugin/731627216655469013)

內容填充(自己製作內容)
[Google Sheets Sync](https://www.figma.com/community/plugin/735770583268406934/Google-Sheets-Sync)
[說明文件](https://docs.sheetssync.app/)

圖示重繪(輪廓化、變色、縮放保真)
[Herontoolbox](https://www.figma.com/community/plugin/1146243428006792173/Heron-toolbox)
### DAY1練習：
[參考](https://www.figma.com/community/file/1023417887041767831/Figma-Bootcamp---Practice)
基本操作熟悉

文章選讀：
[UI｜讓我們立志「不要」成為美感至上的 UI 設計師](https://medium.com/as-a-product-designer/ui-%E8%AE%93%E6%88%91%E5%80%91%E7%AB%8B%E5%BF%97-%E4%B8%8D%E8%A6%81-%E6%88%90%E7%82%BA%E7%BE%8E%E6%84%9F%E8%87%B3%E4%B8%8A%E7%9A%84-ui-%E8%A8%AD%E8%A8%88%E5%B8%AB-57622a908b6e)

### DAY2練習：
還在找

文章選讀：
[先別急著畫UI，你聽過Flow Chart嗎](https://medium.com/as-a-product-designer/%E5%85%88%E5%88%A5%E6%80%A5%E8%91%97%E7%95%ABui-%E4%BD%A0%E8%81%BD%E9%81%8Eflow-chart%E5%97%8E-c6715f055cfc)

### DAY3練習：
[參考](https://youtu.be/Lgiu9FJUGrE)
定義基本色、字型header、fooder、基本文字component
排整個版面

文章選讀：
[Toggle Switch & Checkbox的使用時機](https://medium.com/as-a-product-designer/%E4%BB%80%E9%BA%BC%E6%99%82%E5%80%99%E7%94%A8-toggle-switch-%E6%88%96%E6%98%AFcheckbox-%E8%A8%AD%E8%A8%88%E6%AD%A3%E7%A2%BA%E7%9A%84%E4%BD%BF%E7%94%A8%E6%99%82%E6%A9%9F-5a73b7a5ab90)

### DAY4練習：
[參考](https://uxdworld.com/category/tips/)
定義基本色、字型
作header、fooder、基本文字component

課程講義參考：
[使用者介面設計講義](http://jinjin.mepopedia.com/~jinjin/ui/index.html)

### DAY5練習：
[參考](https://uxdworld.com/category/tips/)
內裡編排細節調整

與時俱進：
[如何使用AI工具幫助設計師(How I use ChatGPT as a UI/UX Designer)](https://medium.com/ux-planet/how-i-use-chatgpt-as-a-ui-ux-designer-bcf22b3cb1c0)

### DAY6練習：
[參考](https://uxdworld.com/category/tips/)
看看不要接著作RWD

[製作RWD網頁時要注意的事](https://medium.com/@king40105/%E8%A3%BD%E4%BD%9Crwd%E7%B6%B2%E9%A0%81%E6%99%82%E8%A6%81%E6%B3%A8%E6%84%8F%E7%9A%84%E4%BA%8B-330e78700b10)