Giao diện người dùng được ra đời như thế nào ?

Giao diện người dùng được ra đời như thế nào ?

Để có được giao diện website người dùng tối ưu như hiện nay, các UI designer, kỹ sư và nhà khoa học máy tính đã mất khoảng 30 năm công sức để xây dựng và thử nghiệm. Vậy giao diện người dùng được ra đời như thế nào? Hãy cùng tìm hiểu về hành trình đầy thú vị này nhé! 

1. Giao diện người dùng bắt đầu từ Sketchpad

Ông tổ của giao diện người dùng có tên là Sketchpad - được tạo ra bởi một sinh viên Viện Công nghệ Massachusetts, Ivan E. Sutherland. Ông xây dựng nó vào năm 1962 trong vai trò là một luận án Tiến sĩ tại Phòng thí nghiệm Lincoln của MIT tại Lexington, Massachusetts. Người dùng Sketchpad không chỉ có thể vẽ điểm, đoạn thẳng và hình tròn trên màn hình CRT bằng bút ánh sáng, mà họ còn có thể gán các ràng buộc và mối quan hệ cho những gì họ vẽ. Từ đó, người dùng có thể kết hợp, xoay, phóng to hoặc thu nhỏ các đối tượng và viết nên chương trình giao diện đồ họa đầu tiên. Từ đó, đặt nền tảng cho việc phát triển, thiết kế website cũng như giao diện website ấn tượng như ngày nay.

Giao diện người dùng Sketchpad

Người dùng Sketchpad không chỉ có thể vẽ điểm, đoạn thẳng và hình tròn trên màn hình CRT bằng bút ánh sáng, mà họ còn có thể gán các ràng buộc và mối quan hệ cho những gì họ vẽ. Từ đó, người dùng có thể kết hợp, xoay, phóng to hoặc thu nhỏ các đối tượng và viết nên chương trình giao diện đồ họa đầu tiên. Từ đó, đặt nền tảng cho việc phát triển, thiết kế website cũng như giao diện website ấn tượng như ngày nay.

2. Sự ra đời của chuột máy tính

Chuột máy tính được phát minh xuất phát từ nhược điểm chung của việc sử dụng bút ánh sáng trên hệ thống máy tính tương tác của những năm 1950 và 1960, bao gồm cả Sketchpad.  Việc xác định vị trí của bút trên màn hình đòi hỏi kỹ thuật phức tạp, cũng như bắt buộc người sử dụng phải nâng cánh tay lên khỏi mặt bàn. Điều này rõ ràng sẽ gây ra sự mệt mỏi, nhất là khi các UI Designer (nhà thiết kế giao diện người dùng) phải làm việc trong thời gian dài. 

Hệ thống máy tính của Douglas

Douglas Engelbart phát minh ra chuột máy tính vào năm 1963 khi làm việc tại Xerox PARC. Chuột máy tính được sử dụng phổ biến khi ứng dụng vào máy tính Apple Lisa và trở thành một phần không thể thiếu trên hầu hết các máy tính hiện đại ngày nay, đặc biệt là trong công việc thiết kế website.

2.1. Chuột máy tính đã được thiết kế lại nhiều lần

Đúng vậy! Sự phát triển và cải tiến của chuột máy tính đã trải qua rất nhiều giai đoạn khác nhau. Bắt đầu từ phiên bản có kích cỡ lớn (gấp đôi chuột máy tính ngày nay) làm bằng gỗ vào năm 1970, sử dụng hai bánh xe để cung cấp dữ liệu theo hai trục rồi chuyển sang máy tính. Sau đó vào năm 1972, bánh xe được thay thế bằng một viên bi kim loại giúp cho việc di chuyển chuột khi thiết kế website mượt mà và đa chiều hơn. 

Chuột máy tính

Và vào năm 1979, chuột máy tính lại một lần nữa được thay đổi. Con lăn từ chất liệu kim loại được thiết kế lại bằng cao su và lực kéo của chuột máy tính phụ thuộc vào ma sát của cao su và trọng lượng của quả bóng.

2.2. Các nút bấm trên chuột máy tính đã thay đổi như thế nào

Bạn có biết con chuột máy tính bằng gỗ đầu tiên chỉ có một nút bấm thôi hay không? Sau đó, thiết kế được thay đổi sang 2 đến 3 nút và cuối cùng là phiên bản tổ hợp các nút như ngày nay. Một con chuột máy tính tiêu chuẩn 6x10cm hiện đại có thể có rất nhiều nút - nút phải, nút trái, nút giữa, nút cuộn và các nút chức năng mở rộng hai bên. Điều này đặc biệt có ích với các UI Designer khi các nút bấm hỗ trợ trên chuột sẽ giúp họ làm việc thiết kế website tốc độ và hiệu quả hơn. 

3. Sự ra đời của Windows, thanh Menu và biểu tượng máy tính

3.1. Sự xuất hiện của Windows lần đầu tiên 

Năm 1962, Sketchpad có thể chia giao diện màn hình theo chiều ngang thành hai phần độc lập, còn được gọi là thiết kế cửa sổ lát gạch. Đến năm 1972, một nhóm ngôn ngữ lập trình Smalltalk tại Xerox PARC đã triển khai phiên bản Windows của họ. Họ sử dụng công nghệ bit để hiển thị hình ảnh dưới dạng các dấu chấm trên màn hình. Công nghệ này cũng giúp thay đổi kích thước (phóng to hoặc thu nhỏ), di chuyển cũng như tạo ra các cửa sổ giao diện website chồng lên nhau một cách dễ dàng hơn. 

3.2. Sự ra đời của thanh Menu

Ban đầu vào những năm 1960, thanh Menu được thiết kế luôn xuất hiện liên tục trên màn hình máy tính và sử dụng phổ biến trong điện toán quốc phòng. Chỉ đến khi công nghệ Bit và Windows ra đời, thanh menu mới được cải tiến và có thể tùy chỉnh để xuất hiện và biến mất theo nhu cầu.

Thanh menu

Và sau này, Apple đã đơn giản hóa mọi thứ trên Lisa và Macintosh bằng một thanh Menu duy nhất được đặt ở phía trên màn hình. Thanh menu này chỉ liên quan đến cửa sổ đang được sử dụng và có thể được “kéo xuống” khỏi thanh và di chuyển Menu đến một vị trí mong muốn trên màn hình. Điều này giúp người sử dụng có thể nhanh chóng tìm được nơi muốn tới trong một  giao diện website.

3.3. Biểu tượng máy tính được đặt tên như thế nào

Công việc ban đầu về biểu tượng này được thực hiện bởi Bell Northern Research. Nhưng khái niệm về “biểu tượng máy tính” mãi đến năm 1975 mới được chính thức hóa. Ban đầu, David Canfield Smith sử dụng thuật ngữ này từ nhà thờ Chính thống giáo Nga. Sau đó, các nhà phát triển của Xerox đã phát triển và thử nghiệm các biểu tượng cho giao diện Star trong suốt ba năm trước khi phiên bản đầu tiên hoàn thiện. Họ đã nhiều lần điều chỉnh kích thước và thiết kế để làm cho chúng rõ ràng và dễ nhận biết.

Có thể nói, sự ra đời của giao diện người dùng là nền tảng to lớn của giao diện website ngày nay. Kiểu chữ, bảng màu, thanh điều hướng, hình ảnh… là tất cả những gì mà một người thiết kế website/ UI Designer sẽ cố gắng tạo ra để thu hút thị giác cũng như đem đến trải nghiệm thú vị và thân thiện cho người sử dụng.