Usability Meetup Review 09/07/2017
Noted lại buổi Usability Meetup của anh Quang Lê — Founder Eggcellent Design and Product Director at Websosanh.vn. Mình có dùng một số hình ảnh và thông tin trong slide của anh Quang và đã được anh đồng ý.
Usability: hiểu đơn giản là tính khả dụng của sản phẩm (có dễ dùng không, giao diện có thân thiện không,…)
UX Design: gồm hai việc riêng biệt: UX (User Experience) — Trải nghiệm người dùng và Design — Thiết kế trải nghiệm.
UX Design means deliver better user experience to as many user as possible
10 usability rules:
1. Our vision is optimized to see structure
2. We are emotional, not intellectual
3. Hard to recall, easier to recognize
4. We are biased
5. Our memory is imperfect
6. Affordance, we learn from our experience
7. Error prevention and tolerance
8. Human thought cycle: goal, execute and evaluate
9. Poor peripheral vision
10. Most of us are followers
1. Our vision is optimized to see structure
Chúng ta thường có xu hướng nhìn theo cấu trúc, ví dụ:
Thế nên cái gì giống hay có đặc điểm tương tự nhau thì làm giống luôn, còn khác thì làm khác hẳn đi. Ví dụ:
2. We are emotional, not intellectual
Chúng ta là những sinh vật có cảm xúc, không phải lý trí
Ví dụ: mua sách online và mua sách ở store. Tại sao có nhiều người vẫn chọn mua sách tại store hơn mua online? Vì mua online chỉ tác động vào 2 xúc giác: thị giác và thính giác. Còn ra store mua thì có nhiều yếu tố tác động hơn: không gian — cả 1 cái nhà toàn sách, cầm trực tiếp quyển sách trên tay, đọc, ngửi mùi giấy, nhân viên xinh,… Chỉ cần một trong các yếu tố trên tác động mạnh đến cảm xúc thì ta có thể ra quyết định mua nhanh hơn.
3. Hard to recall, easier to recognize
Rất dễ để nhận ra một người quen, nhưng rất khó để nhớ tên họ, vì ta sẽ phải gọi lại các yếu tố về thời gian, địa điểm, hoàn cảnh cụ thể,… mà ta đã từng gặp họ
Ví dụ:
Đây đều là menu của 1 app đặt hambuger. Ở hình bên trái (before), thanh menu được thiết kế ẩn đi ở góc 1h (góc phải phía trên màn hình). Thiết kế này không dễ để nhận ra (recognize), ta sẽ phải lục lại trí nhớ (recall) xem đã từng gặp cái menu nào được thiết kế tương tự thế này chưa.
Ở hình bên phải (after), phần menu đã được thiết kế dưới dạng tab bar ở dưới. Thiết kế này giúp người dùng dễ dàng nhận ra các tab thay vì phải tốn thêm một thao tác tìm và thử như thiết kế before.
4. We are biased
Chúng ta thường có (bị) thành kiến. Ví dụ cứ nhắc đến Apple thì sẽ nghĩ đến thiết kế đẹp, phong cách, công nghệ vượt trội,… Thực tế những suy nghĩ này do chúng ta nghe quá nhiều từ truyền thông (Apple đã thành công trong việc “truyền” các suy nghĩ này đến khi người dùng “thông” thì thôi)
Một ví dụ về việc thiết kế theo trend của Apple:
Bên trái là thiết kế website của Apple năm 2008. Thiết kế này có nhiều thông tin các sản phẩm của Apple ở homepage, mục đích là hướng người dùng tới việc mua online. Thiết kế bên phải thì không còn nhiều thông tin các sản phẩm như cũ nữa mà hướng người dùng có trải nghiệm tốt hơn về thương hiệu (thiết kế đẹp, phong cách,…) và cũng định hướng người dùng mua offline — đến các store của Apple (cũng được thiết kế rất đẹp) để mua sản phầm.
Trải nghiệm của người dùng thay đổi theo thời gian, ta phải thay đổi để thích ứng và bắt kịp thay đổi đó.
5. Our memory is imperfect
Não không được thiết kế cho việc tính toán hay ghi nhớ nhiều thông tin một lúc.
Ví dụ: mua giày ở website Biti’s
Ở đây, Biti’s đang yêu cầu người dùng cung cấp chiều dài bàn chân, đồng nghĩa với việc yêu cầu người dùng phải tìm thêm một cái thước để đo, bút và giấy để ghi lại thông tin => phiền phức.
Giải pháp: cho đổi trả nếu không vừa size sau khi mua
6. Affordance, we learn from our experience
Chúng ta học từ những trải nghiệm trong quá khứ.
Ví dụ: Màu đỏ thường biểu tượng cho điều gì đó nguy hiểm (đèn đỏ thì phải dừng lại, các biển báo nguy hiểm đều màu đỏ,..). Vì thế các icon có màu đỏ trong app thường mang ý nghĩa “nguy hiểm, đóng lại”
=> Match between products and real world
Xác định rõ concept muốn làm dựa trên trải nghiệm của người dùng. Fb, Shopee theo concept chợ, cho phép người mua và người bán mặc cả. Tiki, Lazada theo concept siêu thị, giá cả niêm yết rõ ràng, khỏi mặc cả.
7. Error prevention and tolerance
Hạn chế lỗi mà người dùng có thể mắc phải. Có cảnh báo khi người dùng có dấu hiệu đang “mắc sai lầm”. Ví dụ khi đang viết 1 status trên fb mà muốn chuyển sang một trang khác ngay trong tab đang bật fb thì sẽ có warning xác nhận có muốn rời đi không.
8. Human thought cycle: goal, execute and evaluate
Xác định mục tiêu,thực thi và dự tính thời gian. Ví dụ: mục tiêu là chạy được full marathon. Bắt đầu hành động thực tế: vác giày ra công viên tập chạy hàng ngày. Ước tính thời gian cần tập luyện để đạt mục tiêu là trong 2 tháng.
Nên xác định rõ mục tiêu trước khi execute
9. Poor peripheral vision
Nên thiết kế rõ ràng, tránh nhầm lẫn.
Ở hình bên trái, thiết kế button “Submit” và “Cancel” ở dưới cùng là tốt nhất,vì phân biệt được theo màu sắc, định dạng. Tương tự với thiết kế bên phải. Với mục đích là thiết kế button “Đăng ký” và “Đăng nhập” thì thiết kế ngoài cùng bên phải là tốt nhất vì tránh được lỗi lặp từ (Register và Sign In phân biệt rõ ràng hơn Sign Up và Sign In), style và màu khác nhau,….
10. Most of us are followers
Hầu hết chúng ta là người theo xu hướng, chỉ một số ít có thể tạo ra xu hướng (Sơn Tùng M.TP, Chi Pu,…).Vì thế nên tìm cách định hướng người dùng, đồng thời hạn chế những yếu tố tiêu cực để khuyến khích người dùng ra quyết định một cách có chủ đích.
Ví dụ: TGDD thiết kế giao diện bán điện thoại
Usability là một phần trong UX Design. U.X (User Experience) là quá trình trải nghiệm sản phẩm của người dùng, vì thế mỗi người sẽ có những trải nghiệm riêng, phụ thuộc vào nhiều yếu tố khác nhau (kiến thức về sản phẩm, những trải nghiệm trước đây,…). Khi muốn tìm hiểu về cách mà người dùng trải nghiệm một sản phẩm, ta nên tìm những nhóm người dùng mục tiêu của sản phẩm đó rồi cho họ sử dụng, từ đó sẽ có những phản hồi chính xác hơn để cải thiện usability. Hoặc nếu không/chưa có điều kiện, khả năng làm việc này thì ta có thể đóng vai người dùng để tự trải nghiệm sản phẩm luôn.
Trên đây là nội dung của buổi meetup mà mình nhớ. Phần dưới là phần áp dụng kiến thức để đóng vai một người dùng trải nghiệm (các) sản phẩm khi có nhu cầu của mình. Bạn nào không quan tâm có thể bỏ qua :)
THỰC HÀNH
Ví dụ cụ thể: trải nghiệm của người dùng là một bạn nam 25 tuổi, thu nhập trung bình (10 triệu) có nhu cầu mua Iphone 7 32GB tặng bạn gái. Bạn này không có nhiều hiểu biết về điện thoại, chưa từng mua điện thoại nào có mức giá trên 10 triệu. Kỹ năng tìm kiếm ở mức trung bình.
- Đầu tiên, user sẽ lên google tìm kiếm thông tin về Iphone 7.
2. Theo thói quen, vào trang đầu tiên tìm được, kỳ vọng sẽ mua được Iphone 7 luôn.
3. Sau khi vào và thấy đây là website nước ngoài và không tìm thấy thông tin có thể mua Iphone 7 ở đây, user quay ra tìm lại với từ khóa khác. Lần này user tỉnh hơn, search với từ khóa “mua iphone 7 ở Hà Nội”
Thấy quảng cáo, theo bản năng cảm thấy không tin tưởng => bỏ qua.
4. Tìm các trang không có quảng cáo để xem thông tin.
5. Đây cũng là lúc các yếu tố về thông tin liên quan đến sản phẩm mà user từng được (bị) tiếp xúc trước đây ảnh hưởng. Ví dụ user xem tivi, thấy TGDD quảng cáo nhiều quá nên bị “ám ảnh” bởi brand này. Lúc này, user sẽ mở một tab khác để check thông tin về sản phẩm ở TGDD.
6. Vào website của TGDD, thấy thông tin về Iphone trên banner, click vào với kỳ vọng sẽ tìm thấy thông tin về Iphone 7.
7. Sau khi click vào, kéo chuột xuống một đoạn thấy thông tin cần tìm — Iphone 7 32GB. Thấy giá 18tr (cao hơn mức lương hàng tháng) => có phản ứng negative với thông tin này=> click vào ảnh để xem thêm thông tin
8. Sau khi xem thông tin xong, vẫn thấy giá cao => quay ra xem thông tin của trang khác ở tab đã mở trước đó.
9. Qua bên này thấy giá Iphone 7 32GB chỉ có 11.790.000 và 14.590.000, thấy rẻ hơn bên TGDD nhiều quá => nghi ngờ, question: “tại sao giá bên này lại rẻ hơn nhiều thế, hàng có đảm bảo không?,…” => xem thêm thông tin ở các trang khác (mở các tab khác nhau)
10. Sau khi xem xong một loạt thông tin, thấy nhiều thông tin quá => loạn, không biết xử lý tiếp như thế nào => thôi chạy ra cửa hàng gần nhất, cầm cái Iphone lên, sờ, ngắm, dùng thử,… => thấy thích quá => giá hợp lý => mua luôn :))
Vừa rồi là một quy trình trải nghiệm sản phẩm của một người dùng có nhu cầu mua Iphone 7 do mình tự nhập vai và trải nghiệm luôn. Có thể với người khác thì họ sẽ có những action khác nhau ở những bước khác nhau.
Cảm ơn mọi người đã đọc đến đây. Vì là note cá nhân, nhớ gì viết đấy nên một số chỗ hơi lộn xộn :D
Buổi meetup này được anh Quang tổ chức và chia sẻ miễn phí, từ chi phí văn phòng, nước uống,… đến mọi cái khác. Những người tham gia nếu cảm thấy có ích và muốn đóng góp thì có thể donate cho chương trình mà anh Quang có chia ser: Xây Trường — Dựng Ước Mơ (Dự án xây điểm trường Pú Piến).
Mình chia sẻ thông tin chương trình ở đây, bạn nào muốn donate để ủng hộ những đóng góp cho cộng đồng của anh Quang thì cùng góp sức nha. Cảm ơn mọi người.
