60 秒決策
先確認使用者要完成的事。
適合使用
- 使用者常從檔案總管一次拖放多個檔案，且可視覺化的投入區能加快工作。
- 同時有按鈕或可聚焦控制，讓不拖放的人也能選檔。
不適合使用
- 拖放是唯一入口。
- 畫面空間很小、只需要選一個檔案，普通 File Input 已足夠。
畫面要說清楚的事
不要只交代外觀，也要交代資料與輸入規則。
拖放與點擊都要看得懂
明確寫出「拖放檔案」和「選擇檔案」兩條路徑，避免把替代操作藏起來。
拖曳進入有回饋
游標帶入可接受檔案時才顯示可放入狀態；錯誤檔案要以文字回饋。
不要把 input 設成無法聚焦
若以 Label 包裝，仍要讓鍵盤與輔助科技能觸發選檔。
必要狀態與回應
每個狀態都要讓使用者知道下一步。
預設
顯示可接受格式、大小與選擇檔案入口。
拖曳進入
清楚回饋可以放入，不只改變一點難辨識的顏色。
驗證失敗
指出是哪一個檔案、格式或大小不符合。
已加入
轉交給 Queue 或 Preview，不讓使用者誤以為已上傳完成。
操作 Demo
先知道要觀察什麼，再動手操作。
操作前先知道
活動素材拖放
先觀察：拖放提示與點擊選檔是否同時存在。
操作：使用「選擇檔案」替代操作，再按加入範例檔案檢查驗證訊息。
預期結果：不拖放也能完成選檔；加入不合規檔案會說明原因。
可操作 Demo
拖放活動素材
告訴 AI
把任務、規則、狀態與操作條件一次寫清楚。
建立一個可拖放活動素材的 Dropzone。畫面要明確寫出可拖放檔案與「選擇檔案」替代按鈕；支援 PDF、PNG、JPG、XLSX，單檔上限 10 MB。拖曳進入時要有視覺回饋，格式或大小錯誤要在區域附近以文字說明，不能只依賴拖放操作。驗收清單
不要只確認欄位能不能點。
- 是否有鍵盤可到達的選檔替代操作？
- 拖曳進入與離開是否有明確回饋？
- 格式與大小限制是否在區域附近？
- 錯誤是否顯示文字，不只換顏色？
- 加入檔案後是否交由 Queue 處理後續狀態？