1. Vẽ storyboard


Tham gia khoá học: Vẽ storyboard để nắm được cách vẽ storyboard cơ bản

1.1. Đọc và hiểu logic bài

  1. Mục đích, mục tiêu của bài là gì?
  2. Học sinh sẽ thấy gì? (Bản thân đoạn hoạt hình)
  3. Học sinh sẽ cảm thấy như thế nào? (Vui, thích thú, đồng cảm, tự hào…)
  4. Học sinh sẽ nhớ điều gì? (Gồm cả kiến thức và tình tiết câu chuyện)
  5. Học sinh sẽ học được gì? (Kiến thức, kĩ năng, thái độ)

1.2. Phác thảo storyboard

  1. Cảnh giới thiệu: Luôn có cảnh giới thiệu khi vào một không gian mới, quan trọng. Không cần nếu nhân vật chỉ “đi qua” không gian đó, background chung chung…
  2. Đa dạng góc máy, chuyển động camera để cảnh không bị quá tĩnh
  3. Vừa đủ: Storyboard phục vụ hình dung. Thấy đủ là dừng, đừng thêm nhiều chi tiết mất thời gian vẽ

1.3. Review storyboard

Review cùng team leader, người dựng hoạt hình (nếu mình không phải người dựng) và biên tập viên

  1. Tiến trình: Diễn biến câu chuyện và liên kết giữa các cảnh đã rõ ràng và logic chưa?
  2. Thông điệp truyền tải: Thông điệp cần truyền tải đã rõ ràng chưa? Liệu học sinh 3 tuổi (4, 5, 6… tuổi) có hiểu được không? Có cảm nhận đúng cảm xúc không?
  3. Mục tiêu học tập: Video như vậy đã đạt được mục tiêu học tập của bài chưa? Liệu học sinh có nhớ & học được những gì mình muốn học sinh nhớ & học chưa?
  4. Cải tiến: Có cách nào khác làm nổi bật nội dung cần truyền tải và giúp đạt được mục tiêu học tập tốt hơn không?
  5. Animation:
    • Có làm được không?
    • Có phức tạp quá không?
    • Có thể đơn giản hoá animation nhưng vẫn giữ được thông điệp cần truyền tải không?
    • Có thể dùng thủ thuật để tạo cảm giác có animation không? (VD: nhân vật chính diện ngồi xuống phải dùng cái bàn che chân, chỉ thấy nửa thân trên của nhân vật thấp xuống)

2. Thiết kế Assets


2.1. Lập danh sách Assets

  1. Lập danh sách asset theo form
  2. Check với người làm hoạt hình về danh sách asset để
  • Review danh sách asset đã đủ số lượng
  • Mô tả asset đã chi tiết và phù hợp với yêu cầu của bài
  • Đánh dấu các asset mình đã có sẵn từ các bài trước và không phải tìm lại
  • Ghi chú các asset nào đã có nhưng cần chỉnh sửa

2.2. Tìm Assets

  1. Tìm asset trên các website Novastars đã mua tài khoản.
  2. Gửi link cho người giữ tài khoản để down assets

Lưu ý:

  • Ưu tiên sử dụng các nhân vật đã có trong chương trình
  • Không sử dụng hình ảnh không có bản quyền: trên google, trên pinterest…

2.3. Thiết kế, chỉnh sửa assets

Thiết kế mới hoặc chỉnh sửa các assets để phù hợp với yêu cầu của bài. Đối với hình ảnh

  1. Sử dụng file template thiết kế hình ảnh để tiện cho việc thiết kế. Trong file đã bao gồm Logo Novastars, hình ảnh 1 số nhân vật chính, 1 số palette màu thường dùng, 1 số layout cho hoạt động tổng kết, thảo luận…
  2. Không xuất từng hình ảnh lẻ vào Unity. Chú ý làm đúng quy trình trong bước Xuất assets hình ảnh từ illustrator sang Unity

Đối với âm thanh

  1. Xuất file mp3

Đối với video

  1. Xuất file MP4, độ phân giải 720p, 30 hình/s
  2. Hoặc dùng Handbrake thu về độ phân giải như trên

2.4. Checklist khi tìm và thiết kế assets

