【上課心得】2024互動式前端網頁設計與開發實務 心得

188

通常會查到這裡的，應該至少知道這是勞動部產業新尖兵委辦的課程！ 或許想知道互動式前端網頁設計到底會學到什麼？真的可以拿8000元嗎？花這些時間值不值得？課程雷不雷…? 能不能成功轉職！？老師靠譜嗎？等等的……

---

不囉唆，今天就讓第五屆剛畢業的鬼頭刀來做解答！

1. 互動式前端網頁職訓班心得總結

✤ 勞動部開的課程的值得嗎？

我覺得值不值得見仁見智。（被打飛

好啦，我覺得再談值得之前，可以先思考一下自己想要學什麼、想要獲得什麼？

當時學習目標：✔️會寫HTML/CSS  ✔️會用FIGMA ✔️熟悉網站製作流程

如果是要求變得超專業前端或UI設計師，或是馬上求高薪成功，那我覺得有更好的選擇，但如果你是沾邊的新手、沒有特別金錢時間壓力想摸索看看我覺得蠻適合的（還可以領錢，何樂不為🥹）！

我自己一開始想朝UX設計師前進，但逛一圈104只看到滿滿的UIUX職缺，就知道只學UX不是很夠~
我認為：這堂課給的資源很多、彈性空間也很足，先想好自己目標，就可以利用課程專案及課程上往這方面前進～
沒想好的也沒關係！一開始老師會安排一些職訓課程，引導你想要就業的方向

( BTW 推推想學UX可以先學Google 開設的UX 學程！)

1. 涵蓋範圍很廣：可以了解更全面，就職也有幫助！
2. 老師很用心： 每一期的課程都會有調整，老師後期有很用心地詢問我們意見，這一點我覺得在教學上用心程度是推推的～就像是這一期我們是第一班需要做兩個專題，個人＋團體做好做滿，關於這一點我覺得有好處也有壞處！
3. GET許多設計技巧：過去工作常遇到的困難就是設計做得很醜，但我自己其實設計底子也不好，常常道不出個所以然，我覺得這堂課我能知道一些網站基礎規則與知識，該怎麼配色、字距行距、字體使用、排版等，在設計上「不要太相信自己，要相信知識」ＸＤ

✤ 課程可惜的地方

1. 短時間要學很多，有些概念學習順序不是很順！scss如果能早一點教，css撰寫會更容易，但太早教又會容易搞混；以及react的node開發版跟CDN版本有許多執行上不一樣，但CDN好入門，以至於我後期想了解node開發環境時有點來不及學習等等……。
2. 同學互動機會比較少：雖然說我本身問題可能比較大（超級Ｉ人），但因為上課要教的太多，以至於除了組員，很少有機會和其他同學交流～ 不過這一點老師也有想辦法改善！
3. 教學專業度：教太多細節的時候，偶爾就會有一些教學混亂時刻。
4. 專題製作：前期沒有說的很清楚，以至於題目發想、製作流程沒有很理解，雖然有繳交作業的排程設計，但因為一直在上課，中期對於專題的回饋與協助會較少。
5. 企業講座/履歷課程：另外找的老師，有時不清楚這班級的性質，會變得教學的很淺、對於有就業經驗的實際幫助不大。

---

2. 課程內容學什麼？

✤ 甜甜老師

課程內容

• 前端Code (HTML + CSS →  jQuery / Bootstrap / SCSS)  
• Figma操作 ( RWD →  app的UI設計 → 動態作品集)

上課心得

最主要的教學老師，老師親切活潑，教材很多樣豐富，可能是因為教學的內容有時候很細節且操作比較複雜，有時候會造成小混亂，不小心就沒跟上或迷路ＸＤ 不過老師的教材與知識非常豐富，許多資料都整理的超詳細，用心程度推推～

✤ 咖啡老師

課程內容

JavaScript  →  React (JS框架) / Bootstrap / jQuery →  資料庫串接

上課心得

老師教學用心、外冷內熱（？）上課內容會錄影起來，回去都可以複習！一開始在教學JavaScript的時候很有耐心地，讓大家都能進入狀況，中期有一點飆車感，React以及資料串接會開始有一點跳痛感，後期還有教到一些資料庫的內容，這裡我已經很抱歉老師跟不上（ＱＱ

