Bài giảng Thiết kế và phát triển giao diện - Trịnh Thị Kim Chi

Bài giảng Thiết kế và phát triển giao diện cung cấp cho người học các kiến thức về: Các lỗi thiết kế hệ thống tương tác, tính sử dụng là gì, các thuộc tính của tính sử dụng, mô hình sự chấp nhận của hệ thống, nguyên lý thiết kế hệ thống có tính sử dụng, kỹ nghệ của hệ thống có tính sử dụng. Mời các bạn cùng tham khảo.

Trang 3

Các thí dụ về lỗi thiết kế hệ thống tương tác

• Thí dụ 1: phiếu bầu cử tổng thống Mỹ năm 2000

• Thí dụ 2:Thiết kế cửa ra vào

• Thí dụ 3:Thiết kế hộp thoại in mẫu các chứng chỉ(p 21)

Các lỗi thiết kế hệ thống tương tác

Trang 4

How do you open the toothpaste?

• Design suggestion

• A more obvious design might be to provide the type of sealed cap used on many soft-drink bottles, where unscrewing the cap breaks the seal

• At the very least it would be helpful to include directions on the tube for piercing the seal The directions should be

illustrated graphically so they could be understood by

speakers of any language

Trang 5

Trang 6

• Where do you plug the mouse?

• Where do you plug the keyboard?

• top or bottom connector?

• Do the color coded icons help?

Trang 7

(i) A provides direct adjacent mapping between icon and connector

(ii) B provides color coding to associate the connectors with the labels

Trang 8

Coffee machine

So sánh

Trang 9

Plugging in a USB connector

So sánh

Trang 10

Trang 11

Trang 12

Định nghĩa tính sử dụng (Usability)

 Tính sử dụng được : “Khả năng hệ thống được sử dụng bởi con người một cách dễ dàng và hiệu quả” (Shacked 1991)

 Tính sử dụng được là phạm vi trong đó sản phẩm được

sử dụng bởi nhóm người xác định để đạt được những mục tiêu xác định

Trang 14

Định nghĩa tính sử dụng (Usability)

Tính sử dụng - Usability

Đặc tả các thành phần sử dụng và mối quan hệ giữa chúng

Trang 15

Khung làm việc của tính sử dụng (Usability)

 Hiệu năng (performance): effectiveness + efficiency

 Hiệu năng và sự thỏa mãn của người sử dụng được sử dụng vào việc đo tính sử dụng.

 Độ đo về hiệu năng và sự thỏa mãn của người sử dụng là nền tảng của sự so sánh tính sử dụng của các hệ thống khác nhau.

 Tính sử dụng có thể cải thiện bằng cách tích hợp các đặc trưng thuộc tính đã biệt trong ngữ cảnh sử dụng cụ thể.

Tính sử dụng - Usability

Trang 16

Sáu thuộc tính của tính sử dụng (Usability)

 Hiệu quả (Effectiveness): Tính chính xác và tính đầy đủ mà với nó người sử dụng đạt được mục tiêu xác định trước

 Tính học được (Learnability): Hệ thống có dễ học không?

 Năng suất (Effciency): Một khi đã dễ học, có sử dụng nhanh không?

 Tính dễ nhớ (Memorability): Có dễ nhớ những gì đã học?

 Các lỗi (Errors): Ít lỗi, dễ gỡ lỗi?

 Thỏa mãn mục đích (Subjective Satisfaction): Có thích thú sử dụng hệ thống ?

Các thuộc tính của tính sử dụng

Trang 17

• 1994, Mandel liệt kê 10 vi phạm ảnh hưởng đến tính sử dụng bao gồm:

 Menu và biểu tượng nhập nhằng

 Ngôn ngữ chỉ cho phép đi theo một hướng trong hệ thống

 Hạn chế đầu vào và thao tác trực tiếp

 Hạn chế lựa chọn và điểm nổi bật

 Trình tự các bước không rõ ràng

 Nhiều bước quản lý giao diện hơn thực hiện nhiệm vụ

 Liên kết phức tạp với các ứng dụng khác và giữa các ứng dụng

 Phản hồi và khẳng định không phù hợp

 Hệ thống đề phòng kém và kém thông minh

 Các thông điệp lỗi, trợ giúp, tài liệu không phù hợp

Các thuộc tính của tính sử dụng

Trang 18

Mô hình sự chấp nhận được của hệ thống

System

Acceptability

Social Acceptability

Practical Acceptability

Trang 19

Bảy nguyên tắc thiết kế của Donal (trình bày kỹ phần này)

