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

Dự án 3: Thử thách hình khối – tròn, vuông, tam giác

Dựng 3 nhân vật, mỗi nhân vật từ một hình chủ đạo: tròn (thân thiện), vuông (vững chắc), tam giác (nguy hiểm) – học "ngôn ngữ hình khối" để người chơi đoán tính cách trước khi nhìn mặt.

Nâng cao 80 phút ★★★ Dễ Hướng dẫn cho macOS · đổi sang Windows

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ở (⌘ Cmd+O).

Ngôn ngữ hình khối (shape language) là bí quyết các studio hoạt hình và game dùng để kể tính cách nhân vật chỉ trong nửa giây: hình tròn gợi sự mềm mại, an toàn, thân thiện; hình vuông gợi sự vững chãi, đáng tin, khó lay chuyển; hình tam giác gợi sự sắc bén, nhanh nhẹn, nguy hiểm. Trong thử thách này, bạn nhận một hình và phải "nhét" cả nhân vật vào trong nó.

Hình mẫu

Ba nhân vật: thợ bánh tròn trịa đội mũ đầu bếp, người gác bằng đá vuông vức mắt vàng, phù thủy tam giác đội nón nhọn cầm gậy pha lê
Ba nhân vật: thợ bánh tròn trịa đội mũ đầu bếp, người gác bằng đá vuông vức mắt vàng, phù thủy tam giác đội nón nhọn cầm gậy pha lê

Thời gian ước tính: khoảng 80 phút (khoảng 25 phút mỗi nhân vật). Để ý: không chỉ thân, mà từng chi tiết cũng lặp lại hình chủ đạo – mũ đầu bếp tròn, mắt đá vuông, nón và pha lê nhọn.

Chuẩn bị

  • Canvas: 1536 × 512 px (3 ô 512 × 512), Resolution (Độ phân giải) 72, RGB Color, Background Contents: Transparent.
  • Công cụ chính: Ellipse Tool, Rectangle Tool, Polygon Tool (Number of Sides: 3), Pen Tool (Bút tạo đường) (P), Direct Selection Tool (A), Clipping Mask (Mặt nạ cắt).
  • Thiết bị: bài này gần như dựng toàn bộ bằng Shape – chuột có lợi thế vì các hình đều, sạch. Nếu dùng bút Wacom, XP-Pen, Huion hay iPad, hãy phác bằng Brush (Cọ vẽ) trước rồi mới dựng lại bằng Shape; đừng vẽ tay trực tiếp nét cuối vì dễ làm méo hình chủ đạo.
  • File mẫu: "Bảng thử thách hình khối" – mỗi ô có sẵn hình nét đứt và nhãn tính cách. Đặt trên cùng, Opacity (Độ mờ đục) 50%.
MàuMã hexDùng cho
#ffe6c7Thợ bánh – da (bóng #f2c79a)
#ff9fb2Tạp dề
#9aa7b8Đá (bóng #6b7a8f)
#c9a227Tấm khiên ngực
#ffd23fMắt đá phát sáng
#4b2f7aÁo choàng phù thủy (bóng #2f1c52)
#ff4fa0Pha lê
#1b1a24Viền

Các bước

