top of page

Thiết kế Game UI qua những ví dụ thực tế

  • Writer: Hùng Vũ
    Hùng Vũ
  • Mar 2, 2019
  • 17 min read

Bài viết gốc Game UI By Example: A Crash Course in the Good and the Bad bởi Densi Quintans. Dịch bởi Lê Hồng Phúc.

Liệu có dễ dàng hay không để người chơi biến ý định của họ thành hành động, hay để hiểu điều gì đang xảy ra ở trong game của bạn? Trong bài hướng dẫn này, bạn sẽ học được cách xây dựng một giao diện tốt bằng việc xem xét những ví dụ tốt và xấu từ những game hiện có, và kết thúc với danh sách các câu hỏi để hướng dẫn bạn thiết kế nên một giao diện tử tế.


Giới thiệu

Là những game thủ và là những người phát triển game, chúng ta biết rằng sự chìm đắm (immersion) là tất cả. Khi bạn bị cuốn hút vào game, bạn sẽ không còn cảm nhận được dòng thời gian và trở nên đắm chìm vào trò chơi. Một yếu tố lớn tạo ra hay phá bỏ sự thu hút đó, chính là mức độ dễ dàng để người chơi có thể thể hiện ý tưởng của họ thành hành động trong game, cụ thể là độ xuyên suốt trải nghiệm người dùng (UX) trong game của bạn như thế nào và thiết kế giao diện người dùng (UI) tốt đến đâu. Một trò chơi tự làm tổn hại tới chính nó bằng cách cung cấp quá ít hoặc quá nhiều thông tin, yêu cầu quá nhiều đầu vào (input), gây rối loạn người chơi với những lời nhắc không cần thiết hoặc làm những người mới chơi khó tương tác. Một thiết kế UI tệ có thể sẽ phá hỏng hoàn toàn game của bạn.

Ảnh chụp màn hình tổng hợp từ Honey Bee Match 3. Nửa trái bên trên được render trong mode mù màu xanh (green -blind) bới ColorOracle; nửa phần dưới bên phải là hình của game gốc. Một ước tính chỉ ra ràng cứ trong 100 người thì có 1 người bị mù màu xanh, và những người bị như thế gần như không thể chơi được trò chơi này.

Trong bài viết này, tôi sẽ không hướng dẫn bạn về cách làm một UI hoàn chỉnh là như thế nào. Thay vào đó, tôi sẽ chú trọng vào những điều có thể tạo nên một UI tốt hoặc không tốt, và bạn có thể áp dụng những suy nghĩ này như thế nào vào trong chính trò chơi của bạn. Tôi sẽ xem xét thiết kế UI và UX như là một chuỗi các mục tiêu quan trọng và chính xác như những phần khác trong game của bạn, và tôi cũng sẽ sử dụng những ví dụ từ những game thiết kế đúng và sai.


UI và UX là gì?

Thuật ngữ UI UX đôi khi được sử dụng (một cách không chính xác) để thay thế cho nhau, nhưng chúng lại có những ý nghĩa khá khác biệt.


UI, hay giao diện người dùng (User Interface), đề cập tới những phương thức (điều khiển bàn phím, điều khiển chuột) và những màn giao diện (màn inventory, màn map) thông qua cách mà một người dùng tương tác với game. UX, hay trải nghiệm người dùng (User Experience), nói về mức độ trực quan và thú vị của những tương tác đó.


Nói theo một cách khác thì: UI của một cái xe ô tô bao gồm vô lăng, bàn đạp và bảng đồng hồ đo các thông số; UX của ô tô bao gồm những thứ không thể thấy được như độ phản hồi của bàn đạp phanh, động cơ gia tăng mượt mà khi bạn nhấn ga, cần số có lực cản vừa phải - những điều đó khiến cho việc lái xe trở nên thú vị.

Một UI tốt thì sẽ làm những gì?

Một cách đơn giản, vai trò của một giao diện tốt là cung cấp những thông tin liên quan rõ ràng và nhanh chóng, và rời đi khi hoàn thành xong nhiệm vụ. Nếu như bạn chỉ cần biết một chút thông tin từ bài hướng dẫn này, hãy hiểu như sau:

