Bạn học Photoshop trên máy nào? Phím tắt và hướng dẫn sẽ hiển thị đúng theo lựa chọn của bạn.

Mẹo & trick học nhanh

687 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 Windows.

Đều tay về độ sáng

Khoảng cách độ sáng B giữa các tông nên gần bằng nhau (ví dụ 23 – 48 – 76 – 94 – 100). Một bậc quá gần sẽ "biến mất" khi xem ở cỡ thật, một bậc quá xa sẽ tạo đường gãy trên khối tròn.

Dự án 1: Dải màu ramp 5 tông có hue shifting →
Bão hòa cao nhất ở giữa

Tông nền và tông tối 1 thường có S cao nhất; hai đầu dải (tối nhất, sáng nhất) giảm S. Nếu tông tối nhất quá rực, bóng sẽ trông như phát sáng.

Dự án 1: Dải màu ramp 5 tông có hue shifting →
Chọn màu bằng Swatches

Khi đã có nhóm Ramp 25, đừng mở Color Picker nữa. Bấm thẳng vào ô màu trong Swatches – bạn sẽ không bao giờ vô tình tạo ra màu thứ 26 chỉ lệch 1 đơn vị.

Dự án 1: Dải màu ramp 5 tông có hue shifting →
Dither là "màu thứ năm" miễn phí

Một vùng bàn cờ 50% của hai tông trông như một tông ở giữa. Với giới hạn 5 màu, bạn có thêm 3 "tông giả" ở 3 mép chuyển mà bảng màu vẫn chỉ 5.

Dự án 2: Bốn kiểu dithering trên khối cầu →
Kiểm tra ở cỡ thật

Nhấn Ctrl+1 để xem 100%. Dither đẹp là dither không nhận ra ở cỡ thật – chỉ thấy khối tròn mềm. Nếu ở 100% vẫn thấy rõ ô cờ, mép chuyển của bạn quá rộng.

Dự án 2: Bốn kiểu dithering trên khối cầu →
Khóa pixel trong suốt

Bật Lock Transparent Pixels trên layer khối cầu trước khi dither: Pencil không thể vẽ lọt ra ngoài viền, bạn tha hồ chấm điểm mà không sợ hỏng hình tròn.

Dự án 2: Bốn kiểu dithering trên khối cầu →
Selout = viền mượn màu

Màu viền của mỗi đoạn lấy từ tông tối của vùng nằm ngay trong đoạn đó. Vành thép mượn xám tím, mặt gỗ (nếu chạm viền) mượn nâu tối – không thêm màu mới vào bảng.

Dự án 3: Viền selout và anti-alias thủ công trên chiếc khiên →
Lật canvas để soi lỗi

ImageHình ảnh›Image Rotation›Flip Canvas Horizontal làm mắt bạn "quên" hình cũ và thấy ngay đường cong lệch hay bậc thang không đều. Đây là cách nhanh nhất để soi hình tròn.

Dự án 3: Viền selout và anti-alias thủ công trên chiếc khiên →
Bậc thang đẹp

Đường cong pixel đẹp khi độ dài các bậc tăng hoặc giảm đều đặn (1, 1, 2, 3, 4…). Một bậc "ngược" (3, 1, 3) là nguyên nhân chính của răng cưa – sửa nó trước khi nghĩ tới anti-alias.

Dự án 3: Viền selout và anti-alias thủ công trên chiếc khiên →
Chữ số luôn monospace

Dù chữ cái có thể hẹp rộng khác nhau (I hẹp, M rộng), chữ số phải cùng chiều rộng. Bộ đếm thời gian 09:59 → 10:00 sẽ đứng yên thay vì giật ngang.

Dự án 4: Bộ chữ số và chữ pixel 5 × 7 →
Bóng đổ thay cho viền

Viền đủ 4 phía làm chữ 5 × 7 thành 7 × 9 và dễ dính nhau. Bóng lệch 1 px xuống – sang phải chỉ tốn 1 màu, không tăng kích thước ô mà vẫn đọc được trên nền sáng.

