前端技能樹相當茂盛，今天紀錄一下「資策會前端設計工程師養成班」的學習範疇。

課程安排基本上循序漸進，交錯進行，都由不同背景的專業教師來教學。相當重視實務練習，幾乎每堂課都會出作業。以下相當多專有名詞，當初剛接觸時也是有被轟炸的感覺，但是花時間去理解、學習，便可慢慢熟悉。

設計軟體(54hrs)

一開始學Illustrator、Photoshop。有教我們圖片去背、拉貝茲曲線、圖層、遮罩、關鍵影格(產生小型動畫)等等。要使用這兩種工具設計Logo和畫出網頁Prototype。這部分對設計背景的同學來說，都算太簡單了，但是對沒有用過這些工具的人則偏難。但目前就業看來，覺得這塊花費的教學時數偏高，且對網頁設計來說，有更好用的工具是Sketch, Adobe XD等等。

UI/UX(42hrs)

這堂課有蠻多實務操作，例如分組討論出一個商業模式，規劃出幾個主要的功能(我們這組發想了一個二手書交換APP平台)，使用者形象歸納(Persona)，做問卷調查，實際找人做深度訪談，然後要畫出手機的Wireframe和Prototype。相當好玩，但是我在其他課的壓榨下，沒有交出手機版的最後作業@@

網頁基礎

• HTML(18hrs)
  終於進入久仰的HTML(超文本標記語言)，會認識最基礎的Tag, 像是, , , , , 等。後來也學到HTML5(36hrs)：Canvas, SVG, Video/Audio, Map等進階應用。

• CSS(36hrs)+CSS3(24hrs)
  藉由設定樣式讓HTML Tag擁有高度、形狀、顏色等等，讓網頁整個美化起來，並且可以設定一些動作事件，像是滑鼠滑過(hover), 點住(active)，加上轉場時間設定(transition)，就會有動畫效果。

• RWD(18hrs)
  Responsive Web Design(自適應網頁設計)的用意，就是同樣一份HTML架構，可以在不同尺寸的載具上呈現不同的排版，而不用為了不同尺寸去生產多套HTML。只要藉由@media query語法，指定螢幕尺寸斷點，在範圍內即可改變網頁元素的排版方式，例如原本是四個商品一排，在手機板變成一個元素單獨成排。這段目標是切出一個形象網站，尺寸要能支援手機、平板和桌機。最後我們班只完成三個版吧。

學到這邊，課程也走了兩個月的時間，也準備進入緊鑼密鼓的「個人網站」發表階段。每個人要製作任何主題的靜態網站（HTML+CSS+JS）呈現這階段所學。

寫到這發現也上千字了，程式和系統分析部分，就明天繼續囉！