Bạn học Photoshop trên máy nào? Phím tắt và hướng dẫn sẽ hiển thị đúng theo lựa chọn của bạn.

Lộ trình › Luyện nền tảng vẽ › Bài 109/158

Nước và lửa stylized

Vẽ ngọn lửa bằng 4 lớp màu chồng nhau có quầng sáng, và mặt nước có dải tối, dải sáng, bọt trắng, tia nước bắn – xuất thành hai sprite 256 px.

Trung cấp 50 phút ★★★ Vừa Hướng dẫn cho Windows · đổi sang macOS

Photoshop hiển thị tiếng Anh. Từ có gạch chân chấm là thuật ngữ trên giao diện — chạm để xem nghĩa, hoặc tra Từ điển Anh–Việt.

Lửa và nước là hai thứ "không có hình dạng cố định" nên người mới hay vẽ lan man. Cách stylized của game rất đơn giản: chồng các lớp màu. Lửa: mỗi lớp trong nhỏ hơn và sáng hơn lớp ngoài. Nước: tối ở dưới sâu, sáng ở mặt, viền bọt trắng theo mép sóng. Cuối cùng thêm vài chi tiết nhỏ (tàn lửa, giọt nước, lấp lánh) là đủ sống động.

Hình mẫu

Ngọn lửa bốn lớp có quầng sáng và tàn lửa; mặt nước có dải tối, dải sáng, bọt và tia nước bắn
Ngọn lửa bốn lớp có quầng sáng và tàn lửa; mặt nước có dải tối, dải sáng, bọt và tia nước bắn

Thời gian ước tính: 50 phút. Lửa: đỏ #e63946 → cam #ff8a3d → vàng #ffd23f → lõi #fff6d6. Nước: sâu #1e6fb8, nền #3fa3e8, dải sáng #8fdcff, bọt trắng.

Chuẩn bị

  • Canvas: 512 × 256 px – hai ô 256 × 256: trái là lửa, phải là nước. Background Contents: Transparent. Có thể vẽ ở 2048 × 1024 px rồi thu nhỏ sau bằng ImageHình ảnh›Image SizeKích thước ảnh.
  • Nền xem thử: tạo layer Preview BG màu tối #2a2236 dưới ô lửa để thấy quầng sáng; nhớ ẩn trước khi xuất.
  • Thiết bị: không cần lực nhấn – mọi lớp vẽ bằng Lasso (Dây thòng lọng) (L) rồi tô. Chuột làm nhanh như bút. Người dùng bút XP-Pen/Huion/Wacom hoặc iPad có thể vẽ lưỡi lửa bằng Hard Round với Pen Pressure (Lực nhấn bút) cho Size để đầu lưỡi nhọn tự nhiên.

Các bước