Dự án 4: Bộ chữ số và chữ pixel 5 × 7 →
Đường chéo 1:1

Trong ô 5 × 7, chỉ dùng đường chéo 1 pixel mỗi bậc (như chữ X, N). Chéo 2:1 trông gãy khúc ở cỡ nhỏ và làm chữ mất đều.

Dự án 4: Bộ chữ số và chữ pixel 5 × 7 →
Ít cụm mà rõ

Một bụi cây 64 px chỉ cần 5–7 cụm. Nhiều cụm nhỏ hơn 12 px sẽ thành nhiễu ở cỡ thật. Cụm càng gần mặt trước càng to.

Dự án 5: Cụm lá cây và bụi (foliage clusters) →
Khe tối là bí quyết

Dải tông tối nhất ở chỗ hai cụm chạm nhau quan trọng hơn mọi chi tiết lá. Có khe tối, mắt tự hiểu đây là nhiều chùm lá chồng lên nhau.

Dự án 5: Cụm lá cây và bụi (foliage clusters) →
Lật được, xoay không

Lật ngang giữ đúng pixel và gần đúng hướng sáng nếu nguồn sáng ở trên. Xoay 90° hay 45° bằng Free Transform làm pixel méo và ánh sáng sai hướng.

Dự án 5: Cụm lá cây và bụi (foliage clusters) →
Vẽ sàn trước tiên

Sàn chiếm 60–70% màn hình. Một ô sàn đẹp, lặp không lộ đường nối có giá trị hơn mười đồ trang trí. Hãy dành 20–30 phút chỉ cho ô sàn gốc.

Dự án 6: Tileset hầm ngục 16 × 16 (8 × 8 ô) →
Ánh sáng từ trên

Trong góc nhìn 3/4, nguồn sáng giả định ở phía trên màn hình: mép trên viên gạch sáng, mép dưới tối, bóng tường đổ xuống sàn. Giữ quy ước này cho mọi ô để các ô ghép thành một không gian thống nhất.

Dự án 6: Tileset hầm ngục 16 × 16 (8 × 8 ô) →
Thay màu hàng loạt

Magic Wand với Tolerance 0 và bỏ Contiguous chọn mọi pixel cùng một màu trên cả 64 ô. Tô màu mới bằng Alt+Backspace là đổi cả tileset trong một giây – lý do vì sao giữ đúng 16 màu là rất đáng.

Dự án 6: Tileset hầm ngục 16 × 16 (8 × 8 ô) →
Frame giữ lâu

Không phải frame nào cũng dài như nhau. Frame lấy đà ngắn, frame mở hẳn giữ lâu (0,4–0,6 giây) để người chơi kịp thấy phần thưởng. Thời lượng frame là một nửa của hoạt ảnh.

Dự án 7: Rương pixel mở nắp 4 frame →
Ánh sáng không có viền

Viền #1b1a24 dành cho vật thể rắn. Tia sáng, lóe sáng, ánh vàng để không viền – nhờ đó mắt hiểu ngay đó là ánh sáng chứ không phải đồ vật.

Dự án 7: Rương pixel mở nắp 4 frame →
Khóa layer thân

Sau bước sao chép thân, bấm biểu tượng ổ khóa của layer Body. Bạn sẽ không bao giờ lỡ tay vẽ lên thân khi đang sửa nắp.

Dự án 7: Rương pixel mở nắp 4 frame →
Offset chỉ trong vùng chọn

Khi có vùng chọn, Filter Offset với Wrap Around chỉ cuộn pixel bên trong vùng đó. Chọn đúng ô 16 × 16 trước khi Offset để không làm lệch các frame bên cạnh.

Dự án 8: Ô nước chảy 4 frame liền mạch (animated tile) →
Nền chiếm phần lớn