Một UI tốt sẽ nói cho bạn những điều mà bạn cần biết, và sẽ rời đi sau khi hoàn thành nhiệm vụ.

Chúng ta có thể tiến sâu hơn và đưa quy trình của việc thiết kế UI thành 6 câu hỏi cơ bản như sau:

  1. Giao diện này có chỉ cho tôi những điều mà tôi cần biết ngay lúc này không?

  2. Tìm kiếm thông tin có dễ dàng không? hay tôi phải tìm xung quanh mới thấy được? (Các Menu có bị lông ghép tới mức mà chúng ẩn hết thông tin?)

  3. Liệu tôi có thể sử dụng giao diện này mà không cần phải đọc hướng dẫn ở nơi khác?

  4. Giao diện có rõ ràng không?

  5. Có cần thiết để chờ giao diện tải hoặc chạy chuyển động?

  6. Có những lệnh nhàm chán hoặc lặp đi lặp lại nào mà tôi có thể cắt bớt (ví dụ như thay bằng một phím tắt) hoặc gỡ bỏ hoàn toàn?

Hãy tự hỏi những câu hỏi này thường xuyên khi thiết kế và chơi game của bạn. Thế giới của thiết kế giao diện là một thế giới vô tận, và nó là một trong số ít những lĩnh vực trong phát triển game được coi là hoàn toàn bình thường nếu bạn phải mất quá nhiều thời gian với nó.


Một trường hợp cụ thể

Một ví dụ điển hình đó là chiếc máy Pipboy trong game Fallout 3 - cụ thể hơn là đoạn diễn hoạt ngắn của nhân vật khi đưa máy Pipboy tới tầm mắt mỗi lần truy cập:

Đoạn chuyển động chỉ kéo dài trong vòng nửa giây, vì vậy bạn có thể sẽ cho rằng đó không phải là vấn đề gì to tát. Nhưng hãy nghĩ tới việc điều này sẽ thách thức tính kiên trì của người chơi như thế nào khi phải lặp đi lặp lại cùng một hành động qua vô số lần trong vòng 80 giờ chơi. Đừng bao giờ cho rằng người chơi sẽ dần làm quen với thứ gì đó chưa được tối ưu. Họ sẽ chỉ bực mình và phàn nàn về thiết kế của bạn mà thôi.


Tôi có thể luyện tập thiết kế UI như thế nào?

Tôi tin rằng cách tốt nhất để học thiết kế giao diện là làm web. Một vài tài nguyên tuyệt vời như trang Alertbox của Jakob Nielsen cung cấp những thông tin mà bạn muốn biết về thứ chính xác tạo một giao diện dễ sử dụng, cách mà người ta tương tác với phần mềm, v.v…


Trọng tâm của những điều làm cho một UI trở nên dễ sử dụng, là một nhân tố kết hợp những câu trả lời cho 6 câu hỏi cơ bản đã được đề cập trước đó. Vẫn còn nhiều điều để nói về tính khả dụng và cách làm cho giao diện có thể sử dụng được, và tôi sẽ để bạn tự chọn lọc thông tin trong trang Alertbox và tìm các phần liên quan tới những trải nghiệm của bạn.


Ai nên thiết kế giao diện game?

Rất nhiều lập trình viên cảm thấy sợ hãi làm UI bởi họ cảm thấy đây là một công việc sáng tạo, tốt hơn là nên để cho ai khác như một artist có nhiều hiểu biết hơn về cách trình bày. Và vì thiết kế UI là một quá trình mang tính logic chiếm phần lớn, nó trở nên dễ tiếp cận với những nhà phát triển game.


Thực tế thì, tôi tin rằng những người lập trình (hoặc giám đốc sáng tạo, hoặc bất cứ ai ở trong team của bạn có vai trò trực tiếp trong việc định hình trải nghiệm chơi game) nên đảm nhiệm việc thiết kế UI, cũng như họ là những người biết tường tận trò chơi, và cũng là những người biết những thông tin nào là quan trọng, thông tin nào là ngẫu nhiên.


