Mẹo & trick học nhanh

507 mẹo tổng hợp từ các bài học, chia theo chặng. Phím tắt hiển thị cho macOS.

Chọn màu ô bằng vòng màu

Đặt 5 màu ô cách nhau khoảng 60–70° trên vòng màu (vàng, xanh ngọc, xanh dương, xanh lá, tím). Màu càng cách xa, người chơi càng tìm nhanh trong danh sách dài.

Dự án 1: Gói 5 icon nâng cấp cho game idle →
Căn giữa bằng Align

Chọn layer biểu tượng và layer Face, rồi trên thanh Options của Move Tool (V) bấm Align horizontal centers và Align vertical centers – biểu tượng nằm giữa ô tuyệt đối.

Dự án 1: Gói 5 icon nâng cấp cho game idle →
Đặt tên layer theo icon

Đặt tên Group là 01_tap, 02_pickaxe… trùng với thứ tự trên sheet. Khi Unity cắt ra upgrades_128_0 … upgrades_128_4, bạn biết ngay số nào là nâng cấp nào.

Dự án 1: Gói 5 icon nâng cấp cho game idle →
Một ý tưởng duy nhất

Icon tốt chỉ nói một điều: một nhân vật, một vật phẩm hoặc một biểu tượng. Nếu bạn phải giải thích icon có gì, nghĩa là nó đang có quá nhiều thứ.

Dự án 2: Icon app game mobile 1024 × 1024 →
Xem trên nền thật

Chụp màn hình điện thoại của bạn, mở trong Photoshop và đặt icon thu nhỏ vào giữa các icon khác. Icon phải nổi bật nhờ màu và độ tương phản, không nhờ chi tiết.

Dự án 2: Icon app game mobile 1024 × 1024 →
Vùng an toàn theo phần trăm

Vòng an toàn 66% của ảnh 1024 px có đường kính khoảng 676 px. Nếu đổi cỡ canvas, chỉ cần nhân lại theo phần trăm – quy tắc không đổi.

Dự án 2: Icon app game mobile 1024 × 1024 →
Vát 20% là con số an toàn

Cạnh vát khoảng 20% cạnh khối (13 px trên 64 px) nhìn rõ ở cả cỡ nhỏ trên điện thoại. Dưới 10% thì khối trông phẳng; trên 30% thì mặt giữa quá nhỏ.

Dự án 3: Bộ khối puzzle xếp gạch và nền bảng →
Bám lưới khi dời

Bật ViewHiển thị›Snap (⇧ Shift+⌘ Cmd+;). Khi kéo Group bằng Move Tool, nó sẽ "hít" vào lưới 64 px – không bao giờ lệch nửa pixel.

Dự án 3: Bộ khối puzzle xếp gạch và nền bảng →
Xem bảng thật

Tạo file thử 640 × 1280 px, đặt sheet đã xuất vào nhiều lần (Ctrl+J) và xếp thành bảng có vài hàng khối. Lỗi về độ tương phản giữa các màu sẽ lộ ra ngay.

Dự án 3: Bộ khối puzzle xếp gạch và nền bảng →
Dải màu "lệch tông"

