Lộ trình › Thiết kế nhân vật & sinh vật › Bài 141/218

Dự án 13: Bảng tư thế hành động – Attack, Hurt, Victory

Vẽ cùng một nhân vật ở 3 tư thế then chốt của game hành động – tấn công, trúng đòn, chiến thắng – dựng trên đường hành động và người que, xuất sheet 1536 × 512 px làm khung chính cho animation trong Unity 6.

Nâng cao 300 phút ★★★ Khó 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.

File mẫu để luyện tập

Tải về rồi mở bằng Photoshop: FileTệp›OpenMở (Ctrl+O).

Trong animation game, các tư thế then chốt (key pose) quyết định cảm giác của cả chuyển động. Ba tư thế xuất hiện ở hầu hết game hành động: tấn công (attack), trúng đòn (hurt) và chiến thắng (victory). Mỗi tư thế phải đọc được chỉ trong một khung hình – người chơi thấy nó trong vài phần mười giây. Công cụ chính của bài là đường hành động (line of action): một đường cong duy nhất chạy xuyên cơ thể, quyết định toàn bộ dáng người.

Hình mẫu

Cùng một nhân vật tóc xanh khăn đỏ: tấn công lao người vung kiếm có vệt chém, trúng đòn ngả ra sau với ngôi sao va chạm và kiếm rơi, chiến thắng giơ kiếm lên trời
Cùng một nhân vật tóc xanh khăn đỏ: tấn công lao người vung kiếm có vệt chém, trúng đòn ngả ra sau với ngôi sao va chạm và kiếm rơi, chiến thắng giơ kiếm lên trời

Thời gian ước tính: khoảng 5 giờ. Để ý cả thân nghiêng theo hướng lực: tấn công nghiêng về phía trước (~14°), trúng đòn nghiêng ra sau (~−14°), chiến thắng thẳng đứng và nhảy lên khỏi mặt đất. Nghiêng người kể chuyện trước cả khuôn mặt.

Chuẩn bị

  • Canvas: 1536 × 512 px (3 ô 512 × 512), Resolution (Độ phân giải) 72, RGB Color, Transparent.
  • Công cụ chính: Brush (Cọ vẽ) Tool (B) cho đường hành động và người que, Pen Tool (Bút tạo đường) (P), Free Transform (Biến đổi tự do) (Ctrl+T) với điểm tham chiếu xoay, Puppet Warp (Uốn cong) (tùy chọn), Smart Object (Đối tượng thông minh) cho đầu nhân vật.
  • Thiết bị: đường hành động cần được vẽ bằng một nét liền nhanh – bút Wacom, XP-Pen, Huion hay iPad + Apple Pencil (Bút chì) rất hợp (vẽ từ vai, không từ cổ tay). Dùng chuột: Pen Tool đặt 2–3 điểm neo rồi kéo tay cầm thành đường cong chữ C hoặc S, Stroke Path; người que dựng bằng Line Tool và các chấm khớp tròn.
  • File mẫu: "Bảng 3 người que" – đặt trên cùng, Opacity (Độ mờ đục) 50%; vẽ cơ thể bám theo các khớp xanh.
MàuMã hexDùng cho
#3d8bffÁo (bóng #2b5fc0)
#2b3a6bTóc
#e8423bKhăn quàng
#ffd9b3Da
#e6edf5Lưỡi kiếm (bóng #aab6c4)
#e8b830Chuôi kiếm, thắt lưng
#ffd23fSao va chạm, lấp lánh
#9cc4ffViền vệt chém
#1b1a24Viền

Các bước

