陳昱安

Hi~ 我是 An

2015年畢業於龍華科技大學資管系，大四時直接進入雄獅資訊開始實習，畢業後立刻轉為正職。

曾經在雄獅資訊跟天下學習任前端工程師

雄獅

主要工作是切版、動畫、解決跨裝置問題、配合後端串接資料，熟悉HTML5、Javascript、RWD ...等技術，有使用Grunt編譯 scss 並自製jQuery plugin建立模組。

天下學習

主要負責部分行銷案、天下學習平台即cheers快樂工作人部分維護即開發

行銷案跟cheers快樂工作人只要用php(有Laravel) 跟 Javascript 來開發

天下學習平台主要是用vue2 ，nuxt.js 來開發製作

緯創軟體

目前駐點在緯創資通
負責BPM 電子簽核系統並撰寫內外部測試腳本與SOP 。
主要用AgilePoint 開發BPM簽核流程與表單。

使用工具有 javascript 、jQuery、CSS、SQL、.net 、Angular。

我是一位樂觀又喜歡挑戰自我的人，在工作上認真負責，對於每個專案都會努力去完成需求者的需求，有空閒時會去學習新技術來充實自己，曾經用Angular切版跟製作動畫，對於新的技術永於接受挑戰，希望在未來能在貴公司發揮所長。

新北市
[email protected]

專業技能

前端

HTML5

CSS / CSS3 / Sass

RWD

Javascript

jQuery

ES6 / ES5

compass

AJAX / JSON

Webpack

Grunt

版本控管

SVN、GIT

其他開發工具

webstorm

Sublime

vscode

Photoshop

Illustrator

Abode XD

zeplin

figma

工作經歷

2015年4月~2015年6月，雄獅資訊科技實習生

用webstorm後轉sublime 來撰寫 CSS / Sass/Compass、製作RWD以及jQuery、javascript開發網站。

2015年6月畢業轉為正職擔任前端網頁架構師

任職期間負責過活動案、FotoEXP平台的切版(協助)、雄旅網的機票館即團體館的平台以及電子報開發。

活動案

這部分主要是畫面的呈現、動畫、遊戲，活動案都是獨立開發完成，動畫大多使用 css3 或是 jQuery、javascript來作呈現，遊戲則是用canvas 或是 javascript。

平台案

FotoEXP 是一個社群照片分享網站，我負責畫面顯示以及動畫部分
雄旅網(雄獅旅行社官方網站) 機票館跟團體館，開發方式為把網頁所有功能及樣式模組化(例如:選單、輪播...等) ，而功能都改為自製的jQuery plugin開發，開發完成後用webpack打包交付給後端套版，而版本控管用Git來掌控專案開發進度。
後期有使用過React開法過模組 (下方的 下拉選單 以及燈箱)

電子報

負責過活動案的電子報的切版。

2021年9月~10月天下學習擔任前端工程師

任職期間負責部分行銷專案、天下學習平台跟cheers快樂工作人開發及維護，天下學習平台使用 vue + nuxt.js來開發，行銷活動案使用php(Laravel) + jq 來開發。

2022年01月~現今緯創軟體

1.駐點在緯穎科技擔任助理工程師

主要用AgilePoint來開發申請/簽核表單及流程

(AgilePoint 為Microsoft平台開發了第一個全面性的BPM技術，除了可以建立表單簽核流程外，還可以建立非表單的組織邏輯、程式邏輯及商業邏輯。並可整合異質系統，做一次性自動化。)

實作方式：

使用AgilePoint 拉製申請單/簽核單，並使用CSS 美化表單排版、利用JQ來做表單收合，完成後直接開發流程。語言:CSS ,JQuery,SQL

參與過專案

1.Business Card Application: 設計申請單及簽核單且完成開發測試。

2.USB Storage Access Application(新增需求 ): 新增需求簽核單並完成開發測試

3.Business Card Application 、ITSR、EAP簽核單頁面優化

4.e-Sign使用者手冊(中、英) PPT

5.WriteOffGitForFree: 設計簽核單級開發測試

2.緯創資通擔任軟體工程師 (目前在此駐點)

主要用AgilePoint來開發申請/簽核表單及流程、使用.net +Angular 製作報表、維護線上所有簽核專案跟協助開發Agilepoint

報表主要更能分為

1.讓承辦人新增刪除各Site 的承辦人

2.看個單子目前流程狀況

3.根據專案需求是否有特別維護資料

參與過專案

1.開發: 國內差旅、貨運叫車

2.維護: 公務用行動電信、派車四個單子(臨停、租車、私車公用、公務車)、外訓申請、名片申請、喜奠賀慶、文具申請、印刷品、廢棄物申請 ....等

3.協助其他Site 的 IT 開發Agilepoint 專案

作品集

使用React 製作功能

以下網站皆有RWD，使用 HTML5 、CSS / CSS3 / Sass、Javascript、 jQuery 、canvas 做開發

2023

與設計(外包接案)

https://andbrdesign.com/

主要用Angular 去做開發，部分動畫使用lottery 去作呈現

2021

天下學習平台

https://www.cwlearning.com.tw/

