築心相簿使用者與管理員操作手冊

簡單、極速、手機友善的活動成果影像庫。採用 Google Photos 極簡設計哲學，結合全自動 WebP 高壓縮管線與訪客時間限制上傳機制。

📱 Mobile First ⚡ 雙規格 WebP 管線 🛡️ 防機器人驗證碼 📦 一鍵打包下載 ZIP (JPEG) 🌐 PWA 離線支援

PWA 行動裝置桌面安裝

築心相簿支援 PWA（Progressive Web App）標準，無需透過 App Store 或 Google Play 下載，即可將相簿捷徑安裝至手機主畫面，享有如同原生 App 的全螢幕體驗。

🍎

iPhone / iPad (iOS Safari)

1. 使用 Safari 開啟相簿首頁。
2. 點擊瀏覽器底部的「分享」圖示（帶箭頭的方框）。
3. 在選單中向下滑動，點擊「加入主畫面」。
4. 點擊右上角「新增」即完成安裝。

🤖

Android 手機 (Chrome)

1. 使用 Chrome 開啟相簿首頁。
2. 點擊右上角選單「⋮」。
3. 選擇「安裝應用程式」或「加到主螢幕」。
4. 系統將自動生成專屬圖示並置於主畫面。

相簿瀏覽、立體質感與全螢幕燈箱體驗

相簿首頁以質感微立體卡片風格呈現所有公開相簿，背景採低飽和度暖灰柔和配色，瀏覽舒適無負擔：

🖼️

立體浮雕感相簿卡片

相簿封面卡片具備微立體浮雕陰影與層次感，滑鼠懸停 (Hover) 時以細緻陰影與輕微上浮呈現回饋，外觀高雅且自然。

⚡

漸進式極速縮圖載入

網格預設載入 400px 高品質縮圖（平均僅 20KB~40KB），即使相簿內有上百張照片，亦能在行動網路下一秒呈現，不消耗多餘手機流量。

🔍

全螢幕 Zoom 縮放展開燈箱

點擊任意相片以平滑的 Zoom 縮放展開動畫 進入全螢幕燈箱，自動載入 1200px 高畫質大圖，並在背景預先加載前後相鄰兩張相片，切換毫無延遲。

🔒

純粹乾淨的瀏覽體驗

一般民眾瀏覽公開相簿與照片時，介面完全不顯示或透露任何投稿相關字詞，保持畫面整潔純粹。

手機觸控手勢與快捷操作

💡

支援手勢與快捷操作：
• 手機下滑關閉：在全螢幕燈箱中，單指往下滑動即可順暢退出檢視。
• 左右水平滑動：支援觸控左右撥動，無縫切換上一張／下一張相片。
• 電腦鍵盤支援：支援方向鍵 ← → 切換，以及 ESC 鍵隨時關閉。

專屬投稿頁面、前置門檻與操作流程

為方便活動現場志工、家長與工作人員集中上傳花絮，本相簿設計「免登入獨立專屬投稿網頁（/upload/{token}/ 或 /upload/?token={token}）」，具備雙重前置防護：

掃描專屬 QR Code 或開啟專用投稿連結

活動工作人員掃描由管理員提供的活動專屬 QR Code 或點擊投稿網址進入獨立投稿頁面，確認相簿名稱與開放狀態。

強制勾選【相片授權使用與無侵權聲明】

上傳者必須詳細閱讀並勾選聲明，同意無償授權活動成果紀錄使用，並保證絕無侵犯他人著作權、肖像權或隱私權爭議。

輸入 4 碼防機器人圖形驗證碼（即時核驗）

輸入右側 GD 生成之 4 位英數字驗證碼（輸入完成後系統即時在背景驗證並亮起綠色勾號 ✓ 驗證碼正確）。若字元不清晰可隨時點擊圖片更換。

解鎖上傳區域並選取照片

同時完成「授權勾選」與「驗證碼正確」後，照片選取區域自動解鎖；若未完成雙重條件，點擊選取區將被攔截並引導聚焦至未填寫欄位。

預覽縮圖與點擊外部獨立按鈕上傳

