Giao diện người máy
MỤC LỤC
PHẦN I: GIỚI THIỆU CHUNG VỀTƯƠNG TÁC NGƯỜI - MÁY . 1
CHƯƠNG I: CON NGƯỜI. 1
1.1. Giới thiệu. 1
1.2. Các kênh vào - ra. 3
1.2.1. Thịgiác . 4
1.2.1.1. Mắt người . 5
1.2.1.2. Thu nhận bằng thịgiác . 6
1.2.1.3. Khảnăng và hạn chếcủa xửlý thịgiác . 10
1.2.2. Thính giác . 15
1.2.2.1. Tai người . 15
1.2.2.2. Xửlý âm thanh . 16
1.2.3. Xúc giác . 17
1.2.4. Sựchuyển động . 19
1.3. Bộnhớ. 20
1.3.1. Bộnhớngắn hạn . 20
1.3.2. Bộnhớdài hạn . 23
CHƯƠNG II: MÁY TÍNH . 25
2.1. Các thiết bịnhập . 25
2.1.1. Các thiết bịnhập chuẩn. 25
2.1.2. Các phương pháp nhập tựchọn . 25
2.2. Các thiết bịxuất. 27
2.3. Bộnhớ. 28
2.3.1. Bộnhớngắn hạn . 28
2.3.2. Bộnhớdài hạn . 28
CHƯƠNG III: TƯƠNG TÁC . 34
3.1. Các mô hình tương tác. 34
3.1.1. Chu trình thực hiện-đánh giá . 34
3.1.2. Khung tương tác . 36
3.2. Các khungvà HCI. 38
3.3. Công thái học . 38
3.3.1. Sắp xếp các điều khiển và hiển thị. 39
3.3.2. Môi trường vật lý của tương tác . 40
3.3.3. Các vấn đềvềsức khoẻ. 40
3.3.4. Sửdụng màu sắc . 41
3.4. Một sốphong cách giao diện . 42
3.4.1. Giao diện lệnh. 43
3.4.2. Menu . 43
3.4.3. Ngôn ngữtựnhiên . 44
3.4.4. Đối thoại truy vấn và đối thoại kiểu hỏi /trảlời . 45
3.4.5. Form –fill và bảng tính. 45
3.4.6. WIMP. 46
3.4.7. Point và click . 46
PHẦN II: THIẾT KẾGIAO DIỆN NGƯỜI DÙNG . 47
CHƯƠNG 4: GIỚI THIỆU CHUNG VỀTHIẾT KẾGIAO DIỆN NGƯỜI
DÙNG . 47
4.1. Khái niệm giao diện người dùng. 47
4.2. Tại sao cần thiết kếgiao diện . 48
4.3. Các quy tắc thiết kếgiao diện người dùng. 50
4.3.1. Hướng dẫn tương tác chung. 50
4.3.2. Hướng dẫn vềviệc hiển thịthông tin . 51
4.3.3. Hướng dẫn vềviệc vào dữliệu . 52
CHƯƠNG 5: CÁC HOẠT ĐỘNG PHÁT TRIỂN PHẦN MỀM. 55
5.1. Kĩnghệphần mềm . 55
5.2. Vòng đời cổ điển . 56
5.3. Làm bản mẫu. 59
CHƯƠNG 6: CÁC MÔ HÌNH CỦA NGƯỜI DÙNG TRONG THIẾT KẾ
GIAO DIỆN . 61
6.1. Mô hình các yêu cầu của người dùng . 61
6.2. Các mô hình kĩthuật-xã hội. 61
6.2.1. USTM/CUSTOM . 61
6.2.2. OSTA . 64
6.2.3. ETHICS . 65
6.3. Phương pháp luận các hệthống phần mềm . 66
6.4. Thiết kếhợp tác . 68
6.5. Các mô hình nhận thức. 70
6.6. Mô hình phân cấp mục đích và nhiệm vụ. 72
6.6.1. GOMS. 74
6.6.2. CCT.77
CHƯƠNG 7: QUY TRÌNH THIẾT KẾGIAO DIỆN NGƯỜI DÙNG
HƯỚNG NGƯỜI DÙNG. 82
7.1. Quy trình thiết kếhướng người dùng . 82
7.2. Pha phân tích . 85
7.3. Pha thiết kế. 86
7.4. Pha đánh giá . 87
7.5. Những ưu điểm của quy trình phát triển hướng người dùng. 88
CHƯƠNG 8: QUY TRÌNH THIẾT KẾGIAO DIỆN NGƯỜI DÙNG
HƯỚNG NHIỆM VỤ. 89
8.1. Quy trình thiết kếhướng nhiệm vụ. 89
8.1.1. Xác định mục đích sửdụng hệthống của người sửdụng . 90
8.1.2. Lựa chọn các nhiệm vụ. 91
8.1.3. Sao chép . 92
8.2. Phân tích nhiệm vụ. 93
8.2.1. Định nghĩa. 93
8.2.2. Các phương pháp và các kĩthuật phân tích . 93
8.2.2.1. Phân tích nhiệm vụphân cấp (HTA). 94
8.2.2.2. GMOS . 97
8.3. Mô hình hoá nhiệm vụ. 97
8.3.1. Mô hình nhiệm vụtruyền thống . 97
8.3.2. UML. 98
8.3.2.1. Mục đích. 98
8.3.2.2. Các loại sơ đồtrong UML. 99
8.3.3. Mô hình ngữcảnh . 100
CHƯƠNG 9: THIẾT KẾGIAO DIỆN NGƯỜI DÙNG THEO MÔ HÌNH
HƯỚNG ĐỐI TƯỢNG. 101
9.1. Khái quát chung vềlịch sửcủa mô hình hướng đối tượng . 101
9.1.1. Khái quát chung .101
9.1.2. Phân tích và thiết kếhướng đối tượng. 104
9.2. Thiết kếgiao diện người dùng theo phương pháp hướng đối tượng . 107
9.2.1. Cấu trúc giao diện người sửdụng. 107
9.2.2. Đối tượng giao diện và thuộc tính của đối tượng . 108
9.3. Ví dụminh hoạ. 109
9.3.1. Các giai đoạn chính của quá trình phát triển . 109
9.3.2. Phân tích đối tượng. 110
9.3.3. Phân tích hoạt động . 111
9.3.4. Đặc tảcấu trúc. 113
9.3.5. Đặc tảthành phần . 114
tượng là rất rõ ràng. Ví dụ, trong chương trình soạn thảo, tài liệu bao gồm nhiều đoạn, mỗi đoạn lại bao gồm nhiều từ. Tất cả các đối tượng đó đều là các đối tượng giao diện. Thuộc tính của đối tượng: Mỗi đối tượng giao diện có các thuộc tính vật lý và nhận thức của nó. Thuộc tính vật lý bao gồm các thuộc tính như: kích thước, vị trí, và tính nhìn thấy được. Tính nhìn thấy được có 2 khía cạnh: tính nhìn thấy được của đối tượng ở trên màn hình và tính nhìn thấy được của phạm vi hoặc biên của đối tượng. Cả 2 khía cạnh của tính nhìn thấy được đều có ý nghĩa rất quan trọng trong quá trình thiết kế giao diện người dùng. Ví dụ, người sử dụng sẽ không thể truy cập đến các đối tượng mà họ không thể nhìn thấy được. Các thuộc tính nhận thức là các tính chất của đối tượng không thể hiển thị được rõ ràng và không thể truy cập được dễ dàng. Ngoài việc đặc tả tất cả các thuộc tính, người thiết kế cũng nên biết được số lượng các thuộc tính và kích thước của chúng. Nếu một đối tượng có quá nhiều thuộc tính, người thiết kế nên phân rã đối tượng đó ra thành các đối tượng con hoặc cụ thể hoá các thuộc tính. Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 109 9.3. Ví dụ minh hoạ Chúng ta được học về phát triển phần mềm nói chung theo phương pháp hướng đối tượng, do đó tài liệu này sẽ không đề cập lại các khái niệm cũng như các kĩ thuật liên quan, mà chỉ tập trung vào việc ứng dụng phương pháp đó trong thiết kế giao diện. Để thực hiện điều này, cách tốt nhất là xem xét một số thiết kế cụ thể để rút ra các bài học kinh nghiệm trong khi áp dụng mô hình OO. Bài toán: Xây dựng ứng dụng cho phép người sử dụng thanh toán hoá đơn qua thiết bị đầu cuối-máy tính. Người sử dụng có thể truy cập vào tài khoản ngân hàng, và thực hiện thanh toán qua tài khoản cá nhân. Giải pháp: Sử dụng phương pháp hướng đối tượng cho việc phát triển giao diện 9.3.1. Các giai đoạn chính của quá trình phát triển Hình 9.5: Các giai đoạn chính trong quy trình phát triển OO Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 110 9.3.2. Phân tích đối tượng Quá trình phân tích đối tượng sẽ tạo ra mô hình đối tượng phân tích. Sau đây là bảng liệt kê các giao dịch đã được phát hiện trong quá trình phân tích: Bảng 1: Các giao dịch trong ứng dụng ngân hàng cho người sử dụng cuối STT Giao dịch 1 Người sử dụng kiểm tra bảng cân đối trong tài khoản của mình 2 Người sử dụng thanh toán hoá đơn, ví dụ người dùng nhập các hoá đơn cần phải thanh toán theo lịch có hẹn sẵn vào danh sách các hoá đơn cần thanh toán 3 Người dùng sửa đổi các hoá đơn nằm trong danh sách chờ thanh toán theo ngày hẹn trước. 4 Người dùng xoá hoá đơn ra khỏi danh sách chờ thanh toán 5 Người sử dụng kiểm tra lại các giao dịch mới thực hiện Bảng 2: Các nhiệm vụ mà người dùng cần thực hiện để kiểm tra bảng cân đối tài khoản của mình STT Nhiệm vụ 1 Lựa chọn một tài khoản của người dùng 2 Đọc bảng cân đối tài khoản đã được chọn Mô hình đối tượng phân tích thu được được biểu diễn như sau: Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 111 Hình 9.6: Mô hình đối tượng phân tích của ứng dụng ngân hàng (các quy ước về kí hiệu đã được cho ở phần cấu trúc giao diện) 9.3.3. Phân tích hoạt động Trong pha phân tích hoạt động, chúng ta sẽ tiến hành phân tích các hoạt động của người sử dụng cuối và xây dựng các nhiệm vụ để phục vụ cho các hoạt động đó. Các nhiệm vụ tương ứng với các hoạt động của người dùng trong bảng 1 được cho trong các bảng dưới đây: Bảng 3: Các nhiệm vụ mà người sử dụng cần thực hiện để thanh toán hoá đơn Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 112 STT Nhiệm vụ 1 Lựa chọn tài khoản của người sử dụng 2 Thay đổi thông tin liên quan đến hoá đơn 3 Nhập hoá đơn cần thanh toán vào trong danh sách chờ để thanh toán theo đúng ngày hẹn Bảng 4: Các nhiệm vụ mà người sử dụng cần thực hiện để thay đổi hoá đơn trong danh sách chờ STT Nhiệm vụ 1 Lựa chọn hóa đơn trong danh sách chờ 2 Thay đổi thông tin liên quan đến hoá đơn Bảng 5: Các nhiệm vụ mà người sử dụng cần thực hiện để xoá hoá đơn khỏi danh sách chờ STT Nhiệm vụ 1 Lựa chọn hoá đơn đang đợi để thanh toán theo hẹn trước 2 Xoá hoá đơn ra khỏi danh sách chờ Bảng 6: Các nhiệm vụ mà người sử dụng cần thực hiện để kiểm tra các giao dịch mới nhất STT Nhiệm vụ 1 Lựa chọn tài khoản của người sử dụng 2 Đọc các giao dịch liên quan đến tài khoản của người dùng đó Bảng 7: Các nhiệm vụ của ứng dụng ngân hàng cho người sử dụng cuối STT Nhiệm vụ 1 Lựa chọn tài khoản người dùng 2 Đọc bảng cân đối tài khoản của người dùng đó 3 Đọc các giao dịch liên quan đến tài khoản đó Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 113 4 Thay đổi thông tin liên quan đến hoá đơn được thanh toán 5 Nhập hoá đơn vào danh sách chờ thanh toán 6 Xoá hoá đơn ra khỏi danh sách 7 Lựa chọn hoá đơn trong danh sách để thanh toán Sau khi có được các hoạt động, và phân chia chúng thành các nhiệm vụ, ta thấy rằng một số hoạt động có các nhiệm vụ chung nhau. Ví dụ, trong bảng 3 và 4 đều có cùng nhiệm vụ “Thay đổi thông tin liên quan đến hoá đơn”. Đây thực ra chỉ là một trường hợp may mắn, và không phải mọi ứng dụng đều có các trường hợp như vậy. Kết quả là sau khi phân tích, chúng ta đã tập hợp và liệt kê được tất cả các nhiệm vụ mà ứng dụng phải có (bảng 7). Tiếp theo là giai đoạn đặc tả cấu trúc 9.3.4. Đặc tả cấu trúc Đặc tả cấu trúc nhằm mục đích nhận dạng các hộp thoại của úng dụng. Ta sẽ đặt các nhiệm vụ vào trong các hộp thoại và hình dung mối quan hệ giữa các hộp thoại đó. (chú ý là các cửa sổ ở đây cũng được coi là các hộp thoại) Hình 9.7: Sơ đồ đối thoại của ứng dụng Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 114 Sơ đồ đối thoại (hình 9.7), sẽ cung cấp cho ta một cái nhìn trực quan về cấu trúc của giao diện người dùng. Trong sơ đồ trên, câu lệnh “do:” sẽ đặt các nhiệm vụ từ danh sách các nhiệm vụ đã được số (trong các bảng ở trên) vào các hộp thoại. Đường kẻ trong hộp thoại dùng để kí hiệu hộp thoại đó là cửa sổ chính và dấu sao là hộp thoại ẩn. Ví dụ, hộp thoại “Account Selection” trong hình 6. Sự chuyển đổi từ hộp thoại này sang hộp thoại kia chỉ được thực hiện trong một số điều kiện nhất định. Những điều kiện đó được cho trong dấu ngoặc vuông. Ví dụ, việc di chuyển từ hộp thoại “Bank Terminal” đến “Account Selection” chỉ có thể xảy ra nếu như các account có thể được chọn trong trạng thái sẵn sàng. Dấu sổ được dùng để biểu diễn các hoạt động sẽ xảy ra trong khi thực hiện việc di chuyển từ hộp thoại này sang hộp thoại kia. Ví dụ, Nếu lựa chọn “OK” gây ra sự di chuyển từ hộp thoại “Bill Selection” trở lại hộp thoại “Bank Terminal”, thì thông tin của hoá đơn được chọn sẽ được tải. Khi xây dựng sơ đồ thoại, chúng ta vẫn phải thực hiện một số phân tích hoạt động. Nhiệm vụ quan trọng nhất và chung nhất nên được thiết kế làm sao cho người dùng dễ thực hiện nhất. Do đó, chúng ta nên đánh giá các nhiệm vụ theo mức độ quan trọng của nó và nhóm chúng lại để tạo ra các hộp thoại. Cửa sổ chính nên dành cho các nhiệm vụ cơ bản nhất. Các nhiệm vụ thứ cấp nên đặt trong các hộp thoại riêng. 9.3.5. Đặc tả thành phần Trong pha đặc tả thành phần, chúng ta sẽ tiến hành đặc tả tất cả các thành phần giao diện mà người sử dụng cần để thực hiện các nhiệm vụ. Như đã đề cập ở trên, các hộp thoại được xây dựng từ các thành phần, và các thành phần lại được xây dựng từ các công cụ thao tác và phản hồi, hoặc là sự kết hợp giữa các loại công cụ đó. Các thành phần sẽ cung cấp các phương tiện thân thiện để cho người sử dụng thao tác với các đối tượng trong ứng dụng và thực hiện các hoạt động khác nhau. Các công cụ thao tác cũng được sử dụng cho mục đích đó. Các thành phần cũng được dùng để thông báo cho người sử dụng về trạng thái của các đối tượng ứng dụng và các hoạt động đang diễn ra. Các công cụ phản hồi sẽ đảm nhiệm nhiệm vụ này. Khi chúng ta muốn có được Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 115 hành vi thao tác và phản hồi với chỉ một công cụ duy nhất, ta sẽ sử dụng các công cụ kết hợp như là các danh sách, các trường text, hoặc các đối tượng đồ hoạ tương tác. Để miêu tả các thành phần của hộp thoại, chúng ta sẽ vẽ các hộp thoại như trong hình vẽ 9.8, 9.9, và 9.10 với các kí kiệu sau: • Hình chữ nhật góc tròn to, trên nền màu xám: biểu diễn thành phần, mỗi thành phần bao gồm nhiều công cụ • Hình elip: Công tụ thao tác • Hình chữ nhật: công cụ phản hồi • Hình chữ nhật góc tròn: sự kết hợp của 2 công cụ Hình 9.8: Hộp thoại ứng dụng ngân hàng Hộp thoại bao gồm 4 thành phần đó là: “Balance”, “Date”, “Bill” và “Application Control”. Thành phần Date được sử dụng bất cứ khi nào người sử dụng cần thao tác với date, ví dụ như nhập ngày thanh toán hoá đơn. Thành Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 116 phần Application Control cho phép người dùng mở các hộp thoại khác và kết thúc ứng dụng. Các hộp thoại khác trong ứng dụng được minh hoạ trong hình vẽ sau: Hình 9.9: Các hộp thoại khác trong ứng dụng Trong khi xây dựng, các chức năng phức tạp của hộp thoại cần phải được giải thích rõ ràng. Phần giải thích cũng nên làm rõ các khía cạnh của vấn đề cài đặt như là chính sách cập nhật, các kiểu lựa chọn, các giá trị ngầm định, các giá trị hợp lệ và không hợp lệ… Ví dụ giải thích cho thành phần “date” có thể được minh hoạ như sau: Nguyễn Viết C ường K4B Khoa CNTT Email: cuongit4b@gmail.com Tel : 0988 327 228 117 Hình 9.10: Giải thích cho thành phần “Date” Sau một quá trình, giao diện kết quả cuối cùng của ứng dụng được biểu diễn trong hình vẽ sau: Hình 9.11: Các hộp thoại của giao diện
File đính kèm:
Giao diện người máy.pdf
