鐵人檔案
大家好，我是機器人幽默研究員，簡稱機默 (Jim)，一名熱衷於前端開發和數據視覺化的工程師。今天，我想與大家分享一個 30 天的 side project 旅程，題目是「打造紐時風格的時間線小遊戲」。
為什麼選擇這個主題呢？紐約時報（New York Times）以其高質量的敘事和視覺效果聞名，特別是在他們的互動數據報導中。我一直對這種結合敘事和數據的方式感到著迷，並希望能夠模仿這種風格。
接下來30天，我將分享我所遇到的挑戰、解決方案，以及有趣的發現。
希望大家會喜歡這個旅程，也期待您的反饋和建議。讓我們一起學習和成長！
前言 「讓我們的想像力帶領我們穿越時空，回到恐龍盛行的年代。在那片遼闊的草原上，一隻壯觀的阿根廷龍正緩緩行走。科學家的研究告訴我們，這種恐龍的體重高達77公噸，...
Side Project 需要什麼輔助工具與概念 對於前端工程師而言，大多已擁有一套熟悉的編輯器和版本管理工具。但在工作之餘投入創作 side project...
「時間線任務」這個 side project 是受到紐約時報的「Flashback: Your Weekly History Quiz, August 13,...
一個全面的設計流程：從初步設計到最終階段 草稿和低保真（Low-Fidelity）線框圖：初步構思並繪製基本界面。 回顧和反饋：收集意見並進行調整。 高...
專案使用到的工具整理 終端工具（Terminal）: Mac 系統下的內建工具 Cygwin: Windows 系統下的 Unix 模擬工具 Node....
開發工具和編碼習慣 在開始專案開發的過程中，我們會使用各種相依工具來輔助開發。這些工具有的是運行時必須的，例如 Vue，而有的則是僅在開發過程中使用，例如 ES...
可維護的程式碼原則 我們有很多的方法可以用程式實現我們的功能，但作為一個工程師是否寫出可維護的程式碼在於自己，卻往往對於團隊有很大的影響。好的程式碼不會有績效，...
說明 理想的狀態是在開始程式開發之前，首先明確定義專案需求並撰寫相對應的測試案例。接著，我們採用「紅燈/綠燈（Red/Green）」的測試驅動開發（TDD）策略...
切版主要是將 Wireframe 轉換為 HTML 版面，而功能和色調在沒有 style guideline 的情況下我們參考原始網站。總共需要製作三個頁面：遊...
