ướ

H ng d n, Nguyên t c, và Lý thuy tế

1

Đoc sach

 Ch

̣ ́

ng 02 sach DTUI

ươ

2

́

Gi

i thiêu

ớ

 H ng d n cho ng

̣

i thi

ườ

ế ế

t k có th trong hình ể

ướ th c: ứ  Đ c t

ướ

ặ ả  Quy đ nh các v n đ trong thi

ng d n ẫ ề ấ

và h ị ấ

t k , c nh báo phòng tránh, và

ế ế ả ự ở ữ ự ắ

 Các nguyên t c m c chung

 Giúp đ trong phân tích và so sánh l a ch n thi

cung c p các nh c nh h u ích d a trên s tích lũy khôn ngoan

 Lý thuy t m c cao và mô hình

ự ọ ỡ t k ế ế

ế  C g ng mô t ố ắ ấ ể ố

3

c d dàng. ng và các hành đ ng v i thu t ng đ i t ữ ộ ả ố ượ th ng nh t đ có th trao đ i và h tr đ ể ỗ ợ ượ ớ ễ ổ

H ng d n

ướ

ượ

ướ  Nh ng thành tích th c t

ự ự ế ượ

 H ng d n đ ữ

c nh n t ệ

ệ nh ng kinh nghi m th c ậ ừ ệ

đ hành hay s h c h i theo l ự ọ ố

ữ ự

thu t ng , s hi n di n và trình t  H ng d n c a Apple và Microsoft dành cho các ng d ng máy

c d a trên kinh nghi m ự ữ i kinh nghi m v i các ví d theo sát ớ ỏ i thi  Thúc đ y tính nh t quán gi a nh ng ng ườ ữ ấ hành đ ng ộ ữ ự ệ ứ

ụ t k trong ế ế

 H ng d n cho web và các thi

ụ ẫ ủ

t b di đ ng ế ị ộ ẫ

ướ tính ướ  Đi m phê phán  Quá nhi u đ c t , không hoàn thi n, khó áp d ng, và có l ặ ả ụ ệ i ỗ

 Xây d ng d a trên kinh nghi m đ luôn c i ti n

ộ ự

ề  Đi m ng h ể ủ

4

ả ế ự ệ ể

5

Duy t giao di n

 Ví d giao di n các trang web m ng xã h i nh ư

c mô t

ượ các đ m c ề ụ c ướ

ả ỏ ể

ả ử ử ụ ử ụ

ả ả

facebook, twister …  Đ m b o các liên k t bên trong đ ế ả  S dung duy nh t và mô t ấ  S d ng hình nh thu nh đ xem tr  S d ng hình nh phóng to xem các comment …  …..

H ng d n chi ti

t có t

i www.usability.gov

ướ

ế

6

7

ng d n

Kh năng ti p c n các h ế

ướ

 M t s đi m c a trong tiêp cân: ủ

́ ̣

ộ ố ể  Cung c p văn b n t ấ

 Đ i v i b t kỳ s trình bày đa ph

ng ng v i các thành ph n phi văn b n ả ươ ứ ầ ả ớ

ng ti n theo th i gian đ c ự ươ ệ ờ ượ

 Truy n t

đ ng b v i các l a ch n t ng đ ng ố ớ ấ ộ ớ ồ ọ ươ ự ươ

i thông tin v i màu s c ph i đ c truy n t i mà không có ề ả ả ượ ắ ớ ề ả

 Tiêu đ m i khung t o kh năng nh n d ng khung và chuy n

ề ỗ ể ả ạ ạ ậ

8

h ngướ

T ch c th hi n

ể ệ

 Smith and Mosier (1986) cung c p 5 m c tiêu cao c p

ị ữ ệ ạ

ữ ả

cho hi n th d li u:  Tính nh t qu n c a hi n th d li u ấ ậ ệ ướ

ị ữ ệ ể ủ ả t, đ nh d ng, màu s c … t t  Thu t ng , ch vi ữ ế ắ  Tính hi u qu trong đ ng b hóa thông tin ng ồ ả

 H ng trái/ph i, kho ng cách, nhãn …  T i u hóa s ghi c a ng i s d ng ủ ự ố ư  Không có yêu c u nh t

i dùng ườ ộ

i màn hình

ớ ừ ộ

khác

ử ụ

 S d ng ít hành đ ng cho các công vi c ệ ộ  Nhãn và các ki u ph bi n …

