Tileset & Background
Làm tile lặp liền mạch bằng Offset, dựng background nhiều lớp parallax và tạo chiều sâu bằng value và độ bão hòa.
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.
Thế giới game 2D thường được ghép từ các ô vuông nhỏ gọi là tile. Một bộ tile (tileset) cho phép level designer xây cả bản đồ khổng lồ từ vài chục ô ảnh. Điều kiện tiên quyết: tile phải lặp liền mạch (seamless) – ghép cạnh nhau không lộ đường nối.
Chọn kích thước tile
| Kích thước | Phù hợp |
|---|---|
| 16 / 32 px | Pixel art, game retro, màn hình nhỏ |
| 64 px | Game 2D hiện đại vẽ tay, mobile |
| 128 px trở lên | Nền chi tiết cao, game HD |
Luôn chọn lũy thừa của 2 (32, 64, 128, 256) để engine xử lý texture hiệu quả và dễ xếp lưới.
Thực hành: tile cỏ/đất seamless bằng Offset
- Tạo file 256 × 256 px (⌘ Cmd+N). Tô nền màu đất trung bình bằng ⌥ Option+⌫ Delete.
- Vẽ texture: vài viên sỏi, vệt tối, đốm cỏ. Tránh vẽ sát mép – tạm thời cứ để mép có thể không khớp.
- Gộp các layer texture thành một (⌘ Cmd+E) hoặc làm việc trên bản gộp tạm bằng ⌘ Cmd+⌥ Option+⇧ Shift+E.
- Vào . Nhập Horizontal +128, Vertical +128 (một nửa kích thước), chọn Wrap Around.
- Giờ các mép cũ nằm ở giữa ảnh thành một dấu cộng lộ rõ đường nối. Dùng Brush (Cọ vẽ), Clone Stamp (Con dấu nhân bản) (S) hoặc Healing Brush (Cọ chữa lành) (J) vẽ đè để xóa đường nối.
- Chạy lại Offset (Dịch chuyển (bọc vòng)) một lần nữa (hoặc ⌘ Cmd+⌥ Option+F để lặp bộ lọc cuối) để kiểm tra không còn đường nối nào mới.
Định nghĩa pattern để thử ghép
Chọn toàn bộ canvas (⌘ Cmd+A) rồi . Tạo một file lớn 1024 × 1024 px và tô bằng (⇧ Shift+⌫ Delete) chọn Contents là Pattern. Nhìn từ xa để kiểm tra tính lặp.
Background nhiều lớp và parallax
Parallax là hiệu ứng các lớp nền di chuyển với tốc độ khác nhau khi camera chạy: lớp xa chậm, lớp gần nhanh, tạo cảm giác chiều sâu. Bạn cần vẽ nền thành các layer tách biệt:
- Sky: bầu trời, gần như đứng yên.
- Far: núi, thành phố xa – di chuyển rất chậm.
- Mid: đồi, rừng cây – tốc độ trung bình.
- Near: bụi cỏ, cột đèn phía trước – nhanh nhất.
Mỗi lớp (trừ sky) cần lặp liền mạch theo chiều ngang. Dùng Offset chỉ với giá trị Horizontal (Vertical = 0) để kiểm tra mép trái-phải.
Chiều sâu bằng value và độ bão hòa
Theo luật phối cảnh khí quyển, vật càng xa càng:
- Gần màu bầu trời hơn (value sáng hơn nếu trời sáng).
- Ít bão hòa hơn và ít tương phản hơn.
- Ít chi tiết hơn.
Cách nhanh: thêm Adjustment Layer (Lớp điều chỉnh) Hue/Saturation (Sắc độ/Độ bão hòa) dạng clipping mask cho lớp Far, giảm Saturation và tăng Lightness. Lớp Near thì ngược lại: đậm, tương phản, nhiều chi tiết. Nhân vật và nền gameplay nên có tương phản cao nhất để người chơi luôn thấy rõ đường đi.
- Tạo file 1920 × 1080 px, tạo 4 group:
bg_sky,bg_far,bg_mid,bg_near. - Vẽ từng lớp bằng khối màu phẳng trước, lớp xa sáng và nhạt nhất.
- Thêm Hue/Saturation cho từng group (⌘ Cmd+⌥ Option+G để clip) để tinh chỉnh chiều sâu.
- Kiểm tra lặp ngang bằng Offset trên bản sao gộp của từng lớp.
Mẹo & trick học nhanh
Với tile 256 px nhập 128, với tile 64 px nhập 32. Luôn chọn Wrap Around.
Thêm layer Black & White tạm thời để chắc các lớp parallax tách biệt rõ về độ sáng.
Làm 2–3 biến thể của cùng một tile nền (thêm sỏi, bớt cỏ) để level trông tự nhiên hơn khi xếp ngẫu nhiên.
Bật khi vẽ tile, tắt đi khi làm việc khác để tránh nhầm.