2020

幸福。森在其中 In the Forest

https://www.foresttourbus.com/

高雄好行 E起遊雙線

線上帶你遊高雄2條「台灣好行」路線，「大樹祈福線」、「哈佛快線」可直達世界級佛教聖地佛陀紀念館，深入風景秀麗的宜居小城大樹區。

https://event.xinmedia.com/taiwantrip-kao/

老司機帶路重慶武隆全攻略

https://www.chongqing.com.tw/wulong.aspx

2019

宜蘭City Tour 國際學生宜探究竟活動

http://event.xinmedia.com/yilantour_student/

2019河南聽旅人說故事

http://www.henan.com.tw/feature/2019expert/

黃山官網

【天地一幅畫‧樂遊黃山】如詩如畫的奇景，你人生必造訪的地方。

https://www.huangshan.com.tw/

皖如初衷說好的旅行

http://www.anhuitravel.com.tw/event/go_on_Anhui/

五彩斑爛‧耀眼黃山

http://www.huangshan.com.tw/special_features/5color/

成語故事遊安徽

http://www.anhuitravel.com.tw/Special_Features/historystory/

冬戀黃山

http://www.huangshan.com.tw/special_features/winter/

201∞杭州旅遊夢交換

https://www.gotohz.com.tw/feature/postcrossing/?utm_source=xinchinafb&utm_medium=fbpost&utm_campaign=xinmedia

2018

Paragraph image 03 00@2x a10257c22ab8b43ba541f7170ecfbbafea76718648ab6504b9015d9950ed2250

2018河南徵選旅人徵選

http://www.henan.com.tw/feature/2018selecting/

首頁動畫利用 css3的 animation 來製作，讓網頁看起來更有互動性，而參賽名單利用瀑布流的方式，讓版面看起來更豐富。

安徽小天使

http://www.anhuitravel.com.tw/event/angel/Default.aspx

小天使的部分除了利用css3的animation來製作外，也使用了jQuery 來做輪播相片的方式展現每一張相片。

Paragraph image 02 00@2x cb1a9cce8ec2420576e7f93d4a97d2663cb38d3060b7943702140d7f6da9f81e

2018清新福建遊你好運

http://www.fjta.com.tw/event/lucky2018/

清新福建特效最為費工的部分為左右兩側拉霸，使用css3 animation 動畫做出，進場跟出場動畫以外，並利用jQuery套用數學公式算出何時該啟動、停止、離開。

杭州新樂點

專題(右圖): http://www.gotohz.com.tw/feature/g20/HangzhouCBD/

活動(左圖): http://www.gotohz.com.tw/
feature/g20/game/

專題部分，利用css 2D 翻轉將文字呈現以及jQuery算出視窗的到一定高度使內容慢慢浮現，讓使用者能夠一眼明瞭。

活動的部分，在杭州最受喜愛的杭州新樂點j那塊用Query 的動畫業來展現換頁功能。

Paragraph image 04 00@2x 0a60eca693a10c928b852fbc59ecb80f69e59f0d26acd4c74f39c7f256369567

Paragraph image 04 01@2x d7b528f9ab8e34777562695011fbbc2a4f3f28d8b47f4c8e57ee7c3410afdfa8

耀眼欣生代

http://event.xinmedia.com/XTPA/

除了css3 動畫，同時也利用Transitions轉換時間效果以及位置移動，展現出俐落的效果。

2017

廈門特派員

青春一廈，除了一些小部分 css 動畫以外，使用fullPage.js 套件做出每個區塊為一頁式滾動。

成為人氣玩家，利用css 多種位直、時間差、以及放大縮小，讓整個視覺效果更為豐富

青春一廈(左圖): http://event.xinmedia.com/xiamen/2017

selecting/

成為人氣玩家(右圖): http://event.xinmedia.com/xiamen/2017bestplayer/

夏日遼寧風華絕代話古今

http://www.liaoning.com.tw/event/2017summer/

第一次使用大量的css動畫2D翻轉、淡入淡出、位置移動、時間差 ...等，還有一些css3 動畫跟 jQuery 計算出物件大概位置並套入一些css動畫。

達人旅遊武隆

http://event.xinmedia.com/chungqing_wulong/

除了 jQuery輪播動畫跟animation 以及Transitions轉換時間效果以外，第一次嘗試用js寫出滑鼠滾輪的動畫，讓視覺有被打開東西的效果，也嘗試在頁面放入影音，增添一些不一樣的元素，而下面景點介紹更是利用mouse 事件以及 touch 事件，來記錄前後位置達到觸控效果，並且下面拉霸也要同步定位在相對位置。

2016

攝群網站

https://www.liontravel.com/event/photo_network/

第一次製作用jQuery一屏的輪播，讓視覺更開闊，裡面的參賽作品第一次嘗試使用瀑布流以及css 放大縮小來展示每張相片的美感。

開心Fun暑假

https://www.liontravel.com/
comm/2dom/hotsale/summer/

第一次嘗試一小塊主視覺動畫，利用css3 animation，來做出有跳動的效果。

感謝您看完這份履歷

與我聯絡:

[email protected]

陳昱安