Dự án 5: Bộ thức ăn và đồ uống quán trọ

Đồ ăn trong game vừa là đạo cụ trang trí (bày trên bàn quán trọ) vừa là vật phẩm (nhặt để hồi máu). Món ăn trông ngon nhờ ba thứ: màu ấm bão hòa, vệt bóng sáng ướt át và hơi nóng bốc lên. Bộ 8 món phải trông như do một họa sĩ vẽ: cùng góc nhìn 3/4 từ trên xuống, cùng hướng sáng trên – trái, cùng độ dày nét viền. Bài này luyện cách giữ nhất quán cho cả một bộ asset.

Hình mẫu

Thời gian ước tính: khoảng 80 phút (10 phút mỗi món). Hãy để ý bóng elip dưới mỗi món đều cùng cỡ và cùng độ mờ – một chi tiết nhỏ nhưng giúp cả bộ trông đồng bộ.

Chuẩn bị

• Canvas: 512 × 256 px (4 × 2 ô 128 px), Resolution (Độ phân giải) 72, RGB Color, Background Contents: Transparent.
• Công cụ chính: Ellipse Tool và Rectangle Tool (U), Pen Tool (Bút tạo đường) (P), Brush (Cọ vẽ) Tool (B), Clipping Mask (Mặt nạ cắt) (Ctrl+Alt+G), Eyedropper (Ống hút màu) (I) để lấy lại màu từ bảng Swatches (Bảng mẫu màu).
• Thiết bị: bút Wacom, XP-Pen, Huion hay iPad giúp vẽ hơi nóng, vết nướng cháy cạnh, bọt bia mềm mại nhờ lực nhấn (Transfer › Opacity (Độ mờ đục) Jitter › Control: Pen Pressure (Lực nhấn bút)). Dùng chuột: vẽ hơi nóng bằng Pen Tool rồi Stroke Path với Simulate Pressure, vẽ vết nướng bằng Line Tool Caps Round.
• File mẫu: "Lưới 4 × 2 ô" – vùng hồng là lề an toàn 12 px, elip nét đứt là chỗ đặt bóng, mũi tên góc trái nhắc hướng sáng.

Các bước