Khoảng 60% pixel nên là màu nền #2f66b0. Quá nhiều vệt sáng tối làm mặt nước rối và nhấp nháy khó chịu khi cả màn hình đầy nước.

Dự án 8: Ô nước chảy 4 frame liền mạch (animated tile) →
Pattern để xem lát

EditChỉnh sửa›Define Pattern rồi Fill Pattern lên một file lớn là cách nhanh nhất để thấy ô trông thế nào khi lặp hàng chục lần – đường nối nhỏ nhất cũng lộ ra.

Dự án 8: Ô nước chảy 4 frame liền mạch (animated tile) →
Một pixel là đủ

Ở nhân vật 48 px, dời 1 px đã thấy rõ hơi thở; dời 2 px trông như nhảy. Hãy tin vào chuyển động nhỏ – người chơi sẽ nhìn idle này hàng giờ.

Dự án 9: Nhân vật pixel 48 × 48 đứng thở (idle) 4 frame →
Cùng PPU cho cả game

Đặt mọi sprite pixel (tileset, nhân vật, vật phẩm) cùng một Pixels Per Unit. Nếu nhân vật PPU 48 còn tileset PPU 16, pixel nhân vật sẽ nhỏ gấp ba pixel nền – mất cảm giác pixel art thống nhất.

Dự án 9: Nhân vật pixel 48 × 48 đứng thở (idle) 4 frame →
Nhóm Upper / Lower

Tách nhân vật thành hai group ngay từ frame gốc. Mọi frame idle sau đó chỉ là dời group Upper và một vài layer con bằng phím mũi tên – nhanh, chính xác, không phải vẽ lại.

Dự án 9: Nhân vật pixel 48 × 48 đứng thở (idle) 4 frame →
Lấy đà ngược chiều

Muốn chém về phía trước, trước hết kéo kiếm và thân về phía sau. Lấy đà càng rõ, cú chém càng mạnh – kể cả khi frame chém chỉ dài 0,05 giây.

Dự án 10: Đòn tấn công kiếm pixel 6 frame có vệt chém →
Góc kiếm sạch

Chọn góc kiếm theo các tỉ lệ pixel đều 1:1, 2:1, 1:2 hoặc thẳng đứng – ngang. Góc lẻ như 35° tạo đường răng cưa lộn xộn, càng lộ rõ khi kiếm chỉ dày 2 px.

Dự án 10: Đòn tấn công kiếm pixel 6 frame có vệt chém →
Pivot giống idle

Mọi clip của cùng nhân vật (idle, chạy, chém) phải có pivot ở cùng điểm chân. Nếu pivot lệch, nhân vật sẽ giật sang một bên mỗi khi đổi trạng thái trong Animator.

Dự án 10: Đòn tấn công kiếm pixel 6 frame có vệt chém →
Viền là bội của 8

Viền 8 px (hoặc 4, 16) dễ khớp lưới UI và dễ nhập Border trong Sprite Editor. Viền 7 hay 9 px làm bạn tính toán sai và góc lệch 1 pixel khi giãn.

Dự án 11: Bộ khung UI pixel 9-slice →
Nổi hay lõm là do ánh sáng

Mép sáng ở trên – trái, tối ở dưới – phải: khung nổi lên. Đảo ngược: ô lõm xuống. Chỉ cần đổi chỗ hai màu là nút chuyển từ thường sang đang nhấn.

Dự án 11: Bộ khung UI pixel 9-slice →
Tỉ lệ nguyên

UI pixel chỉ đẹp khi mỗi pixel ảnh bằng đúng 2, 3, 4… pixel màn hình. Chọn Reference Resolution nhỏ như 320 × 180 và để Canvas Scaler phóng to nguyên lần.

Dự án 11: Bộ khung UI pixel 9-slice →
320 × 180 là "vua"

Độ phân giải 320 × 180 phóng nguyên lần lên 720p (×4), 1080p (×6) và 1440p (×8). Bắt đầu cảnh nền ở cỡ này là cách chắc chắn nhất để pixel luôn vuông trên mọi màn hình phổ biến.

