兩年前小孩高中時要幫老師用Word做一個座位表，後來跟他說用Excel比較合適，也能寫巨集做隨機座位，但這又太過複雜，用公式又很長，所以弄了一個網頁版的座位表，最近又改良一下分享給大家...
SeatingChart，這是個純前端的學生座位表網頁程式，完全不用安裝軟體，直接在瀏覽器就能用！它是用 VueJS 3 和 Bootstrap 5 寫的，介面簡潔又直覺，特別適合國小、國中、高中教室管理。無論是電腦還是手機操作也沒問題，隨時隨地都能調整座位。無論是隨機分座、拖拉調整，還是備份資料，都一手包辦。讓我來簡單介紹一下，保證讓你愛上它～
(圖片來源：SeatingChart 專案截圖，展示完整的座位表編輯畫面)
為什麼推薦這款工具？
傳統座位表要用 Excel 或手繪，改來改去超麻煩，尤其開學季分班時更頭大。但 SeatingChart 解決了這些痛點，它支援即時編輯和儲存，資料直接存在瀏覽器的 Local Storage，還能匯出 JSON 檔備份。重點是免費、開源，誰都能用！手機上也能輕鬆拖拉座位，觸控操作超順手。主要功能大公開
這裡列出幾個亮點功能，讓你一眼看懂：- 定義排列數輸入資料：先設定教室的行列（如 6 排 8 列），就能快速建立空白座位表。
- 點選編輯模式：點擊姓名或座號，就能直接輸入學生資料，超直覺！
- 貼上名單功能：有班級名冊？直接複製貼上，一鍵匯入，省時省力。
- 隨機座位安排：開學分組？一鍵隨機分配，公平又有趣。
- 拖拉交換座位：不喜歡現在的排列？用滑鼠或手指拖拉就能換位，視覺化操作零負擔。
- 點名功能：名單上的 checkbox 讓你輕鬆點名，標記出席情況，一目了然。
- 文字縮放與字形調整：支援放大縮小文字，還能切換注音、拼音或兩者都有，適合華語教學。
- 抽籤（Bingo）功能：課堂互動時來個小抽獎，增加樂趣。
- 列印功能：一鍵列印座位表，方便直接印出來貼在教室牆上。
- PDF 轉換：輕鬆匯出為 PDF 檔，適合分享給家長或存檔使用。
- 資料備份：下載 JSON 檔存檔，或上傳舊檔繼續用，永不遺失。
這些功能讓整個座位管理變得像玩遊戲一樣簡單，單機使用超方便，也可以分享連結給同事，讓大家各自輸入資料來管理座位表。
如何上手？30 秒入門指南
- 開啟工具：直接點擊 SeatingChart 網頁，瀏覽器就能跑起來（支援 Chrome、Firefox 等主流瀏覽器，手機瀏覽器也 OK）。
- 設定座位：進入後，輸入行列數（如 5x7），點擊確認建立表格。
- 輸入資料：複製班級名單貼上，一鍵匯入，幾秒鐘就搞定；或手動點擊每個格子填入姓名/座號。
- 調整與儲存：用拖拉隨機試座位，滿意後自動存到瀏覽器；想備份就下載 JSON。
- 進階玩法：試試 Bingo 抽籤，或調整字形來適應不同年級。還能直接列印或轉 PDF，超實用！
整個過程零學習曲線，新手老師絕對 OK！尤其是貼上名單安排座位，真的只要 30 秒左右，就能快速上手。如果教室很大，還能縮放文字大小，眼睛不累，尤其在手機上操作時更靈活。
小結與心得
用過後，我覺得這工具不只實用，還能讓座位安排變成有趣的互動過程。尤其對同學來說，座位一目了然，課堂溝通起來更順暢。如果你也是老師或同學，歡迎試用看看！覺得好用，記得分享給親朋好友，讓更多人受益～有什麼使用心得或建議，樓下留言討論吧～有問題我也可以試著解答。工具連結：https://tyroneyeh.github.io/SeatingChart
GitHub 專案（想看原始碼的工程師們）：https://github.com/tyroneyeh/SeatingChart
YT 操作說明：
期待大家的回饋！👍