Lửa: bóng dáng → các lớp trong → quầng và tàn lửa; Nước: nền và dải tối → dải sáng và bọt → tia nước và lấp lánh
Lửa: bóng dáng → các lớp trong → quầng và tàn lửa; Nước: nền và dải tối → dải sáng và bọt → tia nước và lấp lánh
  1. Tạo file: Ctrl+N 2048 × 1024 px, Transparent. Guide dọc ở 1024 px chia hai ô.
  2. Bóng dáng lửa: layer Fire Outer. Dùng Lasso vẽ hình giọt nước lộn ngược có 3–5 lưỡi lửa cong vút lên, đáy tròn bầu. Tô #e63946. Lưỡi giữa cao nhất, các lưỡi bên ngắn hơn và cong ra ngoài.
  3. Lớp cam: nhân bản layer (Ctrl+J), đặt tên Fire Mid, Ctrl+T thu nhỏ 78% với điểm neo ở đáy giữa (giữ Alt khi kéo hoặc dời điểm neo xuống đáy). Bật / và tô #ff8a3d.
  4. Lớp vàng và lõi: lặp lại: Fire Inner 52% màu #ffd23f, Fire Core 25% màu #fff6d6. Các lớp trong luôn "ngồi" dưới đáy – lửa nóng nhất ở gốc.
  5. Lệch nhịp: dùng FilterBộ lọc›Liquify với Forward Warp (Uốn cong) kéo nhẹ đầu các lưỡi của lớp cam và vàng sang hai bên, để các lớp không giống hệt nhau.
  6. Quầng sáng: chọn layer Fire Outer, LayerLớp›Layer Style›Outer Glow: Blend Mode (Chế độ hòa trộn) Screen, màu #ff9f43, Opacity (Độ mờ đục) 60%, Size 60 px.
  7. Tàn lửa: layer Sparks blend mode Color Dodge (Làm sáng rực). Vẽ 4–6 hình thoi nhỏ màu vàng bay phía trên ngọn lửa, to nhỏ khác nhau. Thêm khúc củi nâu ở đáy.
  8. Nền nước: ô phải, layer Water Base: Lasso vẽ mặt nước có mép trên gợn sóng đều, tô #3fa3e8. Layer Deep Clipping Mask (Mặt nạ cắt): tô dải dưới đáy #1e6fb8 có mép trên lượn sóng rộng hơn.
  9. Dải sáng: layer Light Bands Clipping Mask, blend mode Screen, Hard Round 12 px màu #8fdcff. Vẽ các nét lượn sóng ngắn nằm ngang, dài – ngắn xen kẽ, song song mặt nước.
  10. Bọt: layer Foam, Hard Round trắng 14 px vẽ dọc mép sóng trên cùng, thêm các chấm tròn trắng to nhỏ ngay dưới mép.
  11. Tia nước bắn: ở giữa mặt nước, vẽ "vương miện" tia nước hình răng cưa 4–5 mũi màu trắng xanh #e6f7ff, hai vòng sóng elip quanh chân, và 3–4 giọt nước hình giọt lệ bay lên.
  12. Lấp lánh và xuất: vài ngôi sao 4 cánh trắng nhỏ trên mặt nước. Ẩn Preview BG, ImageHình ảnh›Image SizeKích thước ảnh về 512 × 256 px (Resample (Lấy mẫu lại): Bicubic (Nội suy mượt) Sharper), xuất PNG nền trong suốt.
Mẹo: muốn lửa chuyển động trong Unity, nhân bản ngọn lửa thành 4 khung, mỗi khung dùng Liquify uốn lưỡi lửa khác đi một chút, xếp thành sprite sheet 1024 × 256 px – một hoạt ảnh lửa bập bùng đơn giản.
Lỗi hay gặp: đặt lớp vàng ở giữa ngọn lửa (lơ lửng) thay vì ngồi dưới đáy, hoặc dùng Soft Round tô nhòe các lớp vào nhau. Lửa stylized cần ranh giới lớp rõ ràng và lớp sáng nhất ở gốc.

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

  • Lửa phép: dùng ImageHình ảnh›AdjustmentsĐiều chỉnh màu›Hue/SaturationSắc độ/Độ bão hòa đổi lửa thành xanh băng hoặc tím độc.
  • Nước trong hang: tối giản màu nước xuống xanh lục đậm, thêm phản chiếu ánh đuốc cam trên mặt.
  • Thác nước: dải nước dọc với các vệt sáng thẳng đứng, chân thác nhiều bọt trắng.

Mẹo & trick học nhanh

Thu nhỏ theo đáy

Khi Ctrl+T các lớp lửa, kéo điểm neo (chấm tròn ở giữa khung) xuống cạnh dưới rồi mới thu nhỏ – các lớp luôn đứng chung một đáy.

Kiểm tra trên nền tối

Hiệu ứng phát sáng chỉ thấy rõ trên nền tối. Luôn có một layer nền tối để xem thử, ẩn khi xuất PNG.

Bọt theo vật

Bọt nước không rải ngẫu nhiên: nó bám mép sóng, quanh chân đá, quanh nhân vật đang lội. Đặt bọt đúng chỗ là nước "đọc" được ngay.

Kiểm tra nhanh

1 Trong ngọn lửa stylized, lớp màu sáng nhất (lõi) nằm ở đâu?
2 Nước stylized nên tối ở đâu và sáng ở đâu?
3 Blend mode nào hợp để vẽ tàn lửa phát sáng?

Bài tập: Nộp sprite lửa và nước

Làm trong Photoshop rồi nộp file. Máy chấm kiểm tra các yêu cầu kỹ thuật và chỉ cách sửa từng lỗi; giáo viên chấm thêm phần thẩm mỹ.

Làm bài tập