Tông tối của một dải nên ngả về tím/xanh, tông sáng ngả về vàng (ví dụ nâu tối #5c3a24 hơi đỏ, nâu sáng #c58a52 hơi cam). Dải màu lệch tông trông sống động hơn dải chỉ tối – sáng của cùng một màu.

Dự án 4: Bộ 8 vật phẩm roguelike pixel 24 × 24 →
Vẽ đường thẳng pixel

Bấm một điểm bằng Pencil, giữ ⇧ Shift và bấm điểm cuối – Photoshop nối bằng đường 1 px. Đường chéo 1-1 và 2-1 là đẹp nhất; tránh chéo kiểu 3-1-2 lộn xộn.

Dự án 4: Bộ 8 vật phẩm roguelike pixel 24 × 24 →
Nhìn tổng thể

Nhấn ⌘ Cmd+; tắt lưới và ⌘ Cmd+H ẩn đường viền vùng chọn khi muốn ngắm cả dải – lưới dày đặc làm bạn khó thấy khối.

Dự án 4: Bộ 8 vật phẩm roguelike pixel 24 × 24 →
Nhịp chiều cao

Giai đoạn sau nên cao ít nhất gấp 1,5–2 lần giai đoạn trước ở đầu chu kỳ. Nếu chênh lệch quá ít, người chơi không thấy cây lớn và nghĩ game bị lỗi.

Dự án 5: Cây trồng nông trại 4 giai đoạn lớn →
Bật tắt nhanh để so sánh

Giữ ⌥ Option và bấm biểu tượng con mắt của một layer để chỉ hiện layer đó. Bấm lần nữa để hiện lại tất cả – cách nhanh nhất để so hai giai đoạn.

Dự án 5: Cây trồng nông trại 4 giai đoạn lớn →
Lá bằng Pen Tool

Một chiếc lá chỉ cần 2 điểm neo: bấm ở cuống, bấm-kéo ở ngọn để tạo đường cong, rồi đóng lại. Nhân đôi lá bằng ⌘ Cmd+J và xoay bằng ⌘ Cmd+T thay vì vẽ lại.

Dự án 5: Cây trồng nông trại 4 giai đoạn lớn →
Vẽ to, xuất nhỏ

Vẽ ở cỡ gấp 4 cho bạn không gian chỉnh chi tiết, nhưng hãy thường xuyên mở cửa sổ thứ hai (WindowCửa sổ›Arrange›New Window for…) ở 25% – đó là cỡ người chơi sẽ thấy.

Dự án 6: Platformer pack – nhân vật, quái và vật phẩm →
Khóa đường chân

Kéo guide ngang ở đường chân và bật ViewHiển thị›Lock Guides (⌥ Option+⌘ Cmd+;) để không vô tình kéo lệch khi di chuyển sprite.

Dự án 6: Platformer pack – nhân vật, quái và vật phẩm →
Một màu bóng chung

Dùng một màu tím nhạt với Blend Mode Multiply cho bóng của mọi sprite. Bóng cùng màu là "keo" gắn cả gói asset lại với nhau.

Dự án 6: Platformer pack – nhân vật, quái và vật phẩm →
Đối xứng tuyệt đối

Vẽ một nửa, nhân đôi, Flip Horizontal và gộp. Phi thuyền lệch 1–2 px sẽ trông như đang bay chéo khi game di chuyển nó thẳng.

Dự án 7: Bộ asset bắn phi thuyền (shoot ’em up) →
Quầng sáng vẽ sẵn

Outer Glow trong Photoshop được xuất cùng PNG. Đặt Size vừa phải (6–10 px) và chừa đủ chỗ trống trong ô để quầng sáng không bị cắt cụt ở mép.

Dự án 7: Bộ asset bắn phi thuyền (shoot ’em up) →
Kích thước nói lên sức mạnh

Quái yếu nhỏ và tròn, quái mạnh to và vuông. Người chơi đọc "lượng máu" từ kích thước trước cả khi thấy thanh máu.

Dự án 7: Bộ asset bắn phi thuyền (shoot ’em up) →
Vẽ 3 cấp trên cùng một file

Đừng vẽ xong cấp 1 rồi mới nghĩ tới cấp 3. Phác cả 3 cạnh nhau trước để thấy "nhịp" tăng tiến; chỉnh tỉ lệ ở giai đoạn phác rẻ hơn nhiều so với khi đã tô màu.

Dự án 8: Tháp tower defense 3 cấp nâng cấp →
Phân bố đều bằng Align

Chọn các layer lỗ châu mai rồi trên thanh Options của Move Tool bấm Distribute horizontal centers – khoảng cách đều tuyệt đối, không cần đo.

Dự án 8: Tháp tower defense 3 cấp nâng cấp →
Kiểm tra trên nền cỏ

Thêm layer nền cỏ #6cbf5a tạm thời dưới cùng. Đế đá xám phải nổi rõ trên cỏ; nếu không, làm đế tối hơn hoặc thêm bóng đổ elip.

Dự án 8: Tháp tower defense 3 cấp nâng cấp →
Lông mày quyết định cảm xúc

Che miệng nhân vật bằng tay rồi nhìn lông mày: xếch xuống giữa là giận, xếch lên giữa là buồn, nhướng cao là ngạc nhiên. Nếu chưa đoán được, chỉnh lông mày trước khi chỉnh miệng.

Dự án 9: Nhân vật visual novel 4 biểu cảm và nền →
Đặt tên layer có hệ thống

Đặt tên Group Face_Vui, Face_Gian… và file xuất mai_face_vui.png. Khi có 5 nhân vật × 10 biểu cảm, tên chuẩn giúp lập trình viên tìm file trong vài giây.

Dự án 9: Nhân vật visual novel 4 biểu cảm và nền →
Làm mịn nét

Thanh Options của Brush có ô Smoothing. 30–50% giúp nét dài mượt khi dùng bút; với chuột, tăng lên 60–70% và vẽ chậm.

Dự án 9: Nhân vật visual novel 4 biểu cảm và nền →
Chỉ kẹp lớp sơn

Adjustment Layer kẹp vào layer Paint chỉ đổi màu sơn. Nếu đặt Hue/Saturation tự do trên cùng Group, cả kính và lốp cũng đổi màu – kiểm tra biểu tượng mũi tên gập ở đầu layer chỉnh.

Dự án 10: Xe đua top-down 4 màu và đường đua tile →
Xe nhìn từ trên xuống phải đối xứng

Vẽ nửa trái, nhân đôi, Flip Horizontal và gộp. Xe lệch 1 px sẽ trông như đang trượt ngang khi Unity xoay nó.

Dự án 10: Xe đua top-down 4 màu và đường đua tile →
Mép ô không có chi tiết

Cỏ, vết bánh xe, đá vụn chỉ đặt cách mép ô ít nhất 8 px. Chi tiết nằm ngay mép sẽ bị cắt đôi và lặp lại lộ liễu khi lát.

Dự án 10: Xe đua top-down 4 màu và đường đua tile →
Một hình thoi mẫu duy nhất

Mọi ô đều nhân bản từ một layer Top mẫu 128 × 64. Hình thoi vẽ tay từng ô sẽ lệch nửa pixel và tạo khe khi ghép.

Dự án 11: Tile isometric 2:1 và một công trình →
Ba mặt, ba giá trị

Mặt trên sáng nhất, thành trái trung bình, thành phải tối nhất. Kiểm tra bằng cách tạm thêm Adjustment Layer Hue/Saturation với Saturation −100 trên cùng: ở chế độ trắng đen, khối vẫn phải rõ 3 mặt.

Dự án 11: Tile isometric 2:1 và một công trình →
Dời theo bước ô

Khi ghép bản đồ, mỗi bước sang phải – xuống là (+64, +32), sang trái – xuống là (−64, +32). Dùng Move Tool và gõ số trong Properties để không lệch.

Dự án 11: Tile isometric 2:1 và một công trình →
Thiết kế một bên, lật bên kia

Mọi chỉnh sửa làm trên Group P1 rồi nhân đôi lật lại cho P2. Sửa trực tiếp trên P2 sẽ làm hai bên lệch nhau vài pixel – người chơi cảm nhận được sự "không công bằng".

Dự án 12: HUD game đối kháng →
Hình bình hành có cạnh xiên đều

Vẽ hình bình hành bằng Rectangle rồi ⌘ Cmd+T › chuột phải › Skew, kéo cạnh trên sang phải 20 px. Mọi thanh dùng cùng độ xiên để HUD có cùng "nhịp" chéo.

Dự án 12: HUD game đối kháng →
Font số riêng

Đồng hồ và cấp siêu cấp nên dùng một font số đậm, chiều rộng các chữ số bằng nhau (tabular). Số "11" và "88" rộng như nhau thì đồng hồ không bị "rung" khi đếm.

Dự án 12: HUD game đối kháng →
Kiểm tra bằng trắng đen

Thêm tạm Hue/Saturation Saturation −100 trên cùng và bấm qua 3 Layer Comps. Bản đêm vẫn phải đọc được hình khối – nếu chỉ còn một mảng đen, giảm Opacity lớp Multiply.

Dự án 13: Một cảnh nền, ba biến thể ngày – đêm – mưa →
Chọn vùng trên layer khác

Magic Wand với Sample All Layers chọn được cửa sổ trong Group BASE dù bạn đang đứng ở Group DEM. Sau đó tạo layer mới và tô – không động tới cảnh gốc.

Dự án 13: Một cảnh nền, ba biến thể ngày – đêm – mưa →
Cập nhật Layer Comp

Nếu thêm layer mới vào DEM sau khi đã tạo comp, chọn comp Dem và bấm Update Layer Comp (biểu tượng mũi tên vòng) để comp ghi nhớ trạng thái mới.

Dự án 13: Một cảnh nền, ba biến thể ngày – đêm – mưa →
Thumbnail trước, chi tiết sau

Ba thumbnail 320 × 180 bằng 3 giá trị xám tốn 15 phút nhưng tiết kiệm hàng giờ. Bố cục sai không cứu được bằng chi tiết đẹp.

Dự án 14: Màn giới thiệu boss 16:9 →
Color Dodge cần nền tối

Color Dodge phát sáng mạnh nhất trên vùng tối – trung bình. Trên vùng gần trắng nó chỉ "cháy" thành mảng trắng; vì vậy giữ thân boss tối thì vết nứt mới rực.

Dự án 14: Màn giới thiệu boss 16:9 →
Xoay chữ theo dải

Gõ chữ ngang trước, chỉnh font và Tracking cho đẹp, rồi mới ⌘ Cmd+T xoay. Sửa chữ đã xoay vẫn được vì layer chữ vẫn là chữ (không rasterize).

Dự án 14: Màn giới thiệu boss 16:9 →
Màu có nghĩa

Gán nghĩa cố định cho màu và không phá lệ: xanh lá luôn là "đi tiếp", đỏ luôn là "thoát/hủy". Người chơi học quy tắc sau 2 màn hình và bấm không cần đọc chữ.

Dự án 15: Gói UI hoàn chỉnh cho 4 màn hình →
Bội số của 8

Kích thước và khoảng cách dùng bội số 8 (8, 16, 24, 32, 48…). Bố cục thẳng hàng hơn và lập trình viên dựng lại trong Unity chính xác hơn.

Dự án 15: Gói UI hoàn chỉnh cho 4 màn hình →
Kiểm tra 9-slice ngay trong Photoshop

Kéo giãn bản sao panel bằng ⌘ Cmd+T gấp 3 chiều ngang. Nếu góc bo và hoa văn bị kéo méo, nghĩa là chúng nằm ngoài vùng 48 px sát mép – sửa trước khi đưa vào Unity.

Dự án 15: Gói UI hoàn chỉnh cho 4 màn hình →