ườ ử ụ m t màn hình hi n th này t

 Kh năng t ả  Tr

ườ

 Tính linh ho t cho ng

ng thích gi a d li u hi n th v i d li u vào ươ

ng input ể

ổ ế ữ ữ ệ ng output có th ch nh s a phu h p v i tr ể ỉ ử ườ ử ụ các c t, s p x p c a các hàng …

 Th t

ế

ứ ự

9

ị ớ ữ ệ ườ ớ i s d ng ki m soát d li u hi n th ữ ệ ể ̀ ợ ể ạ ị

Thu hút s chú ý c a ng

i dùng

ườ

 C ng đ :

ng đ cao đ thu hút s chú ý

ộ ườ

 Đánh d u: ấ

 G ch chân, box, mũi tên, d u, bullet, ng ch ngang, các ký hi u b sung,

ạ ho c Xặ

 C : ỡ

c l n h n đ thu hút h n n a s chú ý

ướ ớ

ơ

ơ

ỡ ớ

ườ  Ch có 2 m c đ , c

 T i đa ch 4 c , v i kích th ự  T i đa ch 3 fonts ả

ố  L a ch fonts: ố  Ngh ch đ o màu ị  Nh p nháy: ấ

 S d ng v i múc đ c n th n cao và trong ph m vi gi

i h n

ộ ẩ

ớ ạ

ử ụ  Màu s c: ắ

 T i đa có 4 màu

ki n kh n c p

 Âm thanh: ề

ề ệ

 S d ng quá các k thu t trên có th d n đ n hi n th l n x n

 Âm m m mài cho ph n h i tích c c, và m nh m trong đi ử ụ

10

ể ẫ ị ộ ế ể ậ ộ ỹ

Kh năng nh p d li u

ữ ệ

 Smith and Mosier (1986) cung c p 5 m c nh m t ph n

ư ộ

ấ ng d n cho nh p d li u:

ứ ữ ệ

ướ

c a nguyên t c h ủ  Tính nh t quán trong truy n d li u

c a các hành đ ng trên m i đi u ki n

ẫ ề ự ủ

t

t t

ng t

ữ ệ

ng i (tăng năng xu t) ậ ườ ấ

ng xuyên di chuy n gi a bàn phím và chu t ộ ữ

ệ ừ ọ

ệ ữ ệ

i dùng ớ ủ ả

ể ị

ki m soát

ự ườ ư ừ  Đ n gi n s ghi nh c a ng ự ủ ươ ạ ư

ự ể

 Kh năng t ả  Tính linh ho t cho ng  Ví d nh trình t  C n th n tr ng: tính linh ho t s phá v tính nh t quán ậ

ạ ẽ

11

ấ  S gi ng nhau v trình t ề ự ố  S t vi t … ự ừ ế ắ ự ươ  Đ n gi n hóa các thao tác nh p li u t ả ơ  Ít clicks, có danh sách các l a ch n  Tránh s th  Tránh d th a trong nh p li u ệ ườ ơ  Đ dài c a danh sách mã, câu l nh ph c t p ứ ạ c nh p v i d li u hi n th ớ ữ ệ ậ ệ ậ ng thích c a d li u đ ượ ủ i dùng ki m soát nh p li u ườ ể

Nguyên t cắ

 C b n h n, áp d ng r ng rãi h n, và lâu

ơ

ộ ng d n

ụ ơ dài h n so v i các h

ượ

i dùng

ơ ả ướ ơ  C n đ c làm rõ thêm ầ  Các nguyên t c c b n ơ ả ủ

ườ

ắ Xác đ nh m c k năng c a ng ị ứ ỹ Xác đ nh các nhi m v ệ ị 5 phong cách t ng tác chính ươ 8 lu t vàng v thi t k giao di n ế ế ề Phòng tránh l iỗ

12

i dùng

Xác đ nh m c k năng ng ứ

ườ

ả ắ ầ

 “Know the user” Hansen (1971)  T t c thi ế ế ớ ấ ả ng ng t ườ ượ  Tu i, gi i, tr ng thái, kh năng nh n th c, giáo d c, ớ ổ

t k ph i b t đ u v i hi u rõ đ i ố i dùng ạ ặ

ứ ự

ậ ộ

 M t s tính ch t khác: vùng (đô th hay nông thôn),

t, và s h p d n s d ng công

ụ văn hóa ho c dân t c, đào t o, đ ng l c, m c tiêu và cá tính. ộ ố ế

