Ghi chú thiết kế

Component spec · Phím tắt · Micro-interaction
MCP server · 2 agent đang đọc
1. Hệ Badge (Badge System)
Chỉ nội bộẢnh AICó người trong hìnhPublicTrùngĐang tag

Nguyên tắc: Nền tint nhạt + chữ đậm cùng tông là mặc định. Solid chỉ dành cho trạng thái đang xử lý (“Đang tag”) và cảnh báo trùng (nền vàng #FFD60D + chữ tối — vàng không bao giờ làm màu chữ).

2. Card ảnh & Quy tắc an toàn

Bo 12px · viền hairline · shadow thấp. Badge cảnh báo (AI / Chỉ nội bộ / Có người) luôn hiển thị ở góc trên trái với nền mờ chống lóa, không phụ thuộc hover. Hover mới hiện: checkbox chọn, badge nguồn, SKU mono, nút copy link.

3. Hệ thống Phím tắt — Duyệt dưới 10 giây/ảnh
ADuyệt ảnh hiện tại và sang ảnh kế tiếp
XTừ chối ảnh (không vào kho, giữ log)
ENhảy vào trường AI kém tự tin nhất (SKU hoặc Thương hiệu)
← →Chuyển ảnh trước / sau
1 – 5Chọn nhanh chip Loại ảnh (Công trình, Showroom, Studio...)
6 – 9Chọn nhanh chip Không gian (Phòng khách, Bếp, Cửa chính...)
EscThoát khỏi ô nhập hoặc thoát Zoom/So sánh ảnh
4. Micro-interactions & Vòng học AI

Learning ring: Khi sửa một trường do AI điền sẵn, trường đó viền phát sáng cam --learn #C2701A trong 1000ms kèm nhãn đã ghi nhận rồi tắt mềm. Không popup, không toast làm gián đoạn nhịp duyệt.

Confidence Meter: Thanh 46×4px hiển thị độ tin cậy của AI (xanh ≥ 85%, cam < 85%) giúp người duyệt nhìn nhanh vào trường cần soi.

5. Banner trùng lặp (Duplicate Detection)
Giống 92% với 3 ảnh đã có · So sánh thumbnail · Nút “Vẫn giữ” / “Bỏ, dùng ảnh cũ”

Xuất hiện cả lúc upload (viền vàng trên card) và trong màn duyệt. Hệ thống không bao giờ tự ý xóa ảnh của người dùng.