Sổ Tay Hướng Dẫn & Sales Kit Cà Phê Triều Nguyên

🚀 1. Khởi Động & Truy Cập Web Showcase & Admin

Chỉ cần 1 cú nhấp đúp là toàn bộ hệ thống web và dữ liệu sẵn sàng hoạt động.

Khuyên Dùng Trên Mac

Cách 1: Nhấp Đúp 1-Click (Finder)

Mở thư mục dự án và nhấp đúp vào file:

👉 Khoi_Dong_Server.command

✓ Tự động mở web trên trình duyệt sau 1 giây.

Thủ Công

Cách 2: Chạy Lệnh Terminal

Nếu bạn thích dùng Terminal:

python3 -m http.server 8089

Cổng dịch vụ: 8089

🌐

Các Đường Link Truy Cập Trực Tiếp (Sau khi bật server):
• Trang Showcase Trưng Bày: http://localhost:8089/index.html
• Trang Quản Trị Admin CMS: http://localhost:8089/admin.html

🎨 2. Trang Web Showcase Sản Phẩm (Behance Editorial V3)

Được tối ưu chuẩn phong cách Case Study Behance của Café Excelsior, tập trung 100% vào túi sản phẩm.

Bố Cục 1

Sản Phẩm Đơn (Single Product)

Nền xanh co lại (30% bên trái), nền trắng (70% bên phải).
Túi cà phê 680px nằm chính giữa màn hình (1/2 trên nền xanh, 1/2 trên nền trắng tiếp giáp đối xứng).
Dock 3 - 4 góc chụp ngay dưới túi: Nhấn góc nào ảnh chính đổi góc đó ngay tức thì.
Cột phải: Logo Triều Nguyên ở góc phải, tiêu đề, tagline, đoạn văn mô tả tự nhiên và khối link tải ảnh PNG.
Chân trang: Người chụp, ngày chụp, khách hàng và đánh số trang TRANG 01 / 15.

Bố Cục 2

Sản Phẩm Combo (Bộ Sản Phẩm)

Full màu cho toàn bộ nền (màu nâu/xanh trầm sang trọng).
Logo Triều Nguyên ở góc trên bên phải trang.
Ảnh combo dàn hàng ngang ở phía trên kèm dock đổi góc ảnh bên dưới.
Khối text tương phản ở phía dưới: Tagline, Tiêu đề, Mô tả và Link tải ảnh combo.
Chân trang hiển thị đầy đủ thông tin studio và đánh số trang.

⚙️ 3. Trang Quản Trị Admin CMS (Chỉnh Sửa & Supabase)

Quản lý toàn bộ 15 sản phẩm, thay đổi màu sắc background, link ảnh và thông tin khách hàng.

A. Chỉnh Sửa Thông Tin Tức Thì

Nhấn nút "Sửa" ở bất kỳ sản phẩm nào.
Thay đổi Màu sắc background (có cả bảng chọn màu trực quan và ô nhập mã HEX).
Sửa Link Hình Ảnh (đường dẫn nội bộ hoặc URL Supabase/Cloudflare).
Thay đổi Logo thương hiệu, Người chụp, Ngày chụp, Khách hàng.
Nhấn Lưu Thay Đổi: Trang Showcase ngoài tự động cập nhật ngay lập tức!

Dual-Mode

B. Chế Độ Offline & Đám Mây Supabase

Chế độ Mặc Định (Offline): Hoạt động ngay tức thì qua LocalStorage mà không cần tạo tài khoản Supabase.
Đồng bộ Supabase Cloud:
1. Mở Supabase.com -> SQL Editor.
2. Dán nội dung file supabase/schema.sql và nhấn Run.
3. Lấy Project URL & Anon Key dán vào trang Admin rồi bấm Lưu Kết Nối.

✂️ 4. Bộ Công Cụ Cắt Nền Studio (AI & Photoshop)

Đã được nâng cấp để giải quyết triệt để vấn đề "Force Quit" và tích hợp mô hình AI hàng đầu thế giới.

Khuyên Dùng Cho In Ấn & Thiết Kế

🌟 Công Cụ 1: Script Photoshop 2025 AI + Chỉnh Màu Thương Mại

Chuyên trị file ảnh gốc và file RAW Canon (.CR2), tự động nâng tông màu rực rỡ và giữ nguyên Layer Mask:

👉 Chay_Script_Photoshop.command