ấ , khuy t t ế ậ

ử ụ

ự ấ

ườ

i dùng v i giao di n và v i ớ

kinh t nghệ  Hi u k năng ng ỹ ể ng d ng là r t quan tr ng ấ ụ

13

i dùng

Xác đ nh m c k năng ng ứ

ườ

i dùng vào các nhóm đ đ nh h

ng

ể ị

ướ

ườ t k khác nhau ế ế i m i s d ng ớ ử ụ i dùng th ườ i có t n xu t s d ng cao

ng xuyên ấ ử ụ

Phân tách ng các thi  Ng ườ  Ng ườ  Ng ườ t k nhi u l p (các m c c u trúc) Thi ế ế  Không ch trong ph n m m mà còn trong b n h

ầ ề ớ

ỉ ề ầ ả

ng ng d n ẫ ướ i s dung, màn hình tr giúp, các thông báo l i và h ỗ ợ ườ ử ướ

 Cách ti p c n h a h n nh t nh m thúc đ y kh năng s d ng

ng d nẫ

ử ụ ứ ằ ấ ế ẹ ẩ ả

ng h p khác nhau

th ườ

ậ ng xuyên  Các cách x lý trong các tr ử ườ ử ụ ả

ườ  Ng i s d ng ki m soát m t đ thông tin ph n h i ồ ậ ộ ể  Tính mau ho c th a trong hi n th thông tin ư ể  Ch m và nhanh c a t c t ủ ố ộ ươ

14

ị ng tác t ậ

15

Xác đ nh các bài toán

c xác đ nh tr ợ ậ ướ

ả ượ ng liên quan t ườ c quá trình thi ị i l y yêu c u c a ng ủ ầ ớ ấ t k ế ế i ườ

ứ ộ

16

ng xuyên và hi m T p h p các bài toán ph i đ Phân tích bài toán th dùng Phân c p các m c đ bài toán Liên h t n xu t bài toán: th ườ ấ ấ ệ ầ ế

ọ ng tác

L c ch n phong cách ự t ươ

Thao tác tr c ti p

ế

Ma Sélection

Mes Promos

Titre

L a ch n qua ọ ự menu

X% de réduction

Expiration

 Đi n form ề

Image

Description

 Ngôn ng l nh

ữ ệ

ữ ự

Ajouter à ma sélection

 Ngôn ng t nhiên

Envoyer à un ami

Supprimer cette promo

[Texte Conditions commerciales d’utilisation]

Ma carte

Promos

News

Magasins

Mes K'dos

17

Tám lu t vàng c a thi

t k giao di n

ế ế

ự ố

ử ụ ả

ẽ ặ ụ ụ ấ ế ế ộ

ạ ế

ụ i x y ra trong quá trình s d ng

ỗ ả

1. Ch t ch theo s th ng nh t chung 2. Ph c v kh năng s d ng ph th ng ổ ố ả 3. Cung c p thông tin ph n h i ồ t k h p tho i ti n ti n d ng và d hi u 4. Thi ễ ể ệ 5. Phòng tránh l ử ụ 6. Cho phép d dàng thay đ i các hành đ ng ộ ễ 7. H tr t p trung vào đi u khi n ể 8. Gi m s ghi nh c a ng

i s d ng

ể ườ ử ụ

ỗ ợ ậ ự ả

ớ ủ

18

19

Phòng tránh l

iỗ

 Phòng trách l

i s d ng có l

i,

ế

ườ ử ụ

i ngay đ u tiên. N u ng i ỗ ự

i c th , tích c c và có tính xây d ng ự

ỗ ụ ể i: ỗ

ầ hi n lên m t thông báo l ộ ệ  Thông báo l  K thu t gi m l ả ậ ỹ  Hành đ ng đúng đ n ự

ể ố ớ ộ

ư t h n là typing t

do

ọ ố ơ

 T o s khó khăn ho c không th đ i v i m t hành đ ng sai ộ ạ  Ví d nh màu xám cho các hành đ ng không phù h p  L a ch n t ự ự  T đ ng hoàn thi n ự ộ  Ph i h p x lý l ử ố ợ

ng đ n k t h p thông qua nhi u b

c ướ

ơ

ắ ộ

i ỗ

20

i ỗ  Các l nh tr u t ế ợ ừ ượ ệ  S d ng ph i h p các font ch , màu s c trong phòng tránh l ữ ố ợ ử ụ

Lôi font

21

̃