Dự án 12: Bùng nổ lên cấp (level-up burst) 8 frame

Lên cấp là phần thưởng lớn nhất người chơi nhận được sau hàng giờ cày – hiệu ứng phải xứng đáng. Dự án này là bài tổng hợp đầu tiên của cấp Khó: một hiệu ứng có báo trước dài (hai frame hạt hút vào – tạo kỳ vọng), va chạm cực mạnh (chớp trắng gần kín ô, rồi cột sáng) và tan biến chậm, ăn mừng (sao bay lên lấp lánh). Bạn cũng học một kỹ thuật chuyên nghiệp: vẽ bằng thang xám rồi dùng Gradient Map (Ánh xạ dải màu) tô ramp màu – đổi từ vàng sang xanh hay tím chỉ bằng một cú nhấp.

Hình mẫu

Thời gian ước tính: khoảng 110 phút. Nhịp 50 – 50 – 42 – 83 – 83 – 83 – 100 – 100 ms (gần 0,6 giây). Hai frame báo trước dài bằng gần một phần sáu hiệu ứng – đủ để người chơi kịp "nín thở".

Chuẩn bị

• Canvas: 1024 × 512 px (lưới 4 × 2 ô 256 px), Resolution (Độ phân giải) 72, RGB Color, Background Contents: Transparent. Cạnh lũy thừa của 2.
• Công cụ chính: Adjustment Layer (Lớp điều chỉnh) Gradient Map, Brush (Cọ vẽ) Tool Soft/Hard Round, Polygon Tool với Star Ratio, Rectangle Tool + EditChỉnh sửa›TransformBiến đổi›PerspectivePhối cảnh cho cột sáng thon, Ellipse Tool cho vòng sóng, Custom Shape sao bốn cánh (dự án 3), FilterBộ lọc›Blur›Radial Blur kiểu Zoom.
• Thiết bị: khối chính dựng bằng Shape – chuột làm được trọn vẹn. Với bút Wacom, XP-Pen, Huion hay iPad + Apple Pencil (Bút chì), bước vẽ thang xám nhanh và tự nhiên hơn hẳn: Soft Round với Transfer › Opacity (Độ mờ đục) › Control: Pen Pressure (Lực nhấn bút), nhấn mạnh chỗ sáng nhất. Dùng chuột: chọn vùng bằng Lasso (Dây thòng lọng) rồi tô Gradient (Dải màu chuyển) Radial trắng → đen – kết quả tương tự.
• File mẫu: "Khung 8 frame lên cấp" – đặt dưới cùng làm nền đen. Đường hồng y = 225 là chân nhân vật, elip xám là vòng sóng, vòng xanh ở F1 – F2 là bán kính hạt hút vào, vòng hồng F3 là chớp sáng, nét vàng ở F4 là độ rộng cột sáng.

Các bước