1. Tạo file và bảng màu: FileTệp›NewTạo mới, 512 × 256 px, Transparent; lưới 128 px. Mở WindowCửa sổ›SwatchesBảng mẫu màu, tạo Swatch Group Quán trọ và thêm 9 màu ở bảng trên – cả bộ chỉ lấy màu từ đây.
2. Phác góc nhìn chung: layer Sketch Opacity 30%. Mọi món nhìn từ góc 3/4 phía trên: miệng cốc, mặt bát, mặt đĩa là elip dẹt có tỉ lệ chiều cao bằng khoảng 1/4 chiều rộng. Vẽ elip này trước cho các món có miệng rồi dựng thân bên dưới.
3. Bánh mì và bánh bao: Pen Tool vẽ ổ bánh mì vòm (đáy hơi cong), Fill #e0a050; bánh bao vòm cao hơn, Fill #fbf3e4, có chấm đỏ trên đỉnh. Stroke Outside 3 px #1b1a24 cho mọi shape – copy/paste Layer Style để chắc chắn cùng độ dày.
4. Đùi gà và xiên nướng: đùi gà là một hình giọt nước tròn #c8692c cộng xương trắng #f6efe0 (hình chữ nhật bo tròn + 2 chấm tròn ở đầu). Xiên nướng: một đường Line Tool làm que, 3 khối bo góc xoay chéo cùng góc (thịt – rau – thịt) bằng Ctrl+T và nhập góc −31° trên thanh Options.
5. Cốc gỗ đầy bọt: thân cốc hình chữ nhật bo góc #c58a52, hai đai sắt #5b6375, quai là Pen Tool. Bọt #fbf3e4 là đám mây gồm 4–5 nửa vòng tròn tràn ra khỏi miệng cốc – bọt tràn làm cốc trông "đầy".
6. Pho mát, bát súp, đĩa trái cây: pho mát là hình nêm 3 mặt: mặt trên sáng #ffd86b, mặt bên #f2b632; lỗ pho mát là elip #d08a1a. Bát súp: thân bát nửa elip #4f7ab8 có viền trang trí kem, mặt súp elip #e8a050 có vài lát rau xanh. Đĩa: elip trắng xám, một quả táo và chùm nho 5 quả.
7. Đổ bóng đồng loạt: mỗi món một layer kẹp Multiply (Nhân (làm tối)). Ánh sáng trên – trái nên mảng tối nằm ở phải – dưới của mọi món. Dùng Ellipse Tool vẽ một elip lớn lệch phải – dưới rồi kẹp vào – nhanh hơn tô tay và đảm bảo mọi bóng có cùng "logic".
8. Vệt bóng "ngon": layer kẹp Normal, Brush cứng hoặc Ellipse nhỏ: một vệt sáng elip dẹt ở trên – trái của bánh mì #ffd08a, của đùi gà #f0a060, chấm sáng tròn trên quả táo và từng quả nho. Đồ nướng, trái cây cần vệt sáng rõ; bánh bao chỉ cần một mảng sáng mờ – bột mì không bóng.
9. Vết nướng và kết cấu: Brush 3 px màu tối hơn nền món: 3 vết rạch chéo trên bánh mì, vài vết cháy ngắn trên đùi gà và xiên nướng, nếp gấp hình chữ thập trên đỉnh bánh bao, vân dọc trên cốc gỗ. Mỗi món 3–5 nét chi tiết là đủ ở cỡ 128 px.
10. Hơi nóng: trên bát súp, Brush 3 px trắng Opacity 80% vẽ 3 đường lượn sóng chữ S đi lên, đầu trên mờ dần (dùng Eraser (Tẩy) mềm Opacity 50% xóa nhẹ phần ngọn). Hơi nóng chỉ dành cho món nóng – đừng thêm cho pho mát hay trái cây.
11. Bóng đổ chung: layer Shadow dưới cùng: Ellipse Tool vẽ elip 72 × 10 px màu đen Opacity 20% đặt đúng các elip nét đứt của file mẫu. Cùng kích thước cho cả 8 món, chỉ đĩa trái cây có bóng rộng hơn một chút.
12. Kiểm tra đồng bộ: thu về 50% và nhìn cả bộ: có món nào "lạc tông" (quá tối, quá nhạt, nét mảnh hơn)? Thêm tạm Adjustment Layer (Lớp điều chỉnh) Black & White trên cùng để xem độ sáng: các món phải có độ sáng gần nhau, không món nào đen sì hay trắng xóa. Xóa layer kiểm tra sau khi xem.
13. Xuất và đưa vào Unity 6: ẩn Sketch và lưới, Export As (Xuất ra (tùy chỉnh)) PNG → inn_food.png 512 × 256 px. Unity: Sprite Mode Multiple, Slice Grid By Cell Size 128 × 128, đổi tên từng sprite (bread, drumstick, mug…). Tạo Sprite Atlas qua menu Assets › Create › 2D › Sprite Atlas, kéo cả 8 sprite vào Objects for Packing – Unity vẽ cả bộ trong một lần (ít draw call). Món dùng làm vật phẩm: thêm Circle Collider 2D bật Is Trigger, script hồi máu khi người chơi chạm vào.

Nâng cao (tùy chọn)

• Bản "đã ăn dở": nhân đôi bánh mì và đùi gà, dùng Ellipse Tool trừ đi một vết cắn hình răng cưa – dùng cho bàn tiệc sau khi NPC ăn xong.
• Món ăn Việt: thay 2 món bằng bát phở có lát thịt và hành lá, đĩa xôi gấc đỏ – vẫn giữ góc nhìn và bảng màu chung.
• Icon túi đồ 64 px: thu cả sheet về 50% bằng ImageHình ảnh›Image SizeKích thước ảnh (Resample (Lấy mẫu lại): Bicubic (Nội suy mượt) Sharper), tăng Stroke lên 4 px trước khi thu để nét không bị mảnh.