1 Sử dụng kiến thức trong đầu và trên thế giới

2 Đơn giản cấu trúc nhiệm vụ

3 Làm cho mọi điều dễ nhìn thấy

4 Nhận quyền ánh xạ

5 Khai thác sức mạnh của những khó khăn (tự nhiên

và nhân tạo) –Thách thức thiết kế

6 Thiết kế cho lỗi

7 Tiêu chuẩn thiết kế lấy người dùng làm trung tâm

Trang 20

De sig n

Impl eme nt

Evalu ate

Trang 21

phải thực hiện thao tác nào

• Vd: giao diện MS WORD

Nguyên lý thiết kế hệ thống có tính sử dụng

Trang 22

• Sự phản hồi (Feedback)

– Những gì hệ thống đáp ứng khi người dùng thực hiện hành động.

– Khi những gì thay đổi, thì nó phải được nhìn thấy vd: change the font face (ms word), remove file

(explorer)

– Các loại phản hồi bao gồm : thị giác, âm thanh, xúc giác

Trang 23

• Sự gợi ý (Suggest, Affordance)

– Tập các thao tác hay thủ tục thực hiện trên đối tượng

– “Gợi ý quan sát” là những gì người sử dụng nghĩ rằng nó

có thể được thực hiện trên đối tượng

– Khả năng tưởng tượng liên quan đến khả năng người sử dụng xác định cách sử dụng đối tượng chỉ bằng quan sát

• Các đối tượng vật lý : hình dáng bề ngoài gợi ý cách sử dụng đối tượng đó Vd: cái ghế, phím nhấn, nút trượt, cánh cửa ra vào,…

Trang 24

– Sự gợi ý trong GUI:

• Con chạy gợi ý trỏ, hình dáng con chạy gợi ý một thao tác, …

• Các button gợi ý nhấn để thực hiện nhiệm vụ

• Bàn phím gợi ý nhấn để thao tác

• Làm lõm các phần tử gợi ý disable

• Màn hình trắng và có con chạy nhấp nháy gợi ý người dùng nhập thông tin

• Các phần tử có nền xám gợi ý không thể thao tác được

• Những đường nối gợi ý có thể dịch chuyển được

Trang 25

Trang 26

• Ánh xạ:

– Là quan hệ giữa các điều khiển và ảnh hưởng của

nó trên hệ thống Điều khiển là khái niệm liên

quan đến các đối tượng đồ họa trong giao diện

phần mềm

– Vd: Xoay tay lái của ô tô theo chiều kim đồng hồ

để điều khiển xe rẽ phải, xoay nút sử dụng âm

thanh theo chiều kim đồng hồ sẽ tăng âm lượng

và ngược lại, hoặc chọn số lớn cho âm thanh lớn,

…

Trang 27

• Ánh xạ:

Trang 28

• Tính nhất quán (Constraints)

• Nhất quán trong việc nhìn và cảm giác là yếu tố mấu chốt

trong HCI tốt

Trang 30

• Quy ước: là sự ràng buộc về văn hóa Nó tùy thuộc vào các nền văn hóa khác nhau Vd:

– Công tắc đèn:

• Mỹ : bật xuống là tắt, Anh: bật lên là tắt

– Van nước :

• Mỹ : ngược chiều kim đồng hồ là mở,

• Anh: ngược chiều kim đồng hồ là đóng

Trang 31

• Sự ràng buộc (Constraints)

Trang 33

Kỹ nghệ hệ thống có tính sử dụng

mục tiêu đề ra?

Trang 34

tính sử dụng của hệ thống nên chúng ta phải xây dựng bản mẫu (prototype)

Trang 35

 Giai đoạn đánh giá : thực hiện thử nghiệm

bản mẫu, sử dụng các phương pháp khác

nhau như phương pháp Heuristic, phương

pháp quan sát người dùng thao tác với UI

 Điều quan trọng nhất của kỹ nghệ hệ thống có

tính tiện dụng là thiết kế lặp Nghĩa là chúng ta sẽ thực hiện vài lần để tái thiết kế giao diện, xây

dựng bản mẫu mới và tiếp tục đánh giá, như vậy chúng ta sẽ có giao diện tiện dụng như mong đợi.

Trang 36

Phân tích thiết kế phần mềm Create by: quyetnv87@gmail.com

dddddddddddddddddddddddd

Tiêu đề	Các Lỗi Thiết Kế Hệ Thống Tương Tác
Người hướng dẫn	Trần Thị Kim Chi
Trường học	Unknown
Thể loại	Bài Giảng

Định dạng
Số trang	36
Dung lượng	2,89 MB