Sáu giai đoạn: đặt hình chủ đạo, nét viền, màu nền, đổ bóng, ánh sáng, chi tiết kể tính cách
Sáu giai đoạn: đặt hình chủ đạo, nét viền, màu nền, đổ bóng, ánh sáng, chi tiết kể tính cách
  1. Tạo file và đặt mẫu: ⌘ Cmd+N 1536 × 512 px, Transparent. FileTệp›Place Embedded file mẫu, khóa lại (⌘ Cmd+/). Kéo Guide ngang ở đường chân y = 470.
  2. Ba hình chủ đạo: trên layer Guide_Shapes, vẽ lại hình tròn đường kính 360 px (ô 1), hình chữ nhật 320 × 360 px (ô 2), tam giác cao 400 px (ô 3) chỉ bằng nét Stroke 3 px màu xanh. Đây là "khung" – nhân vật không được tràn ra ngoài quá 10%.
  3. Phác nhanh (layer Sketch, 30%): mỗi ô 3 phút, vẽ 3 ý tưởng nhỏ chồng lên nhau rồi chọn ý tưởng đọc tốt nhất. Câu hỏi: "Nếu tô đen kín, người ta có đoán ra tính cách không?"
  4. Thợ bánh tròn – thân: Ellipse Tool vẽ một hình tròn lớn 216 × 216 px làm cả đầu lẫn thân, Fill #ffe6c7, Stroke 3 px. Tay và chân cũng là elip tròn nhỏ – không có góc nhọn nào.
  5. Thợ bánh – chi tiết tròn: mũ đầu bếp ghép từ 3 hình tròn + một dải bo góc; tạp dề là nửa elip dưới bụng màu #ff9fb2; mắt cười cong và má hồng tròn to. Tính cách: hiền, ấm áp.
  6. Người gác đá vuông – thân: Rectangle Tool vẽ thân 176 × 176 px (Radius góc chỉ 10 px – vẫn đọc là vuông), đầu 96 × 72 px đặt sát trên vai, tay là hai khối 48 × 112 px. Fill #9aa7b8.
  7. Người gác đá – chi tiết vuông: tấm khiên ngực hình chữ nhật vàng, mắt là 2 ô vuông nhỏ #ffd23f, lông mày là 2 nét ngang thẳng. Vết nứt vẽ bằng Pen Tool với các đoạn gấp khúc góc vuông. Vài mảng rêu xanh trên đỉnh cho thấy "đứng gác rất lâu rồi".
  8. Phù thủy tam giác – thân: Pen Tool vẽ áo choàng hình tam giác đáy rộng 184 px, cao 236 px, Fill #4b2f7a. Đầu là elip nhỏ – đầu nhỏ trên thân to nhọn làm nhân vật trông khó lường.
  9. Phù thủy – chi tiết nhọn: nón nhọn cao gấp đôi đầu, vành nón là elip dẹt; mắt là 2 tam giác nhỏ phát sáng vàng, lông mày xiên, miệng nhếch một bên. Gậy là một đường thẳng mảnh, đầu gậy là viên pha lê hình thoi #ff4fa0.
  10. Đổ bóng: mỗi khối một layer kẹp (⌘ Cmd+⌥ Option+G). Bóng cũng theo hình chủ đạo: thợ bánh bóng hình lưỡi liềm tròn, người đá bóng là dải chữ nhật bên phải, phù thủy bóng là tam giác nửa phải áo choàng.
  11. Ánh sáng: layer kẹp thứ hai, vệt sáng trắng dẹt trên đỉnh đầu thợ bánh, dải sáng mảnh #c9d3df ở mép trên khối đá, điểm sáng nhỏ trên viên pha lê.
  12. Bài test bóng dáng: nhân đôi cả 3 Group, gộp mỗi bản bằng ⌘ Cmd+E, rồi khóa điểm ảnh và tô đen kín. Nhìn 3 bóng đen: tròn – vuông – tam giác phải hiện ra rõ ràng. Xong thì ẩn các bản bóng đen đi.
  13. Xuất: ẩn file mẫu, Guide_Shapes và Sketch. FileTệp›Export›Export AsXuất ra (tùy chỉnh), PNG → shape_trio.png 1536 × 512 px.
  14. Đưa vào Unity 6: Sprite Mode Multiple, Slice Grid By Cell Size 512 × 512, Pivot (Điểm neo) Bottom, Pixels Per Unit (Số pixel mỗi đơn vị) 256. Đặt 3 nhân vật cạnh nhau trong Scene để xem tỉ lệ; nếu một nhân vật trông quá to so với nhóm, chỉnh Scale trong Transform thay vì vẽ lại.
Mẹo: Pha trộn hình khối tạo tính cách phức tạp hơn: anh hùng thường là vuông (đáng tin) với vài chi tiết tam giác (dũng mãnh); phản diện quyến rũ là tam giác với vài đường tròn. Nhưng luôn giữ một hình chủ đạo chiếm phần lớn diện tích.
Lỗi hay gặp: Thân đúng hình chủ đạo nhưng chi tiết "phá" hình – ví dụ người gác đá vuông có mắt tròn to long lanh, hay phù thủy tam giác có má phúng phính. Mỗi chi tiết phải nhắc lại hình chủ đạo, nếu không thông điệp bị lẫn.

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

  • Đảo vai: vẽ một quái vật hình tròn nhưng là phản diện (ví dụ con bánh bao ăn thịt) – sự tương phản giữa hình hiền và hành vi xấu tạo yếu tố hài hước.
  • Hình thứ tư: thử hình giọt nước hoặc ngôi sao và tự đặt tính cách cho nó.
  • Đồng đội: đặt 3 nhân vật vào cùng một cảnh nhỏ 1920 × 1080 như một nhóm phiêu lưu – kiểm tra chúng có "đứng chung" được không (cùng nét, cùng ánh sáng).

Mẹo & trick học nhanh

Bài test bóng đen

Tô đen kín nhân vật là cách nhanh nhất kiểm tra ngôn ngữ hình khối: nếu bóng đen của 3 nhân vật trông na ná nhau, hình chủ đạo chưa đủ mạnh.

Combine Shapes để ghép khối

Trên thanh Options của Shape Tool chọn Path Operations › Combine Shapes để ghép nhiều hình thành một layer – sửa màu và Stroke một lần cho cả khối.

Góc bo cũng là ngôn ngữ

Bán kính góc lớn làm hình vuông "hiền" đi; góc gần như vuông 90° làm nó cứng rắn. Với người gác đá, giữ Radius dưới 12 px.

Kiểm tra nhanh

1 Hình tam giác chủ đạo thường gợi tính cách nào?
2 Người gác đá vuông nên có đôi mắt như thế nào để giữ ngôn ngữ hình khối?
3 Cách nhanh nhất để kiểm tra 3 nhân vật có đọc được hình chủ đạo không?

Bài tập: Bộ ba hình khối 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