Bài giảng Phương tiện tương tác kỹ thuật số: Bài 6 - Trần Thị Kim Chi

Bài 6

Giảng viên: Trần Thị Kim Chi
1


1

Các lỗi giao diện

2

Các phương pháp đánh giá

3

Đánh giá theo kinh nghiệm(heuristic)

4

Kiểm thử GUI bởi người sử dụng

5

Kiểm thử bằng phương pháp duyệt dịch vụ

6

Tổng kết

2

1

Các lỗi giao diện

 Giao diện Alt –Tab trong Microsoft Window
 Chức năng tương tự có thể được tìm thấy trong
các hệ thống khác như KDE, Gnome và Mac OS
 Khơng có tính gợi ý (affordance)
 Giao diện Alt-Tab được thiết kế như phím tắt
(shortcut)
 Đảm bảo tính đơn giản về đồ họa và thao tác
 Hiệu quả khi chuyển đổi từ cửa sổ này sang cửa sổ
khác trên màn hình
3


1

Các lỗi giao diện

4


1

Các lỗi giao diện

Lỗi thiết kế

5

05/10/21


1

Các lỗi giao diện

6


1

Các lỗi giao diện

7


1

Các lỗi giao diện

Lỗi thiết kế
Sign-In Page:
1. Good
visibility
(centered,
obvious sign in

spot)

8

05/10/21


1

Các lỗi giao diện

Lỗi thiết kế
Opening Page:
·Attention - Info
related to most
common tasks
·Bridged the Gulf of
Execution
·Visibility good- Left
pane never changeseven when message
is open

9

05/10/21


1

Các lỗi giao diện

Lỗi thiết kế

 Menu thích nghi của MS Office

 Khởi đầu menu đơn chỉ có các
items thơng dụng
 Khi click chuột trên mũi tên dưới
menu thì mọi item sẽ hiển thị
 Menu thích nghi chỉ hiển thị các
items hay sử dụng nhất và mới
được sử dụng
 Đáp ứng tính đơn giản và hướng
nhiệm vụ
 Thiếu tính dự báo trước khi
menu thay đổi
10

05/10/21


1

Các lỗi giao diện

11


2

Các phương pháp đánh giá - Evaluation

•

Đánh giá là quá trình sử dụng các phương thức khác
nhau để xác định q trình thiết kế có đảm bảo u cầu
của một hệ thống đã đưa ra không.
Thiết kế và đánh giá là hai quá trình lặp được tiến hành
một cách liên tiếp nhằm giải thích các câu hỏi:

•

–
–
–
–

Why: để kiểm tra các yêu cầu và sở thích của người dùng.
What: kiểm tra các chức năng của hệ thống, của các giao
diện có hoạt động tốt khơng.
Where: q trình này diễn ra ở đâu
When: trong suốt giai đoạn thiết kế; sản phẩm hồn thành
có được đánh giá để đưa ra các thơng tin về sản phẩm mới
không

12


2

Các phương pháp đánh giá

Các phương pháp đánh giá
• Đánh giá giao diện (UI) theo phương pháp Heuristic
–
–

Kiểm tra một cách hệ thống thiết kế giao diện so với tập các
nguyên tắc tính sử dụng được đã nhận biết trước
Đội ngũ đánh giá: Các chuyên gia

• Đánh giá UI bởi người sử dụng (User Testing)
–
–

Người sử dụng thử nghiệm GUI
Cho phép quan sát trực tiếp người sử dụng khi họ đang sử
dụng ứng dụng

• Đáng giá UI theo phương pháp duyệt nhiệm vụ
(Cognitive Walkthrough)
–

Đánh giá theo tập các nhiệm vụ và đánh giá tính dễ hiểu và
tính dễ học của chúng
13


3

Đánh giá theo kinh nghiệm(heuristic)

• Được phát triển bởi Developed Jacob Nielsen vào năm 1990.
• Dựa trên cơ sở giải quyết vấn đề bằng cách đánh giá và tìm
giải pháp qua thử nghiệm từ phân tích kinh nghiệm sử sụng
của 249 vấn đề
• Heuristics thường dùng để đánh giá cho các thiết bị mobile,
wearables, virtual worlds, etc.

14


3

Đánh giá theo kinh nghiệm(heuristic)

Nhắc lại 10 heuristics của Nielsen
• Đáp ứng mong đợi
–
–
–

Phù hợp thế giới thực
Nhất quán và chuẩn
Trợ giúp và tài liệu

–
–
–