Họ nên chú trọng vào những khía cạnh về mặt chức năng của UI: Nó rộng lớn đến đâu, có nên cho nó cuộn hay không, cho thông tin nào hiển thị và ở đâu, và cách mà người chơi điều hướng tới nó. Demo với 2 hoặc 3 màu, và không bao giờ chỉ dựa vào sự thay đổi màu sắc để truyền đạt thông tin. Và ít nhất hãy thử cho lọc game qua các trang như ColorOracle hoặc Coblis để đảm bảo rằng những người mù màu cũng có thể chơi được.


Những game có UI tệ

Trước khi đi sâu vào vấn đề này, có một điều quan trọng mà bạn nên hiểu đó là khi nói về UI tệ, tôi đưa ra những nhận xét dựa trên những suy nghĩ và hành vi của tôi trên tư cách là một người chơi game PC bằng chuột và bàn phím.


Sự lựa chọn của người dùng với đầu vào input cực kì liên quan tới những trải nghiệm của họ, mặc dù đó không phải là toàn bộ câu chuyện. Một người nào đã quen với việc sử dụng giao diện cảm ứng sẽ cảm thấy không quen thuộc với giao diện nút, nhưng một giao diện nút được thiết kế tốt vẫn có thể giúp cho họ cảm thấy dễ hiểu.


Oblivion

