Các phương pháp thiết kế hay nhất sau đây giúp đảm bảo trải nghiệm tối ưu cho người dùng chơi trò chơi trên YouTube trên nhiều thiết bị và nền tảng.
Ngoài các thành phần hệ điều hành, trải nghiệm Chơi game chủ yếu bao gồm 3 thành phần:
- Thao tác trong tính năng Chơi game
- Canvas trò chơi
- Trình đơn và hộp thoại
Các phương pháp hay nhất về thiết kế trò chơi này đưa ra đề xuất về cách xây dựng trò chơi cho canvas trò chơi.
Đổi kích thước trò chơi
Hãy xem xét các phương pháp này để đảm bảo trò chơi thích ứng phù hợp với nhiều kích thước và hướng màn hình.
Đổi kích thước trò chơi và điều chỉnh giao diện người dùng theo kích thước và tỷ lệ khung hình của canvas.
Sử dụng hiệu ứng hòm thư hoặc hiệu ứng hòm thư nếu trò chơi không thể đáp ứng hoàn toàn với kích thước canvas và tỷ lệ khung hình của trò chơi.
Tránh kích hoạt thanh cuộn. Thanh cuộn ảnh hưởng tiêu cực đến cả lối chơi và thao tác điều hướng chung. Lấp đầy canvas mà không làm cho trò chơi có thể cuộn được bên trong canvas. Bạn có thể sử dụng thanh cuộn nếu có chủ đích, chẳng hạn như khi cuộn qua một danh sách dọc dài trong giao diện người dùng của trò chơi. Lý tưởng nhất là các trò chơi chịu hoàn toàn trách nhiệm về khung nhìn.
Điều chỉnh tỷ lệ trò chơi
Hiển thị rõ ràng (không bị mờ, bị vỡ ảnh hoặc bị kéo giãn) trên nhiều độ phân giải màn hình.
Đảm bảo giao diện người dùng của trò chơi (văn bản, biểu tượng) điều chỉnh theo tỷ lệ thích hợp khi hiển thị trên cả màn hình có độ phân giải thấp hơn (chẳng hạn như thiết bị di động 360x800) và màn hình có độ phân giải cao hơn (chẳng hạn như màn hình máy tính để bàn 3840x2560).
Tránh các thành phần tạo điểm ảnh có độ phân giải thấp bị mờ khi được điều chỉnh theo tỷ lệ trên màn hình lớn.
Kiểu chữ
Đảm bảo tính dễ đọc trên các thiết bị và kích thước màn hình.
Các văn bản xuất hiện trong trò chơi (chẳng hạn như nút, trình đơn và ô lời thoại) cần phải dễ đọc trên nhiều thiết bị và kích thước màn hình. Bạn có thể thực hiện việc này bằng cách tự động điều chỉnh tỷ lệ và điều chỉnh văn bản hoặc cung cấp cho người dùng một chế độ cài đặt để điều chỉnh cỡ chữ.
Nếu văn bản nhỏ hơn 18pt hoặc nếu văn bản được in đậm và nhỏ hơn 14pt, hãy đặt tỷ lệ tương phản màu tối thiểu là 4,5:1.
Đối với tất cả các phần văn bản khác, hãy đặt tỷ lệ tương phản màu tối thiểu là 3:1.
Để tham khảo chung, hãy xem WCAG2.1.
![]() |
![]() |
Sử dụng cỡ chữ lớn, có đủ độ đậm và độ tương phản để dễ đọc. Trong ví dụ này, tỷ lệ tương phản là 4,48:1. | Tránh sử dụng cỡ chữ nhỏ và màu sắc có độ tương phản thấp. Trong ví dụ này, tỷ lệ tương phản là 3,07:1. |
Tương tác
Phần này đề cập đến các phương pháp hay nhất về hoạt động tương tác của người dùng và các phần tử có liên quan.
Đích chạm
Tạo đích chạm đủ lớn để tương tác dễ dàng hơn.
Đảm bảo các đích chạm có kích thước tối thiểu là 48x48 dp và không gian tối thiểu 8 dp giữa các đích (xem Nguyên tắc thiết kế Material Design) để tương tác dễ dàng hơn.
Trong ví dụ này, nút được kết xuất hình ảnh có kích thước 24 dp, trong khi đích chạm vô hình bao gồm 12 dp xung quanh biểu tượng để đạt được đích chạm 48 x 48 dp.
Thêm khoảng đệm xung quanh các biểu tượng và nút để tăng kích thước đích chạm.
Nút
Sử dụng kiểu riêng cho từng trạng thái nút:
- Đang bật
- Đã tắt
- Di chuột (đối với các thiết bị đầu vào không cảm ứng)
- tập trung
- Phấn nén
Bạn cũng nên cố gắng phân biệt các nút theo hệ phân cấp. Ví dụ: nút hành động chính so với nút hành động phụ trong trình đơn Start (Bắt đầu) (xem Nguyên tắc thiết kế cho các nút của Google Material 2).
Kiểu riêng giúp phân biệt từng trạng thái nút
Nhập qua b.phím
Để tăng khả năng hỗ trợ tiếp cận của trò chơi trên nhiều thiết bị và người dùng, ngoài phương thức nhập bằng cách chạm và bằng chuột, hãy hỗ trợ phương thức nhập bằng bàn phím cho tất cả các chế độ điều khiển lối chơi và thao tác trên màn hình.
Đối với các trò chơi hỗ trợ phương thức nhập bằng bàn phím, hãy cho phép người dùng đóng mọi trình đơn và hộp thoại trong trò chơi bằng phím Esc. Ngoài việc có nút đóng hình ảnh (ví dụ: biểu tượng X ở góc trên cùng). Ví dụ về phương thức hoặc hộp thoại phổ biến là trình đơn Settings (Cài đặt), trình đơn Pause (Tạm dừng), thông báo lỗi và cửa sổ bật lên thông tin Help (Trợ giúp).
Tránh ánh xạ mọi thao tác với thao tác nhấn và giữ phím Esc, vì thao tác này dùng để thoát khỏi chế độ toàn màn hình trên trình duyệt web dành cho máy tính.
Đối với các trò chơi đã đăng ký trình nghe thao tác nhấn phím: không sử dụng preventDefault()
với các sự kiện chính Esc. Khi ở chế độ toàn màn hình trong Safari, trò chơi sử dụng sự kiện nhấn phím mà không thoát khỏi chế độ toàn màn hình.
Xúc giác
Khi thích hợp, bạn nên dùng phản hồi xúc giác (Rung) để khiến các trò chơi mang lại cảm giác thú vị và sống động hơn.
Những khoảnh khắc quan trọng trong trận đấu
Phần này đề cập đến những khoảnh khắc quan trọng trong trò chơi có thể tạo ra trải nghiệm tuyệt vời cho người chơi.
Hướng dẫn
Đưa ra hướng dẫn ngắn gọn hoặc cấp độ làm quen để trợ giúp người chơi mới.
Quá trình làm quen giúp đảm bảo rằng người dùng tìm hiểu các kiến thức cơ bản về cách chơi cũng như những yếu tố cần thiết trong trò chơi để tiếp tục và tận hưởng trò chơi.
Vì mục đích của tính năng Chơi game là hướng đến việc người dùng có thể bắt đầu chơi một cách nhanh chóng và dễ tiếp cận, nên hãy cố gắng hạn chế tối đa việc giới thiệu. Mặc dù không phải trò chơi nào cũng yêu cầu hướng dẫn, nhưng hầu hết trò chơi đều hưởng lợi từ một số hình thức giới thiệu. Hãy xem xét các cơ chế, quy tắc và kỹ năng chính mà người chơi cần biết để chơi thành công và tận hưởng trò chơi.
Hướng dẫn có thể ở định dạng sau:
- Nhóm màn hình ở đầu trò chơi (hoặc lý tưởng hơn là hiển thị theo ngữ cảnh trong suốt trò chơi khi thích hợp)
- Cấp độ hướng dẫn thực tế mà người dùng chơi qua
Tạm dừng
Thông báo rõ ràng về trạng thái trò chơi cho người dùng.
Thông báo rõ ràng cho người dùng khi trò chơi bị tạm dừng và cách người dùng có thể tiếp tục chơi. Tránh làm cho người dùng nghĩ rằng trò chơi bị treo hoặc gặp sự cố.
Gắn nhãn rõ ràng trạng thái trò chơi là "tạm dừng" và đưa ra một thao tác rõ ràng (nút) để tiếp tục chơi.
Trận đấu kết thúc
Thông báo cho người dùng rằng họ đã hoàn thành cấp độ cuối cùng hoặc họ đã kết thúc trò chơi.
Nếu trò chơi có một kết thúc rõ ràng (ví dụ: một số cấp độ hữu hạn), hãy thông báo rõ ràng cho người dùng. Điều này giúp người dùng nghĩ rằng trò chơi bị hỏng hoặc bị treo. Lý tưởng nhất là trò chơi tôn vinh và chúc mừng người chơi đã hoàn thành trò chơi.
Âm thanh
Trò chơi có thể chứa các nút điều khiển âm lượng riêng biệt cho hiệu ứng, lời nói và nhạc nền. Các nút điều khiển có thể bao gồm thanh trượt để điều chỉnh âm lượng hoặc nút tắt tiếng cho từng hoặc cả hai.
Hỗ trợ tiếp cận
Khả năng hỗ trợ tiếp cận trong thiết kế mang đến cho người dùng nhiều cách để chơi và tận hưởng trò chơi của bạn.
Không giống như thiết kế web và phần mềm, các nguyên tắc hỗ trợ tiếp cận theo tiêu chuẩn ngành dành cho thiết kế trò chơi không tồn tại. Để có tài nguyên phù hợp với các nguyên tắc bổ sung về thiết kế trò chơi toàn diện, hãy xem Nguyên tắc về khả năng hỗ trợ tiếp cận của trò chơi. Bạn nên cân nhắc cách áp dụng các nguyên tắc này vào thiết kế của trò chơi.