選取相片後可即時預覽縮圖、檢視單張大小、移除單張或一鍵清空；確認無誤後點擊卡片外部獨立的「上傳Ｘ張照片」按鈕開始上傳，傳輸過程請勿關閉頁面。

支援與禁止檔案格式規範

為維持伺服器長期穩定運作（10GB 主機環境）與最佳瀏覽體驗，本系統具備嚴格的相機攝影檔案類型白名單：

格式類別	副檔名與類型	系統狀態	轉碼處理方式
JPEG / JPG	.jpg, .jpeg (相機 / Android)	允許上傳	讀取 EXIF 1~8 全規格轉向校正，轉碼為 Full / Thumb WebP，隨後銷毀原始檔案。
HEIF / HEIC	.heic, .heif (iPhone 預設相片)	允許上傳	透過 Imagick 解碼轉向並轉為 Full / Thumb WebP，隨後銷毀原始檔案。
WebP	.webp	允許上傳	標準化雙尺寸縮放（1200px / 400px），不放大原始檔案。
無損/非相機圖檔	.png, .gif, .bmp, .tiff, .svg	嚴格禁止	系統前後端雙重拒絕。PNG 等無損圖檔體積過大且非相機標準照片，禁止上傳以保護伺服器空間。
所有影片格式	.mp4, .mov, .avi, .mkv 等	嚴格禁止	本系統定位為純相片庫，全面禁止上傳任何影片。

單本相簿容量與張數配額

⚖️

全體適用配額規範（管理員與訪客上傳皆同）：
1. 單本相簿相片數量上限：最多 100 張 相片。
2. 單本相簿檔案總量上限：累計總容量不可超過 512 MB。
3. 單張照片大小限制：單檔上限為 15 MB。

當相簿相片數達 100 張或總容量達 512MB 時，前端與後端皆會自動封鎖上傳通道，確保單一相簿不會過度佔用主機磁碟。

打包下載整本相簿 (ZIP)

需要將整本相簿下載保存或用於成果報告時，可使用一鍵打包下載功能：

📦

整本相簿 ZIP 打包

點選相簿標題列的「下載整本 (ZIP)」按鈕，系統會在伺服器端將所有相片即時轉換為相容性最高、最通用的 JPEG 格式（Quality 90），並打包為 ZIP 檔案下載。

🔢

編號與中文檔名友善

ZIP 檔名自動採用「相簿名稱_日期.zip」，解壓縮後的相片自動加上序號編號（如 001_花絮.jpg），在任何電腦或行動裝置開啟皆能依序閱覽。

管理員登入與相簿維護指引

管理員擁有相簿建立、修改、封面更換、刪除以及伺服器儲存維護的完整管理權限：

1. 管理員登入

點擊網頁右上角「管理員登入」按鈕，輸入預設帳號 admin 與密碼 admin123（建議於首次上線後至資料庫或設定檔調整）。登入後頂部會顯示綠色管理員控制面板。

2. 相簿管理作業

