B3dbf1axhfu5opq0g2t7

林純如 Ruby Lin ( Front-End Developer )


        擔任網頁前端工程師，負責網站介面和互動功能開發，擅長以使用者角度出發設計規劃產品，樂於接受回饋進一步優化。能自主學習並快速實用，喜於接觸各領域新知，具好奇心，不排斥接觸陌生領域。畢業後原從事醫療業，後來在創業中接觸到寫程式的樂趣，在轉換跑道的過程中，選擇進入了前端開發。逐步解決問題的過程充滿挑戰性，喜歡完成作品的成就感，在專案中培養了良好的跨團隊合作與溝通能力以及可完成獨立作業的特質，前端領域是快速變遷產業，在生活裡我時時學習最新的技術並不放棄任何自我成長的機會，隨時精進自身能力並跟進新知。


    0960-291914                                      

[email protected]

    Taipei , Taiwan

技能

Front-end

  •    HTML5
  •  CSS / SASS / SCSS
  •   RWD ( Flex / Bootstrap)
  •    JavaScript (ES6) / JQuery
  •   React / Redux
  •   Vue / Vuex
  •   Angular / TypeScript

Back-end

  •   Node.js / Express
  •   PHP
  •  Python / Flask
  •  MySQL 

Others
  •   Git

工作經歷

德義資訊股份有限公司 / 前端工程師  2020 / 01 - Now

  • 協助PM與團隊溝通，根據客戶需求與後端團隊討論可實作的程式規劃、架構及wireframe。
  • 與設計師合作，主導網站新功能的介面設計與互動體驗。

  • 負責前端頁面：包含互動、RWD( 行動端、電腦端頁面 )、Restful API設計串接及功能開發，並導入前端框架 ( Angular10 ) 於公司專案使用。
  • 能根據客戶原有架構、Coding Style 維護程式碼及撰寫新功能，快速融入團隊風格。

  • 與後端團隊一起定義 API 規格、測試 、部署流程，根據需求改變因應情況重新調整方案。

  • 負責測試及串接第三方合作公司所提供API，並導入使用於專案中。

壞主意實境密室工作室   Co-Founder / 遊戲體驗設計，2016 / 02  - Now

  • 遊戲主題設計及發想 ： 針對不同客群及消費者體驗需求找出適合開發的主題，並尋求容易實現設計概念的實作方式，以提供消費者完整體驗服務。 

  • 以 C 語言撰寫 Arduino 程式，串接各式模組功能，用於自動控制電子機構和聲光效果。

  • 和夥伴互相審視計畫，評估開發的可行性、確認優先順序並控管時程。
  • 管理與訓練新進人員維持工作室運作。

亞東紀念醫院    醫檢師，2011 / 01 - 2016 / 05

學歷 / 專業訓練

財團法人資訊工業策進會 / 前端工程師就業養成班 ，2019 / 06 - 2019 / 12

中國醫藥大學 

作品集

壞主意工作室 - 那些年，我們一起的戀愛滋味

  • 使用技術：Vue  /  Vuex，配合 WebSocket 與 PHP 串接 
  • 首創全手機引導進行的城市闖關實境遊戲，導入PWA技術開發，實際參與遊戲設計，製作前端介面及功能開發。
  • 根據UI設計師圖稿製作頁面，並討論優化方式。
  • 配合手機裝置設計多種互動模式：
          -  地理位置定位 ( Geolocation ) 配合leaflet地圖，設計尋寶關卡。
          -  陀螺儀 ( Devicemotion )配合體感動作，設計跳舞、拳擊等。
          -  觸控事件 ( Touch Event ) 設計刮刮樂關卡。

Paragraph image 00 00@2x

德義資訊 - 即時視訊會議及案件管理系統

  • 前端：Html / SCSS / JQuery + Bootstrap   串接  Java API 
  • 以 WebRTC 為核心，多對多即時視訊提供團隊進行遠端會議。
  • 即時視訊會議：
        -  可預先設定參與成員或由主持人同意後加入。
        -  支援手機、平板、電腦使用，根據參與成員人數改變視窗佈局。
        -  提供分享桌面以及靜音、暫時關閉視訊畫面等視訊功能。
        -  針對會議過程進行錄影，作為重要會議或申請案件
  • 案件管理系統：提供基本後台功能，可即時監控會議狀況、生成工作報表、編輯會議成員...等。

