Giao diện người dùng là một phần của hệ thống mà người dùng tương tác. Nó bao gồm màn hình hiển thị cung cấp điều hướng thông qua hệ thống, màn hình và biểu mẫu thu thập dữ liệu và các báo cáo mà hệ thống tạo ra (cho dù trên giấy, trên màn hình hay qua một số phương tiện khác). Chương này giới thiệu các nguyên tắc và quy trình cơ bản của giao diện thiết kế và thảo luận về cách thiết kế cấu trúc giao diện và các tiêu chuẩn, điều hướng thiết kế, thiết kế đầu vào và thiết kế đầu ra. Chương này cũng mô tả ảnh hưởng của các yêu cầu phi chức năng đối với việc thiết kế lớp tương tác giữa người và máy tính.
Trang 1BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC KINH TẾ TP.HCM
BÁO CÁO LÝ THUYẾT
THIẾT KẾ LỚP TƯƠNG TÁC GIỮA CON NGƯỜI VÀ MÁY TÍNH
MỤC LỤC
Trang 2I Giới thiệu: 1
1 Khái niệm: 1
2 Thành phần cơ bản của giao diện người dùng: 1
Có 3 phần: 1
3 Nội dung chính của chương: 1
II Nguyên tắc thiết kế giao diện người dùng: 2
1 Bố trí 2
2 Nhận thức về nội dung: 5
3 Tính thẩm mỹ: 6
4 Kinh nghiệm người dùng: 7
5 Tính nhất quán: 9
6 Giảm thiểu nỗ lực của người dùng: 9
III Quy trình thiết kế giao diện người dùng: 10
1 Phát triển kịch bản sử dụng: 11
2 Thiết kế cấu trúc giao diện 14
3 Thiết kế tiêu chuẩn giao diện 16
4 Tạo mẫu thiết kế giao diện: 18
5 Đánh giá giao diện 21
IV Thiết kế điều hướng: 23
2 Các loại điều khiển điều hướng 24
3 Thông báo: 28
4 Thiết kế điều hướng 30
V Thiết kế đầu vào: 32
1 Nguyên tắc cơ bản 32
2 Các loại đầu vào: 35
3 Xác thực đầu vào 37
VI Thiết kế đầu ra: 38
1 Các loại đầu ra: 40
2 Phương tiện truyền thông: 40
Trang 3VII YÊU CẦU PHI CHỨC NĂNG VÀ THIẾT KẾ LỚP TƯƠNG TÁC
GIỮA NGƯỜI VÀ MÁY TÍNH 41
VIII ÁP DỤNG CÁC KHÁI NIỆM TRONG LỰA CHỌN CD 42
1 Phát triển kịch bản sử dụng 43
2 Thiết kế cấu trúc giao diện 44
3 Sửa đổi WND 46
4 Thiết kế tiêu chuẩn giao diện 48
5 Thiết kế mẫu giao diện 48
6 Tạo mẫu thiết kế giao diện 50
7 Đánh giá giao diện 51
8 Tài liệu Thiết kế Điều hướng 52
TỔNG KẾT 53
1 Nguyên tắc thiết kế giao diện người dùng 53
2 Quy trình thiết kế giao diện người dùng 53
3 Thiết kế điều hướng 54
4 Thiết kế đầu vào 54
5 Thiết kế đầu ra 55
6 Yêu cầu phi chức năng và Lớp tương tác giữa con người và máy tính 55
Trang 4- Lớp giao diện người và máy tính xác định cách thức mà người dùng
sẽ tương tác với hệ thống và bản chất của đầu vào và đầu ra mà hệ thống có thể chấp nhận
2 Thành phần cơ bản của giao diện người dùng:
Có 3 phần:
- Thứ nhất: cơ chế điều hướng (cách mà người dùng đưa ra hướng dẫn
cho hệ thống và yêu cầu hệ thống phải làm gì) Ví dụ: nút, menu
- Thứ hai: cơ chế đầu vào (input – cách hệ thống nắm bắt thông tin) Ví
dụ: biểu mẫu để thêm khách hàng mới, …
- Thứ ba: cơ chế đầu ra (output – cách hệ thống cung cấp thông tin cho
người dùng hoặc cho các hệ thống khác) Ví dụ: báo cáo, trang web
3 Nội dung chính của chương:
- Giới thiệu một số nguyên tắc thiết kế giao diện người dùng cơ bản.
- Cung cấp một cái nhìn tổng quan về quy trình thiết kế lớp tương tác
giữa con người và máy tính
- Cung cấp cái nhìn tổng quan về thành phần (điều hướng, đầu vào và
đầu ra) được sử dụng trong thiết kế giao diện
II Nguyên tắc thiết kế giao diện người dùng:
Trang 5Vấn đề lớn nhất mà các nhà thiết kế phải đối mặt là sử dụng không gian một cách
hiệu quả Nói một cách đơn giản, thường có quá nhiều thông tin cần được trình bày
trên một màn hình hoặc báo cáo hoặc biểu mẫu Các nhà phân tích phải cân bằng
nhu cầu về sự đơn giản và hình thức, tránh việc trình bày thông tin quá nhiều trên
các trang
Layout
(Bố trí) Giao diện là một loạt các khu vực trên màn hình được sử dụng nhất quáncho các mục đích khác nhau Ví dụ: vùng trên cùng cho các lệnh và điều
hướng, khu vực giữa để thông tin được nhập hoặc xuất, và khu vực dưới cùng cho thông tin trạng thái.
(Tính thẩm mỹ) Các giao diện phải hoạt động hiệu quả và hấp dẫn người dùng thông quaviệc sử dụng khoảng trắng, màu sắc và phông chữ
Thường có sự đánh đổi giữa việc bao gồm đủ khoảng trắng để làm cho giao diện trông đẹp mắt mà không làm mất đi nhiều không gian mà thông tin quan trọng không vừa trên màn hình.
Minimal User Effort
(Nỗ lực tối thiểu của người dùng)
Giao diện phải đơn giản để sử dụng Hầu hết các nhà thiết kế có kế hoạch
về việc không có hơn ba lần nhấp chuột từ menu bắt đầu cho đến khi người dùng thực hiện công việc.
1 Bố trí
- Yếu tố đầu tiên của thiết kế là bố cục cơ bản của màn hình, biểu mẫu
hoặc báo cáo
- Màn hình được chia thành ba hộp Hộp trên cùng là vùng điều hướng,
qua đó người dùng đưa ra các lệnh để điều hướng trong hệ thống
Hộp dưới cùng là khu vực trạng thái, hiển thị thông tin về những gìngười dùng đang làm Hộp giữa - và lớn nhất - được sử dụng để hiểnthị báo cáo và trình bày biểu mẫu cho nhập dữ liệu
Trang 6- Trong nhiều trường hợp (đặc biệt là trên Web), nhiều vùng bố cục
được sử dụng Hình 11-2 hiển thị một màn hình có năm khu vực điều
hướng, mỗi khu vực được sắp xếp để cung cấp chức năng và điềuhướng trong các phần khác nhau của hệ thống Khu vực trên cùngcung cấp Điều khiển lệnh và điều hướng chuẩn của Internet Explorerthay đổi nội dung của toàn bộ hệ thống Khu vực điều hướng ở cạnhbên trái điều hướng giữa các phần và thay đổi tất cả nội dung bênphải của nó Hai khu vực điều hướng khác ở trên cùng và dưới cùngcủa trang cung cấp các cách khác để điều hướng giữa các phần
- Việc sử dụng nhiều khu vực bố trí để điều hướng cũng áp dụng cho các
đầu vào và đầu ra Các vùng dữ liệu trên báo cáo và biểu mẫu thường
Trang 7được chia thành các vùng con, mỗi vùng được sử dụng cho một loại
thông tin khác Ví dụ: trên mẫu đơn đặt hàng (hoặc báo cáo đơn hàng), một phần có thể được sử dụng cho thông tin khách hàng (ví dụ: tên, địa chỉ), một phần cho thông tin về đơn đặt hàng nói chung (ví dụ: ngày, thông tin thanh toán) và một phần, cho chi tiết đơn đặt hàng (ví dụ: bao nhiêu đơn vị trong số các mặt hàng với giá bao nhiêu mỗi mặt hàng) Mỗi khu vực được tự kiểm soát để thông tin trong khu vực này không chạy sang khu vực khác.
- Các khu vực và thông tin trong các khu vực phải có luồng trực quan tự
nhiên để giảm thiểu sự di chuyển của người dùng từ khu vực này sangkhu vực khác Trong bất kỳ trường hợp nào, trước khi các khu vựcđược đưa vào biểu mẫu hoặc báo cáo, nhà phân tích phải có sự hiểubiết rõ ràng về cách sắp xếp có ý nghĩa nhất đối với cách biểu mẫuhoặc báo cáo sẽ được sử dụng Dòng chảy giữa các phần cũng phải
nhất quán, cho dù nằm ngang hay dọc (xem Hình 11-3) Tốt nhất là
các khu vực sẽ duy trì sự nhất quán về kích thước, hình dạng và vị trícho các biểu mẫu được sử dụng để nhập thông tin (dù trên giấy haytrên màn hình) và báo cáo được sử dụng để trình bày nó
2 Nhận thức về nội dung:
Trang 8a Khái niệm: Nhận thức về nội dung đề cập đến khả năng của giao diện
làm cho người dùng nhận biết được thông tin mà giao diện chứa đựng với
ít nỗ lực nhất từ phía người dùng
b Áp dụng vào phương diện nào?
- Nhận thức về nội dung áp dụng cho giao diện nói chung Tất cả các giao diện phải có tiêu đề Menu phải hiển thị vị trí của chúng Ví dụ, trong Hình 11-2, dòng bên dưới khu vực điều hướng phần trên cùng cho thấy rằng người dùng đã duyệt từ trang chủ Wiley đến phần khoa học máy tính, phần mạng, phần mạng chung, và sau đó đến cuốn sách cụ thể này.
- Nhận thức về nội dung cũng áp dụng cho các khu vực trong biểu mẫu
và báo cáo Tất cả các khu vực nên phải được xác định rõ ràng Sau
đó, người dùng có thể nhanh chóng xác định vị trí phần của biểu mẫuhoặc báo cáo có khả năng chứa thông tin họ cần Đôi khi các khu vựcđược đánh dấu bằng cách sử dụng đường kẻ, màu sắc hoặc tiêu đề (ví
dụ: khu vực mặt cắt trong Hình 11-2), trong khi trong các trường hợp
khác, các khu vực chỉ được ngụ ý (ví dụ: điều khiển trang ở cuối Hình11-2)
- Nhận thức về nội dung cũng áp dụng cho các trường (fields) trong
mỗi khu vực Trường là các phần tử riêng lẻ của dữ liệu, là đầu vào hoặc đầu ra Các nhãn hiệu (labels) của trường được dùng để nhận biết được từng trường trên giao diện nên ngắn gọn và đặc trưng, riêngbiệt Không nên chắc chắn về định dạng thông tin trong các trường,
cho dù để nhập hay hiển thị Ví dụ: ngày 10/5/07 khác nhau tùy thuộc vào việc bạn đang ở Hoa Kỳ (ngày 5 tháng 10 năm 2007) hay
ở Canada (ngày 10 tháng 5 năm 2007)
- Nhận thức nội dung cũng áp dụng cho các hình thức hay báo cáo
chứa thông tin Nói chung, tất cả hình thức và báo cáo nên có ngày chuẩn bị ( ngày in hoặc dữ liệu hoàn thành ) sao cho thông tin về ngày tháng phải rõ ràng
Hình 11-4 cho thấy một biểu mẫu từ Đại học Georgia Biểu mẫu này
minh họa hợp lý nhóm của các lĩnh vực vào trong các khu vực với một hộp rõ ràng (trên cùng bên trái), cũng như một khu vực ngụ ý không
có hộp (phía dưới bên trái) Các địa chỉ lĩnh vực trong vùng địa chỉ tuân theo một trật tự rõ ràng, tự nhiên Các nhãn hiệu ngắn nếu có thể (xem phía trên bên trái) nhưng dài khi cần thêm thông tin để tránh hiểu sai (xem phía dưới bên trái).
Trang 93 Tính thẩm mỹ:
a Khái niệm: Tính thẩm mỹ đề cập đến việc thiết kế các giao diện đẹp mắt
b Làm thế nào để thể hiện tính thẩm mỹ?
- Tất cả các hình thức và các dạng báo cáo đều cần có một khoảng
trống tối thiểu được để trống => tránh gây khó chịu cho người dùng khi nhiều thông tin bị dồn ép trên một trang màn hình
- Phản ứng đầu tiên của bạn khi bạn nhìn vào Hình 11-4 là gì? Đây
là hình thức khó chịu nhất tại Đại học Georgia, theo các nhân viên Mật độ của nó quá cao; nó có quá nhiều thông tin bị dồn vào một không gian quá nhỏ với quá ít khoảng trắng Mặc dù có thể hiệu quả để tiết kiệm giấy bằng cách sử dụng một trang chứ không phải hai trang, nó không hiệu quả đối với nhiều người dùng.
- Người mới sử dụng hoặc không thường xuyên sử dụng một giao diện,cho dù trên màn hình hay trên giấy, thích giao diện có mật độ thấp,thường là giao diện có mật độ dưới 50 phần trăm (nghĩa là ít hơn hơn
Trang 1050 phần trăm giao diện bị chiếm bởi thông tin) Còn người dùng cókinh nghiệm hơn thích mật độ cao hơn, đôi khi đạt tới 90% vì họ biết
vị trí thông tin được định vị và mật độ cao làm giảm lượng chuyểnđộng vật lí thông qua giao diện
Ví dụ: Hình 11-14 thường được dùng bởi người có kinh nghiệm như nhân viên phòng nhân sự, những người sử dụng nó hàng ngày.
c Thiết kế văn bản:
- Theo nguyên tắc chung, tất cả văn bản phải giống nhau phông chữ và
có cùng kích thước Phông chữ phải có kích thước không dưới 8,nhưng 10 thường được ưa thích, đặc biệt nếu giao diện sẽ được sửdụng bởi những người lớn tuổi Thay đổi phông chữ và kích thướcđược sử dụng để chỉ ra những thay đổi trong loại thông tin được trìnhbày (ví dụ: đề mục, chỉ báo trạng thái) Nên tránh in nghiêng và gạchchân vì chúng làm cho văn bản khó đọc hơn
- Phông chữ serif (“chữ có chân” chẳng hạn như Times Roman) lànhững báo cáo in dễ đọc nhất, đặc biệt là những báo cáo nhỏ Phôngchữ Sans serif (chẳng hạn như Helvetica hoặc Arial, giống như nhữngphông chữ được sử dụng cho tiêu đề chương trong cuốn sách này) dễđọc nhất đối với màn hình máy tính và thường được sử dụng cho cáctiêu đề trong báo cáo in Không sử dụng tất cả các chữ cái viết hoa,ngoại trừ tiêu đề
- Màu sắc và hoa văn nên được sử dụng cẩn thận và tiết kiệm và chỉ khi
dùng cho mục đích nào đó Mục tiêu chính của việc thiết kế văn bản
là tính dễ đọc, màu sắc và hoa văn nên được sử dụng để củng cốthông điệp nhưng không lấn át nó Màu sắc được sử dụng tốt nhất là
để tách và phân loại các mục, chẳng hạn như hiển thị sự khác biệtgiữa tiêu đề và văn bản thông thường hoặc để làm nổi bật thông tinquan trọng Vì thế, nên sử dụng các màu có độ tương phản cao (ví dụ:đen và trắng) Nói chung, văn bản màu đen trên nền trắng là dễ đọcnhất, với màu xanh lam trên màu đỏ là ít dễ đọc nhất Màu sắc đượchiển thị ảnh hưởng đến cảm xúc, với màu đỏ kích động cảm xúcmãnh liệt (ví dụ: tức giận) và màu xanh lam kích động giảm cảm xúc(ví dụ: buồn ngủ)
4 Kinh nghiệm người dùng:
Về cơ bản có thể chia thành 2 cấp: những người có kinh nghiệm và những
người không có kinh nghiệm
Trang 11- Người dùng mới làm quen thường quan tâm nhất đến tính dễ học.
Người dùng thành thạo thường quan tâm nhất đến tính dễ sử dụng.Thường thì hai điều này bổ sung và dẫn đến các quyết định thiết kế
tương tự nhau, nhưng đôi khi có sự đánh đổi Ví dụ, người mới sử dụng thường thích các menu hiển thị tất cả các chức năng hệ thống có sẵn, bởi vì chúng giúp việc học trở nên dễ dàng hơn Mặt khác, các chuyên gia đôi khi thích ít menu hơn được tổ chức xung quanh các chức năng được sử dụng phổ biến nhất.
- Các hệ thống được nhiều người sử dụng hàng ngày có nhiều khả năng
có phần lớn người dùng là chuyên gia (ví dụ: hệ thống nhập đơn hàng) Mặc dù các giao diện đã cố gắng cân bằng giữa tính dễ sử
dụng và dễ học, các loại hệ thống này nên nhấn mạnh hơn vào tính dễ
sử dụng hơn là dễ học
- Trong nhiều hệ thống khác (ví dụ: hệ thống hỗ trợ quyết định), hầu
hết mọi người sẽ dùng không thường xuyên trong suốt thời gian hoạtđộng của hệ thống Trong trường hợp này, có thể nhấn mạnh nhiềuhơn vào tính dễ học hơn là dễ sử dụng
- Dễ sử dụng và dễ học thường đi đôi với nhau — nhưng đôi khi
không Nghiên cứu cho thấy rằng người dùng chuyên nghiệp vàngười mới sử dụng có các yêu cầu và mẫu hành vi khác nhau trong
một số trường hợp Ví dụ: người mới sử dụng hầu như không bao giờ nhìn vào khu vực dưới cùng của màn hình hiển thị thông tin trạng thái, trong khi các chuyên gia tham khảo thanh trạng thái khi họ cần thông tin Hầu hết các hệ thống phải được thiết kế để hỗ
trợ người dùng thường xuyên, ngoại trừ các hệ thống được thiết kế đểkhông thường xuyên sử dụng hoặc khi có nhiều người dùng mới hoặcngười dùng không thường xuyên được mong đợi (ví dụ: Web)
- Việc cân đối truy cập nhanh vào các chức năng và hướng dẫn nổi bật
được sử dụng phổ biến thông qua các chức năng kém nổi bật hơn làmột thách thức đối với người thiết kế giao diện, và việc cân đối nàythường đòi hỏi các giải pháp tài tình.Ví dụ, Microsoft Office giải
quyết vấn đề này thông qua việc sử dụng các chức năng “hiển thị cho tôi”, trình bày các menu và nút cho các chức năng cụ thể Các tính năng này vẫn ở trong nền cho đến khi chúng được người dùng mới làm quen (hoặc thậm chí người dùng có kinh nghiệm) cần khi
họ sử dụng một phần không quen thuộc của hệ thống.
5 Tính nhất quán:
Trang 12a Tổng quát:
- Tính nhất quán trong thiết kế có lẽ là yếu tố quan trọng nhất trong
việc làm cho một hệ thống dễ sử dụng vì nó cho phép người dùng dựđoán điều gì sẽ xảy ra Khi các giao diện nhất quán, người dùng cóthể tương tác với một phần của hệ thống và sau đó biết cách tương tácvới phần còn lại, tất nhiên, từ các phần tử duy nhất đến các phần đó
- Tính nhất quán thường đề cập đến giao diện trong một hệ thống máy
tính, để tất cả các phần của cùng một hệ thống hoạt động theo cùngmột cách Tốt nhất là, hệ thống cũng phải nhất quán với các hệ thốngmáy tính khác trong tổ chức và với phần mềm thương mại được sử
dụng (ví dụ: Windows) Ví dụ, nhiều người dùng đã quen thuộc với
Web, do đó việc sử dụng các giao diện giống như Web có thể làmgiảm lượng học tập mà người dùng yêu cầu Nhiều công cụ phát triểnphần mềm hỗ trợ các giao diện hệ thống nhất quán bằng cách cung
cấp các đối tượng giao diện tiêu chuẩn (ví dụ: hộp danh sách, menu kéo xuống và nút radio).
b Tính nhất quán xảy ra ở nhiều mức độ khác nhau
- Tính nhất quán trong các điều khiển điều hướng truyền đạt cách thực
hiện các hành động trong hệ thống Ví dụ, việc sử dụng cùng một biểu tượng hoặc lệnh để thay đổi một mục sẽ thông báo rõ ràng cách thực hiện các thay đổi trong toàn hệ thống
- Tính nhất quán trong thuật ngữ cũng rất quan trọng Điều này đề cập
đến việc sử dụng các từ giống nhau cho các yếu tố trên biểu mẫu vàbáo cáo
- Sự nhất quán trong thiết kế báo cáo và biểu mẫu là rất quan trọng.
Khi báo cáo và biểu mẫu rất giống nhau ngoại trừ những thay đổi rấtnhỏ trong tiêu đề, người dùng đôi khi sử dụng nhầm biểu mẫu hoặcnhập dữ liệu không chính xác hoặc hiểu sai thông tin của nó Ý nghĩacủa thiết kế là làm cho các báo cáo và biểu mẫu giống nhau nhưngcung cấp cho chúng một số yếu tố đặc biệt (ví dụ: màu sắc, kíchthước của tiêu đề) cho phép người dùng phát hiện ngay sự khác biệt
6 Giảm thiểu nỗ lực của người dùng:
Điều này có nghĩa là sử dụng số lần nhấp chuột hoặc tổ hợp phím ít nhất có thể để
di chuyển từ phần này sang phần khác của hệ thống Hầu hết các nhà thiết kế giao diện tuân theo quy tắc ba lần nhấp chuột: người dùng có thể đi từ trình đơn bắt đầu hoặc chính của hệ thống đến thông tin hoặc hành động họ muốn trong không quá
ba lần nhấp chuột hoặc ba lần nhấn phím
Trang 13III Quy trình thiết kế giao diện người dùng:
Thiết kế giao diện người dùng là một quá trình gồm năm bước lặp đi lặp lại — các nhà phân tích thường di chuyển qua lại giữa các bước, thay vì tiến hành
tuần tự từ bước 1 đến bước 5 (xem Hình 11-5).
- Đầu tiên, các nhà phân tích kiểm tra các trường hợp sử dụng (xem Chương 5) và sơ đồ trình tự (xem Chương 7) được phát triển trong
phân tích và phỏng vấn người dùng để phát triển các kịch bản sử dụng mô tả các mẫu hành động thường được sử dụng mà người dùng
sẽ thực hiện để giao diện cho phép người dùng nhanh chóng thực hiệntrơn tru các kịch bản này
- Thứ hai, các nhà phân tích phát triển sơ đồ cửa sổ điều hướng
(Window Navigation Diagram - WND) xác định cấu trúc cơ bản của giao diện Các sơ đồ này hiển thị tất cả các giao diện (ví dụ: màn hình, biểu mẫu và báo cáo) trong hệ thống và cách chúng được kết nối
- Thứ ba, các nhà phân tích thiết kế các tiêu chuẩn giao diện, là các yếu
tố thiết kế cơ bản dựa trên các giao diện trong hệ thống
- Thứ tư, các nhà phân tích tạo ra một nguyên mẫu thiết kế giao diện
cho từng giao diện riêng lẻ trong hệ thống, chẳng hạn như điều khiển điều hướng (bao gồm việc chuyển đổi các trường hợp sử dụng thiết yếu thành các trường hợp sử dụng thực tế), màn hình đầu vào, màn
Trang 14hình đầu ra, biểu mẫu (bao gồm cả biểu mẫu giấy in sẵn ), và các báo cáo
- Cuối cùng, các giao diện riêng lẻ phải được đánh giá để xác định xem
chúng có đạt yêu cầu hay không và chúng có thể được cải thiện như thế nào
- Đánh giá giao diện hầu như luôn luôn xác định cải tiến, vì vậy quá
trình thiết kế giao diện được lặp lại theo chu kỳ cho đến khi không có cải tiến mới nào được xác định Trong thực tế, hầu hết các nhà phân tích tương tác chặt chẽ với người dùng trong quá trình thiết kế giao diện để người dùng có nhiều cơ hội nhìn thấy giao diện khi nó phát triển, thay vì chờ đợi một đánh giá giao diện tổng thể ở cuối quá trìnhthiết kế giao diện Sẽ tốt hơn cho tất cả những người có liên quan (cả nhà phân tích và người dùng) nếu các thay đổi được xác định sớm
hơn là muộn hơn Ví dụ: nếu cấu trúc giao diện hoặc các tiêu chuẩn cần cải tiến, tốt hơn hết là xác định các thay đổi trước khi hầu hết các màn hình sử dụng tiêu chuẩn đã được thiết kế.
1 Phát triển kịch bản sử dụng:
a Khái niệm: Một kịch bản sử dụng là một bản phác thảo các bước mà người
dùng thực hiện để hoàn thành một phần công việc của họ
Ví dụ, Hình 8-1 cho thấy sơ đồ ca sử dụng cho Hệ thống Cuộc hẹn Hình này cho thấy trường hợp sử dụng Tạo bệnh nhân mới khác với trường hợp sử dụng Thu xếp Thanh toán Chúng tôi lập mô hình riêng hai trường hợp sử dụng này vì chúng đại diện cho các quy trình riêng biệt được bao gồm trong trường hợp sử dụng Đặt hẹn.
Trang 15b Tác dụng:
- Biểu đồ use case được thiết kế để mô hình hóa tất cả cách sử dụng có
thể có của hệ thống — chức năng hoàn chỉnh của nó hoặc tất cả các đường dẫn có thể có thông qua use case ở mức độ trừu tượng khá cao
Ví dụ:
- Trong một tình huống sử dụng, bệnh nhân sẽ yêu cầu lễ tân về một cuộc hẹn với nha sĩ Nhân viên lễ tân sẽ tra cứu bệnh nhân và kiểm tra xem bệnh nhân có bất kỳ hóa đơn nào cần thanh toán hay không Sau đó, nhân viên lễ tân sẽ hỏi bệnh nhân xem liệu họ có muốn thiết lập một cuộc hẹn mới, hủy bỏ cuộc hẹn hiện tại hay thay đổi cuộc hẹn hiện có Nếu bệnh nhân muốn tạo một cuộc hẹn mới, nhân viên lễ tân hỏi bệnh nhân về một số thời gian hẹn được
đề xuất, nhân viên lễ tân phù hợp với thời gian có thể có Nhân viên lễ tân cuối cùng tạo một cuộc hẹn mới (xem Hình 7-1 và 7-5).
Trang 16- Trong một tình huống sử dụng khác, bệnh nhân chỉ muốn hủy cuộc hẹn Trong trường hợp này, lễ tân sẽ tra cứu bệnh nhân và kiểm tra xem bệnh nhân có bất kỳ hóa đơn nào cần thanh toán hay không Sau đó nhân viên lễ tân hỏi bệnh nhân về thời gian của cuộc hẹn Cuối cùng, lễ tân xóa lịch hẹn.
Trang 17- Các tình huống sử dụng được trình bày dưới dạng mô tả tường thuật
đơn giản gắn với các trường hợp sử dụng thiết yếu được phát triển
trong quá trình phân tích (xem Chương 5) Hình 11-6 cho thấy hai
kịch bản sử dụng vừa được mô tả Mục đích là ghi lại hai hoặc ba tìnhhuống sử dụng phổ biến nhất để giao diện có thể được thiết kế để cho phép thực hiện các mục đích sử dụng phổ biến nhất một cách đơn giản và dễ dàng
(Các số trong ngoặc đơn đề cập đến các sự kiện cụ thể trong trường hợp sử dụng thiết yếu)
2 Thiết kế cấu trúc giao diện
a Tổng quát: Cấu trúc giao diện xác định các thành phần cơ bản của giao diện
và cách chúng hoạt động cùng nhau để cung cấp các chức năng cho người dùng
b WND là gì?
Trang 18- WND được sử dụng để hiển thị tất cả các màn hình, biểu mẫu và báo
cáo được hệ thống sử dụng có liên quan với nhau và cách người dùng
di chuyển từ trang này sang trang khác Hầu hết các hệ thống đều có một số WND, một cho mỗi phần chính của hệ thống
- WND rất giống với một máy trạng thái hành vi (xem Chương 7), cả
hai đều thay đổi trạng thái mô hình Máy trạng thái hành vi thường
mô hình hóa các thay đổi trạng thái của một đối tượng, trong đó WND mô hình hóa các thay đổi trạng thái của giao diện người dùng Trong WND, mỗi trạng thái trong đó giao diện người dùng có thể được biểu diễn dưới dạng một hộp Hơn nữa, một hộp thường tương ứng với một thành phần giao diện người dùng, chẳng hạn như cửa sổ, biểu mẫu, nút hoặc báo cáo
Ví dụ, trong Hình 11-7, có năm trạng thái riêng biệt: Menu Khách hàng, Tìm Biểu mẫu Khách hàng, Thêm Biểu mẫu Khách hàng, Danh sách Khách hàng
và Báo cáo Thông tin Khách hàng.
*WND thực sự là một sự thích ứng của máy trạng thái hành vi và sơ đồ đối tượng [xem Meilir Page-Jones, Các nguyên tắc cơ bản về thiết kế hướng đối tượng trong UML]
Ví dụ trong Hình 11-7:
- Quá trình chuyển đổi từ trạng thái Menu Máy khách sang trạng thái Tìm Biểu mẫu Máy khách không yêu cầu trả lại Các mũi tên
Trang 19được gắn nhãn với hành động khiến giao diện người dùng chuyển
từ trạng thái này sang trạng thái khác.
- Để chuyển từ trạng thái Menu Máy khách sang trạng thái Tìm Biểu mẫu Máy khách, người dùng phải nhấp vào Nút Tìm Máy khách trên Menu Máy khách.
- Mục cuối cùng được mô tả trong WND là khuôn mẫu Một khuôn
mẫu được lập mô hình như một mục văn bản nằm trong dấu ngoặc nhọn (<< >>) hoặc dấu ngoặc nhọn (<< >>) Khuôn mẫu đại diện cho
loại thành phần giao diện người dùng của một hộp trên sơ đồ Ví dụ, Menu Khách hàng là một cửa sổ, trong khi Tìm Biểu mẫu Khách hàng là một biểu mẫu.
c Cấu trúc cơ bản của giao diện tuân theo cấu trúc cơ bản của chính quy trình
nghiệp vụ, như được định nghĩa trong các trường hợp sử dụng và mô hình hành vi Người phân tích bắt đầu với các trường hợp sử dụng thiết yếu và phát triển luồng điều khiển cơ bản của hệ thống khi nó chuyển từ đối tượng này sang đối tượng khác Tiếp theo, nhà phân tích xem xét các tình huống sửdụng để xem WND hỗ trợ chúng tốt như thế nào Thông thường, các kịch bản sử dụng xác định các đường dẫn qua WND phức tạp hơn Sau đó, nhà phân tích làm lại WND để đơn giản hóa khả năng hỗ trợ các tình huống sử dụng của giao diện, đôi khi bằng cách thực hiện các thay đổi lớn đối với cấu trúc menu, đôi khi bằng cách thêm các phím tắt
3 Thiết kế tiêu chuẩn giao diện
Tiêu chuẩn giao diện là các yếu tố thiết kế cơ bản phổ biến trên các màn hình, biểu mẫu và báo cáo riêng lẻ trong hệ thống
a Ẩn dụ về giao diện:
- Trước hết, các nhà phân tích phải phát triển (các) ẩn dụ giao diện cơ
bản xác định cách giao diện sẽ hoạt động Phép ẩn dụ giao diện là mộtkhái niệm từ thế giới thực được sử dụng làm mô hình cho hệ thống máy tính Phép ẩn dụ giúp người dùng hiểu hệ thống và cho phép người dùng dự đoán những tính năng mà giao diện có thể cung cấp, ngay cả khi không thực sự sử dụng hệ thống
- Trong một số trường hợp, phép ẩn dụ hiển nhiên đến mức không cần
suy nghĩ Ví dụ: hầu hết các cửa hàng trực tuyến sử dụng phép ẩn
dụ giỏ hàng để lưu trữ tạm thời các mặt hàng mà khách hàng đang cân nhắc mua Trong những trường hợp khác, rất khó xác định một
phép ẩn dụ Nói chung, tốt hơn là không nên tạo một phép ẩn dụ thực
sự không phù hợp với một hệ thống, bởi vì một phép ẩn dụ không phù
Trang 20hợp sẽ gây nhầm lẫn cho người dùng bằng cách đưa ra các giả định không chính xác.
a Đối tượng giao diện
- Mẫu chỉ định tên mà giao diện sẽ sử dụng cho các đối tượng giao diện
chính, các khối xây dựng cơ bản của hệ thống, chẳng hạn như các lớp
- Trong nhiều trường hợp, tên đối tượng rất đơn giản, chẳng hạn như
gọi giỏ hàng là “giỏ hàng” Trong những trường hợp khác, nó không đơn giản như vậy Trong trường hợp người dùng biết loại mặt hàng mình muốn mua, người dùng có thể giới hạn tìm kiếm bằng cách chỉ định các loại mặt hàng tìm kiếm cụ thể hơn, chẳng hạn như sách, CD,DVD Rõ ràng, tên đối tượng phải dễ hiểu và giúp thúc đẩy phép ẩn
dụ giao diện
- Nói chung, trong trường hợp có bất đồng giữa người dùng và nhà
phân tích về tên, cho dù là đối tượng hay hành động, người dùng sẽ thắng Bởi vì một cái tên dễ hiểu hơn luôn đánh bại một cái tên chính xác hơn hoặc chính xác hơn
b Hành động trên giao diện
Mẫu cũng chỉ định kiểu ngôn ngữ điều hướng và lệnh (ví dụ: menu) và ngữ pháp (ví dụ: thứ tự hành động đối tượng; xem phần thiết kế điều hướng ở phần sau của chương này) Nó đặt tên cho các hành động giao diện được sử dụng phổ biến nhất trong thiết kế điều hướng (ví dụ: mua sovới mua hoặc sửa đổi so với thay đổi)
c Biểu tượng giao diện
- Các đối tượng giao diện và các hành động cũng như trạng thái của
chúng (ví dụ: đã xóa hoặc bị vẽ quá mức) có thể được biểu thị bằng
các biểu tượng giao diện Biểu tượng là những hình ảnh sẽ xuất hiện trên các nút lệnh cũng như trong các báo cáo và biểu mẫu để làm nổi bật thông tin quan trọng
- Thiết kế biểu tượng là rất khó khăn vì nó có nghĩa là phát triển một
hình ảnh đơn giản với kích thước nhỏ nhưng phải truyền tải một ý nghĩa thường phức tạp Cách tiếp cận đơn giản nhất và tốt nhất là chỉ
cần sử dụng các biểu tượng do người khác phát triển (ví dụ: một trang trống để chỉ định tạo một tệp mới, một đĩa đệm để biểu thị lưu)
d Lệnh là những hành động đặc biệt khó biểu diễn bằng các biểu tượng
Nhiều biểu tượng đã trở nên nổi tiếng từ việc sử dụng rộng rãi Tuy nhiên, việc sử dụng các biểu tượng đôi khi có thể gây ra nhiều nhầm lẫn
Trang 21[Ví dụ, bạn có biết rằng hình ảnh cây chổi quét nhà (cọ vẽ?) Trong Microsoft Word có nghĩa là người vẽ định dạng?]
e Mẫu giao diện
Mẫu giao diện xác định diện mạo chung của tất cả các màn hình trong hệ
thống thông tin và các biểu mẫu và báo cáo trên giấy được sử dụng Ví
dụ, thiết kế mẫu chỉ định bố cục cơ bản của màn hình [ví dụ: nơi (các) khu vực điều hướng, khu vực trạng thái và (các) khu vực biểu mẫu / báo cáo sẽ được đặt] và (các) bảng màu sẽ được đã áp dụng Nó xác định
xem các cửa sổ sẽ thay thế nhau trên màn hình hay sẽ xếp chồng lên nhau Mẫu xác định vị trí và thứ tự chuẩn cho các hành động giao diện phổ biến (ví dụ: Chế độ xem chỉnh sửa tệp thay vì Chỉnh sửa chế độ xem tệp) Tóm lại, mẫu này tập hợp các yếu tố thiết kế giao diện chính khác:
ẩn dụ, đối tượng, hành động và biểu tượng
4 Tạo mẫu thiết kế giao diện:
Nguyên mẫu thiết kế giao diện là một mô phỏng hoặc một mô phỏng của màn hình máy tính, biểu mẫu hoặc báo cáo Một mẫu thử nghiệm được chuẩn bị cho mỗi giao diện trong hệ thống để cho người dùng và người lập trình thấy cách hệ thống sẽ hoạt động Bốn cách tiếp cận phổ biến nhất để tạo mẫu thiết kế giao diện là bảng phân cảnh, sơ đồ bố cục cửa sổ, nguyên mẫu HTML và nguyên mẫu ngôn ngữ
a Bảng phân cảnh
Bảng phân cảnh hiển thị các hình ảnh vẽ tay về các màn hình sẽ trông như thế nào và cách chúng chuyển từ màn hình này sang màn hình khác, giống như cách bảng phân cảnh cho phim hoạt hình cho thấy hành động sẽ chuyển
từ cảnh này sang cảnh tiếp theo (xem Hình 11-8)
Trang 22b Sơ đồ bố cục Windows:
Sơ đồ bố trí windows là một bảng phân cảnh gần giống với giao diện
người dùng thực tế mà người dùng sẽ dần dần nhận được Thông thường,
nó được tạo bằng một công cụ như mẫu giao diện người dùng Windows của Visio Sử dụng loại công cụ này, nhà thiết kế có thể nhanh chóng kéo
và thả các thành phần giao diện để tạo ra thiết kế của giao diện người dùng
Ví dụ, trong Hình 11-9, một sơ đồ tương đương cho cửa sổ Thêm máy khách cho bảng phân cảnh được mô tả Hơn nữa, bằng cách kết hợp sơ đồ bố trí cửa
sổ với sơ đồ điều hướng cửa sổ, nhà thiết kế có thể làm việc hiệu quả với một nhóm người dùng để thiết kế cả giao diện của hệ thống đang phát triển mà không cần phải thực hiện bất cứ điều gì.
Trang 23c Nguyên mẫu HTML( hypertext markup language – ngôn ngữ đánh dấu siêu văn bản) :
- Một trong những loại nguyên mẫu thiết kế giao diện phổ biến nhất
được sử dụng ngày nay là nguyên mẫu HTML Một nguyên mẫu HTML được xây dựng bằng cách sử dụng các trang Web được tạo bằng HTML
- Người thiết kế sử dụng HTML để tạo ra một loạt các trang Web, hiển
thị các phần cơ bản của hệ thống Người dùng có thể tương tác với các trang bằng cách nhấp vào các nút và nhập dữ liệu giả vào các biểumẫu (nhưng vì không có hệ thống đằng sau các trang nên dữ liệu không bao giờ được xử lý) Các trang được liên kết với nhau để khi người dùng nhấp vào các nút, phần được yêu cầu của hệ thống sẽ xuấthiện Các nguyên mẫu HTML vượt trội hơn so với bảng phân cảnh ở chỗ chúng cho phép người dùng tương tác với hệ thống và hiểu rõ hơn về cách điều hướng giữa các màn hình khác nhau
- Tuy nhiên, HTML có những hạn chế — các màn hình hiển thị trong
HTML sẽ không bao giờ xuất hiện chính xác như màn hình thực trong
hệ thống
d Nguyên mẫu ngôn ngữ
- Nguyên mẫu ngôn ngữ là nguyên mẫu thiết kế giao diện được xây
dựng bằng ngôn ngữ hoặc công cụ thực tế sẽ được sử dụng để xây dựng hệ thống
- Các nguyên mẫu ngôn ngữ được thiết kế theo cách giống như nguyên
mẫu HTML (chúng cho phép người dùng di chuyển từ màn hình này sang màn hình khác nhưng không thực hiện quá trình xử lý thực sự)
Ví dụ, trong Visual Basic, có thể tạo và xem các màn hình mà
Trang 24không cần gắn mã chương trình vào màn hình Nguyên mẫu ngôn
ngữ mất nhiều thời gian hơn để phát triển so với bảng phân cảnh hoặcnguyên mẫu HTML nhưng có lợi thế khác biệt của việc hiển thị chínhxác màn hình sẽ trông như thế nào Người dùng không phải đoán về hình dạng hoặc vị trí của các phần tử trên màn hình
e Lựa chọn các kỹ thuật thích hợp
Các dự án thường sử dụng kết hợp các kỹ thuật tạo mẫu thiết kế giao diện khác nhau cho các phần khác nhau của hệ thống Storyboarding lànhanh nhất và ít tốn kém nhất nhưng cung cấp ít chi tiết nhất Sơ đồ bốcục Windows cung cấp nhiều cảm giác hơn mà người dùng sẽ trải nghiệm, trong khi vẫn khá rẻ để phát triển Tạo mẫu HTML hữu ích để kiểm tra thiết kế cơ bản và điều hướng của giao diện người dùng Tạo mẫu ngôn ngữ là cách tiếp cận chậm nhất, tốn kém nhất và chi tiết nhất Do đó, phân cảnh được sử dụng cho các phần của hệ thống, trong
đó giao diện được hiểu rõ và các nguyên mẫu đắt tiền hơn được cho là không cần thiết
5 Đánh giá giao diện
- Mục tiêu của việc đánh giá giao diện là để hiểu cách cải thiện thiết kế
giao diện trước khi hệ thống hoàn chỉnh Hầu hết các nhà thiết kế giaodiện cố ý hoặc vô ý thiết kế một giao diện đáp ứng sở thích cá nhân của họ, có thể phù hợp hoặc có thể không phù hợp sở thích của người dùng Do đó, thông điệp chính là có càng nhiều người đánh giá giao diện càng tốt, và càng nhiều người dùng càng tốt
- Nhiều tổ chức lưu giữ đánh giá giao diện cho bước cuối cùng trong
quá trình phát triển hệ thống trước khi hệ thống được cài đặt Tuy nhiên, lý tưởng nhất là đánh giá giao diện nên được thực hiện trong khi hệ thống đang được thiết kế — trước khi nó được xây dựng — để bất kỳ vấn đề thiết kế chính nào có thể được xác định và sửa chữa trước khi nó được làm thành bản hoàn chỉnh
- Bốn cách tiếp cận phổ biến là tự đánh giá, đánh giá hướng dẫn, đánh
giá tương tác và kiểm tra khả năng sử dụng chính thức
a Đánh giá thực nghiệm
Đánh giá thực nghiệm là kiểm tra giao diện bằng cách so sánh nó với một tập hợp các thực nghiệm hoặc các nguyên tắc để thiết kế giao diện.Nhóm dự án phát triển một danh sách kiểm tra các nguyên tắc thiết kế giao diện — chẳng hạn từ danh sách ở đầu chương này, cũng như danhsách các nguyên tắc trong phần thiết kế điều hướng, đầu vào và đầu ra
Trang 25ở phần sau của chương này Sau đó, ít nhất ba thành viên của nhóm dự
án làm việc riêng lẻ thông qua nguyên mẫu thiết kế giao diện kiểm tra từng giao diện để đảm bảo nó đáp ứng từng nguyên tắc thiết kế trong một danh sách kiểm tra chính thức Sau khi từng người trải qua nguyênmẫu riêng biệt, họ gặp nhau như một nhóm để thảo luận về các đánh giá của họ và xác định các cải tiến cụ thể được yêu cầu
b Đánh giá bộ hướng dẫn chi tiết:
Đánh giá hướng dẫn thiết kế giao diện là một cuộc họp được tiến hành với những người sẽ phải vận hành hệ thống Nhóm dự án trình bày nguyên mẫu cho người dùng và hướng dẫn họ qua các phần khác nhau của giao diện Nhóm dự án hiển thị bảng phân cảnh và sơ đồ bố trí cửa
sổ hoặc thực sự thể hiện nguyên mẫu ngôn ngữ hoặc HTML và giải thích cách giao diện sẽ được sử dụng Người dùng xác định các cải tiếncho mỗi giao diện được trình bày
c Đánh giá tương tác
- Với đánh giá tương tác, bản thân người dùng thực sự làm việc
với HTML hoặc nguyên mẫu ngôn ngữ trong phiên một người với (các) thành viên của nhóm dự án
- Khi người dùng làm việc với nguyên mẫu (thường bằng cách trải qua
các tình huống sử dụng, sử dụng các trường hợp sử dụng thực tế được
mô tả sau trong chương này hoặc chỉ điều hướng theo ý muốn thông qua hệ thống), họ sẽ nói với (các) thành viên nhóm dự án những gì anh ta hoặc cô ấy thích và không thích và những thông tin hoặc chức năng bổ sung nào là cần thiết Khi người dùng tương tác với nguyên mẫu, (các) thành viên trong nhóm ghi lại các trường hợp khi họ
dường như không chắc chắn về những gì phải làm, mắc lỗi hoặc hiểu sai ý nghĩa của một thành phần giao diện Nếu mô hình về sự không chắc chắn, sai lầm hoặc hiểu sai lặp lại ở một số người dùng tham gia đánh giá, thì đó là một dấu hiệu rõ ràng rằng những phần đó của giao diện cần được cải thiện
d Kiểm tra khả năng sử dụng chính thức
- Kiểm tra khả năng sử dụng chính thức thường được thực hiện với các
sản phẩm phần mềm thương mại và các sản phẩm được phát triển bởi các tổ chức lớn được sử dụng rộng rãi Cũng như đánh giá tương tác, kiểm tra khả năng sử dụng được thực hiện trong các phiên một người trong mà người dùng làm việc trực tiếp với phần mềm Tuy nhiên, nó thường được thực hiện trong một phòng thí nghiệm đặc biệt được
Trang 26trang bị máy quay video và phần mềm đặc biệt ghi lại từng thao tác
gõ phím và chuột để chúng có thể được phát lại để hiểu chính xác những gì người dùng đã làm
- Người dùng được giao một nhóm nhiệm vụ cụ thể để hoàn thành
(thường là các tình huống sử dụng) và sau một số hướng dẫn ban đầu,các thành viên của nhóm dự án không được phép tương tác với người dùng để cung cấp hỗ trợ Người dùng phải làm việc với phần mềm màkhông có sự trợ giúp, điều này có thể gây khó khăn cho người dùng nếu họ bị nhầm lẫn với hệ thống Điều quan trọng là người dùng phải hiểu rằng mục tiêu là kiểm tra giao diện chứ không phải khả năng của
họ và nếu họ không thể hoàn thành nhiệm vụ, thì giao diện — không phải người dùng — đã thất bại trong thử nghiệm
- Kiểm tra khả năng sử dụng chính thức là rất tốn kém, vì mỗi phiên một
người dùng có thể mất một đến hai ngày để phân tích do khối lượng chi tiết được thu thập trong nhật ký máy tính và băng video Phiên thường kéo dài từ một đến hai giờ
IV Thiết kế điều hướng:
Thành phần điều hướng của giao diện cho phép người dùng nhập các lệnh để điều hướng qua hệ thống và thực hiện các hành động để nhập và xem xét thông tin trong đó Thành phần điều hướng cũng hiển thị thông báo cho người dùng về
sự thành công hay thất bại của các hành động của họ Mục tiêu của hệ thống định vị là làm cho hệ thống sử dụng đơn giản nhất có thể
1 Nguyên tắc cơ bản
Một trong những điều khó nhất khi sử dụng hệ thống máy tính là học cách thao tác với các điều khiển điều hướng để cho hệ thống làm theo những gì bạn muốn Tất cả các điều khiển phải rõ ràng, dễ hiểu và được đặt ở vị trí trực quan trên màn hình Lý tưởng nhất, các kiểm soát nên dự đoán những gìngười dùng sẽ làm và đơn giản hóa nỗ lực của họ Ví dụ, nhiều chương trình cài đặt được thiết kế để đối với một cài đặt thông thường, người dùng có thể chỉ cần nhấn nút Tiếp theo
a Ngăn ngừa sai lầm
- Nguyên tắc đầu tiên của việc thiết kế điều khiển điều hướng là ngăn
người dùng mắc lỗi Một sai lầm sẽ tốn thời gian và tạo ra sự thất vọng Tệ hơn nữa, một loạt sai lầm có thể khiến người dùng loại bỏ
hệ thống Sai lầm có thể được giảm thiểu bằng cách gắn nhãn các lệnh và hành động một cách thích hợp và bằng cách hạn chế các lựa
Trang 27chọn Quá nhiều lựa chọn có thể gây nhầm lẫn cho người dùng, đặc biệt khi chúng giống nhau và khó mô tả Khi có nhiều lựa chọn tương
tự trên một menu, hãy cân nhắc tạo cấp menu thứ hai hoặc một loạt các tùy chọn cho các lệnh cơ bản
- Không bao giờ hiển thị lệnh không thể sử dụng Ví dụ, nhiều ứng
dụng Windows làm xám các lệnh không thể sử dụng được; chúng được hiển thị trên menu kéo xuống bằng phông chữ rất sáng màu, nhưng chúng không thể được chọn Điều này cho thấy rằng chúng
có sẵn nhưng không thể được sử dụng trong bối cảnh hiện tại
b Sử dụng thứ tự ngữ pháp nhất quán
- Một trong những quyết định cơ bản nhất là trật tự ngữ pháp Hầu hết
các lệnh yêu cầu người dùng chỉ định một đối tượng (ví dụ: tệp, bản ghi, từ) và hành động sẽ được thực hiện trên đối tượng đó (ví dụ: sao chép, xóa) Giao diện có thể yêu cầu người dùng trước tiên chọn đối tượng và sau đó là hành động (một thứ tự hành động đối tượng) hoặc đầu tiên chọn hành động và sau đó là đối tượng (một thứ tự hành động-đối tượng) Hầu hết các ứng dụng Windows sử dụng thứ tự ngữ pháp hành động đối tượng (ví dụ: hãy nghĩ về việc sao chép một khối văn bản trong trình xử lý văn bản của bạn)
- Thứ tự ngữ pháp phải nhất quán trong toàn hệ thống, cả ở cấp phần tử
dữ liệu cũng như ở cấp menu tổng thể
- Khi người dùng sắp thực hiện một chức năng quan trọng khó hoặc
không thể hoàn tác (ví dụ: xóa tệp), điều quan trọng là phải xác nhận hành động với người dùng (và đảm bảo lựa chọn không được thực hiện do nhầm lẫn) Điều này thường được thực hiện bằng cách yêu cầu người dùng trả lời một thông báo xác nhận, trong đó giải thích những gì người dùng đã yêu cầu và yêu cầu người dùng xác nhận rằng hành động này là đúng
2 Các loại điều khiển điều hướng
Có hai thiết bị phần cứng truyền thống có thể được sử dụng để điều khiển giao diệnngười dùng: bàn phím và thiết bị trỏ như chuột, bi lăn hoặc màn hình cảm ứng Có
ba cách tiếp cận phần mềm cơ bản để xác định lệnh người dùng: ngôn ngữ, menu
và thao tác trực tiếp
a Ngôn ngữ
- Với ngôn ngữ lệnh, người dùng nhập các lệnh bằng ngôn ngữ đặc biệt
được phát triển cho hệ thống máy tính (ví dụ: DOS và SQL đều sử dụng ngôn ngữ lệnh) Các ngôn ngữ lệnh đôi khi cung cấp tính linh
Trang 28hoạt cao hơn các cách tiếp cận khác bởi vì người dùng có thể kết hợp các yếu tố ngôn ngữ theo những cách không được các nhà phát triển xác định trước Tuy nhiên, chúng tạo ra gánh nặng lớn hơn cho người dùng vì người dùng phải học cú pháp và gõ lệnh Các hệ thống ngày nay sử dụng ngôn ngữ lệnh một cách tiết kiệm, ngoại trừ những trường hợp có số lượng cực lớn các tổ hợp lệnh khiến việc cố gắng xây dựng tất cả các tổ hợp vào một menu là không thực tế (ví dụ: truyvấn SQL cho cơ sở dữ liệu).
- Giao diện ngôn ngữ tự nhiên được thiết kế để hiểu ngôn ngữ riêng
của người dùng (ví dụ: tiếng Anh, tiếng Pháp, tiếng Tây Ban Nha) Một ví dụ về việc sử dụng ngôn ngữ tự nhiên là Microsoft’s Office Assistant, cho phép người dùng đặt câu hỏi dạng tự do để được trợ giúp
b Menu:
- Loại hệ thống điều hướng phổ biến nhất hiện nay là menu Một menu
hiển thị cho người dùng một danh sách các lựa chọn, mỗi lựa chọn có thể được chọn Menu dễ học hơn ngôn ngữ vì một số lệnh giới hạn cósẵn được trình bày cho người dùng theo cách có tổ chức Nhấp vào một mục bằng thiết bị trỏ hoặc nhấn một phím phù hợp với lựa chọn menu (ví dụ: phím chức năng) tốn rất ít công sức Do đó, menu
thường được ưu tiên hơn cho các ngôn ngữ
- Thiết kế menu cần phải được thực hiện cẩn thận vì menu phụ đằng
sau menu chính bị ẩn với người dùng cho đến khi họ nhấp vào mục menu Tốt hơn là tạo menu rộng và nông (tức là mỗi menu chứa nhiềumục chỉ có một hoặc hai lớp menu) hơn là hẹp và sâu (nghĩa là mỗi menu chỉ chứa một vài mục, nhưng mỗi menu lại dẫn đến ba hoặc nhiều lớp của menu) Một menu rộng và nông cung cấp cho người dùng nhiều thông tin nhất ban đầu để họ có thể thấy nhiều tùy chọn
và chỉ cần một vài cú nhấp chuột hoặc nhấn phím để thực hiện một hành động Menu hẹp và sâu khiến người dùng tìm kiếm các mục ẩn sau các mục menu và yêu cầu nhiều lần nhấp hoặc nhấn phím hơn để thực hiện một hành động
- Bất kỳ một menu nào không nên chứa nhiều hơn tám mục và chỉ cần
hai lần nhấp chuột hoặc nhấn phím từ bất kỳ menu nào để thực hiện một hành động (hoặc ba từ menu chính khởi động hệ thống) Tuy nhiên, các nhà phân tích đôi khi phải phá vỡ hướng dẫn này khi thiết
kế các hệ thống phức tạp Trong trường hợp này, các mục menu
Trang 29thường được nhóm lại với nhau và được phân tách bằng một đường
ngang (xem Hình 11-10) Thường thì các mục menu có các phím
nóng cho phép người dùng có kinh nghiệm nhanh chóng gọi một lệnh
bằng các tổ hợp phím thay cho lựa chọn menu (ví dụ: Ctrl-F trong Word gọi lệnh Tìm hoặc Alt-F mở menu tệp).
- Các menu nên kết hợp với nhau giống như các mục để người dùng có
thể trực quan đoán mỗi menu chứa những gì Hầu hết các nhà thiết kếkhuyên bạn nên nhóm các mục menu theo các đối tượng giao diện (vídụ: khách hàng, đơn đặt hàng, khoảng không quảng cáo) thay vì theo các hành động trên giao diện (ví dụ: mới, cập nhật, định dạng), để tất
cả các hành động liên quan đến một đối tượng đều nằm trong một menu, tất cả các hành động cho một đối tượng khác nằm trong một menu khác, và như vậy Tuy nhiên, điều này phụ thuộc nhiều vào giao
diện cụ thể Như Hình 11-10 cho thấy, Microsoft Word nhóm các
mục menu theo các đối tượng giao diện (ví dụ: Tệp, Bảng, Cửa sổ) vàtheo các hành động trên giao diện (ví dụ: Chỉnh sửa, Chèn, Định dạng) trên cùng một menu Một số loại menu phổ biến hơn bao gồm thanh menu, menu thả xuống, menu bật lên, menu tab, thanh công cụ
và bản đồ hình ảnh (xem Hình 11-11).