Người sử dụng điều khiển các ứng dụng và tự do
Tính trực quan của trạng thái hệ thống
Mềm dẻo và hiệu quả

–
–
–

Tránh lỗi
Nhận dạng, không hồi tưởng
Báo cáo lỗi, phát hiện và khắc phục

–

Thiết kế đẹp và tối thiểu

• Người sử dụng làm chủ

• Lỗi

• Tính đơn giản

15


3

Đánh giá theo kinh nghiệm(heuristic)

Kỹ thuật đánh giá Heuristic

• Các bước đánh giá
–
–

Người đánh giá khám phá UI, đánh giá nó trên cơ sở heuristics
Lập ra danh sách các vấn đề phát hiện liên quan đến tính sử dụng được

• Kỹ thuật
–
–
–
–

Cần phải diễn giải tại sao nó vi phạm heuristics
Liệt kê đầy đủ các vấn đề mà đã tìm thấy trong bảng
Kiểm tra giao diện ít nhất 2 lần
Hiệu chỉnh mọi vấn đề trong GUI nhờ các hướng dẫn thiết kế đã nghiên cứu (không giới hạn bởi 10 heiristics của Nielsen

16


3

Đánh giá theo kinh nghiệm(heuristic)

Đánh giá Heuristic

• Đánh giá heutistic theo phương pháp của Nielssen : (10 đánh
giá)
 Theo các nhà nghiên cứu thì pp của Nielssen là pp ít tốn kém nhất

 Đánh giá heuristic là pp đánh giá mà các chuyên gia đánh giá về tính
sử dụng được – những hiểu biết – đã sử dụng – suy nghĩ nhiều về
thiết kế giao diện
 Các bước cơ bản đánh giá heuristic khá đơn giản

17

05/10/21


3

Đánh giá theo kinh nghiệm(heuristic)

Ví dụ về đánh giá heuristic

Ví dụ
Hãy thử phân tích một số phần tử để tìm ra các vấn đề vi phạm
về tính sử dụng được và chúng cần hiệu chỉnh gì

18

05/10/21


3

Đánh giá theo kinh nghiệm(heuristic)

Ví dụ về đánh giá heuristic

19

05/10/21


3

Đánh giá theo kinh nghiệm(heuristic)

Continue
Shopping

20

05/10/21


3

Đánh giá theo kinh nghiệm(heuristic)

21


3

Đánh giá theo kinh nghiệm(heuristic)

Tiến trình đánh giá Heuristic

• Thơng báo
–
–
–

Tổ chức gặp gỡ giữa đội ngũ thiết kế và những người đánh giá
Giới thiệu ứng dụng
Giải thích về số đơng người sử dụng, nghiệp vụ và các kịch bản

• Đánh giá
–
–
–
–

Người đánh giá làm việc độc lập
Viết báo cáo hay người quan sát ghi âm lại các bình luận của người
đánh giá
Tập trung vào phát hiện vấn đề, không xếp hạng tính nguy hại nó tại
thời điểm này
Mỗi người đánh giá làm việc ít nhất từ 1-2 giờ

22


3

Đánh giá theo kinh nghiệm(heuristic)

Tiến trình đánh giá Heuristic

• Xếp hạng lỗi nghiêm trọng của UI
–
–

Người đánh giá xếp mức ưu tiên cho mọi vấn đề tìm ra (khơng chỉ của riêng mình)
Giải thích ý nghĩa cách xếp hạng người đánh giá

• Bàn bạc
–

Người đánh giá và đội ngũ thiết kế trao đổi các kết quả và phương pháp giải quyết vấn đề

23


3

Đánh giá theo kinh nghiệm(heuristic)

• Đánh giá Heuristics cho websites (Budd, 2007) tập trung vào:
– Tính rõ ràng
– Sự phức tạp
– Ngữ cảnh người dùng
– Độ tin cậy và sự thỏa mãn của người dùng

24


3

Đánh giá theo kinh nghiệm(heuristic)

Kinh nghiệm duyệt Web của người dùng
• Điều hướng dễ dàng.
• Cung cấp kịch bản trợ giúp người dùng.
• Các chức năng phải rõ ràng và cụ thể.
• Dựa vào 3 câu hỏi sau:
–
–
–

Các chức năng có đem đến lới ích cho người dùng khơng?
Có các thông báo hay phản hồi cho người dùng khi duyệt Web khơng?
Người dùng có chọn chức năng đúng với các phản hồi hay yêu cầu của Website không?

25