Introduction to UsabilityGiới thiệuvềTínhThânThiệnNgườiDùngTrần Tuấn AnhVTC Online go.vn
UseUsableUsability
InconsistencySự thiếu nhất quán
AffordanceAffordance làmộtđặctính (quality) củamộtđốitượng (object) hay mộtmôitrường(env), đặctínhnàychophépngườidùngthựchiệnmộthành động.
Shortcuts
Giao diện quantrọngGiaodiệnảnhhưởnglớnđến nhận thức (perception) về mộtsản phẩmMộtphầnmềmthânthiệnvớingườidùngsẽdễđượcđónnhậnTrang web khódùngsẽbịtẩychaySự cảm nhận nhiềukhihờihợtNgườidùngtựđổlỗichochínhmìnhkhikhôngdùngđượcsảnphẩmNgườidùngđầucuốinhiềukhikhôngphảilàngườiđưaraquyếtđinhmuabán
Mọi thứ đều có cái giá của nóHoặc là thiết kế từ ban đầu, hoặc trả giá sau này
Thiết kế Giao diện là Việc KhóBạn không phải là người dùngĐa số các quy trình sản xuất phần mềm  giải quyết vấn đề giao tiếp giữa các lập trình viênMục đích chính của giao diện là giao tiếp với người dùngNgười dùng luôn đúngNếu một vấn đề xảy ra thường xuyên, thì đó là lỗi của hệ thốngTuy vậy, người dùng không phải lúc nào cũng đúngNgười dùng không có chuyên môn thiết kế
Lập trình Giao diện là Việc KhóLập trình giao diện chiếm tỉ trọng lớn trong phát triển phần mềmGiao diện chiếm ~50%:Thời gian thiết kếThời gian lập trìnhThời gian bảo dưỡngSố lượng code
vì vậy Giao diện là một phần Quan trọng của Phần mềm
Định nghĩa UsabilityUsability: người dùng sử dụng tính năng của hệ thống tốt đến thế nào?Các khía cạnh của UsabilityLearnability : hệ thống có dễ học không?Efficiency (Tính hiệu quả): một khi đã học, dùng hệ thống có hiệu quả không?Memorability: có dễ nhớ những gì bạn đã học không?Errors (Lỗi): hệ thống có ít lỗi không? Các lỗi có thể khắc phục được không?Satisfaction (Thỏa mãn): dùng hệ thống có thấy  thú vị không?
Các khía cạnh có độ quan trọng khác nhauPhụ thuộc vào đối tượng người dùngNgười dùng mới cần hệ thống dễ họcNgười dùng không thường xuyên cần hệ thống dễ nhớChuyên gia cần tính hiệu quảNgười dùng không luôn luôn là mới hoặc chuyên giaKinh nghiệm về chuyên mônKinh nghiệm về ứng dụngKinh nghiệm về tính năng
Usability chỉ là một thuộc tínhMột hệ thống phần mềm cần phải quan tâm đến nhiều vấn đề:Tính năngPerformanceChi phíBảo mậtUsabilityĐộ ổn địnhMột thiết kế cần phải cân đối các thuộc tính này
Usability là một quy trình
Thiết kếTask analysis (phân tích tác vụ)Design guidelines  Tránh những lỗi cơ bảnCó thể không rõ ràng hoặc mâu thuẫn
ImplementPrototypeRẻ dễ thực hiệnLow-fidelity: giấyMedium-fidelity: HTML, Photoshop, etc
Đánh gia (Evaluate)Kiểm nghiệm bản prototype trên thực tếExpert evaluationHeuristics and walkthroughsPredictive evalutionKiểm tra giao diện theo một mô hình Emprical evalutationTheo dõi người dùng sử dụng
Iterative Design
Không bao giờ đúng ngay lần đầu
Mục tiêuPhương pháp phân tích tác vụ người dùngÁp dụng kiến thức về khả năng của con người vào tính thân thiện người dùngGuidelines cho việc thiết kế giao diện Sự quan trọng của iterative designCác phương pháp protyping Đánh giá/kiểm định giao diện
Tài liệu tham khảoGiáo trình MIT 6.831

