您的👍是我們的動力來源!
一位優秀的設計人也許是最適合走向前端的潛在人才，因為前端工程是程式領域的門面代表，決定了網站與使用者互動時呈現的樣貌，因此有美感、懂設計的人更能做出令人賞心悅目的網站。
平面設計師的視覺處理主要是用Illustrator、Photoshop，如果是UI/UX設計師也許會多使用Sketch等工具，但跨了領域要做網站，可不是將設計好的素材丟上空白頁就能運作，設計人成為工程師的第一段距離，就是學會如何把設計版型轉為HTML與CSS。
設計>>切版>>前端工程
HTML（HyperText Markup Language，超文本標記語言）是網頁的骨，可以製作出網頁基本的結構；CSS（Cascading Style Sheets，層疊樣式表）則是網頁的肉，為製作好的結構增添其他裝飾（字體字形、色彩、排列等）。
在任何一個網站頁面點擊右鍵選單，再點選「檢查」，會出現一排排的程式碼，這就是透過HTML、CSS將原本設計的版型轉為靜態網頁，而這樣的過程便是所謂的「切版」。
接著才是邁向「前端工程」的第二段距離：JavaScript。
前端工程師的標配程式語言：JavaScript
列舉幾個熱門網站為例子，可以發現後端語言有各式各樣的選擇，但前端語言目前就只有JavaScript，它是第一個在瀏覽器剛出現時使用、也是目前唯一可以支持所有瀏覽器的語言，因此與前面提到的HTML、CSS成為「前端工程三本柱」。
對於程式初學者我們常建議從網頁開始學起，而學會切版之後，踏入真正前端工程領域的學習也沒什麼好煩惱到底要先學哪個程式語言了：僅JavaScript一家，別無分號！
只要學了JavaScript就沒問題 ?
從視覺處理到真正的運用邏輯、實現更多的網站互動功能，學習JavaScript是獲取前端門票的是必經之路。為什麼只說是門票呢？因為想真正成為前端工程師，只會前端工程三本柱絕對是不夠的。
從圖中歸納出關於前端工程師應該具備的能力，可以發現JavaScript的函式庫jQuery以及其開發框架，還有其他延伸的應用都是必備條件，因此透過JavaScript打開前端工程的大門，成為工程師的學習之路才正式開始。
設計師學前端的動力來自視覺效果
JSDC（JavaScript Developer Conference，JavaScript 開發者年會）是台灣最大的 JavaScript 年度性技術研討會，在2013的會議中探討了設計師學習前端技術的議題。
講者認為，考量設計師重視覺，呈現視覺上的互動效果，更能引起設計師的興趣，進而克服學習程式的心理障礙。換言之，從純做設計轉向撰寫程式，靠的是成果展現的成就感，不要想著是從設計領域轉向程式領域，而是為了呈現更棒的視覺效果！
結語
也許有的大公司會細分「視覺設計」、「切版」以及「前端工程」，但熟悉彼此的技術將能對自我能力以及整體開發效率有所提升，因此更不應該自己侷限在「純設計」或「純切版」的領域，也可以先從平面設計先轉向與前端最相關的UI/UX設計，再慢慢轉向完整的前端工程領域。
走向工程師的路途或許並不容易，但可以肯定的是跨領域的整合能力絕對是未來提升競爭力的重要關鍵。
【歡迎追蹤訂閱】 「HiSKIO 嗨 程式技能」科技資訊文章、實用工具分享、新課程優惠領取 「Hi 直播學程式」不定期專題直播 「HiSKIO youtube頻道」免費實用課程、工程師經驗分享 最懂初學者的「F5學程式」 不想一個人孤單寫 code ? 來活力滿點的「程式丼起來」加入話圈吧 !
延伸閱讀：