董翠峰 |Tracy Tung

網頁前端程式 | 網頁前端設計 | 介面設計

有四年以上的前端設計經驗,目前正在自我學習前端語法,曾經在不同產業有設計以及前端協同合作的經歷。 希望能將「程式」以及「設計」結合,設計出更多有趣的作品。


技能


Web Layout

HTML5 / CSS3 、Bootstrap 5 、RWD 手刻網頁版面 、

使用GitHub上傳、網站 SVG 動畫



JavaScript

熟悉 JavaScript 基礎語法、 學習ES6程式語法 

AJAX/JSON串接第三方API 

使用jQuery做出網頁互動效果


Vue

使用Vue-Cli開發專案 、使用Vue-Router套件管理專案路由 

使用Components管理員件 

加入Vue第三方套件 (Vuetify、vue-loading-overlay)


Design

使用Figma、Sketch設計UI介面 

使用AI、PS進行平面設計 

使用Zeplin跟工程師進行協同合作

工作經歷

2020-2022 ECS 精英電腦

ECS 精英電腦 UI Designer & 前端設計

Pretso 品牌官網 

公司進行新品牌「Pretso」官網規劃以及前端設計。為增加網站互動性以及使用者體驗, 網站使用SVG動畫互動,並且以創新故事流的方式呈現案例說明。


充電樁管理平台 

使用Figma進行協同設計,建立使用者情境分析以及Design Guideline設計。


國光客運智慧車載管理系統 

接觸到「Vue.js」前端框架,並且與團隊工程師一起進行前端開發。使用Azure Devops 程式編輯協同合作


Company@2x

2018-2019 集智顧問公司 

UI Designer & 前端設計 

官網 & Logo CIS設計 為公司進行官網設計以及Logo CIS 設計。

因建立公司官網更加熟悉前端框架「Bootstrap」。 

 快速設計開發 因應公司需求時常進行快速設計提案,更加熟悉介面設計軟體像是Sketch以及快速設計方法(建立componets)。

Company@2x

2017-2018 亞果元素 

UI Designer & 網頁前端設計 

接觸到前端的領域,負責商品網頁的前端程式執行。和網頁設計師使用zeplin溝通,完成不同裝置的響應式網站設計。同時期也曾參與app-iKlips(上架於App Store) 製作,使用Sketch進行協同設計。

Company@2x

2016 資策會「互動式UI/UX網頁設計班」

第 47 屆資策會「互動式UI/UX網頁設計班」在結訓專案中擔任整體網站主視覺設計以及部分頁面網頁前端程式撰寫以及 php 資料串連。

Company@2x

2014 - 2016 淡江大學 資訊傳播學系


Company@2x

網頁專案

更多作品歡迎到我的個人網站觀看
Paragraph image 01 00@2x


Scented Candel電商網站(Vue作品)

Vue 3 & Vue CLI 開發的電商網站購物。使用者可以進行購物,另一方面管理者可以在後台系統進行商品管理,像是「商品上下架、文章管理、優惠卷管理...」功能。

Paragraph image 01 00@2x

Pretso 官方網站

SVG動畫互動網站,使用BS4 框架以及jQuery。使用創新故事流的方式來增加使用者互動,運用大量的SVG動畫。在此專案中擔任網頁前端程式撰寫以及網頁協同設計。

Paragraph image 01 00@2x

FLEET LensPro

使用BS4進行網站前端撰寫,並且用Zeplin跟網頁設計師進行溝通。,因應不同產品做出前端視覺特效。

Paragraph image 01 00@2x

Omnia Q1

使用BS4進行網站前端撰寫,並且用Zeplin跟網頁設計師進行溝通,因應不同產品做出前端視覺特效。


UI專​​​​​案

Paragraph image 01 00@2x


Pretso 充電樁管理平台

充電樁案場監控。掌握當下案場的充電狀況,異常時第一時間了解。

Paragraph image 01 00@2x

Pretso Charging App

電動車車主專用 App。快速預約附近充電格,並建立會員制度。

Paragraph image 01 00@2x

茶癮

出門購買手搖飲不會再忘記集點卡,並第一時間掌握最新優惠資訊。

- 每一段經歷都是珍貴的反饋 -

職場過程中,透過每一段學習經歷及反饋,從網頁設計,涉獵到前端程式的領域中,深知要持續學習並精進自身的技能,

才能在科技產業中與時俱進。希望能將技術為基底的「程式」及視覺感官為框架的「設計」結合,

創造出富有美感與功能兼具的作品。