1. Tạo file và Gradient Map: FileTệp›NewTạo mới, 1024 × 512 px, Transparent; Gridline Every 256 Pixels. Đặt file mẫu dưới cùng. Tạo 8 Group F1–F8. Trên cùng thêm LayerLớp›New Adjustment Layer›Gradient MapÁnh xạ dải màu, gradient 5 điểm: #000000 (0%) – #b45a00 (35%) – #ffc23a (60%) – #fff1a8 (82%) – #ffffff (100%). Từ giờ bạn chỉ vẽ trắng – xám – đen, Gradient Map tự đổi thành ramp vàng kim.
2. F4 – cột sáng (frame va chạm chính): Rectangle Tool vẽ hình chữ nhật rộng 82 px từ chân y = 225 lên tới đỉnh ô, Fill xám 35%. EditChỉnh sửa›TransformBiến đổi›PerspectivePhối cảnh: kéo góc trên vào trong để cột thon lại ở đỉnh (khớp nét vàng của file mẫu). Nhân đôi ba lần, mỗi lần hẹp hơn 30% và sáng hơn: xám 60%, xám 82%, trắng. Gradient Map biến chúng thành cam nâu → vàng cam → vàng kem → trắng.
3. Vòng sóng mặt đất F4: Ellipse Tool vẽ elip 200 × 52 px tâm ở chân (128, 225), Fill none, Stroke 10 px xám 35%; nhân đôi Stroke 6 px xám 60% và 2,5 px trắng. Vòng sóng lan ra từ chân nhân vật – năng lượng đập xuống đất.
4. Quầng sáng: layer dưới cột, Soft Round 260 px xám 55%, chấm một lần quanh thân cột rồi ⌘ Cmd+T kéo dài theo chiều dọc. Chấm thêm một elip mềm ở chân. Đặt Blend Mode (Chế độ hòa trộn) Linear Dodge (Add) (Cộng sáng) – trong thang xám, các vùng cộng sáng chồng lên nhau sẽ tiến về trắng, đúng như ánh sáng thật.
5. F3 – chớp trắng: trong ô 3, Ellipse Tool vẽ hình tròn bán kính 77 px (vòng hồng) tâm ở ngực nhân vật (128, 154), Fill trắng; quanh nó Polygon Tool 10 cạnh Star Ratio 40%, bán kính 118 px, xám 35%. Một vòng tròn xám 60% ở giữa hai lớp. Đây là frame sáng nhất – gần như cả ô trắng – và chỉ giữ 42 ms: ngắn đến mức mắt chỉ cảm nhận một "cú chớp".
6. F1 – F2 – hút vào: trong ô 1, vẽ 8 tia tam giác mảnh hướng vào tâm (128, 154) ở bán kính 97 px (vòng xanh), xám 35% với đầu nhọn chỉ vào trong; mỗi tia có một chấm trắng nhỏ ở đầu. Lõi xám 82% bán kính 6 px. Vòng chân elip nhỏ. F2: copy F1, dời các tia vào bán kính 46 px, lõi lớn hơn (12 px), vòng chân to hơn. Hạt hút vào là báo trước – tạo kỳ vọng trước khi bùng nổ.
7. F5 – F6 – cột thu hẹp: nhân đôi F4 sang ô 5: cột còn 62% bề rộng, vòng sóng lớn hơn (220 × 58 px) và mỏng hơn. Thêm 3 sao bốn cánh (Custom Shape) bay lên dọc cột. F6: cột chỉ còn 25% bề rộng, Opacity 75%; vòng sóng 245 × 64 px Opacity 45%; 4 sao cao hơn.
8. F7 – F8 – ăn mừng: không còn cột. F7: 5 sao bốn cánh nhỏ trôi gần đỉnh ô, một quầng sáng rất mờ. F8: 3 sao nhỏ hơn nữa, sát mép trên. Sao trôi chậm và mờ dần – pha tan biến dài, nhẹ nhàng, tạo cảm giác "đã xong, bạn mạnh hơn rồi".
9. Sao xanh nhấn: chọn 2 sao ở F5 – F6, đặt chúng trên Gradient Map (ngoài phạm vi ảnh hưởng) và tô #7cf7ff. Một vài điểm màu tương phản (xanh trên nền vàng) làm hiệu ứng phong phú mà không phá ramp chính.
10. Radial Blur cho F3: trên một bản merge của F3, FilterBộ lọc›Blur›Radial Blur Amount 20, Blur Method Zoom, đặt tâm vào lõi. Chớp sáng giờ có tia tỏa ra như ánh đèn flash. Opacity 60%, Linear Dodge (Add).
11. Thử đổi màu: nhấp đúp Gradient Map và thay ramp: xanh lam (#0b2a6b – #2f7bff – #bfe3ff – trắng) cho lên cấp kỹ năng, tím cho lên cấp thú cưng. Vì vẽ bằng thang xám nên mọi frame đổi màu đồng bộ. Lưu thêm một bản PSD cho mỗi màu nếu cần.
12. Kiểm tra nhịp và độ "đã": Timeline (Dòng thời gian): 0,05 – 0,05 – 0,04 – 0,08 – 0,08 – 0,08 – 0,1 – 0,1 giây. Đặt một sprite nhân vật 128 px vào giữa các ô, chân trên đường hồng. Cột sáng phải bao trùm nhân vật ở F4 nhưng nhân vật vẫn hiện lại rõ từ F6. Nếu cú bùng nổ thiếu lực, rút ngắn F3 hoặc làm F2 tối hơn – tương phản giữa báo trước tối và va chạm sáng tạo cú "đập".
13. Xuất và đưa vào Unity 6: ẩn nền và file mẫu, xuất PNG → vfx_levelup.png đúng 1024 × 512 px. Trong Unity 6: Sprite Mode Multiple, Grid By Cell Size 256 × 256, Pivot (Điểm neo) Custom Y 0,12 (chân y = 225), Apply. Tạo clip LevelUp.anim từ 8 sprite, Samples 24, giãn keyframe theo nhịp, bỏ Loop Time. Sprite Renderer dùng material Particles/Unlit Additive, Sorting Layer VFX. Thêm một Particle System con: Burst 20 hạt dùng texture sao bốn cánh, Start Speed 1–3 hướng lên, Gravity Modifier −0,2, Color over Lifetime mờ dần, Start Delay 0,15 (bắt đầu đúng lúc F4). Trong code, khi lên cấp: Instantiate prefab tại chân nhân vật, phát âm thanh và hiện chữ "LEVEL UP" bằng UI.

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

• Rung camera: dùng Cinemachine Impulse Source phát một xung nhỏ đúng frame F3 – màn hình rung 0,1 giây cùng cú chớp sáng.
• Lớp phía trước – phía sau: tách cột sáng thành hai sheet: nửa sau ở Sorting Layer dưới nhân vật, vòng sóng và sao ở trên – nhân vật như đứng trong cột sáng.
• Hiệu ứng mở khóa kỹ năng: dùng lại sheet với Gradient Map xanh lam, thay cột sáng bằng biểu tượng kỹ năng bay lên từ lõi.