Selected Projects

用作品說明取捨與結果

以下先以三種前端情境呈現案例版型。專案敘述刻意不捏造公司、客戶或量化成果,之後可替換成能公開的真實資料。

每日行程時間軸介面示意圖

Productivity · PWA

Daily Schedule

如何讓每日行程、待辦與時間軸在手機與桌機上都能快速理解,並在網路不穩時維持基本可用性。

實作重點
規劃響應式時間軸、狀態更新與靜態 PWA 快取策略。
成果方向
建立可安裝、可離線且適合快速操作的日程介面範例。
  • JavaScript
  • PWA
  • CSS
  • GitHub Pages
企業入口儀表板介面示意圖

Enterprise · Angular

Enterprise Portal

企業入口通常包含多個模組、權限與共享元件,需要明確分層才能控制長期維護成本。

實作重點
拆分核心服務、共享元件與功能路由,建立一致的介面與錯誤處理方式。
成果方向
示範可擴充的 Angular 前端結構與一致的產品操作體驗。
  • Angular
  • TypeScript
  • RxJS
  • SCSS
文件預覽工作區介面示意圖

Document · Performance

Document Workspace

高解析度文件預覽容易遇到畫質、記憶體與行動裝置效能之間的取捨。

實作重點
設計漸進式渲染、縮放狀態與適合觸控的文件操作介面。
成果方向
呈現兼顧清晰度、載入回饋與跨裝置操作的文件工作區。
  • Angular
  • PDF.js
  • Canvas
  • Responsive UI