鐵人檔案
這次的鐵人挑戰的是，研究資訊設計的遊戲為互動載體。在這三十天會整理，目前台灣在資訊設計裡的互動遊戲，去分析網頁遊戲如何成為資訊設計互動載體的選項，並主要探討前端方面的實作
圖文不符推出兩個卷軸式遊戲，《全能古蹟燒毀王》 與 《奔跑吧!台北》 全能古蹟燒毀王 議題 表達出因土地利益，台灣一些珍貴古蹟，在半夜忽然被縱火燒掉，文化保存...
讀取 sprite sheet 並產生動畫，介紹兩種方法: css animation 與 canvas 這裡示範使用的 sprite sheet，是使用六角學...
拿昨天的動畫 sprite function 示範用 prototype 和 es6 的 class 重構 Prototype 步驟1.建立時呼叫⺟類別 (初始...
Demo 用到的 canvas 技巧 ctx.save( ) //儲存當下座標狀態 ctx.restore( ) //還原上⼀個儲存的狀態原則 - 先進後...
簡易的切換場景(使用滑鼠 click 事件) var currentScene = 1; var sceneDraw; // this is the only...
今天花點時間研究昨日的切換場景，寫個簡易的場景管理器 簡易場景切換 Demo with ScenesManager 1.製作一個場景為四方形的物體場景 func...
在開發互動式網頁裡，可以外掛 Dat.gui 直接調整程式內部的變數，便於開發與測試 起手式 var gui = new dat.GUI(); var cont...
改寫原本的 Day 06 的 ScenesMangerswitch scence with ScenesManager by ts private: 私有屬性...
改變刺蝟的方向 Demo (function() { var hedgehogImage, canvas; class sprite { co...
const keydown$ = Rx.Observable .fromEvent(document, 'keydown', e =>...
