GUI là gì?

Trong thế giới thiết kế trải nghiệm người dùng, có một số khái niệm tạo nên nền tảng cho mọi thứ bạn học sau đó. Giao diện người dùng đồ hoạ, hoặc GUI để ngắn gọn, là một trong những khái niệm đó.

Hầu hết các thiết bị và ứng dụng hiện đại đều sử dụng giao diện người dùng đồ họa trong thiết kế của họ – chúng đã trở thành một lưu bút trong nhiều thập kỷ, và có lẽ điều này sẽ không thay đổi trong thời gian sắp tới. Vì vậy, đáng để hiểu GUI trước khi xem xét sâu hơn về UX.

Trong bài viết này, bạn sẽ học:

Định nghĩa GUI
Lịch sử phát triển của GUI trên máy tính
Cách GUI hoạt động
Khái niệm trừu tượng
Nơi tìm thấy GUI
Vuợt thế và hạn chế của GUI

Table of Contents

Giao diện người dùng đồ họa (GUI) là một giao diện kỹ thuật số mà người sử dụng tương tác với các thành phần đồ hoạ như biểu tượng, nút và menu. Trong GUI, các hình ảnh hiển thị trên giao diện người dùng truyền tải thông tin liên quan đến người dùng, cũng như các hành động mà họ có thể thực hiện.

Ngày nay, rất khó để tưởng tượng máy tính mà không có GUI. Nhưng trước đây, chúng ta thậm chí còn không có con trỏ chuột. Hãy xem xét lịch sử của GUI.

Lịch sử ngắn của GUI

Trước khi có giao diện người dùng đồ họa, người dùng tương tác với máy tính bằng cách sử dụng giao diện người dùng ký tự, hoặc CUI. Trong CUI, người dùng gõ lệnh văn bản trên bàn phím của họ để thực thi các hành động trên thiết bị.

Mặc dù hữu ích đối với các nhà lập trình viên, nhưng CUI chỉ thực sự thuận tiện cho các chuyên gia công nghệ thông tin và người dùng cao cấp. Giao diện này rất khó hiểu với người mới chuyển sang dùng, cũng như không hiệu quả vì những lệnh phải được nhớ và gõ chính xác mỗi lần – điều đó sẽ không thu hút hầu hết người tiêu dùng.

Sau đó, vào năm 1981, Xerox phát hành GUI đầu tiên trong một sản phẩm người tiêu dùng, Xerox Star. Điều này hoàn toàn khác với các giao diện sử dụng ngày nay, nhưng đánh dấu một bước ngoặt rời khỏi các giao diện dựa trên văn bản trước đây. Nó có hình ảnh, nút và màu sắc mà người dùng bình thường có thể nhận ra.

Vài năm sau đó, Apple phát hành hệ điều hành GUI đầu tiên của mình, Macintosh, vào năm 1984. Microsoft ra mắt GUI đầu tiên của mình vào năm sau đó trong Windows 1.0. Hai hệ điều hành tiên tiến này đã giới thiệu các biểu tượng để đại diện cho các thứ như tập tin, thư mục, ứng dụng và các nút. Đây là giao diện GUI của máy Macintosh khi khởi động:

Xerox Star, Macintosh và Windows đánh dấu một trong những tiến bộ quan trọng nhất trong tính cá nhân hóa máy tính: các giao diện của chúng có thể truy cập được cho công chúng nói chung. Bây giờ, người dùng bình thường có thể làm việc như mở rộng tập tin và chạy tập lệnh mà không cần biết bất kỳ lệnh hoặc ngôn ngữ lập trình chuyên môn nào.

Không cần phải nói thêm, GUI hiện là mặc định cho gần như tất cả các sản phẩm kỹ thuật số thương mại, từ máy tính để bàn và thiết bị di động đến TV, máy chơi game và tủ lạnh – nhờ vào GUI, bạn có thể nhấn nút “đá viên nghiền” trên màn hình thay vì phải nhập yêu cầu của bạn mỗi lần.

Làm thế nào GUIs hoạt động

Trong GUI, các yếu tố trực quan đại diện cho các hành động người dùng có thể thực hiện, các đối tượng mà người dùng có thể thao tác và thông tin khác liên quan đến người dùng. Một số yếu tố trực quan thường gặp là:

Con trỏ chuột, di chuyển và thao tác với các yếu tố khác
Các nút nhấn, người dùng có thể nhấp hoặc chạm để khởi động một hành động
Thanh công cụ và thanh menu, có thể coi là nhóm các nút nhấn
Biểu tượng, hình ảnh nhỏ đại diện cho thông tin hoặc các thành phần tương tác
Thực đơn, danh sách các mục có thể nhấp
Thanh cuộn, để cuộn trang xuống