Paragraph image 00 00@2x

德義資訊 - OO銀行 申請上傳證件及辨識

  • 前端：Vue  / Vuex 
  • 擷取影像圖片，配合OCR文字辨識，減少用戶負擔並提升申請速度。
  • 以 WebRTC擷取圖片後， 文字辨識驗證欄位資料正確並帶入。
  • 配合Canvas可進一步編輯圖片，放大、旋轉、位移、裁切，增加上傳圖片的品質，避免用戶被退件。 
  • 提供給多種行動端裝置使用包含：Android、Android (多鏡頭)、IOS、IOS放大模式......等等。

Paragraph image 00 00@2x

德義資訊 - 實質受益人批次查詢系統

  • 前端：Angular 10 / TypeScript  串接 Java API    
  • 以「 經濟部工商登記公示資料 」為來源，提供客戶快速查詢公司股東佔股比資料並生成圖表，也可自行加入更新資料。
  • 提供基本後台功能，可即時監控會議狀況、生成工作報表、編輯會議成員...等。
  • 將個功能切分為components，配合directives重複利用。
  • 使用Service保管資料，減少重複查詢的時間。
  • 利用響應式表單自訂驗證器做表單驗證。

Paragraph image 00 00@2x

德義資訊 - 視訊客服及客戶驗證

  • 前端：Html / SCSS / JQuery    串接  Java API  ＋ 部分 J S P
  • 以 WebRTC 為核心，開發即時視訊作為申請業務的身份認證系統。
  • 透過點對點視訊提供客服服務並串接合作夥伴API進行線上身份驗證
           - 文字辨識 OCR ( Penpower Technology - Optical Character Recognition ) 
           - 人臉辨識系統 ( ThinkCloud - FaceID )
           - 影像電子簽章 ( ThinkCloud - SelfieSign )
  • 此專案參與科技黑客松多元數位身分認證競賽。

Paragraph image 00 00@2x

德義資訊 - 台O電智慧燈控及室內定位系統

  • 前端：Html / CSS /  JQuery   後端： Python + Flask
  • 根據台O智慧照明系統( DELTA BIC Zone ) 開發 Web 版本，以 Python 與燈具的藍芽連線，控制燈具開關、亮度、色溫、情境及定時關閉。 
  • 製作前端 RWD 介面 和按照使用情境設計流程及優化。
  • 編寫 Python API Controller 回傳資料，於前端串接API呈現頁面。
  • 設計室內定位演算法：搭配 Beacon 定位系統，參考藍芽室內定位相關文獻，收集各種情境中裝置資料及排除極端資料，在辦公室、庫房作為貴重物品追蹤及人員管制系統。

Paragraph image 00 00@2x
個人作品

Paragraph image 01 00@2x

品書 - 書評社群網站

  • 前端：React / Redux + RWD 切版 ( Bootstrap / Material - UI ) 
  • 後端：Node.js / Express / MySQL
  • 以提供書評為主體的讀書社群平台為核心，利用駐站書評家以及討論區的留言等等，讓愛書人能與同好討論交流。
  • 負責開發討論區功能，包含發布文章、文章編輯、會員留言及點讚
  • Ｍedium 風格的 HTML文本編輯器，能輸入文字、分段、插入影片或圖片，或是使用串接的unsplash圖庫增加圖片於文章中。
  • 後端設計 Restful API 管理文章資料新增、讀取、刪除、修改。

Paragraph image 01 00@2x

品書 - 廠商後台管理系統

  • 前端：HTML / CSS / JQuery    
  • 後端： PHP / MySQL
  • 負責開發後台會員資料管理系統，能進行搜尋及分頁。
  • 包含會員註冊、查詢、刪除、密碼更新、上傳頭像、編輯頭像 ( 放大、旋轉、裁切 ) 等功能。
實境密室遊戲作品：

Paragraph image 01 00@2x

壞主意工作室 - 密室實境遊戲

  • 於2017及2019分別推出腦細胞入侵及冥古屋兩款實境密室逃脫遊戲，已累積超過10,000名付費玩家，預計2022於推出新遊戲。
  • 以程式配合機關為設計特色，在各平台得到4.8星滿意度，包含售票平台 NiceDay 、 Google 評論、及 FB 等。
  • 親自負責遊戲體驗設計、遊戲謎題發想、機關程式Arduino設計、測試及實體機關安裝及實做跟場景美術製作。