Profile 00 00@2x

陳暘 Web Frontend

前遊戲業 3D 角色設計師,半路出家學美術的理科生,曾留學於日本學習 2D 動畫。後來發掘出寫程式的能力,轉型為 Web 工程師。目前專精於前端開發,也有些許後端經驗。喜歡研究、分享各式前端新技術。善用前美術的經驗,可與 UI 設計師有極佳的配合度,能將技術細節轉為美術也聽得懂的方式來溝通。


  

台北市

[email protected]

技能


  • Typescript、JavaScript
  • React、Next.js
  • Vue、PetiteVue
  • Tailwind CSS、Sass、RWD
  • Vite、Webpack


  • Express.js
  • Handlebars、Twig
  • MySQL、Redis
  • Heroku、Vercel
  • CRUD、RESTfull API


  • Git Flow、GitHub
  • CI / CD
  • Photoshop
  • 日本語 N1

工作經歷

巴比樂視網路科技股份有限公司】前端工程師,2022.03 至今 (現職)

公司簡述: 日本電子書商 Papyless 台灣分公司,經營電子書網站「亂搭!租書網」。
  • 維護、更新「亂搭!租書網」前端頁面
  • 部分參與 PHP 後端、SQL 調整需求
  • 以每月 1~2 個的頻率,開發活動、宣傳頁面
  • 因應頻繁的活動頁需求,提出輕量級前端開發架構,使工作效率化、提高產出
  • 參與「動畫」新商品開發,製作串流視訊自動化編碼工具、引入前端影片播放器
  • 配合 Server CORS 策略,自製反向代理工具,方便前端 local 端開發

ALPHA Camp】擔任 Teaching Assistant,2020.04 至今 (現職)

公司簡述: 亞洲最具影響力的新創學校,以新加坡與台灣為教學據點,培養國際級的全端工程師。
  • 負責前端開發課程,回答學生技術問題,批改作業 Code Review 並給予回饋
  • 配合前端技術演進,協助改良舊版本課程內容
  • 支援過的課程學生數逾 1800 人,回答了近 700 筆學生提問,學生點讚數約 1200 次

啟雲科技Speed 3D】 Junior Developer,2020.04 ~ 2022.03

公司簡述: 運用臉部辨識與 AR 技術,呈現 3D 視覺效果於各平台,Facebook 官方認證 SparkAR 技術合作夥伴

Web:
  • 網頁前端開發,製作 WebAR 與臉部辨識技術相關之網站
  • 開發 Messenger Chatbot 之 Node.js Server,曾製作過 IG Chatbot 簡易框架
  • 曾救援過難以使用的 Web 文字編輯器,使產品得以上線
  • 有帶人經驗,指導前端新人,共同開發專案
SparkAR:
  • 參與了 10 餘款 Instagram & Facebook AR 小遊戲濾鏡開發
  • 參與 Messenger Video Calling 多人互動濾鏡開發
  • 因應美術需求開發 SparkAR 實用 Shader
  • 研究 AABB、SAT、GJK 等碰撞演算法,並實作於 SparkAR
  • 改善程式架構,曾讓遊戲加載速度提升約 50%

日商艾鳴網路遊戲】擔任 3D 角色設計師,2013.04 ~ 2017.02

公司簡述:日本 Aiming 台灣分公司,開發原創線上遊戲,涵蓋企劃、製作及運營。
  • 參與日本手遊「スマホでゴルフ!ぐるぐるイーグル」之 3D 開發工作 (PV 連結)
  • 累計完成約 70 組 3D 場景,約 30 餘組 3D 角色,約 10 張 2D 卡牌插畫
  • 具管理經驗,帶領 2-3 人小組完成手遊「問答 RPG 魔法使與黑貓維茲」之 3D 外包工作
  • 協助美術部門引入 Git 版控技術,幫忙排除 Git 相關問題
  • 用日文書寫的方式,直接與日本的程式、企劃討論開發需求

學歷

【日本工學院專門學校】Manga & Animation 科,2017.04 ~ 2019.02 (專門士)

  • 主修 Animation 作画組
  • 曾參與科系單位的團隊動畫製作,與日本人、他國留學生共同製作
  • 作品 Youtube 連結,擔當 1:05 ~ 1:11 部分,Layout、原畫、動畫的繪製工作

