Một Vài Suy Nghĩ Về Tương Tác Trong Game Mobile

Đây là bài viết tiếp nối những chia sẻ năm ngoái. Gần đây, tôi đang áp dụng các ý tưởng này để cải tiến một trò chơi xây dựng theo phong cách “Factorio” mà chúng tôi đang phát triển.

Công cụ phát triển game của chúng tôi được xây dựng trên nền tảng PC, nhưng mục tiêu là tối ưu hóa trải nghiệm trên smartphone. Dù tôi luôn mong muốn quá trình phát triển diễn ra trực tiếp trên thiết bị thật, công cụ và phần nhân chính viết bằng C vẫn đang trong giai đoạn điều chỉnh liên tục. Việc debug trên thiết bị di động khó khăn hơn nhiều so với trên PC, bởi thao tác trên màn hình cảm ứng không tiện bằng chuột bàn phím. Tuy nhiên, vài tuần gần đây mọi thứ đã ổn định hơn. Chúng tôi dần chuyển sang thử nghiệm trực tiếp trên điện thoại, từ đó chú trọng nhiều hơn đến các vấn đề tương tác đặc thù cho thiết bị di động.

Điều đầu tiên tôi nhận ra: Phiên bản giả lập trên PC hoàn toàn không thể tái hiện đúng trải nghiệm tương tác cảm ứng. Muốn tối ưu giao diện cho smartphone, bắt buộc phải trải nghiệm trực tiếp trên điện thoại.

Ban đầu, giao diện tương tác của engine dựa trên tín hiệu chuột, còn cảm ứng chỉ là sự mô phỏng thô sơ từ chuột. Đây là cách tiếp cận sai lầm. Sau khi nhận ra, chúng tôi quyết định loại bỏ hoàn toàn tín hiệu chuột khỏi engine. Thay vào đó, các cử chỉ cảm ứng được nâng lên hàng “ngôn ngữ chính”, còn tín hiệu chuột sẽ được mô phỏng ngược lại thông qua cử chỉ.

Bốn cử chỉ cơ bản cần xử lý là: chạm (tap), giữ lâu (long press), vuốt (swipe) và thu phóng (pinch). Trong một số trường hợp, cử chỉ “vuốt” có thể thay thế bằng “quét” (sweep), nhưng cả hai không thể tồn tại song song.

Trong game xây dựng, dù tương tác bằng chuột hay cảm ứng đều hướng đến mục tiêu điều khiển nhân vật hoặc công trình, nhưng khác biệt lại rất rõ rệt:

• Vùng chạm trên màn hình cảm ứng là một hình tròn, trong khi chuột lại là một điểm chính xác. Điều này khiến việc chọn lựa chính xác từng chi tiết nhỏ bằng ngón tay trở nên khó khăn hơn rất nhiều.
• Chuột có tín hiệu di chuyển và hover (chỉ cần đưa con trỏ qua là kích hoạt), rất hữu ích trong các game cần tương tác liên tục. Tuy nhiên, cảm ứng lại không có chức năng tương tự.
• Ngón tay chạm vào màn hình sẽ che khuất vùng tương tác, nếu áp dụng logic chuột để kéo thả vật thể, người chơi sẽ liên tục bị che mất đối tượng họ đang thao tác.

Từ những hạn chế đó, tôi đã thiết kế lại hệ thống tương tác như sau:

1. Thay thế tín hiệu Hover bằng Tap

Thay vì dùng hover, tôi định nghĩa lại hành động “tap” như một tín hiệu xác định tiêu điểm tương tác. Khi người chơi chạm vào một vị trí trên màn hình, hệ thống sẽ xác định xem họ muốn tập trung vào vật thể nào dưới ngón tay. Do chạm cảm ứng không chính xác, hệ thống sẽ quét các vật thể gần điểm chạm. Nếu nhiều vật thể chồng lấn, chỉ cần chạm liên tục để chọn đúng mục tiêu.

Mỗi vật thể được chọn sẽ có hiệu ứng trực quan rõ ràng (ví dụ: viền sáng), giúp người chơi dễ dàng nhận biết trạng thái tiêu điểm. Việc chạm lúc này chỉ mang ý nghĩa “focus” (tương tự hover), không kích hoạt bất kỳ hành động tương tác nào. Điều này giúp tránh tình trạng click nhầm, giống như việc rê chuột qua nhiều vật thể trên PC rồi mới dừng lại chọn mục tiêu đúng.

2. Nút tương tác chính ở góc dưới phải

Sau khi xác định được tiêu điểm, mọi hành động tương tác (với vật thể đã chọn) đều được thực hiện thông qua một nút ảo lớn ở góc dưới bên phải – vị trí thuận tiện nhất cho ngón cái.

• Nhấn nhẹ nút này tương ứng với click chuột trái
• Nhấn giữ tương ứng với click chuột phải

Ví dụ: Khi muốn tương tác với một công trình, người chơi chạm để chọn nó, sau đó nhấn nhẹ nút góc phải để mở bảng tùy chọn. Nếu muốn hủy bỏ, nhấn giữ nút đó để hiện menu lựa chọn khác.

3. Giao diện thông tin hai lớp

Tất cả thông tin trên màn hình di động cần được trình bày đơn giản, tránh chữ quá nhỏ hoặc bố cục chật chội. Đây là nguyên tắc dễ nói nhưng dễ bị bỏ qua, nhất là khi phát triển trên màn hình PC quen thuộc.

Tôi thiết kế một bảng thông tin tạm thời (tips window) hiển thị ở bên trái màn hình, chiếm khoảng 1/3 diện tích. Khi người chơi di chuyển tiêu điểm giữa các vật thể, nội dung tips sẽ cập nhật tức thì. Mỗi phần trong bảng tips được chia thành 3-4 vùng nhỏ, chạm vào từng vùng sẽ mở ra bảng thông tin chi tiết tương ứng ở trung tâm màn hình.

4. Điều hướng bản đồ không bị che mắt

Với các thao tác xây dựng, người chơi không cần phải cầm công trình và di chuyển như logic chuột. Thay vào đó, khi nhấn giữ ở tâm màn hình, hệ thống sẽ mở bảng chọn công trình. Sau khi chọn xong, công trình sẽ hiện ở giữa màn hình. Người chơi chỉ cần vuốt bản đồ để điều chỉnh vị trí, còn công trình luôn giữ nguyên ở trung tâm – giúp tầm nhìn không bị che khuất bởi ngón tay.

5. Giao diện chính sạch sẽ

Tôi chủ trương giữ giao diện chính tối giản, chỉ đặt 1-2 nút cố định ở các góc thuận tiện. Các thao tác chính bao gồm:

• Vuốt/zoom bản đồ
• Chạm để chọn tiêu điểm
• Nhấn nút góc phải để tương tác

Khi cần các tùy chọn phức tạp hơn, tôi thiết kế một bảng điều khiển toàn màn hình kích hoạt bằng thao tác nhấn giữ ở tâm màn hình – tương