1. introduction to usability

  • 1.
    Introduction to UsabilityGiớithiệuvềTínhThânThiệnNgườiDùngTrần Tuấn AnhVTC Online go.vn
  • 2.
  • 4.
  • 9.
    AffordanceAffordance làmộtđặctính (quality)củamộtđốitượng (object) hay mộtmôitrường(env), đặctínhnàychophépngườidùngthựchiệnmộthành động.
  • 11.
  • 15.
    Giao diện quantrọngGiaodiệnảnhhưởnglớnđếnnhận thức (perception) về mộtsản phẩmMộtphầnmềmthânthiệnvớingườidùngsẽdễđượcđónnhậnTrang web khódùngsẽbịtẩychaySự cảm nhận nhiềukhihờihợtNgườidùngtựđổlỗichochínhmìnhkhikhôngdùngđượcsảnphẩmNgườidùngđầucuốinhiềukhikhôngphảilàngườiđưaraquyếtđinhmuabán
  • 16.
    Mọi thứ đềucó cái giá của nóHoặc là thiết kế từ ban đầu, hoặc trả giá sau này
  • 17.
    Thiết kế Giaodiện là Việc KhóBạn không phải là người dùngĐa số các quy trình sản xuất phần mềm giải quyết vấn đề giao tiếp giữa các lập trình viênMục đích chính của giao diện là giao tiếp với người dùngNgười dùng luôn đúngNếu một vấn đề xảy ra thường xuyên, thì đó là lỗi của hệ thốngTuy vậy, người dùng không phải lúc nào cũng đúngNgười dùng không có chuyên môn thiết kế
  • 18.
    Lập trình Giaodiện là Việc KhóLập trình giao diện chiếm tỉ trọng lớn trong phát triển phần mềmGiao diện chiếm ~50%:Thời gian thiết kếThời gian lập trìnhThời gian bảo dưỡngSố lượng code
  • 19.
    vì vậy Giaodiện là một phần Quan trọng của Phần mềm
  • 20.
    Định nghĩa UsabilityUsability:người dùng sử dụng tính năng của hệ thống tốt đến thế nào?Các khía cạnh của UsabilityLearnability : hệ thống có dễ học không?Efficiency (Tính hiệu quả): một khi đã học, dùng hệ thống có hiệu quả không?Memorability: có dễ nhớ những gì bạn đã học không?Errors (Lỗi): hệ thống có ít lỗi không? Các lỗi có thể khắc phục được không?Satisfaction (Thỏa mãn): dùng hệ thống có thấy thú vị không?
  • 21.
    Các khía cạnhcó độ quan trọng khác nhauPhụ thuộc vào đối tượng người dùngNgười dùng mới cần hệ thống dễ họcNgười dùng không thường xuyên cần hệ thống dễ nhớChuyên gia cần tính hiệu quảNgười dùng không luôn luôn là mới hoặc chuyên giaKinh nghiệm về chuyên mônKinh nghiệm về ứng dụngKinh nghiệm về tính năng
  • 22.
    Usability chỉ làmột thuộc tínhMột hệ thống phần mềm cần phải quan tâm đến nhiều vấn đề:Tính năngPerformanceChi phíBảo mậtUsabilityĐộ ổn địnhMột thiết kế cần phải cân đối các thuộc tính này
  • 23.
  • 24.
    Thiết kếTask analysis(phân tích tác vụ)Design guidelines Tránh những lỗi cơ bảnCó thể không rõ ràng hoặc mâu thuẫn
  • 25.
    ImplementPrototypeRẻ dễ thựchiệnLow-fidelity: giấyMedium-fidelity: HTML, Photoshop, etc
  • 26.
    Đánh gia (Evaluate)Kiểmnghiệm bản prototype trên thực tếExpert evaluationHeuristics and walkthroughsPredictive evalutionKiểm tra giao diện theo một mô hình Emprical evalutationTheo dõi người dùng sử dụng
  • 27.
  • 28.
    Không bao giờđúng ngay lần đầu
  • 29.
    Mục tiêuPhương phápphân tích tác vụ người dùngÁp dụng kiến thức về khả năng của con người vào tính thân thiện người dùngGuidelines cho việc thiết kế giao diện Sự quan trọng của iterative designCác phương pháp protyping Đánh giá/kiểm định giao diện
  • 30.
    Tài liệu thamkhảoGiáo trình MIT 6.831