【銘傳大學】數位媒體設計學系,2005.09 ~ 2010.02 (學士)

  • 動畫、遊戲、多媒體、網頁設計綜合課程,主修遊戲組

Web 作品


亂搭!租書網  上線產品

日本漫畫、小說之線上電子書平台。主架構為 PHP SSR 之傳統網站。

- 每月開發 1 ~ 2 個活動頁面,可於「Header 選單 > 精選特輯」查看
    - 活動頁導入 Vite 與自研之輕前端架構,使工作效率化
- 開發新商品「動畫」之各動線前端頁面
    - 開發 Node.js 基於 FFmpeg 之 HLS 串流格式轉檔工具
    - 研究、導入前端 HLS 串流格式 VideoJS 播放器
- 開發「關於亂搭」、「全站分類 > 每月選書」等,全新頁面
- 部分頁面導入 Atomic CSS 解決方案,優化 CSS 可維護性
- 些許參與 Apache Router 設定、PHP CRUD、等後端工作

● jQuery ● PetiteVue ● WindiCSS ● Sass ● VideoJS ● Vite
● PHP ● Twig ● MySQL ● FFmpeg

Paragraph image 00 00@2x

FunkAR - WebAR送禮平台  上線產品 / PV

AR 虛擬賀卡之電商網站,User 可製作 AR 賀卡寄送給別人,透過 WebGL 於網頁觀看、編輯卡片。

- 管理副站「圖文機器人」之前後端開發,導入 Next.js 解決 SEO 問題
- 改善文字編輯器,文字錯位、UX 不良、卡片解析度差等諸多技術問題
- 優化各式共用 Components,協助解決 WebAR 之技術問題
- 導入 markdown 機制,使條款類、長文頁面的工作效率化,不用手刻 html

● React ● Next.js ● Typescript ● Bootstrap5 ● Sass ● Canvas API

Paragraph image 00 00@2x

捷欣企業 - JONIRO 客製鞋  上線產品

重作網站的「客製專屬鞋款 > 3D 編輯器」頁面。User 可以客製、編輯自己的鞋子,並透過 Canvas 3D 即時預覽,完成後可直接下訂單,具有讀存檔功能。主架構為 PHP SSR 之傳統網站。


- 負責前台、後台之前端頁面,與後端、Unity 工程師合作開發

- 參與部份後台 PHP CRUD 作業、擴充 Database Table

- 導入 Sass、提出 UI / UX 優化方案、設計讀存檔機制


● jQuery ● Sass ● Canvas API ● PHP ● MySQL

Paragraph image 00 00@2x

Fake Kado  線上Demo / Github

※ Next.js Side Project

臨摹台灣角川 KadoKado 輕小說平台之練習專案。使用不同渲染策略,Products 頁為 CSR,Product 詳細頁為 SSG,Search 頁為 SSR。包含後端 fake API,以模擬前後端分離的情境。


● Next.js ● Typescript ● styled-jsx ● SWR ● RESTful API

Paragraph image 00 00@2x

GreatSmile 模型電商  線上Demo / Github

※ Side Project

3 人共同開發的電商網站。 具備商品展示、後台管理、使用者認證、購物車、線上支付等完整電商功能。其參考自日本知名模型商 GOOD SMILE。


個人負責進度管理、架構規劃、CI / CD。 主要經手商品詳細頁、結帳流程頁、購物車邏輯、結帳系統邏輯、自動上下架機制、串金流、等部分。


● Node.js ● Express.js ● Handlebars ● MySQL ● Travis CI ● Mocha

Paragraph image 00 00@2x

Game 作品 (SparkAR FB / IG 濾鏡)


SparkAR 是一款集成臉部辨識與 AR 技術的 3D 軟體,用於製作 Facebook 與 Instagram 濾鏡,使用 JavaScript 作為腳本語言。 以下為 AR 濾鏡小遊戲,僅能用手機由 Facebook 與 Instagram App 開啟。

ASUS ProArt  IG 濾鏡 / PV

電流急急棒小遊戲,使用臉部鼻尖的位置操作小球,設法不碰到牆壁,抵達終點。
於此專案研究出了適用於 SparkAR 的旋轉矩形碰撞判定。

● TypeScript
Paragraph image 00 00@2x
Powered By CakeResume