Hệ thống thiết kế UI/UX nhận diện thương hiệu đồ ăn nhanh

Tạo một bảng hướng dẫn phong cách hệ thống thiết kế UI/UX và nhận diện thương hiệu chuyên nghiệp toàn diện gồm 9 phần dành cho một thương hiệu đồ ăn nhanh lớn. Bố cục phải được cấu trúc như một bản trình bày dạng lưới gọn gàng với các phần riêng biệt, được đánh số (từ 01 đến 09). Thẩm mỹ tổng thể phải đậm nét, mang tính biểu tượng và có cấu trúc cao.

### 01 PHẦN ĐẦU THƯƠNG HIỆU (BRAND HEADER)
- Bao gồm một logo nổi bật, đậm nét trên nền bắt mắt (ví dụ: các sọc đỏ và trắng đặc).
- Hiển thị hình minh họa nhân vật hoặc linh vật thương hiệu dễ nhận biết.
- Bao gồm một khẩu hiệu thương hiệu đáng nhớ (ví dụ: "vâng, ngon ngón tay") được viết bằng phông chữ viết tay thông thường.
- Liệt kê ba từ khóa cốt lõi của thương hiệu bên dưới khẩu hiệu được phân tách bằng dấu gạch chéo (ví dụ: BOLD / ICONIC / REAL).

### 02 HỆ THỐNG MÀU SẮC (COLOR SYSTEM)
- **Bảng màu chính (Primary Palette):** Trưng bày 4 màu chính với mã hex, được dán nhãn theo vai trò của chúng (ví dụ: Nền, Nhấn mạnh).
- **Bảng màu phụ (Secondary Palette):** 4 màu hỗ trợ với mã hex, được dán nhãn theo tâm trạng bầu không khí.
- **Bảng màu điểm nhấn (Accent Palette):** 4 màu nổi bật với mã hex cho các lệnh gọi hành động cụ thể.
- **Độ dải màu (Gradients):** Một phổ trực quan hiển thị quá trình chuyển đổi độ dải màu của thương hiệu.
- **Sự kết hợp màu sắc:** Các khối tương phản nhỏ thể hiện khả năng tương thích của văn bản/nền (ví dụ: Đỏ+Trắng, Đen+Vàng) ở cả bản xem trước giao diện Chế độ sáng và Chế độ tối.

### 03 HỆ THỐNG KIỂU CHỮ (TYPOGRAPHY SYSTEM)
- **Tiêu đề chính (Headline):** Phông chữ không chân (sans-serif) viết hoa toàn bộ, được xếp chữ chặt chẽ, đậm để có tác động tối đa (ví dụ: "REAL CHICKEN. REAL GOOD.").
- **Tiêu đề phụ (Subheadline):** Phông chữ không chân sạch sẽ, đáng tin cậy bằng màu sắc tương phản (ví dụ: "Hand-breaded. Freshly prepared. Every single day.").
- **Văn bản nội dung (Body Text):** Phông chữ không chân hàng ngày, thân thiện, dễ đọc hiển thị đoạn văn ngắn về triết lý thương hiệu.
- **Bảng mẫu (Specimen Panel):** Hiển thị các ví dụ về trọng lượng phông chữ "Aa" cho Display Bold, Sans Bold và Sans Regular bên cạnh logo giữ chỗ.

### 04 NGÔN NGỮ TRỰC QUAN (VISUAL LANGUAGE)
- **Hướng dẫn Chỉ đạo Nghệ thuật & Nhiếp ảnh:** Quy tắc chi tiết về Phong cách hình ảnh (ví dụ: Đậm, Biên tập, Thèm thuồng), Ánh sáng (ví dụ: Ánh sáng định hướng kịch tính với bóng tối sâu) và Kết cấu (ví dụ: Kết cấu thực phẩm giòn, xúc giác, gỗ thô, điểm nhấn bằng kim loại).
- **Lưới hình ảnh:** Bao gồm một chuỗi ngang gồm năm bức ảnh chân dung và món ăn biên tập có độ tương phản cao, riêng biệt, mỗi bức được gắn thẻ với một trụ cột thương hiệu (ví dụ: Đậm, Thực tế, Tự tin, Thèm thuồng, Biểu tượng).