Hình ảnh: Background, Nhân vật chính, nhân vật phụ, Props

  1. Chốt phong cách hình ảnh: Hình thật, hay hoạt hình (có 1000 loại hoạt hình → phải check sớm để chốt đúng phong cách hoạt hình), Màu sắc
  2. Đối với Background:
  • Check góc camera, độ xa gần phù hợp với storyboard
  • Đặt nhân vật vào để kiểm tra có phù hợp phong cách và góc quay không
  1. Đối với nhân vật:
  • Nhân vật có cần gắn xương không? Nếu cần thì tìm trên Freepik cũng cần tìm nhân vật tách sẵn khớp cho dễ làm
  • Nhân vật phụ, không chuyển động thì không cần.
  1. Đối với Props:
  • Dùng illus hoặc photoshop, Ghép nhanh props với background, cho nhân vật cầm thử… để xem đã phù hợp chưa

Âm thanh: Nhạc nền, hiệu ứng âm thanh

  • Người làm hoạt hình tự tìm nhạc nền & hiệu ứng phù hợp

Hiệu ứng hình ảnh & video

  • Không có lưu ý gì

2.5. 1 số yếu tố cần lưu ý khi làm assets

Về việc sử dụng icon trong bài

  1. Phần lớn icon không có ý nghĩa với trẻ và không có tác dụng hỗ trợ ghi nhớ kiến thức, kĩ năng. Việc đưa icon vào bài chỉ mang tính trang trí → mất thời gian và không hiệu quả.
  2. Chỉ nên sử dụng các icon nếu mình muốn trẻ nhớ icon đó. Ví dụ:
  • Tiết kĩ năng thoát hiểm trên xe ô tô khoá kín: Trẻ phải nhớ Icon đèn báo hiệu nguy hiểm trên ô tô để bấm khi cần
  • Ý nghĩa của các icon cảnh báo trên chai lọ: Trẻ nhớ để biết đâu là hoá chất nguy hiểm…

Về hình ảnh sử dụng trong bài

  1. Thống nhất phong cách hình ảnh sử dụng trong bài sớm với biên tập viên
  2. Nếu có nhân vật mới xuất hiện thì cần check lại xem nhân vật đó chỉ xuất hiện 1 lần hay sẽ xuất hiện nhiều lần, có yêu cầu đặc biệt gì về animation không trước khi thiết kế
  3. Vì hình ảnh trong bài thường cũng được dùng trong game và học liệu, giáo cụ, nên cần check với những bạn đang làm học liệu giáo cụ và game xem có tận dụng được thiết kế của nhau không.
  4. Những hình ảnh liên quan đến kĩ năng cần check kĩ với biên tập viên trước khi xuất

3. Xuất Assets từ illustrator sang Unity


3.1. Tạo artboard 2048 x 2048 px

  1. Trong illustrator, tạo 1 artboard cỡ 2048 x 2048 px. Đây là cỡ khung phổ biến khi xuất hình ảnh cho game.
  • Nếu lượng assets ít, có thể dùng artboard 1024 x 1024 hoặc 1024 x 2048.
  • Nếu lượng assets nhiều, có thể tạo nhiều artboard để xuất

3.2. Đưa hình ảnh vào artboard

  1. Sắp xếp các assets cần xuất vào trong artboard. Xếp assets to vào trước rồi đến assets nhỏ
  2. Đảm bảo đường bao của các assets (hình vuông lựa chọn bao quanh mỗi assets) không chạm vào đường bao của các assets khác.
  3. Có thể xoay lại asset cho vừa khổ artboard, sau đó vào Unity xoay lại. Tuy nhiên cách này hơi mất công, chỉ sử dụng nếu tiết kiệm được rất nhiều diện tích.

3.3. Xuất assets

  1. Chỉnh lại position của artboard để x và y tròn số
  2. Chọn File > Export > Export for screens… với setting Scale = 1x, Format = PNG

4. Đưa assets vào Unity


4.1 Xử lý ảnh

  1. Ấn vào asset hình ảnh vừa đưa vào Unity

2. Kiểm tra hình ảnh đã được xuất đúng kích thước chưa

  • Unity sẽ nén được các hình ảnh có chiều dài và chiều rộng chia hết cho 4.
  • Nếu trong inspector, phần xem trước hình ảnh có chữ “Compressed” và “DXT5” là hình ảnh đã có kích thước phù hợp và được Unity nén dung lượng thành công.