Editor's Notes

  • #3 Usabilitylàbộmônnghiêncứuvề sự dễdàng (the ease) khi một ngườidùngmộtcôngcụcụthể (tool) đểđạtmộtmụctiêucụthể (goal). MụctiêucủaUsabilitylàtạoranhữnggiaodiện hiệu quả (effective UI). Một giao diện đẹp không có nghĩa là giao diện đó thân thiện, nói các khác không có nghĩa là giao diện đó có usability tốt. Ví dụ sau đây thể hiện rõ điều này.
  • #4 Đây là một hộp hộithoại nằm trongmộtchươngtrình in bằng khen. Ngườidùngsửdụnghộphộithoạinàyđểchọnmẫu bằng khen có sẵn.Mộtsốđặcđiểmvềgiaodiệnnày: giaodiện graphics, ngườidùngtácnghiệpbằngchuột, khônghềphảigõhoặcnhớmộtcâulệnhnào. Giaodiệnnàycònchophépngườidùngxem preview trước mẫuđượcchọn (preview), mộtthuậtngữ hay đượcdùngchokiểugiaodiệnnàylà what-you-see-is-what-you-get (WYSIWYG). Câuhỏi ở đâylàtạisaogiaodiệnnàyvẫnkhôngdễ sử dụng?Mộtmanhmốilàđoạn text giảithích ở phíabêntrái. Tạisaophảicầngiảithíchquádàichomộtcôngviệcđơngian ở đâylàlựachọnmẫu?Giaodiệnnàytươngđốikỳlạ. Thanh trượt (Scrollbar) đượcsửdụngđểchọnmẫu. Mỗivịtrítrên thanh trượtlàmộtmẫutronghệthông. Di chuyển thanh trượt sang tráivàphảithayđổimẫuđượcchọn.Sửdụng thanh trượttrongtìnhhuốngnàylàsaimụcđích. Thanh trượtkhôngcódấuthông tin (mark) nênngườidùngkhôngbiếtđượccóbaonhiêumẫuđểchọn? Cácmẫuđượcsắpxếpnhưthếnào? Cầnphảikéo thanh trượtbaoxađẻchọnmẫutiếptheo? Thập chí người dùng khó có thể đoán được câu trả lời cho các vấn đề trên thông quan giao diện.
  • #6 Thôngthường, khimột thanh trượtngangđặtdướimộtbứcanh hay tàiliệuđượcdùngđểtrượtnội dung theochiềungang. Khimộtngườidùngmớilàmquenvớimôtchươngtrìnhhoặcítsửdụngchươngtrìnhđó, khinhìnthấy thanh trượtngangchorằng thanh trượtsẽ hoạt động giống như trong các chương trình khác. Thiếu nhất quán vớicácthói quen/trải nghiệm trước đây củangườidùngvàcácchươngtrìnhkhácsẽgâybấttiệnchongườidùng.
  • #11 Nói một cách khác, affordance của thanh trượt ngang là cho việc trượt liên tục (continuous scrolling) chứ không để lựa chọn rời rạc (discrete selection).
  • #12 Chúngtavừanóiđếntínhthốngnhấtvà affordance, các thuộctínhgiúpchongườidùngmớivàngườidùngkhôngthườngxuyên. Tuyvậygiaodiệnnàycũng không thân thiện với dùngthườngxuyên (frequent users). Nếumộtngườidùngthườngxuyênmuốndùnglạimộtmẫuđãdùngtrướcđây, làmsaongườidùngđósẽtìmlạiđượcmẫuđó? Mộtngườidùngthườngxuyêncóthểnhớđượclàđạiloạimẫungườiđómuốntìmnằm ở khoảnggiànửacủatranhtrượt!! Giaodiệnnàykhôngcungcấp short-cut chongườidùngthườngxuyên. Giaodiệnnàymangmộtquátrìnhtruyxuấtngẫunhiên (random access process| array) vàépnóvàomộtquátrìnhtruyxuấttuầntự (linear process|linked list). Tấtcảngườidùngbịépphảiduyệt qua tấtcảmẫungaycảkhihọbiếtmẫunàohọmuốndùng).Chú ý ngaycảđoạn text giảithíchcũngcóvấnđềvề usability.Mộtđiểmtíchcực ở đâylàngườithiếtkếrahộphộithoạinàynhậnthứcđượclàhộphộithoạikhôngdễdùngnênđãchođoạn text giảithíchvào. Nhưngvớimộtthaotácđơngiảnnhưthếnày, việccầnphảicóđoạn text giảithíchchothấyrằngthiếtkếtươngtáccủahộphọithoạicóvấnđềvề usability. Cácvấnđề usability phảimộtphầntrongquátrìnhpháttriểnsảnphẩmchứkhôngthểđểđếncuốiquátrìnhvàchỉđượcđốiphó. Lỗivề usability phảiđượcsửavớitầmquantrọngnhưmộtlỗilậptrình.
  • #13 Thiếtkếtrênlàmộtphươngángiảiquyếtcácvấnđềgặpphảicủathiếtkếtrươc. Cácmẫuđượcliệtkếtheodanhsách ở cộtbêntrái. Khimộtmẫuđượcchọnthìmẫuđóđược preview ở ô bênphải. Thiếtkếnàyphụcvụtốtchocảngườidùngmớivàngườidùngthườngxuyên. Thiếtkếnàydễhiểuvàkhôngcànphảicó text giảithích.
  • #14 Đây là một ví dụ khác tương đối kỳ quặc. Để điều chỉnh được âm lượng, người dùng phải tập trung tương đối cao, trong khi ở lúc này đáng nhẽ người ta phải được thưởng thức âm nhạc.
  • #16 Tạisaochúngtaphảiquantâmđếntínhthânthiệnngườidùng (usability)? Cónhữnglý do rấtthiếtthựcđểchúngtalưutâmđến usability.Giaodiệnảnhhưởnglớnđến perception củangườidùngvềmộtsảnphẩm, vìgiaodiệnchínhlàphươngtiệnduynhấtđểmộtphầnmềmtươngtácvớingườidùng. Đốivớingườidùnggiaodiệnchínhlàphầnmềmđó (ngườidùngbìnhthườngkhôngquantâmvàcũngkhôngcókhảnăngđểtìmhiểuvềhệthốngphíadưới). Tínhthânthiệndễdùngcủamộtsảnphẩmthườngđượctruyềnmiệngquátraođổicánhân, diễnđàn, báochí, vànóảnhhưởngđếnquyếtđịnhsửdụng/muabáncủangườidùng.Mộtsảnphẩmdễdùngsẽgiúpchoviệctiếpthịvàbánsảnphẩmdễdànghơn. Ngượclạingườidùngsẽxalánhmộtsảnphẩmkhódùng, đặcbiệttrongmôitrường Internet, cácràocảnđểthayđổithóiquansửdụnglàrấtthấp, nếumộttrang web kôphụcvụđượcnhucầucủangườidùngthìhọsẽchuyeenresảngdùngsảnphẩmkhác.Mộtnghịchlýtồntạiđólà perception củangườidùngvềtínhthânthiệncủamộtphầnmềmnhiềukhihờihợt. Mộtgiaodiệnđẹpmắtcóthểtạochongườidùngcảmgiácthânthiệndễdùngngaycảkhinókhôngphảithế. Mộtphầnlý do làngườidùngnhiềukhitựđổlỗichochínhmìnhkhikhôngdùngđượcsảnphẩm. (vídụ). Khácvớinhiềukhíacạnhkháccủamộtsảnphẩmnhưtínhbảomật, tínhổnđịnh. Khiphầnmềmchạychậm, bị hacked, xòe, thìviệcquytráchnhiệmrấtrõràng, cònkhimộtsảnphẩmkhódùngnhưngkhôngđếnmứcngăncảnngườidùngthựchiệncáctácvụ, thìcácvấnđềđấycóthểbịbỏ qua.
  • #17 Một giao diện tồi gây lãng phí thời gian cho người dùng, sẽ gây phí tổn cho thơi gian của bị lãng phí của người dùng đó. Các phí tổn này sẽ tích lũy theo thời gian (một sản phẩm càng được sử dụng nhiều thì phí tổn tích lũy càng nhiều). Đối với những sản phẩm như trung tâm hỗ trợ khách hàng thì tiết kiêm chỉ một vài giây cho 1 thao tác sẽ tiết kiệm cho công ty hàng triệu đô một năm.Thậm chí một số giao diện tồi còn gây đến tổn thất về con người. Ví dụ:
  • #18 Một điều không may là thiết kế giao diện là một công việc khó. Chúng ta không phải là người dùng tiêu biểu. Là người phát triển sản phẩm (thiết kế, lập trình, QA) chúng ta hiểu rõ sản phẩm hơn bất cứ một người dùng nào. Chúng ta có thể tưởng tưởng nhập vai người dùng. Thực tế là rất khó để quên những gì bạn biết. Nếu người dùng thường xuyên mắc phải lỗi hoặc gặp khó khăn ở một giao diện nào đó, thì đấy là dấu hiệu cho biết thiết kế của giao diện đó có vấn đề, chứ không phải là người dùng không hiểu biết. Điều này là một điều tương đối khó để người thiết kế tự đối diện.Ví dụ về điện thoại….
  • #21 Khi nói đến usability, chúng ta hiểu chi tiết và hẹp hơn vấn đề một hệ thống có tốt không. Lấy ví dụ, khi hệ thống không có nhưng tính năng mà người dùng cần thì đó là hệ thống kém cho thiếu chứng năng chứ không phải là kém về mặt usability. Chú ý: chúng ta có thể lượng hóa được các tiêu chuẩn chất lượng của usability. Chúng ta có thể nói Giao diện X dễ học hơn giao diện Y cho một có tác vụ và đối tượng người dùng cụ thể.
  • #23 Usability không tồn tại độc lập, thậm chí nó có thể không phải là thuộc tính quan trọng nhất của hệ thống.
  • #28 Một yếu tố quan trọng để đưa usability vào trong sản phẩm là iterative design. Nghĩa là chúng ta không chỉ đi qua quy trình Thiết kế -> Thực thi -> Đánh gia 1 lần; chúng ta tự thú nhận là thiết kế đầu tiên không bao giờ hoàn chỉnh và chuẩn bị cho điều đó. Sử dụng lại những phản hồi từ khâu đánh giá, chúng ta thiết kế lại, xây dựng prototypes mới, triển khai đánh giá trên prototype mới. Lặp lại quá trình này, quy trình sẽ cho ra giao diện ở mức chấp nhận được.Rất nhiều kỹ thuật chúng ta sẽ thảo luận giúp cho quá trình iteractive design: design guidelines làm giảm số lần lặp, kỹ năng protypes làm giảm chi phí thời gian lặp lại.
  • #29 Điều duy nhất cần nhớ sau buổi nói chuyện này.