### 05 ỨNG DỤNG THƯƠNG HIỆU (BRAND APPLICATIONS)
- Hiển thị các triển khai thực tế của nhận diện trực quan trên nhiều phương tiện:
 - **Bao bì sản phẩm:** Mô hình 3D của xô và hộp thực phẩm có thương hiệu.
 - **Trang chủ Website (Hero):** Bố cục trang đích trên máy tính để bàn gọn gàng có tiêu đề mạnh mẽ, ảnh sản phẩm và nút "Đặt hàng ngay".
 - **Màn hình ứng dụng di động:** Giao diện người dùng điện thoại thông minh hiện đại hiển thị giao diện giao đồ ăn.
 - **Bài đăng trên mạng xã hội:** Mô hình cho Instagram (bài đăng vuông 1:1), Stories (dọc 9:16) và Biểu ngữ (màn hình rộng 16:9).
 - **Văn phòng phẩm & Ngoài trời (OOH):** Danh thiếp doanh nghiệp tối giản và bảng quảng cáo ban đêm kịch tính, có tác động mạnh mẽ.

### 06 HỆ THỐNG THIẾT KẾ (THÀNH PHẦN UI)
- **Nút bấm (Buttons):** Các biến thể trạng thái (Mặc định, Khi di chuột, Vô hiệu hóa) cho kiểu nút chính, phụ và văn bản.
- **Thẻ (Cards):** Thẻ UI cho các mặt hàng thực đơn món ăn có hình ảnh chất lượng cao, tiêu đề, giá cả và huy hiệu khuyến mại "Ưu đãi hôm nay".
- **Trường nhập liệu (Input Fields):** Hộp nhập văn bản trạng thái Mặc định, Đang chọn và Lỗi.
- **Thanh điều hướng (Navigation Bar):** Bố cục thanh điều hướng máy tính để bàn với logo, liên kết menu và nút CTA có thể hành động.
- **Thang đo khoảng cách (Spacing Scale):** Thang đo hệ thống lưới 8pt trực quan hiển thị các khối đệm tăng dần (8px, 16px, 24px, lên đến 96px).

### 07 HỆ THỐNG BIỂU TƯỢNG (ICONOGRAPHY)
- Lưới sạch gồm 10 biểu tượng nghệ thuật đường nét tối giản, đồng nhất đại diện cho các hành động cốt lõi và danh mục sản phẩm: Gà, Xô, Burger, Khoai tây chiên, Đồ uống, Địa điểm, Giao hàng, Ưu đãi, Tài khoản và Yêu thích.

### 08 HỌA TIẾT & MẪU (PATTERNS & MOTIFS)
- Năm mẫu hình chữ nhật hiển thị các tài sản thương hiệu lặp lại:
 - **Mẫu sọc:** Các đường dọc sạch sẽ.
 - **Mẫu Đại tá/Linh vật:** Mô hình logo nghệ thuật đường nét lặp lại trên nền đặc.
 - **Mẫu kết cấu:** Kết cấu vật liệu thô tinh tế (như thớ gỗ hoặc giấy).
 - **Mẫu hình học:** Các yếu tố thiết kế hình học chữ V/ruy băng.
 - **Đường chia tách:** Các điểm ngắt dòng chức năng, mỏng và chỉ báo UI.

### 09 VẬT LIỆU & ĐỘ SÂU (MATERIAL & DEPTH)
- Bốn ví dụ trực quan chứng minh kết xuất không gian vật lý:
 - **Bóng thực tế:** Bao bì sản phẩm tạo ra bóng xung quanh định hướng, tự nhiên.
 - **Bề mặt có kết cấu:** Cận cảnh các vật liệu xúc giác như giấy, bìa cứng và gỗ.
 - **Sự phản chiếu:** Độ bóng tinh tế và lớp hoàn thiện được đánh bóng trên cốc đồ uống nhựa hoặc thủy tinh.
 - **Độ sâu lớp:** Giao diện ứng dụng di động nhiều lớp cho thấy hệ thống phân cấp độ sâu và các yếu tố chồng chéo.

### TRÍCH DẪN CUỐI TRANG (FOOTER QUOTE)
- Kết thúc bảng với một khối điểm nhấn màu đỏ đặc có chứa trích dẫn lớn màu trắng từ người sáng lập công ty bên cạnh minh họa đường vector sạch sẽ của linh vật thương hiệu.