大家好，我是GG！
目前是一名網頁設計師，之前擔任平面設計，後來嘗試轉型成網頁設計至今已滿三年。
三年的時間說長不長，說短不短，倒是在這段上班兼學習的期間，
體會到平面與網頁堪稱「隔行如隔山」，是另一門深奧的學問！

網頁設計要學的東西非常多，線上教學與資源也不勝枚舉。
不用擔心學習資源的同時，五花八門的選擇不一定每個都適合你。
多看一些老師分享的影片、多練習、累積作品和實作能力，
在其中一定可以找到適合自己的學習方式！

三年後的今天，回想當初對於轉職最快的方法，就是「上班」！
當老闆丟給你一個難題，或是從來沒有接觸過的東西，
跟你說：「這個明天下班前要喔～」
你一定會竭盡所能把它生出來的！ヽ(●´∀`●)ﾉ

設計師一定要的圖配文！有美美的圖，才不會看文字看得很累XD

by Christopher Gower on Unsplash

當初為何選擇網頁設計？

畢業後做平面設計的日子並不長，但在求職過程與後續工作、包含之前大學校外實習的經驗，充分體會到平面設計在職場上被當作「美工」的機率真的很高很高。
當然專業的「美工」是很令人敬佩的，但是當初想找尋「平面設計」的職缺，不外乎就是希望多一點展現設計的機會，也對這行充滿著夢想與熱忱。
可能是運氣不好，遇到了對平面設計待遇不佳的公司，當然薪水也是考慮轉職的一大重點，為何網頁設計的薪水普遍比平面來的好，當初的我也想一探究竟。

思考了一陣子後，決定從平面離職，
挑戰看看網頁設計這條不歸路。

網頁設計師需要會些什麼？

1. HTML、CSS
   目前大致聽過幾種網頁公司的分工模式：
   一、要求網頁設計師會切版
   切版就是將完成的設計稿用HTML+CSS切成網頁，並且視案子需求做RWD，後續再交給前端工程師製作動畫特效與其他功能，或是交由後端工程師上程式...等等。
   二、單純的視覺設計師
   繪製平面設計稿與各種螢幕尺寸的設計圖，再交由前端工程師或切版工程師做後續處理，不需要會HTML、CSS但需懂基本的觀念，避免畫出程式上難以辦到的設計稿。
   三、擁有自由意志的視覺設計師
   專門設計視覺性強的版面，不用懂程式邏輯，只要畫得出來就有工程師為你實現，但容易發生網站UI很美，UX體驗不佳的狀況，而且替你切版的工程師可能會在半夜偷偷罵你XD
   四、把你當前端工程師
   但是職稱叫做網頁設計師，內容卻寫要具備開發能力...？
2. 平面設計的美感與排版能力
   會製作Banner、網站主視覺、整體網站色彩配置、區塊編排設計、內頁排版...等等
3. 網頁程式如何運作的邏輯
   能減少和切版工程師、前端工程師打架的頻率
4. 設計軟體 Photoshop、Illustrator 或 Adobe Xd 基本操作
   製作設計稿和處理SVG圖的能力、視專案需求修圖與合成、繪製icon...等等
5. 時常逛逛國外網站，跟上網頁設計的趨勢潮流、多累積腦海的設計參考
   多看多逛，才有靈感！
6. 網頁設計的實作經驗
   可以是一個Side Project、或是和工程師朋友一起完成的小專案，對於想轉職但是沒有相關工作經驗、作品的朋友很有幫助

有平面設計的底子，轉往網頁設計確實有一定的優勢，
但也有被「平面思維」侷限住的障礙。
這些都是轉型成網頁設計必須要克服與學習的點，在剛開始勢必得花很多時間搜尋網路上的教學和資源，做自主練習與進修。

花了很多時間還是覺得困難，這都是很正常的各位！

工作至今，我依然覺得網頁設計這條路不好走，不敢說已經從新手村畢業，要學的東西實在太多了！
不論是技術或趨勢，一直不斷在更新與進步，常常好不容易學了一個東西，覺得自己好厲害已經跟上潮流，殊不知逛一下國外平台的網站，才發現其實落伍了！

網頁設計真的是一條充滿挑戰與未知的道路啊～( ´艸`)

by Christopher Gower on Unsplash

目前在公司的工作內容

我們公司的人很少，加老闆只有三隻小貓XD
除了一般的品牌官網外，也有承接系統介面，和一些奇奇怪怪的功能性網站（？）

因為人手不足，要做的事情比較雜，我們的分工模式並沒有包含在上述分享的類型裡面。
基本上都是一人兩到三個新專案，從設計到切版和程式全部完成，客戶對過沒問題就上線！
若有做後台或特殊功能的，公司有外聘一位後端工程師會協助。
新專案製作途中，也會穿插各式各樣的網站維護內容及雜項。

目前的工作大致需要：

1. 繪製設計稿
2. 繪製SVG的插圖或icon
3. HTML、CSS切版
4. 一點點的JavaScript
   （我真的看不懂，都要一直拜託外聘的工程師，關於外聘的後端工程師為什麼會JavaScript，我以後會專門寫一篇文章給大家講解）
5. 使用Bootstrap前端框架
6. Banner動畫製作
7. 突然要列出來有點難，想到會繼續補充！

這系列文章會分享

當初從平面踏入網頁設計，也是經過了不少辛苦的學習過程。
寫程式真的要每天都睡飽！不然好容易寫出一些邏輯奇奇怪怪的code｡ﾟヽ(ﾟ´Д`)ﾉﾟ｡
雖然沒有到很專業，但這系列會分享一些平常使用到的技術與筆記，和當初轉職期間瘋狂研究的線上教學。
也會記錄一些愛用網站和程式資源！

希望可以藉由這30篇文章，
分享自己到目前的所學所聞。
也希望能幫助到有興趣從平面轉職成網頁設計的朋友：）