Tôi nên lưu ý điều gì khi tạo trò chơi 2D cho nhiều độ phân giải?


27

Tôi đang làm một trò chơi 2D (Android). Các thiết bị Android thay đổi khá nhiều về độ phân giải màn hình; Tôi cần lưu ý điều gì khi thực hiện trò chơi của mình?

  • Tôi có cần giữ các phiên bản lớn của tất cả các hình ảnh và giảm tỷ lệ tùy thuộc vào độ phân giải (không phải là lãng phí không gian)?
  • Các phông chữ bitmap có tỷ lệ tốt hay tôi cần sử dụng cái gì khác?
  • Bất cứ điều gì khác tôi đang quên?

Câu trả lời:


26

Tôi là nhà phát triển của một trò chơi di động cực kỳ chạy trên mọi thứ, từ PC, đến TV, thậm chí cả Amazon Kindle Đen & Trắng (Smiles HD - http://smileshd.com - Nhiều thiết bị và nền tảng hơn bạn thấy ở đó) .

Cách tốt nhất tôi tìm thấy để hỗ trợ bất kỳ thiết bị nào là chọn độ phân giải cơ bản, sau đó tăng tỷ lệ (hoặc giảm) lên màn hình hiện tại. Nếu bạn muốn gian lận, bạn có thể phù hợp với độ phân giải màn hình mới, nhưng lý tưởng nhất là bạn nên giữ nguyên tỷ lệ khung hình. Ghép một trò chơi được làm cho màn hình 4: 3 trông có vẻ gớm ghiếc trên 16: 9, nhưng lắp 16: 9 vào 16:10, không ai có thể nhận thấy. Bạn sẽ lưu ý rằng tôi đề cập đến màn hình theo tỷ lệ khung hình chứ không phải kích thước, đây là cách đặc biệt hữu ích để suy nghĩ trong thời đại kích thước LCD hoàn toàn ngẫu nhiên này.

Để tạo tác phẩm nghệ thuật phù hợp với bất kỳ màn hình nào trong khi duy trì tỷ lệ khung hình, hãy tạo các hình nền lớn hơn hầu hết các màn hình thông thường sẽ thấy. Điều này tương tự như các khu vực an toàn tiêu đề khái niệm với Truyền hình.

http://en.wikipedia.org/wiki/Safe_area

Tạo nền làm việc thực sự tuyệt vời cho việc này. Các mẫu lát gạch, bàn cờ, hình dạng fractal, v.v. Bạn chỉ cần tạo thêm một chút nữa để phù hợp với màn hình mới.

Ngoài ra, tạo hình ảnh tĩnh lớn hơn những gì người dùng thông thường của bạn sẽ thấy. Rộng hơn màn hình rộng (16: 9) và squarer hơn def tiêu chuẩn (4: 3). Một lần nữa quay lại các khu vực an toàn tiêu đề, điều chỉnh thông tin quan trọng của bạn vào khu vực an toàn, mở rộng một chút để khu vực an toàn của bạn chạm vào một trong các cạnh của màn hình và để lại một số thiết bị lớn hơn một chút.

Một biến thể tôi đang làm việc với ngày hôm nay là tạo các đối tượng 3D "an toàn tiêu đề". Vì chúng là 3D, bao gồm hoàn toàn các đỉnh, làm cho chúng lớn hơn màn hình thực tế không chiếm nhiều bộ nhớ hơn so với khi chúng vừa. Giống như mật độ pixel tăng lên, bạn có thể muốn một số kết cấu chi tiết cao hơn có sẵn. Nếu không, ồ, nó hơi mờ.

Giao diện người dùng, tôi thích điều chỉnh giao diện người dùng chính trong một hình vuông hoàn hảo ở giữa màn hình. Các góc và các cạnh giữa cũng làm cho những nơi thực sự tốt để đặt mọi thứ; Bạn nên tính tọa độ của chúng như vậy (tương đối góc hoặc cạnh giữa).

http://www.smileshd.com/press/iPad/png/UI01.png

Nếu bạn thực sự muốn có được sự ưa thích, bạn có thể hỗ trợ cả định hướng Cao và Rộng. Một số thiết bị báo cáo độ phân giải màn hình của chúng cao hơn chiều rộng (ví dụ như iPhone), do đó bạn có thể phải làm gì đó cho các thiết bị đó, ngay cả khi nó chỉ đơn giản là xoay tất cả các tọa độ của bạn.

Giao diện người dùng thích nghi với cả màn hình cao và rộng có thể là một cảnh tượng khá ấn tượng.

Rộng: http://www.smileshd.com/press/iPad/jpg/SmilesHD01.jpg

Cao: http://www.smileshd.com/press/iPad/jpg/SmilesHD02.jpg

Về mặt tích cực, thiết kế khôn ngoan, bạn chỉ thực sự cần xem xét Cao và Rộng, thay vì Chân dung + Chân dung ngược + Phong cảnh + Đảo ngược. Khi bạn chọn vị trí của những thứ trên màn hình, hãy cân nhắc việc có một vị trí thay thế phù hợp hơn cho hướng khác.

Tôi có cần giữ các phiên bản lớn của tất cả các hình ảnh và giảm tỷ lệ tùy thuộc vào độ phân giải (không phải là lãng phí không gian)?

Vâng, bạn có thể "lãng phí không gian" và hỗ trợ nhiều loại thiết bị hơn với một bản dựng hoặc "lãng phí thời gian của bạn" và phải tạo ra NHIỀU bản dựng và thay đổi kích thước tác phẩm nghệ thuật cho nhiều thiết bị.

Trong trường hợp tốt nhất, bạn nên tạo tác phẩm nghệ thuật của mình ở độ phân giải cao hơn kích thước cuối cùng sẽ có trên TV 1080p (1920x1080). 2048x2048 phải là kích thước phổ biến trong tác phẩm nghệ thuật nguồn của bạn. Hoặc, hoặc xem xét sử dụng các công cụ nghệ thuật Vector như Flash và Adobe Illustrator.

Tôi thực sự khuyên bạn nên tạo một quy trình tự động để thay đổi kích thước tác phẩm nghệ thuật của bạn. Hầu hết các thiết bị di động hiện nay, bao gồm máy tính bảng, không vượt quá độ phân giải lớn hơn 720p (1280x720) ... ít nhất, không nhiều. Tuy nhiên, hãy đến vào năm tới, chúng ta không biết liệu điều đó có còn đúng nữa không (iPad 3?).

Dù bằng cách nào, để có hiệu suất tốt nhất, bạn nên làm quen với ý tưởng về tác phẩm nghệ thuật nguồn và tài sản nguồn. Sau đó, bạn có thể thực hiện quy trình tối ưu hóa dữ liệu cho bất kỳ (các) thiết bị nào bạn đang nhắm mục tiêu.

Các phông chữ bitmap có tỷ lệ tốt hay tôi cần sử dụng cái gì khác?

Chúng có tỷ lệ tốt nếu bạn đang sử dụng bộ lọc tốt. Nếu bạn đang tạo trò chơi 2D của mình bằng phần cứng 3D (OpenGL ES), thì tôi phải khuyên bạn nên sử dụng Bộ lọc tuyến tính kết hợp với MipMapping (tức là một tập hợp các hình ảnh được thu nhỏ). Bạn có thể nhận được kết quả hoàn hảo về mặt nhận thức với điều này và thường sử dụng mipmap nhanh hơn là không.

http://en.wikipedia.org/wiki/Mipmapping

Dù sao, tôi hy vọng rằng sẽ giúp. Chúc may mắn với dự án của bạn.


2

Nói chung, mọi kết cấu bạn tạo nên là 256x256 hoặc 512x512. Nếu bạn cũng đang nhắm mục tiêu miếng đệm (Galaxy Tab, Honecomb, iPad), thì 512x512 sẽ không lấp đầy toàn bộ màn hình, vì vậy bạn có thể muốn bao gồm các phiên bản lớn hơn của những tài sản nghệ thuật cần lấp đầy màn hình. Apple bao gồm hậu tố hình ảnh "@ 2x" để xử lý trường hợp này.

Giải pháp đơn giản, mà tôi đã sử dụng cho mình, chỉ đơn giản là tạo trò chơi của bạn cho màn hình 320x480 (iPhone). Đặt con số này một cách tự nhiên cho iPhone 2 (640 x 960), và sau đó, trường hợp khác duy nhất bạn thực sự phải xử lý khác là thực tế là một số thiết bị Android có màn hình cao hơn - vì vậy chỉ cần đặt một bộ đệm ở trên cùng và dưới cùng (theo chiều dọc chế độ).

Nói tóm lại - xây dựng trò chơi của bạn cho một kích thước màn hình trung tính, và sau đó bao gồm các ngoại lệ, dựa trên


2
Tôi nghĩ rằng bạn đã bỏ lỡ Androidthẻ của tôi . Dù sao, đệm hút; sẽ tốt hơn nếu trò chơi của bạn thực sự mở rộng và trông rất đẹp.
tro999

1

Tốt nhất là giữ các bản sao làm việc của bất kỳ tài sản nào bạn có. Ví dụ: nếu bạn đang phát triển một hình ảnh trong photoshop, hãy lưu tệp psd gốc. Bất cứ khi nào bạn cần một hình ảnh độ phân giải khác nhau, bạn có thể mở nó lên và xuất hình ảnh mới với chất lượng giảm tối thiểu.

Thay vì xây dựng cho một kích thước màn hình này hay cách khác, tôi sẽ mạnh mẽ đề nghị bạn xây dựng cho một loạt từ đầu. Bạn không chỉ nói về mật độ pixel khác nhau, bạn cũng đang nói về các tỷ lệ khung hình khác nhau. 16x9 và 16x10 có thể mang lại trải nghiệm hình ảnh rất khác nhau. Vì vậy, hãy đảm bảo bạn kiểm tra các thay đổi mới trên nhiều hình dạng và kích thước màn hình khác nhau.

Theo kinh nghiệm của tôi, phông chữ bitmap hoàn toàn không có tỷ lệ. Nó có thể phụ thuộc rất nhiều vào phong cách của phông chữ bạn sử dụng, nhưng nói chung, việc lấy lại mẫu bitmap cho kết quả rất kém. Phông chữ bitmap hoạt động tốt nhất khi lấy mẫu kết cấu của bạn không được đặt thành đa mẫu (GL_NEAREST và không có mipmap) và nó được hiển thị sao cho ánh xạ pixel-pixel cho màn hình. Bạn có thể muốn xem xét sử dụng một loạt các kết xuất của cùng một phông chữ ở các kích cỡ khác nhau và đảm bảo rằng phông chữ luôn xuất hiện ở tỷ lệ == 1 trong trò chơi của bạn; điều này sẽ cho phép bạn một số tùy chọn giới hạn khi chọn kích thước phông chữ để sử dụng trong một kịch bản cụ thể.


1

Android cung cấp một số trợ giúp cho việc này ...

Bạn có thể chỉ định "tài nguyên thay thế" cho các mục như đồ họa của mình.
Hãy xem phần "Cung cấp tài nguyên thay thế" tại liên kết này: http://developer.android.com/guide/topics/resource/providing-resource.html Bạn sẽ có thể tìm thấy các ví dụ trong ví dụ SDK hoặc thông qua Google.

Ngoài ra, Google cung cấp Trình giả lập Android mà bạn có với SDK. Bạn có thể xác định một số thiết bị ảo với các cấu hình khác nhau để kiểm tra mã của mình. Đây là một liên kết để biết thêm thông tin: http://developer.android.com/guide/developing/devices/emulator.html

Chúc may mắn


0

Bên cạnh các khía cạnh kỹ thuật (được giải quyết bởi Mr Strange) hãy cẩn thận khi thiết kế một trò chơi với kích thước màn hình thay đổi. Chỉ là một ví dụ, hãy tưởng tượng chơi những con đường giận dữ trong một màn hình giống như phong cảnh và sau đó trong một màn hình dọc.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.