Dự án 12: Cảnh nền pixel 320 × 180 nhiều lớp parallax →
Xa = nhạt, gần = đậm

Phối cảnh không khí trong pixel art chỉ là chọn dải màu: lớp xa mượn màu trời, lớp gần tối và rõ. Kiểm tra bằng ảnh xám là cách khách quan nhất.

Dự án 12: Cảnh nền pixel 320 × 180 nhiều lớp parallax →
Mỗi lớp một layer

Đừng vẽ chung các lớp vào một layer "cho nhanh". Khi xuất cho Unity, bạn cần từng lớp riêng có nền trong suốt; tách sau rất mất công vì phải vẽ lại phần bị che.

Dự án 12: Cảnh nền pixel 320 × 180 nhiều lớp parallax →
Boss đọc được từ xa

Thu nhỏ về 50% hoặc nheo mắt: nếu không thấy rõ đầu, hai nắm đấm và lõi sáng, bóng dáng còn quá rối. Sửa bóng dáng trước mọi chi tiết khác.

Dự án 13: Boss pixel 96 × 96 – Golem dung nham →
Vật phát sáng không viền

Lõi, vết nứt dung nham và mắt không có viền #1b1a24. Viền đen làm vật trông như miếng dán; để trống viền, ánh sáng như tỏa ra từ bên trong.

Dự án 13: Boss pixel 96 × 96 – Golem dung nham →
Giữ layer khối

Đừng gộp layer khi vẽ xong. Boss nào rồi cũng cần hoạt ảnh; có sẵn layer vai, tay, đầu riêng thì làm idle hay đòn đánh nhanh gấp nhiều lần.

Dự án 13: Boss pixel 96 × 96 – Golem dung nham →
Bảng màu theo nhiệt độ

Xếp 7 màu thành một hàng từ nóng tới nguội trong Swatches. Mỗi frame mới, mọi vùng lùi một ô sang phải. Bạn không bao giờ phải băn khoăn "vùng này tô màu gì".

Dự án 14: Vụ nổ pixel 8 frame chỉ với 7 màu →
Lửa bốc lên

Lõi trắng lệch lên trên tâm, khói ở frame sau cao hơn frame trước 2–3 px. Chi tiết nhỏ này cho cảm giác có không khí nóng, vụ nổ không còn là vòng tròn phẳng.

Dự án 14: Vụ nổ pixel 8 frame chỉ với 7 màu →
Dither để tan

Frame cuối dùng hoa văn ô 2 × 2 xen kẽ để khói còn một nửa. Mắt hiểu ngay khói đang loãng dần – đẹp hơn nhiều so với khói chỉ thu nhỏ rồi biến mất.

Dự án 14: Vụ nổ pixel 8 frame chỉ với 7 màu →
Bậc 2:1 là luật

Mọi đường xiên trong isometric pixel đều đi 2 ngang – 1 dọc, không ngoại lệ. Khi nghi ngờ, đếm pixel: mỗi bậc phải đúng 2. Một bậc 3 pixel là đủ làm cả lưới lệch.

Dự án 15: Khối isometric pixel 2:1 và căn nhà nhỏ →
Ba mặt, ba độ sáng

Quy ước một lần cho cả bộ: mặt trên sáng nhất, mặt trái vừa, mặt phải tối nhất. Mọi khối, mọi căn nhà giữ đúng quy ước này thì cả thế giới isometric trông cùng một ánh sáng.

Dự án 15: Khối isometric pixel 2:1 và căn nhà nhỏ →
Chi tiết theo mặt

Cửa sổ, cửa, rãnh gạch phải nghiêng theo đường 2:1 của mặt chứa nó. Cửa sổ vẽ thẳng đứng – ngang như nhìn chính diện sẽ trông như dán lên chứ không nằm trên tường.

Dự án 15: Khối isometric pixel 2:1 và căn nhà nhỏ →