Nghiên Cứu Lý Thuyết Phương Pháp Heuristic Evaluation Và Áp Dụng Vào Cải Thiện Ứng Dụng MY VNPT (Đồ Án Tốt Nghiêp PTIT lĩnh vực UIUX)

HỌC VIỆN CÔNG NGHỆ BƯU CHÍNH VIỄN THÔNG KHOA ĐA PHƯƠNG TIỆN ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC Đề tài: “NGHIÊN CỨU LÝ THUYẾT PHƯƠNG PHÁP HEURISTIC EVALUATION VÀ ÁP DỤNG VÀO CẢI THIỆN ỨNG DỤNG QUẢN LÝ CÁC SẢN PHẨM, DỊCH VỤ MY VNPT.” Giảng viên hướng dẫn: … Sinh viên thực hiện: … Lớp: … Khóa: 2018 - 2023 Hệ: ĐẠI HỌC CHÍNH QUY HÀ NỘI – 2022 LỜI CẢM ƠN Học phần thay thế tốt nghiệp là học phần cuối cùng trong chương trình đào tạo của chuyên ngành Thiết kế Đa phương tiện thuộc khoa Đa phương tiện, Học viện Công nghệ Bưu chính Viễn thông Đây là một học phần thú vị, vô cùng bổ ích và có tính thực tế cao, là cơ hội để mỗi sinh viên theo học tổng hợp các kiến thức đã tích lũy trong suốt quá trình đào tạo tại Học viện và thể hiện nó qua sản phẩm thực tế Trong suốt quá trình nghiên cứu và thực hiện báo cáo này, bên cạnh những nỗ lực của bản thân, em đã nhận được sự hỗ trợ, hướng dẫn nhiệt tình của quý thầy cô trong khoa Em xin gửi lời cảm ơn đến ban lãnh đạo cùng các cán bộ khoa Đa phương tiện, Học viện Công nghệ Bưu chính Viễn thông đã tạo điều kiện tốt nhất trong suốt quá trình em thực hiện đồ án này Đặc biệt, em xin gửi lời cảm ơn sâu sắc đến … đã trực tiếp hướng dẫn, chỉ bảo cho em trong suốt thời gian thực hiện đồ án vừa qua Do điều kiện về thời gian cũng như kinh nghiệm thực tế và vốn kiến thức còn nhiều hạn chế, báo cáo này của em không tránh khỏi những thiếu sót Em rất mong sẽ được các thầy cô góp ý, chỉ bảo để từ đó em hoàn thiện thêm các kỹ năng và kiến thức của mình, phục vụ cho học tập và công việc sau này Em xin chân thành cảm ơn! Hà Nội, ngày 29 tháng 11 năm 2022 Sinh viên thực hiện … … ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC MỤC LỤC DANH MỤC HÌNH VẼ 3 DANH MỤC CÁC BẢNG BIỂU, LƯU ĐỒ 5 DANH MỤC TỪ VIẾT TẮT 6 PHẦN MỞ ĐẦU 7 CHƯƠNG 1: TỔNG QUAN VỀ PHƯƠNG PHÁP HEURISTIC EVALUATION 12 1.1 TỔNG QUAN VỀ THIẾT KẾ UI/UX VÀ TÍNH KHẢ DỤNG CỦA HỆ THỐNG 12 1.1.1 Giao diện người dùng 12 1.1.2 Trải nghiệm người dùng và tính khả dụng 12 1.1.3 Các phương pháp đánh giá tính khả dụng 14 1.2 PHƯƠNG PHÁP HEURISTIC EVALUATION 17 1.2.1 Định nghĩa 17 1.2.2 10 tiêu chuẩn Heuristics đánh giá tính khả dụng 18 1.2.3 Quy trình thực hiện Heuristic Evaluation 26 1.2.4 Ưu điểm và hạn chế của Heuristic Evaluation 30 1.3 MỐI TƯƠNG QUAN GIỮA HEURISTIC EVALUATION VÀ USABILITY TESTING 31 1.4 TIỂU KẾT CHƯƠNG 1 31 CHƯƠNG 2: ĐÁNH GIÁ HEURISTIC EVALUATION ỨNG DỤNG MY VNPT .33 2.1 TỔNG QUAN VỀ VNPT VÀ ỨNG DỤNG MY VNPT 33 2.1.1 Giới thiệu chung về VNPT 33 2.1.2 Giới thiệu về ứng dụng My VNPT 33 2.2 ĐÁNH GIÁ TÍNH KHẢ DỤNG CỦA GIAO DIỆN ỨNG DỤNG MY VNPT 35 2.2.1 Đánh giá sơ bộ tính khả dụng của ứng dụng My VNPT sử dụng SUS 36 2.2.2 Thực hiện đánh giá HE cho ứng dụng My VNPT 38 2.3 TIỂU KẾT CHƯƠNG 2 44 CHƯƠNG 3: PHÂN TÍCH VÀ ĐỀ XUẤT CẢI THIỆN GIAO DIỆN ỨNG DỤNG MY VNPT 46 3.1 ĐỘ HIỆN DIỆN CỦA TRẠNG THÁI HỆ THỐNG 46 3.2 SỰ TƯƠNG ĐỒNG GIỮA HỆ THỐNG VÀ THẾ GIỚI THỰC 49 … – Lớp … 1 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC 3.3 KHẢ NĂNG KIỂM SOÁT CỦA NGƯỜI DÙNG 50 3.4 TÍNH ĐỒNG NHẤT VÀ TÍNH TIÊU CHUẨN 54 3.5 KHẢ NĂNG CHẶN LỖI 57 3.6 TÍNH LINH HOẠT VÀ HIỆU QUẢ TRONG SỬ DỤNG 59 3.7 NHẬN BIẾT THAY VÌ PHẢI HỒI TƯỞNG 59 3.8 THIẾT KẾ CÓ TÍNH THẨM MỸ VÀ TỐI GIẢN 60 3.9 GIÚP NGƯỜI DÙNG NHẬN BIẾT, HIỂU NGUYÊN NHÂN VÀ KHẮC PHỤC LỖI 64 3.10 TRỢ GIÚP VÀ TÀI LIỆU HƯỚNG DẪN 65 3.11 KẾT LUẬN CHƯƠNG 67 TÀI LIỆU THAM KHẢO 68 … – Lớp … 2 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC DANH MỤC HÌNH VẼ Chương 1 Hình 1.1: Các phương pháp đánh giá tính khả dụng 15 Hình 1.2: 10 tiêu chuẩn Heuristics đánh giá tính khả dụng .19 Hình 1.3: Heuristic 1: Độ hiện diện của trạng thái hệ thống .19 Hình 1.4: Heuristic 2: Sự tương đồng giữa hệ thống và thế giới thực .20 Hình 1.5: Heuristic 3: Khả năng kiểm soát của người dùng 21 Hình 1.6: Human Interface Guidelines của Apple 22 Hình 1.7: Heuristic 5: Khả năng chặn lỗi 23 Hình 1.8: Một thiết kế bàn phím laptop đảm bảo tính linh hoạt và hiệu quả trong sử dụng .24 Hình 1.9: Heuristic 7: Nhận biết thay vì phải hồi tưởng 24 Hình 1.10: Heuristic 9: Giúp người dùng nhận biết, hiểu nguyên nhân và khắc phục lỗi 25 Hình 1.11: Biểu đồ tỷ lệ người đánh giá và các vấn đề được phát hiện .28 Chương 2 Hình 2.1: Ảnh showcase ứng dụng My VNPT 34 Hình 2.2: Các mức độ đánh giá tính khả dụng của hệ thống dự trên điểm SUS 37 Hình 2.3: Bảng đánh giá SUS của ứng dụng My VNPT .37 Hình 2.4: Điểm SUS của ứng dụng My VNPT 38 Hình 2.5: Đánh giá độ hiện diện của trạng thái hệ thống 40 Hình 2.6: Đánh giá sự tương đồng giữa hệ thống và thế giới thực 40 Hình 2.7: Đánh giá khả năng kiểm soát của người dùng 41 Hình 2.8: Đánh giá tính đồng nhất và tính tiêu chuẩn .41 Hình 2.9: Đánh giá khả năng chặn lỗi .42 Hình 2.10: Đánh giá tính linh hoạt và hiệu quả trong sử dụng 42 Hình 2.11: Đánh giá khả năng nhận biết thay vì phải hồi tưởng .42 … – Lớp … 3 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC Hình 2.12: Đánh giá tính thẩm mỹ và tối giản 43 Hình 2.13: Đánh giá khả năng giúp người dùng nhận biết, hiểu nguyên nhân và khắc phục lỗi 43 Hình 2.14: Đánh giá khả năng trợ giúp và tài liệu hướng dẫn 43 Hình 2.15: Biểu đồ thể hiện kết quả đánh giá HE cho ứng dụng My VNPT 44 Chương 3 Hình 3.1: Màn hình loading của ứng dụng My VNPT 46 Hình 3.2: Màn hình đầu tiên của flow Thanh toán tiền nước .47 Hình 3.3: Màn hình trước và sau khi chọn mục Settings 48 Hình 3.4: Icon được dùng trong giao diện ứng dụng 49 Hình 3.5: Màn hình menu của ứng dụng 50 Hình 3.6: Màn hình thông báo Giao dịch thất bại .51 Hình 3.7: Màn hình đăng ký quản lý số Vinaphone yêu cầu người dùng nhập lại thông tin mà họ đã cung cấp 52 Hình 3.8: Sơ đồ kiến trúc thông tin hiện tại của ứng dụng My VNPT 53 Hình 3.9: Màn hình Hỗ trợ điện thoại cố định 54 Hình 3.10: Màn hình xem phim lẻ 55 Hình 3.11: Nút Đăng ký được thiết kế khác nhau giữa các màn hình 56 Hình 3.12: Thiết kế của một số nút trong ứng dụng 57 Hình 3.13: Màn hình thông báo “Không có kết quả” 58 Hình 3.14: Một màn hình thông báo lỗi của ứng dụng 59 Hình 3.15: Thiết kế của màn hình Quản lý dịch vụ 60 Hình 3.16: Các nút ấn chưa đảm bảo tiêu chuẩn về sự tương phản dẫn đến khó đọc 61 Hình 3.17: Màn hình danh sách Phim độc quyền của mục Phim lẻ 62 Hình 3.18: Màn hình Chi tiết gói dịch vụ 63 Hình 3.19: Các icon trong ứng dụng trông khá rối mắt .64 … – Lớp … 4 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC Hình 3.20: Thông báo lỗi tại màn hình Thanh toán trước cước 65 Hình 3.21: Trợ giúp tại màn hình Thanh toán tiền nước 66 Hình 3.22: Màn hình chính của giao diện trợ giúp … – Lớp … 67 5 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC DANH MỤC CÁC BẢNG BIỂU, LƯU ĐỒ Chương 1 Bảng 1.1: Điểm khác biệt giữa Heuristic Evaluation và Usability Testing 31 Chương 2 Bảng 2.1: Các chức năng cơ bản của ứng dụng My VNPT .Error! Bookmark not defined.5 … – Lớp … 6 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC DANH MỤC TỪ VIẾT TẮT Chữ viết tắt Nguyên nghĩa Nghĩa tiếng Việt HE Heuristic Evaluation Phương pháp đánh giá dựa trên kinh nghiệm UI User Interface Giao diện người dùng UX User Experience Trải nghiệm người dùng UT Usability Testing Kiểm tra khả năng sử dụng UE Usability Evaluation Đánh giá khả năng sử dụng SUS System Usability Scale Thang đo tính khả dụng của hệ thống … – Lớp … 7 ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC PHẦN MỞ ĐẦU 1 Lý do chọn đề tài Công nghệ thông tin không phải một ngành mới ở Việt Nam, nhưng chỉ trong khoảng 10 năm trở lại đây, chúng ta mới bắt đầu chứng kiến những bước tiến vượt bậc trong việc xây dựng những sản phẩm phần mềm (hay còn gọi là sản phẩm số, sản phẩm công nghệ thông tin, ứng dụng hay digital product) Thị trường nội địa xuất hiện hàng ngàn sản phẩm số cho rất nhiều ngành nghề, từ website cổng thông tin đến những hệ thống quản trị doanh nghiệp đồ sộ và những sản phẩm ứng dụng được các công ty khởi nghiệp sáng tạo ra để giải quyết các vấn đề hàng ngày của người dân Việt Nam như đi lại, du lịch, ăn uống, tài chính,… Dù là ở bất cứ loại sản phẩm nào, dù nhiều người sử dụng hay giới hạn nội bộ, việc đảm bảo chất lượng của sản phẩm hay đảm bảo việc sản phẩm thực hiện đúng tác vụ mà nó được tạo ra để thưc hiện một cách hiệu quả là vô cùng quan trọng Tính khả dụng của sản phẩm là một trong số những yếu tố thiết yếu định hình lên chất lượng sản phẩm Khả năng sử dụng càng tốt, càng nhiều người dùng sẽ tương tác với sản phẩm, từ đó, tỷ lệ chuyển đổi (ROI) càng cao Theo công bố của VNR 500 - Bảng xếp hạng 500 doanh nghiệp lớn nhất tại Việt Nam công bố năm 2012, VNPT là doanh nghiệp lớn thứ 3 Việt Nam Đây cũng là tập đoàn kinh tế nhà nước đứng số 2 về lĩnh vực Bưu chính, Viễn thông tại Việt Nam Với lịch sử 27 năm phát triển, VNPT cung cấp rất nhiều các dịch vụ khác nhau cho một tệp khách hàng rộng lớn trải dài khắp Việt Nam Với sự bùng nổ của ứng dụng di động như hiện nay, việc sở hữu một ứng dụng giúp quản lý dịch vụ là một điều quan trọng và tất yếu, trực tiếp ảnh hưởng đến công việc kinh doanh của công ty, nhất là với một tập đoàn lớn và có tiếng như VNPT Từ đó, ứng dụng My VNPT ra đời như một giải pháp giúp kết nối doanh nghiệp với khách hàng Ứng dụng như một cầu nối cung cấp điều kiền thuận tiện nhất để khách hàng tiếp cận với các sản phẩm, dịch vụ của VNPT … – Lớp … 8 ... phương pháp đánh giá tính khả dụng khác Từ sở lý thuyết áp dụng vào cải thiện ứng dụng My VNPT, cần thực tiền kiểm hậu kiểu tính khả dụng ứng dụng Qua đó, làm rõ vai trị việc áp dụng phương pháp Heuristic. .. VNPT phương pháp Heuristic Evaluation Phạm vi nghiên cứu: Lĩnh vực UI/UX Design nói chung, phương pháp kiểm thử tính khả dụng phương pháp Heuristic Evaluation nói riêng; ứng dụng My VNPT Phương pháp. .. VỀ VNPT VÀ ỨNG DỤNG MY VNPT 33 2.1.1 Giới thiệu chung VNPT 33 2.1.2 Giới thiệu ứng dụng My VNPT 33 2.2 ĐÁNH GIÁ TÍNH KHẢ DỤNG CỦA GIAO DIỆN ỨNG DỤNG MY VNPT 35 2.2.1 Đánh giá sơ tính khả dụng ứng