建立新相簿：設定相簿標題、日期、簡介，並選擇「公開／私人」權限。
自訂網址代稱 (Slug)：相簿專屬靜態短網址代稱，嚴格限制僅能使用英文字母 (a-z, A-Z)、數字 (0-9) 及連字號 (-)，例如 summer-camp-2026。不允許輸入中文、底線、空格或特殊標點符號；若留空系統將自動生成合規代稱。
訪客投稿專屬 Token 與 QR Code：
- 專屬投稿網址：系統為每本相簿自動產生高強度的安全 Token 投稿連結（格式如 /upload/YbPyWYjaOLVP/ 或 /upload/?token=...），管理員可一鍵「複製投稿連結」。
- 現場 QR Code 產出：點擊「查看 QR Code」即可彈出高解析度向量 QR Code，支援現場直接讓志工掃描或下載 PNG 圖片列印於活動海報。
- 重新產生 Token：若活動結束或欲作廢舊連結，點擊「重新產生 Token」即可立即讓舊投稿連結失效。
- 公開瀏覽隱蔽設計：一般相簿瀏覽頁面不會顯示任何投稿字樣或按鈕，僅持有專屬連結或掃描 QR Code 者能進入獨立投稿頁面。
訪客上傳時限設定：
- 開放至指定日期時間：填入例如 2026/12/20 22:00，時間一到系統自動關閉訪客上傳，但相簿仍持續開放公開瀏覽。
- 無截止時間：留空則代表長期開放訪客上傳。
- 關閉訪客上傳：取消勾選訪客上傳開關即可。
首頁相簿拖曳自訂排序 (Drag & Drop)：登入管理員在首頁相簿卡片上可看見專屬 ⠿ 拖曳 Handle，按住即可即時拖曳調整相簿排列順序，放開後系統自動完成資料庫交易批次儲存，無需重新載入網頁。
相簿內相片自訂排序模式：在相簿內點選右上角「︙ 更多選項」選單中的「相片排序」，即可進入專用排序模式。在此模式下可按住相片左上角 ⠿ 拖曳調換位置，亦可點擊相片下方的無障礙輔助按鈕（⤒ 移至最前、◀ 往前移、▶ 往後移、⤓ 移至最後）進行快速定位。相片排列順序與全螢幕燈箱 (Lightbox) 前後導覽順序即時百分之百同步。
更換相簿封面：在相片卡片右上角點選「設為封面」圖示即可立即變更。

3. 永久刪除相簿防呆機制

🚨

相簿防誤刪機制：
若相簿內已有相片，點選「刪除相簿」時，系統會強制彈出確認視窗，要求管理員手動輸入完全一致的相簿名稱方可確認刪除，避免重要活動照片因誤觸而永久遺失。

4. 變更管理員密碼

為維護系統安全，建議於系統部署後立即變更預設密碼：

管理員登入後，點擊網頁頂部綠色管理控制列的「🔐 變更密碼」按鈕。
在彈出視窗中，依序填入：
- 目前舊密碼：預設為 admin123。
- 新密碼：長度需至少 6 位字元，建議混合大小寫英文與數字。
- 再次確認新密碼：確保兩次輸入完全一致，防範拼寫錯誤。
點擊「確認變更密碼」，系統將即時以強加密雜湊（Bcrypt Cost 12）更新資料庫，下次登入請使用新密碼。

5. 儲存空間與孤兒檔案清理

點擊頂部管理列的「🧹 清理孤兒檔案」：

孤兒檔案掃描：自動比對實體磁碟目錄（uploads/full 與 uploads/thumbs）與資料庫紀錄，找出因非預期中斷而殘留未被記錄的無效圖檔。
一鍵釋放與 VACUUM：管理員可一鍵徹底清除孤兒圖檔，系統會同步執行 SQLite VACUUM 壓縮資料庫，釋放伺服器空間。

常見問題與障礙排除 (FAQ)

Q1：為什麼 iPhone 上傳 HEIC 相片有時速度較慢？

答：HEIC 格式包含高密度的動態與色彩數據，伺服器在上傳時會運用 ImageMagick 與 GD 進行全自動解碼、轉向與雙尺寸 WebP 重新壓縮。單張照片處理約需 0.5 至 1.5 秒，請保持上傳進度條開啟直到全數處理完畢。

Q2：為什麼系統完全拒絕 PNG 和 GIF？

答：PNG 屬於無損壓縮，手機截圖或相機轉出的 PNG 檔案常高達 10MB~20MB，會迅速耗盡組織主機的 10GB 儲存空間；GIF 則色彩深度不足且檔案過大。請使用手機原生相機拍攝（JPEG 或 HEIF）後直接上傳。

Q3：相簿滿 100 張後如何繼續記錄活動？

答：建議建立「活動名稱 (二)」或依不同活動子主題建立新相簿（例如「上午場」、「晚會活動」），保持每本相簿輕巧、載入流暢。

Q4：訪客下載 ZIP 解壓縮後是 WebP 還是 JPEG？

答：解壓縮後全部都是標準的 .jpg (JPEG) 檔案！本相簿在打包下載時已自動將高畫質 WebP 照片轉檔回 JPEG，讓大眾下載後可直接置入 Word、PowerPoint 報告或送交沖印，相容性 100%。