Interactive Priority Mapping

把任務清單轉成一個可操作的決策畫布

Kinetic Priority Canvas 以力導向模擬呈現任務優先級,讓待辦排序不再只是靜態列表。 你可以直接輸入任務、拖曳位置、篩選優先級、編輯細節,並把整個狀態匯出成可分享的 JSON。

Product Snapshot
Drag 以物理感操作優先級球體,快速聚焦討論中的任務。
Filter 用滑桿篩出高優先任務,讓畫布只呈現當下需要的訊號。
Export 保留名稱、優先級與位置,方便 demo、handoff 或資料保存。

為什麼這個介面適合展示優先級系統

一般待辦清單擅長記錄,不擅長呈現張力。這個畫布把任務權重轉成大小、位置與碰撞行為, 更適合作為作品集展示、產品概念頁,或內部工作流程工具的原型。

視覺化決策

高優先級任務球體更大、更容易被感知,讓畫面本身就傳達排序。

互動式探索

拖曳、聚焦、刪除與編輯都在同一頁完成,不需要切換多個工具視圖。

適合公開展示

首頁與模擬器共存,既能說明產品定位,也保留實際可操作的核心體驗。

核心功能

保留原本互動模擬器,並把對外展示需要的資訊架構一起補齊。

多筆任務快速輸入

使用 `任務名稱, 優先級` 格式批次建立球體,適合 demo 與工作坊現場操作。

任務編輯與聚焦

從清單或畫布選取任務後可直接修改名稱與優先級,並讓該球體回到視覺中心。

JSON 匯入匯出

將互動結果儲存為可讀 JSON,方便版本保存、示範資料切換或跨裝置分享。

Live Demo

首頁即為可用的模擬器展示區。這裡保留原始互動核心,並重新整理為可公開展示的產品化區塊。

Physics Canvas

高優先級球體半徑更大,模擬器會將整體任務群吸向展示區中心。

How To Use

使用方式

這個專案是純靜態頁面,不需要建置流程;直接開啟 `index.html` 或用 GitHub Pages 即可操作。

1 輸入任務

每行一筆,格式為 `任務名稱, 優先級(1-10)`。

2 操作畫布

拖曳球體調整位置,點擊可聚焦,雙擊可刪除。

3 篩選與編輯

用滑桿只顯示高優先級任務,並從左側編輯器更新內容。

4 保存狀態

資料會寫入 localStorage,也可匯出或匯入 JSON。