Sáu giai đoạn: đường hành động, nét viền trên người que, màu nền, đổ bóng, hiệu ứng chuyển động, nhãn tư thế
Sáu giai đoạn: đường hành động, nét viền trên người que, màu nền, đổ bóng, hiệu ứng chuyển động, nhãn tư thế
  1. Tạo file: Ctrl+N 1536 × 512 px, Transparent. Guide dọc mỗi 512 px, Guide ngang đường chân y = 480.
  2. Đường hành động (layer LOA): Brush 6 px màu hồng, mỗi ô vẽ một đường cong: Attack – chữ C ngả về phía trước, từ chân sau lên tay cầm kiếm; Hurt – chữ C ngả ra sau như bị đẩy; Victory – đường gần thẳng vươn lên trời, hơi cong ở đỉnh.
  3. Người que (layer Stick): đặt hông, cổ, đầu dọc theo đường hành động, rồi tay chân. Attack: chân trước bước dài, chân sau duỗi (thế lao); Hurt: một chân nhấc lên, tay vung ra hai bên mất thăng bằng; Victory: hai chân khép, một tay đấm lên trời.
  4. Kiểm tra trọng tâm: thả một đường thẳng đứng từ cổ xuống. Attack: đường rơi trước bàn chân trụ – nhân vật đang lao tới. Hurt: rơi sau bàn chân – đang ngã. Victory: rơi giữa hai chân – vững vàng. Nếu sai, xoay lại thân trên người que.
  5. Đầu dùng chung: vẽ đầu nhân vật (tóc, mặt trống) một lần, chuyển thành Smart Object, đặt vào 3 ô và xoay theo người que bằng Ctrl+T. Mặt vẽ riêng cho từng tư thế trên layer phía trên.
  6. Thân và tay chân: layer Line: vẽ thân, tay, chân bám người que. Tay xa (tay khuất) vẽ trên layer dưới thân. Giữ tỉ lệ chibi đồng nhất – dùng thước đầu trong khung mẫu.
  7. Kiếm theo tư thế: Attack – kiếm vung chéo ra trước, lưỡi kiếm kéo dài theo đường hành động; Hurt – kiếm văng khỏi tay, rơi nằm trên đất; Victory – kiếm giơ thẳng lên, mũi kiếm là điểm cao nhất của hình. Kiếm trên layer riêng.
  8. Biểu cảm: Attack – lông mày xiên, miệng há hét (khí thế); Hurt – mắt nhắm chặt dạng "> <", miệng lượn sóng, giọt mồ hôi; Victory – mắt cười cong, miệng mở cười lớn.
  9. Khăn quàng theo lực: khăn đỏ là "chỉ báo chuyển động": Attack – khăn bay ngược về sau; Hurt – khăn bay về phía trước (người bị đẩy lùi); Victory – khăn tung nhẹ lên. Vật mềm luôn đi trễ hơn cơ thể.
  10. Màu và bóng: layer Flat, rồi layer Shade Multiply (Nhân (làm tối)) kẹp vào. Ánh sáng từ trên – trái cho cả 3 ô dù nhân vật xoay khác nhau – bóng phải "xoay theo" cơ thể, nên vẽ lại bóng cho từng tư thế, không copy.
  11. Hiệu ứng chuyển động: Attack – vệt chém hình lưỡi liềm trắng viền xanh #9cc4ff theo cung của kiếm (Pen Tool, Fill trắng); Hurt – ngôi sao va chạm 8 cánh vàng (Polygon Tool, Star) tại điểm trúng đòn; Victory – vài tia lấp lánh 4 cánh quanh mũi kiếm.
  12. Tách lớp hiệu ứng: mọi hiệu ứng nằm trong Group FX riêng. Trong game, vệt chém và sao va chạm thường do Particle System hoặc sprite riêng hiển thị – xuất 2 phiên bản: có và không có FX.
  13. Xuất: ẩn LOA, Stick và khung mẫu; FileTệp›Export›Export AsXuất ra (tùy chỉnh), PNG → hero_poses.png 1536 × 512 px; ẩn FX và xuất thêm hero_poses_nofx.png.
  14. Đưa vào Unity 6: Sprite Mode Multiple, Slice Grid By Cell Size 512 × 512, Pivot (Điểm neo) Bottom. Tạo 3 Animation Clip ngắn (Attack, Hurt, Victory) mỗi clip giữ sprite tư thế tương ứng 0.3–0.5 giây; trong Animator, nối từ Idle bằng Trigger attack, hurt, win. Sau này bạn thêm các khung chuyển tiếp (in-between) vào giữa mà không phải đổi state machine.
Mẹo: "Bài test hình nhỏ": thu nhỏ sheet còn 10% (khoảng 50 px mỗi tư thế) và tô đen. Ba bóng đen phải khác nhau đến mức bạn gọi tên được tư thế. Tư thế chỉ đọc được khi phóng to là tư thế yếu.
Lỗi hay gặp: Vẽ thân thẳng đứng rồi chỉ thay đổi tay – kiểu "ma-nơ-canh cử động tay". Tư thế mạnh bắt đầu từ thân và hông nghiêng theo đường hành động; tay chân chỉ đi theo.

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

  • Tư thế chuẩn bị (anticipation): vẽ thêm khung "lấy đà" trước Attack: người co lại, kiếm kéo ra sau – khung này làm đòn đánh có lực hơn nhiều.
  • Squash & stretch: ở Hurt, ép nhân vật lùn đi 5%; ở Victory, kéo dài 5% – cường điệu tạo năng lượng.
  • Xương 2D: tách nhân vật thành bộ phận (đầu, thân, tay, chân) và dựng xương bằng gói 2D Animation – 3 tư thế này trở thành key pose để Unity nội suy chuyển động mượt.

Mẹo & trick học nhanh

Một đường cho cả cơ thể

Đường hành động chỉ nên là một đường C hoặc S. Nếu bạn cần hai đường để mô tả dáng, tư thế đang bị chia đôi và sẽ kém mạnh mẽ.

Vật mềm đi trễ

Tóc, khăn, áo choàng luôn chậm hơn cơ thể một nhịp: lao tới thì chúng bay về sau, dừng đột ngột thì chúng văng về trước.

Tư thế đọc được qua bóng

Tránh để tay che ngang thân trong bóng dáng. Đưa tay và vũ khí ra ngoài khối thân để bóng đen cho thấy rõ động tác.

Kiểm tra nhanh

1 Đường hành động (line of action) là gì?
2 Ở tư thế trúng đòn, khăn quàng nên bay về hướng nào so với cú đánh?
3 Nếu đường thẳng đứng thả từ cổ rơi phía sau bàn chân trụ, nhân vật đang ở trạng thái nào?
4 Trong Animator của Unity 6, cách nào chuyển từ Idle sang tư thế tấn công khi bấm nút?

Bài tập: Ba tư thế then chốt cho nhân vật của bạn

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