ướ
ẫ
ắ
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
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
̃