✤ Peggy老師

課程內容

UIUX流程、規劃 → Figma操作 → Protopie → 作品網站要點

上課心得

老師上的很優雅（？）別誤會這是100%是純純的稱讚！老師用很輕鬆簡潔的重點教學，但你會發現句句都是精華，每次看老師做的內容，簡單範例卻看得出來非常有設計的成熟度！

雖然老師上課的時數最少，不過教學的內容相當豐富，從一開始的UX網站製作流程、設計要點、UI製作Prototype以及設計細節、到個人簡歷與作品集，我覺得含金量滿滿！ 

3. 課程注意事項(2024領錢策略)

• 費用：10,000元，若90天內內找到工作，參加就業保險就可以領回！（一般的勞保也算喔）
• 補助：8000/月，上課三個多月，最後一個月依比例領取（我這期是領到四次8000元～）
• 總時數為 504 小時，請假超過10%拿不到補助金 (壓線請49.5小時的我)，超過上限為 77 小時會退訓。

4. 學習心路歷程

✤第一個月學習：

HTML＋CSS，就是手把手建立兩個網站來教學，css內容居多，html提到的不多，但因為我本身懂一點，所以學習上沒有困擾～但CSS感覺沒有到非常系統性學習，而是實際操作，所以有一些基本概念沒有非常理解，像是我之前看書看到的BEM概念並沒有特別在教學的時候提到過（推推我自己覺得入門的書：CSS 設計風格指南）

RWD：教學用Figma做RWD ，這是蠻有趣也深度的教學，只是比較複雜，加上是實機操作，沒有先講定設計邏輯，上課的時候容易會卡住或是跟不上老師節奏～ 另外一開始也不知道學這個的用處、實際應用時機，以至於同學會誤用在錯誤的地方（例如在做wireframe的時候就開始畫RWD）

Js 教一個月左右差不多會開始到React，可以很放心0基礎的話，這一個月都還跟得上，雖然第一個禮拜也是有點混亂，老師講得很慢、邏輯會重複敘述，所以是跟得上！

✤第二個月學習：

這個月感覺css的東西更多，有手把手刻一個一頁式網站架構＋各種css設計的一頁式網站，強化架構能力！自己寫出兩個網頁，成就感會上升！

Figma 使用上也教更多使用上的小細節，把wireframe畫得更完整、搭配一些設計要注意的細節，這裡差不多完成Figma的八成學習，後期老師開始教prototype的應用，但以其他設計軟體為主，在figma上提到的不多，可能是因為figma的交互太基礎了（？）

Js 這時候會開始教一些套件使用，有點話鋒一轉的感覺 開始react 進來以後 發現前面教的不太搭得上 中間有幾堂課整個陣亡ＱＱ

✤第三個月學習：

因為這次有兩個作業，已經開始有點分身乏術 要吸收的也過多，交互教了protopie 這部分我直接取捨了一下 大概懂個理念就好JS 開始教其他的應用，像是 bootstrap \ scss \  jquery 這裡我覺得很混亂，上課有種給我套就對了的感覺，但我比較希望能說明有哪些套件、怎樣的情況適合（形象網站or電商or部落格等）、業界多用哪些之類的，這部分比較少提到！

✤總結與專題心得：

這次上課要求要有兩種專題，一為團體網站，一開始老師會請大家發想主題，然後開始找適合的同學組團！必須使用react撰寫，老師也會引導如何分工合作等，這部分就要看自己運氣與溝通能力了（嘆

二為個人網站，主題自訂，大部分同學都是做簡單的作品集網站居多，因為已經很忙了～ 我選擇做電子商務網站，因為老師有提到，若想走電商或行銷有電商網站做履歷是不錯的（但請三思，因為電商要注意的細節很多，一做不好會弄巧成拙ＸＤＤ）後來還有找老師討論個人的專題！ 可以把自己想要走的目標和專題特點跟老師討論，我覺得老師給的意見非常有用且重要，收穫良多，讓個人專題有更大進步的空間（改不完（哭））

我覺得這個時代有Chat GPT真的是我的神，有Ai以後，還幫我的電商做了很多商品圖 （推推 Bing 的ai 製圖），如果沒有它們，其實覺得根據上課的內容會吸收不了且做不出來，可能只能做出簡單排版的個人作品集～