Tốc độ siêu nhanh: Chỉ ~4 giây / ảnh nhờ engine Adobe Sensei AI.
Tự động cân sáng & sắc độ: Áp dụng Auto Tone & Auto Color khử sạch ám vàng đèn studio.
Thêm lớp Vibrance (+18 Vibrance, +6 Saturation): Giúp màu đỏ Kraft, vàng cam và xanh rêu của bao bì Triều Nguyên tươi rực.
Giữ Layer Mask nguyên bản 100%: Không phá hủy pixel ảnh gốc, designer có thể dùng cọ Brush sửa lại bất kỳ lúc nào.
Xuất Kép Tự Động: Xuất file .PSD đa lớp VÀ file .PNG tách nền trong suốt dùng ngay cho Web!

Mô Hình AI SOTA 2024

🌟 Công Cụ 2: Mô Hình zhengpeng7/BiRefNet (CVPR / NeurIPS 2024)

Mô hình chuyên tách nền độ phân giải cao, bóc tách cực nét từng nếp gấp mép ép bao bì cà phê và bóng đổ chân túi:

💡

Khắc Phục Triệt Để Lỗi Force Quit:
Trước đây hệ thống bị Force Quit do Apple CoreML bị rò rỉ bộ nhớ khi nạp model 1GB. Chúng tôi đã khóa cơ chế CPUExecutionProvider đa luồng, nạp model chỉ mất 10s, RAM ổn định 5.4GB, 100% không bao giờ bị crash.

👉 Chay_BiRefNet.command

1-Click Khởi Động: Nhấp đúp vào file Chay_BiRefNet.command để chạy ngay ảnh mẫu IMG_9497.JPG.
Thời gian xử lý: ~55 giây / ảnh độ phân giải cao trên CPU.
File kết quả thực tế: src/photo/IMG_9497_BIREFNET.png (Đã có sẵn trong thư mục).
Tool Cắt Hàng Loạt: Mở Chay_Tool_Cat_Nen.command và nhấn phím 2 để chọn BiRefNet khi cắt cả folder.

📸 Kết Quả Thực Tế Đã Xuất Trên Ảnh Mẫu IMG_9497.JPG

Photoshop 2025 AI (~4s)

File: IMG_9497_PERFECT.png & .psd (Có chỉnh màu Vibrance)

BiRefNet NeurIPS 2024 (~55s)

File: IMG_9497_BIREFNET.png (Sắc nét nếp gấp & bóng đổ)

📊 5. Bảng So Sánh Các Giải Pháp Cắt Nền

So sánh khách quan để chọn phương án tối ưu cho từng mục đích sử dụng.

Tiêu Chí	Photoshop 2025 AI	BiRefNet (NeurIPS 2024)	U2-Net Chuẩn
Tốc độ xử lý	⚡ ~4 giây/ảnh	⏱ ~55 giây/ảnh (CPU)	⚡ ~2 giây/ảnh
Định dạng file xuất	File .PSD đa lớp + File .PNG	File .PNG trong suốt	File .PNG trong suốt
Khả năng chỉnh sửa	Giữ Layer Mask 100% (Brush sửa lại được)	Ảnh phẳng (đã tách)	Ảnh phẳng (đã tách)
Chỉnh màu thương mại	Auto Tone + Vibrance (+18,+6)	Màu ảnh gốc	Màu ảnh gốc
Độ nét chi tiết vi mô	Rất sắc nét, khử lem 1px	🌟 Cực cao (tách cả nếp nhăn)	Khá tốt cho bao bì
Khuyến nghị sử dụng	In ấn, thiết kế banner, sales kit	Ảnh khó, nhiều chi tiết phức tạp	Cắt nhanh hàng loạt cho web

📌 6. Tóm Tắt Danh Mục Phím Tắt & File 1-Click

Chỉ cần nhấp đúp vào các file .command dưới đây trong Finder:

Tên File Phím Tắt	Vai Trò & Chức Năng	Thao Tác
`Khoi_Dong_Server.command`	Khởi động web server port 8089 & tự động mở trình duyệt	Nhấp đúp chuột
`Chay_Script_Photoshop.command`	Chạy script cắt file RAW/JPG & chỉnh màu trong Photoshop 2025	Nhấp đúp chuột
`Chay_BiRefNet.command`	Chạy thử nghiệm mô hình BiRefNet SOTA trên ảnh mẫu	Nhấp đúp chuột
`Chay_Tool_Cat_Nen.command`	Tool AI cắt hàng loạt (cho phép chọn U2-Net hoặc BiRefNet)	Nhấp đúp chuột
`index.html`	Giao diện Web Showcase trưng bày sản phẩm chuẩn Behance	Mở trên trình duyệt
`admin.html`	Trang quản trị CMS & kết nối Supabase Cloud	Mở trên trình duyệt