UI của Oblivion là một ví dụ cổ điển về một nền tảng UI không tương thích với những nền tảng khác. Mặc dù Oblivion được chuyển từ game console sang PC, nó vẫn giữ lại giao diện vốn được dành cho tay cầm (controller_. Điều này hoàn toàn tương tự như việc phát hành game trên iOS hoặc Android, và làm cho người chơi di chuyển mũi tên quanh màn hình như họ sử dụng bàn di chuột trên laptop thay vì sử dụng tính lợi thế của việc dùng hoàn toàn cảm ứng điểm chạm.


Vậy điều gì làm cho UI của Oblivion tệ đi? Đó là tổng hợp của sự lãng phí không gian, tỉ lệ bất hợp lý và các lệnh điều khiển không phù hợp.

Tôi hy vọng là bạn cảm thấy ổn với việc xem tận 6 cái item cùng một lúc, bởi kích thước của các cửa sổ này là không thể điều chỉnh được. Phần thực tế mà menu truyền tải lại những thông tin liên quan, ví dụ như những nội dung trong inventory, chỉ sử dụng 21.7% khoảng không gian màn hình ở độ phân giải 1920x1080.

Không phải là tệ nếu chỉ sử dụng 1/5 màn hình: bạn có thể làm được rất nhiều thứ trong khoảng không gian đó. Vấn đề thực sự đó chính là font chữ và icon có kích thước gấp đôi so với mức cần thiết để có thể xem được trên màn hình PC; và điều này vô cùng hạn chế việc hiển thị số lượng item trên màn hình.


Chế độ xem danh sách item theo một hàng dọc cũng đồng nghĩa với xu hướng phải thao tác cuộn nhiều, và các tab giao diện sẽ ẩn mọi thứ đi. Để kiểm tra trạng thái hiệu ứng bạn phải click vào tab Magic, đi tới tab phụ Effects và sau đó cuộn thông tin trong danh sách. Chúng ta giấu các thông tin ít được sử dụng như thông số của nhân vật vào các tab, nhưng điều đó hoàn toàn khác với việc ẩn hết những thông tin quan trọng chẳng hạn như cái gì làm tụt máu của bạn khi bạn đang di chuyển xung quanh.


Oblivion cũng thiếu các phím tắt. Không hề có phím Map để hiển thị bản đồ; bạn sẽ phải nhấp vào cái la bàn để gọi tab Map. Không có phím bán nhanh (Quick-sell) hoặc Bán cả lô (Sell stack); bạn sẽ phải kéo thanh trượt số lượng bằng chuột và xác nhận chúng bằng cách nhấp chuột hoặc nhấn Enter. Không hề có một nút quy chuẩn chung cho việc thoát khỏi cửa sổ (phím Esc cho hầu hết các game), vì thế các cửa sổ khác nhau sẽ có các cách thoát khác nhau như phím E, Tab, Esc hoặc bằng những chìa khóa khác.


Phần tiếp theo, Skyrim, đã giải quyết những vấn đề trên, nhưng vẫn còn một vài vấn đề tồn đọng hoặc trở nên tệ hơn. Tôi đã bị mắc kẹt khi lần đầu mở rương trong Skyrim: Esc không cho tôi thoát khỏi màn đó; chìa khóa không giúp tôi thoát ra được; Use the chest again cũng không giúp được gì. Không có một cái nút nào mà bạn có thể nhấp vào để thoát hoặc một lời nhắc nói cho bạn biết phải làm gì. Click chuột vào phần ngoài cửa sổ cũng không có tác dụng. Đoán xem cuối cùng thì key nào đã cho tôi thoát khỏi cái rương? Tất nhiên là Sheathe/Ready Weapon.


Far cry 3

Menu của Far Cry 3 gây ra sự khó chịu đối với người chơi bằng PC. Thỉnh thoảng chúng không hề phản hồi lại những cú nhấp chuột, vì vậy bạn sẽ phải click tới 3 lần; menu mất thời gian tải; không gian sử dụng không tối ưu - bạn đã biết tới vấn đề này.


Game đã được cập nhật với một bản vá, vì vậy tôi sẽ tập trung vào trạng thái của HUD trong game khi game được phát hành lần đầu tiên. Hãy bắt đầu nhìn vào HUD của phiên bản game trước đó, Far Cry 2.

Đây là thứ bạn thấy trong hầu hết khoảng thời gian chơi game. Những thứ như chỉ số máu và giáp sẽ ẩn hiện lúc mà bạn muốn biết, nhưng nhìn chung thì HUD sẽ để bạn một mình.


Bây giờ hãy xem HUD của Far Cry 3.

HUD của Far Cry 3 sẽ không bao giờ biến đi cho khuất mắt bạn. Đó là thứ mà bạn phải trải nghiệm như một người chơi liên tục bị kéo về thực tại. Nó tạo ra một cảm giác ngột ngạt.


Bản đồ bị quá khổ và không thể nhìn xuyên qua, vì vậy nó sẽ gây vướng trong màn hình. Phần nhắc nhở ở góc trái trên cùng cũng to, không thể nhìn xuyên và rất vướng víu; và mặc dù nó sẽ biến mất sau một vài giây, nó có xu hướng xuất hiện lại thời điểm mà bạn bắt đầu đắm chìm vào game. Khi bạn bị bắn, các chỉ số lại xuất hiện ở gần trung tâm của màn hình nơi nó một lần nữa sẽ làm cho bạn khó chịu, thay vì xuất hiện ở phần rìa ở màn hình như những game khác. Nếu bạn thu thập đủ nguyên liệu để craft, lại có một khung popup to và không thể nhìn xuyên sẽ xuất hiện ở phía bên phải để nhắc nhở bạn rằng bạn có thể craft ra một thứ gì đó mới.

Mỗi khi những khung popup này xuất hiện, chúng sẽ đánh bật người chơi ra khỏi bất kỳ niềm vui nào trong game mà họ đang có và gợi nhắc cho họ rằng họ chỉ đang sử dụng một phần mềm mà thôi. Các thông tin hiển nhiên được cung cấp quá mức cần thiết tạo cảm giác như trò chơi không hề tin tưởng vào người chơi có thể hoàn thành. Bản vá cho phép bạn tắt đi những phần tệ nhất của HUD nhưng bản đồ thì vẫn ở vị trí đấy, và những menu vẫn khó sử dụng đối với chuột và bàn phím.


Game với UI tốt

Tất nhiên, chúng ta cũng không nên dành toàn bộ thời gian chỉ để nói về những UI tệ. Những ví dụ tuyệt vời về thiết kế giao diện tới từ những game biết rõ giới hạn và thế mạnh trong hệ thống của họ.


Morrorwind

Hầu hết những người chơi game PC đều đồng ý rằng Morrowind (phiên bản trước của Oblivion) là một trong những game có UI tốt nhất - ngoại trừ một vấn đề mà tôi sẽ nói dưới đây.

Hãy xem những thành phần cơ bản của màn này.

  • Một màn hình đơn với 4 cửa sổ không có tab. Đi theo chiều kim đồng hồ từ góc trái phía trên bạn có thể thấy được cửa sổ chi tiết nhân vật, bản đồ (có thể phóng to), danh sách các phép và item ma thuật, và mục vật phẩm (với các tab sắp xếp đồ).

  • Ở phía góc phải phía trên của các cửa sổ là một ô vuông nhỏ. Nếu bạn nhấp vào ô vuông này, cánh cửa sổ vẫn ở trên màn hình ngay cả khi bạn thoát khỏi Menu. Chẳng hạn như, bạn có thể giữ cho cửa sổ map mở nếu như bạn đang cố gắng hoàn thành map bãi biển, hoặc bạn có thể giữ cửa sổ Magic để theo dõi được số charge còn lại trong Ring of Healing.

  • Bạn có thể kéo thả những cửa sổ này vào bất cứ nơi đâu trên màn hình, và bạn có thể co kéo hoặc thu nhỏ chúng để phù hợp với giao diện mà bạn mong muốn.

  • Ở phần phía dưới bên phải của màn hình là một vài icon trạng thái. Nếu bạn thấy một icon lạ, bạn có thể di chuột qua biểu tượng icon ở chế độ Menu, và một chú giải sẽ chỉ cho bạn biết đó là gì. Những icon tương tự cũng xuất hiện ở phần trên của cửa sổ Magic.

  • Khung vật phẩm đặt trong một hệ thống lưới với không gian tối ưu, và bạn có thể điều chỉnh số lượng item hiển thị bằng cách điều chỉnh màn inventory.

Giao diện này có ý nghĩa gì với người chơi PC? Hầu hết mọi thứ đều chỉ cần một lần nhấp chuột. Nếu như muốn xem các chiêu thức, bạn chỉ cần cuộn chuột trong khung cửa sổ nhân vật. Nếu bạn muốn trang bị thứ gì đó, bạn kéo nó vào búp bê giấy (paper doll). Giao diện đơn giản và dễ tiếp cận, và hầu hết mọi loại item ở thế giới trong game đều có một biểu tượng độc nhất, vì vậy việc tìm búa Journeyman Hammer chỉ chiếm một nửa giây trong khung vật phẩm gọn gàng và dễ co kéo.


Chi tiết duy nhất khiến cho giao diện này có vấn đề đó là các bình potion và các cuộn giấy (scroll) vẫn sử dụng lại các biểu tượng trong túi đồ (inventory); có nhiều icon độc nhất cho đặc tính của bình potion, nhưng không có cái nào cho hiệu ứng của nó, vì vậy một icon của Master Water Breathing potion trông như icon của Master Restore Fatigue potion.

Beyond Good and Evil

Việc phải nhập văn bản bằng tay cầm là cực kỳ bất tiện và khổ sở. Bạn không thể trực tiếp di chuyển các ngón tay của bạn tới một chữ cái, bạn phải nhấn nút di chuyển cho tới vị trí của chữ cái đó, tạo ra một loạt các hành động thừa thãi không cần thiết.


Beyond Good and Evil đã gạt bỏ những điều này bằng cách tạo ra thứ được chấp nhận như là một console nhập văn bản tốt nhất từ trước đến nay: Một dải vô hạn các chữ cái và con số được sắp xếp theo thứ tự ở trên đấy. Dải băng này cuộn nhanh và không bị trễ, cung cấp các hồi đáp âm thanh liên tục và phản hồi với các điều chỉnh. Thật lạ lùng tại sao các game khác không theo ý tưởng này.

Ừ thì tôi đã có chút thiên vị ở đây. Những kiểu nhập văn bản dạng bàn phím khác cũng cho phép bạn giữ một hướng và cuộn tuần tự qua tất cả các phím, nhưng chúng thường có một khoảng chững trước khi chúng bắt đầu cuộn ở tốc độ tối đa, hoặc chúng không cuộn đủ nhanh (Hãy nhớ lại câu hỏi cơ bản, “Liệu có cần thiết để chờ giao diện tải hoặc chạy chuyển động?”)


Homeworld

Homeworld gây đột phá vào những năm 1999 vì đây là tựa game RTS đầu tiên với chuyển động 3D thực sự. Chuyển động vật thể dọc theo 3 trục x, y, z là một thử thách thiết kế mới vào lúc đó, và Homeworld hoàn toàn truyền tải được phong cách và sự thanh lịch. Vấn đề nằm ở chỗ: Làm cách nào để diễn hoạt chuyển động 3D trên mặt phẳng 2D (màn hình máy tính của bạn).


Giải pháp: Đầu tiên là giải quyết vấn đề với mặt phẳng ngang truyền thống mà người chơi đã quen thuộc.

Sau đó, giải quyết với mặt phẳng dọc.

Màn chuyển động cũng đưa cho người chơi các công cụ tinh tế nhưng mạnh mẽ:

  • Hãy chú ý tới vòng tròn la bàn ở phía bên ngoài vùng chuyển động của các tàu Scouts. Bản đồ của Homeworld rất lớn và trống rỗng, và hướng của la bàn rất quan trọng để bạn có thể định vị mình trong không gian.

  • Thật dễ dàng để có thể thấy những đường thẳng tạo nên những phần chức năng của màn hình. Một vài game cố gắng để hòa hợp được những thành phần UI với thế giới trong game bằng cách làm cho chúng trở nên trắng hơn hoặc mờ nhạt hơn, nhưng Homeworld không làm như vậy. Lấy Empire: Total War làm một phản ví dụ. Đường cong chỉ hướng bắn được tạo ra từ một đường mỏng đỏ với viền trắng mờ xung quanh, và nó thường xuyên bị lẫn vào địa hình. Cảm ơn lòng tốt của các mod và modders.

  • Có một hình chữ thập ở giữa vòng biểu thị khoảng chuyển động, và nó luôn chỉ về trung tâm của đội hình các con tàu mà bạn chọn. Không có chữ thập đó, bạn sẽ phải đi tìm thanh máu của các con tàu được chọn để tìm ra vị trí của chúng, và thanh máu có thể sẽ bị khá nhỏ và tối đi khi mà con tàu bị hư hại.

  • Đường di chuyển cho bạn biết khoảng cách di chuyển, thuận tiện để ước tính khoảng thời gian di chuyển trong bản đồ không có cột mốc nào rõ ràng.

  • Hãy nhìn vào con tàu Harvester ngay phía trước đám tàu Scouts. Có một đường nhô qua nó, giới hạn trong vòng tròn nhỏ ở phía trên. Vòng tròn đó nằm trên mặt phẳng ngang của tàu Scouts (vòng tròn xanh). Dòng này xác định độ xa thật sự của con tàu Harvester với mặt phẳng ngang. Với 2 cái indicators này, chúng ta có thể di chuyển nhanh và chính xác tới con tàu bằng cách: di chuyển điểm đánh dấu mặt phẳng ngang trên cái vòng đĩa, sau đó kéo xuống dưới cùng để tạo ra mặt phẳng đứng.


Crusader Kings 2

Crusader Kings 2 là một loại game phức tạp, đa tầng lớp khiến cho bạn cảm thấy ngớ ngẩn khi chơi. Tuy nhiên giao diện của trò chơi sẽ hết sức giúp bạn vượt qua được tất cả. Đầu tiên, có rất nhiều cửa sổ Help hiện ra cho đến khi bạn cảm thấy thoải mái với phần nào đó của game để yêu cầu chúng dừng lại. Thứ hai, có một tính năng cực kì tuyệt vời như sau. Xem nào, tôi muốn biết biểu tượng của đồng tiền đại diện cho thứ gì, tôi chỉ rê chuột vào nó và BAM!

Ô chú giải xuất hiện ở đây xuất hiện lơ lửng là bởi con trỏ chuột không được chụp lại trong screenshot này

Một ô chú giải từ đâu xuất hiện! Trò chơi này nói cho tôi biết tôi nên gọi biểu tượng đồng tiền như thế nào, đưa ra những thông tin liên quan tới nó, và thậm chí nói cho tôi biết những thông tin đó được sắp xếp ra sao. Bạn có thể làm điều này với bất cứ thành phần nào khác trong game, và ô chú giải xuất hiện nhanh chóng vì thế nên tôi không mất thời gian chờ đợi.


Bạn có thể nhìn vào đây và nói rằng “Thôi đê, mấy cái ô chú giải này đã có từ lâu rồi. Hiển nhiên là chúng sẽ hiện ra khi mà tôi rê chuột vào một thứ gì đó.” Nhưng hãy cứ nhớ lấy điều này bởi nó rất dễ quên đấy.


A Valley Without Wind

Có nơi đặc biệt mà bạn sẽ rất dễ quên về các ô chú giải đó chính là ở phần menu ở trang chủ của game. Dưới đây là một ô chủ giải Vsync trong Options menu của A Valley Without Wind.

Còn đây là ô chú giải Vsync trong Options menu của Half Life 2: Episode 2.

Thật sự hữu ích. Hầu hết game thủ PC khi lang thang trong phần đồ họa nâng cao (Advanced graphics) đều sẽ biết VSync là gì, nhưng đặt một ô chú giải vào đây thì khá là lịch sự - chừng nào đó là một chú giải tốt và không phải chỉ đơn giản là “Bật hoặc tắt VSync”.


Civilization 5

Màn hình thành phố của Civ 5 là một ví dụ tuyệt vời về việc cung cấp thông tin xuất hiện nhanh chóng.

Chỉ tính riêng màn hình này, bạn đã được biết: trạng thái kinh tế và văn hóa toàn bộ đế chế của bạn; tình hình sản xuất của thành phố này, bao gồm mức độ gia tăng dân số (và mức độ mở rộng biên giới khi mà danh sách các công trình được xổ xuống); các đơn vị và công trình xuất hiện trong thành phố này và mất bao lâu để xây dựng xong; quá trình mở rộng thành phố, cũng như những ô tài nguyên trong đó, và ô nào thì người dân đang làm việc; những công trình đã được xây dựng trên đó, và một khung Citizen Management xổ xuống là nơi bạn có thể chuyển qua các phần hồ sơ phân bổ nhân công khác nhau để chuyên biệt hóa đầu ra của thành phố.


Bạn có thể di chuyển những nhân công này giữa các ô ngay trên bản đồ của thành phố, tận dụng tốt các khoảng trống trong màn hình.

Tổng kết

Chúng ta hãy cùng nhau viết lại 6 câu hỏi cơ bản của thiết kế giao diện thành 6 nguyên tắc chung như sau:

  1. Dự đoán người dùng muốn biết điều gì và cung cấp cho họ thông tin về điều đó.

  2. Thông tin phải dễ tìm thấy.

  3. Giao diện của bạn nên dễ sử dụng và dễ điều hướng. Áp dụng những hệ thống có sẵn ở những nơi bạn có thể sử dụng: Mọi người đều biết rằng Ctrl + Nhấp chuột thì sẽ thêm item vào phần lựa chọn, vì vậy đừng chuyển thành trao đổi item.

  4. Tạo sự rõ ràng cho vị trí người dùng trong hệ thống menu, và làm cho nó rành mạch ở nơi mà người dùng có thể tới và thứ họ có thể làm được từ đó.

  5. Giảm thiểu tối đa thời gian tải và tránh những chuyển động trong các menu.

  6. Loại bỏ hoặc tối giản những tác vụ lặp đi lặp lại.

Thiết kế UI là một công việc mang tính logic mà bạn không nên sợ hãi khi phải làm. Chú ý tới những game mà bạn chơi, lưu ý lại cách mà họ thể hiện thông tin và bạn cảm thấy như thế nào về chúng. Tìm kiếm những thông tin mà đóng vai trò chỉ như trang trí, và cân nhắc xem bạn muốn thay thế chúng bằng cái gì. Chú ý tới những thứ làm cho bạn cảm thấy khó hiểu. Và cuối cùng, luôn luôn có một vài người chơi thử trò chơi ngay trước mặt bạn. Chỉ cho họ cách để chơi game, âm thầm quan sát và đừng tìm cách hướng dẫn họ. Đó là một cảm giác tuyệt vời đấy.

Comments


Like ViNa Ludens trên Facebook

© 2018 ViNa Ludens. All Rights Reserved.

Background & Header by freepik.com

Muốn hợp tác cùng ViNa Ludens? Liên hệ với chúng tôi tại Fanpage hoặc địa chỉ email alex.vu@vinaludens.com

bottom of page