Đôi khi, đồ họa GUI được liên kết với các đối tượng thực tế để đại diện cho mục đích của chúng và giúp người dùng hiểu các chức năng có sẵn cho họ. Ví dụ, một thư mục (tức là một nhóm tệp và / hoặc thư mục) được đại diện bằng một biểu tượng thư mục và thùng rác được đại diện bằng một thùng rác.

Người dùng có thể tương tác với các yếu tố trong GUI theo nhiều cách khác nhau. Phổ biến nhất, chúng ta nhấp và cuộn bằng cách sử dụng chuột trên máy tính để bàn và chạm màn hình trên các thiết bị di động. Tất cả các hệ thống vận hành GUI phổ biến và nhiều ứng dụng phần mềm cũng cho phép tương tác qua các lệnh bàn phím (một tính năng tiếp cận được khóa) và một số còn chấp nhận lệnh bằng giọng nói.

Khi người dùng khởi tạo tương tác, GUI thường phản hồi bằng một tín hiệu như thay đổi màu sắc hoặc kích thước trong yếu tố đã nhấp, một tiếng ồn hoặc hiệu ứng khác, sau đó hệ thống thực hiện hành động yêu cầu.

Khả năng hầu như bạn sử dụng nhiều GUI mỗi ngày, vì đến mức có vẻ như điều đó là rõ ràng làm thế nào chúng được thiết kế để hoạt động. Tuy nhiên, hàng thập kỷ của sự suy nghĩ và nghiên cứu tỉ mỉ đã được đầu tư để tạo ra các giao diện mà người dùng đặc biệt yêu thích, và các thiết kế tiếp tục tiên tiến mỗi năm. Ví dụ, khi các phiên bản phần mềm mới được phát hành, chúng thường bao gồm các cập nhật cho giao diện để cải thiện trải nghiệm người dùng. Gần đây nhất, VR và các lệnh bằng giọng nói đã nhận được sự quan tâm.

Sự trừu tượng trong GUIs

Mục đích cuối cùng của GUIs là cho phép con người tương tác với mã nguồn nền tảng thiết bị bằng cách tách chúng ta khỏi các chi tiết kỹ thuật và trình bày một giao diện đơn giản cho người dùng. Quá trình này được gọi là trừu tượng và là một khái niệm chính khi thiết kế và xây dựng các giao diện.

Để hiểu rõ hơn về trừu tượng là gì, chúng ta có thể liên hệ đến việc lái xe. Để lái xe của bạn, bạn không cần phải biết các chi tiết cụ thể của cách chính xác bộ máy và cột lái của xe của bạn hoạt động – điều đó sẽ là một lớp học lái xe dài.

Thay vào đó, những khái niệm tiên tiến này được trừu tượng thành giao diện người dùng của xe: các bàn đạp và vô-lăng. Tất cả những gì người lái xe cần biết là nhấn đạp chân ga để xe chuyển động đến phía trước và quay vô-lăng để xe di chuyển sang trái hoặc phải.

Điều tương tự cũng đúng cho GUIs: Biểu tượng thư mục không phải là các thư mục thực sự trên màn hình của bạn và khi bạn kéo tệp vào thùng rác của mình, bạn không đặt một thứ gì đó trong một tôi rác thực sự. Đó chỉ là trừu tượng của mã nguồn phần mềm bên dưới.

Và, bất ngờ, sự trừu tượng còn sâu hơn thế: Mã nguồn phần mềm là một sự trừu tượng của ngôn ngữ lập trình hợp ngữ và mã máy của máy tính, chính nó cũng là sự trừu tượng của phần cứng máy tính.

Thông điệp quan trọng ở đây là những lớp trừu tượng này cho phép hầu như ai cũng có thể sử dụng máy tính, vốn khá phức tạp dưới nắm.

Ví dụ GUIs

Bạn không cần phải tìm kiếm xa để tìm các giao diện người dùng đồ họa – bạn đang sử dụng một ngay bây giờ. Hầu hết các trang web, ứng dụng web, chương trình phần mềm (ví dụ: Microsoft Word và Apple Music), trình duyệt web (ví dụ: Chrome và Internet Explorer) và các hệ thống vận hành (ví dụ: Windows, macOS, iOS và Android) có GUIs.

Thường thì, các giao diện người dùng đồ họa được lần lượt lồng vào nhau. Ví dụ, khi tôi dùng Spotify để nghe nhạc trong trình duyệt web, tôi đang làm việc với giao diện ứng dụng web Spotify (màu cam bên dưới), nằm trong giao diện trình duyệt Google Chrome (màu xanh lá cây), nằm trong giao diện hệ điều hành của máy Mac của tôi (màu xanh dương).

Khi phóng to vào giao diện của Spotify, chúng ta thấy một số thành phần giao diện người dùng thông thường như nút, menu và thanh trượt:

Bạn cũng sử dụng một điện thoại thông minh, mà có một giao diện người dùng riêng cho hệ điều hành của nó và các giao diện khác nhau cho mỗi ứng dụng của nó. Tất cả các trang web phổ biến đều thích nghi giao diện người dùng của họ phù hợp với kích thước màn hình mà họ đang hiển thị. Điều này được gọi là thiết kế đáp ứng và là một yếu tố thiết yếu trong thiết kế giao diện người dùng ngày nay.

Ưu điểm của GUI

Ngày nay, mọi sản phẩm có màn hình đều có giao diện người dùng đồ họa. Dưới đây là những lý do:

Dễ sử dụng: Giao diện người dùng đồ họa thân thiện hơn với hầu hết chúng ta so với các giao diện dựa trên văn bản, đủ để kể cả những người có kiến thức rất hạn chế về máy tính cũng có thể sử dụng chúng mà không cần học ngôn ngữ lập trình hoặc câu lệnh máy tính.
Hiệu quả: Giao diện người dùng đồ họa giúp người dùng hoàn thành công việc nhanh chóng và dễ dàng hơn. Một tác vụ mà cần nhiều lệnh gõ vào dòng lệnh có thể được thực hiện chỉ với vài cú nhấp chuột trên giao diện người dùng đồ họa.
Rõ ràng: Giao diện người dùng đồ họa giúp hiển thị rõ ràng các yếu tố hình ảnh để người sử dụng dễ hiểu và cung cấp phản hồi trực quan cho người dùng để chỉ ra liệu hành động của họ có thành công hay không.
Thẩm mỹ: Giao diện người dùng đồ họa hấp dẫn hơn so với văn bản đơn giản và nhà phát triển có nhiều quyền kiểm soát hơn trong việc tùy chỉnh hình ảnh để tạo trải nghiệm người dùng thú vị.
Khả năng truy cập: Trong nhiều trường hợp, giao diện người dùng đồ họa dễ dàng tiếp cận hơn với người dùng có khuyết tật, tổn thương và giới hạn.

Nhược điểm của GUI

Giao diện người dùng đồ họa phổ biến trong máy tính cá nhân, nhưng không phải là vô cùng phổ biến. Một số người dùng thích các giao diện dựa trên văn bản, chẳng hạn như thực hiện các hành động thông qua dòng lệnh. Dưới đây là một số hạn chế nhỏ của giao diện người dùng đồ họa so với các giao diện khác:

Tốc độ: Giao diện người dùng đồ họa chậm hơn và yêu cầu nhiều nguồn lực máy tính hơn so với các giao diện dựa trên văn bản.
Sử dụng bộ nhớ: Giao diện người dùng đồ họa yêu cầu nhiều bộ nhớ máy tính hơn so với các giao diện dựa trên văn bản.
Thiếu linh hoạt: Thông thường, người dùng phải làm việc trong các giới hạn của một giao diện người dùng đồ họa và không thể thay đổi chức năng của nó. Với các giao diện dựa trên văn bản, việc cài đặt gói với các lệnh tùy chỉnh mạnh mẽ là dễ dàng.
Không hiệu quả: Vâng, hiệu quả là một lợi thế lớn của giao diện người dùng đồ họa đối với phần lớn người dùng. Nhưng nhiều người dùng có kỹ năng trong lĩnh vực công nghệ thấy rằng việc thực hiện các lệnh trong môi trường dòng lệnh hiệu quả hơn. Ngoài ra, các lệnh của môi trường dòng lệnh có thể được tự động hóa.
Xây dựng: Giao diện người dùng đồ họa cần được xây dựng bởi một nhóm thiết kế và phát triển, điều này tốn thêm thời gian và tài nguyên.

Giao diện người dùng đồ họa: Cách (hầu hết) thế giới sử dụng máy tính

Giao diện người dùng đồ họa đã trở nên rộng rãi đến nỗi chúng ta cho rằng nó là điều hiển nhiên. Tuy nhiên, đã có một thời gian trước đó, trước khi có giao diện người dùng đồ họa, chỉ có rất ít người sử dụng máy tính. Sự xuất hiện của giao diện người dùng đồ họa đánh dấu một bước ngoặc quan trọng trong việc chuyển từ một sở thích độc nhất vào thời điểm này đến cuộc cách mạng công nghệ mới chúng ta đã chứng kiến trong vòng 30 năm qua.

Đó là lý do tại sao quan trọng để lùi một bước và đánh giá cao những công việc đã được thực hiện để làm cho máy tính trở nên dễ sử dụng như vậy. Như một nhà thiết kế, bạn cần phải khám phá xem chúng ta sẽ đi đến đâu tiếp theo.