Xây dựng trang web thời trang với các tiện ích chatbot, khuyến nghị sản phẩm để nâng cao trải nghiệm người dùng

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM TRẦN ANH THẮNG TRƯƠNG CƠNG TẤN PHÁT KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG TRANG WEB THỜI TRANG VỚI CÁC TIỆN ÍCH CHATBOT, KHUYẾN NGHỊ SẢN PHẨM ĐỂ NÂNG CAO TRẢI NGHIỆM NGƯỜI DÙNG Fashion website with support utility to enhance user experience KỸ SƯ NGÀNH CÔNG NGHỆ PHẦN MỀM TP HỒ CHÍ MINH, ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CƠNG NGHỆ THƠNG TIN KHOA CÔNG NGHỆ PHẦN MỀM TRẦN ANH THẮNG – 17520159 TRƯƠNG CƠNG TẤN PHÁT – 17520884 KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG TRANG WEB THỜI TRANG VỚI CÁC TIỆN ÍCH CHATBOT, KHUYẾN NGHỊ SẢN PHẨM ĐỂ NÂNG CAO TRẢI NGHIỆM NGƯỜI DÙNG Fashion website with support utility to enhance user experience KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN Ths.MAI TRỌNG KHANG TP HỒ CHÍ MINH, DANH SÁCH HỘI ĐỒNG BẢO VỆ KHÓA LUẬN Hội đồng chấm khóa luận tốt nghiệp, thành lập theo Quyết định số ……………… …… ngày ……………… Hiệu trưởng Trường Đại học Công nghệ Thông tin ………………………………………… – Chủ tịch ………………………………………… – Thư ký ………………………………………… – Ủy viên ………………………………………… – Ủy viên ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN TP HCM, ngày …… tháng …… năm …… NHẬN XÉT KHÓA LUẬN TỐT NGHIỆP (CỦA CÁN BỘ HƯỚNG DẪN) Tên khóa luận: XÂY DỰNG TRANG WEB THỜI TRANG VỚI CÁC TIỆN ÍCH CHATBOT, KHUYẾN NGHỊ SẢN PHẨM ĐỂ NÂNG CAO TRẢI NGHIỆM NGƯỜI DÙNG Nhóm SV thực hiện: Cán hướng dẫn: Trần Anh Thắng 17520159 Trương Công Tấn Phát 17520884 ThS Mai Trọng Khang Đánh giá Khóa luận Về báo cáo: Số trang Số chương Số bảng số liệu Số hình vẽ Số tài liệu tham khảo Sản phẩm Một số nhận xét hình thức báo cáo: Về nội dung nghiên cứu: Về chương trình ứng dụng: Về thái độ làm việc sinh viên: Đánh giá chung: Điểm sinh viên: Trần Anh Thắng: ………/10 Trương Công Tấn Phát: ……/10 Người nhận xét (Ký ghi rõ họ tên) ThS Mai Trọng Khang ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN TP HCM, ngày …… tháng …… năm …… NHẬN XÉT KHÓA LUẬN TỐT NGHIỆP (CỦA CÁN BỘ PHẢN BIỆN) Tên khóa luận: XÂY DỰNG TRANG WEB THỜI TRANG VỚI CÁC TIỆN ÍCH CHATBOT, KHUYẾN NGHỊ SẢN PHẨM ĐỂ NÂNG CAO TRẢI NGHIỆM NGƯỜI DÙNG Nhóm SV thực hiện: Cán phản biện: Trần Anh Thắng 17520159 Trương Công Tấn Phát 17520884 ThS Trần Thị Hồng Yến Đánh giá Khóa luận Về báo cáo: Số trang Số chương Số bảng số liệu Số hình vẽ Số tài liệu tham khảo Sản phẩm Một số nhận xét hình thức báo cáo: Về nội dung nghiên cứu: Về chương trình ứng dụng: Về thái độ làm việc sinh viên: Đánh giá chung: Điểm sinh viên: Trần Anh Thắng: ………/10 Trương Công Tấn Phát: ……/10 Người nhận xét (Ký ghi rõ họ tên) ThS.Trần Thị Hồng Yến ĐỀ CƯƠNG CHI TIẾT TÊN ĐỀ TÀI: Xây dựng trang web thời trang với tiện ích Chatbot, khuyến nghị sản phẩm để nâng cao trải nghiệm người dùng Cán hướng dẫn: ThS Mai Trọng Khang Thời gian thực hiện: Từ ngày 01/03/2021 đến ngày 20/06/2021 Sinh viên thực hiện: Trương Công Tấn Phát – 17520884 Trần Anh Thắng – 17520159 Nội dung đề tài:(Mô tả chi tiết mục tiêu, phạm vi, đối tượng, phương pháp thực hiện, kết mong đợi đề tài) Mục tiêu đề tài 1.1 Bối cảnh chọn đề tài Công nghệ thông tin phát triển ngày đại đổi không ngừng, việc chinh phục hết đỉnh cao thành đỉnh cao khác Mạng internet trở thành mạng truyền thong có sức ảnh hưởng lớn nhất, thiếu tất hoạt động người việc truyền tải trao đổi liệu Không ngày việc liên quan đến thông tin ngày dễ dàng cho người sử dụng việc kết nối internet dịng liệu truy tìm kho tài ngun khơng nước mà ngồi nước khơng ngơn ngữ mà hình ảnh , âm Chính lợi ích từ internet thúc đảy đời phát triển thương mại điện tử làm biến đổi mặt văn hoá nâng cao chất lượng sống người hoạt động thong thường sản xuất, kinh doanh doing nghiệp phát triển sống người ngày phát triển nhu cầu sống người nâng cao nhu cầu đơn giản thiết thực Đó nhu cầu ăn, mặc vấn đề toán nhà kinh doanh, để đáp ứng nhu cầu người để cải thiện đời sống ngày cao Chính lẽ để đáp ứng nhu cầu người sở kế thừa trang web bán hang khác em xây dựng nên website bán hang thời trang qua mạng để đáp ứng nhu cầu mua sắm người, giúp họ tiết kiếm kiệm thời gian, chi phí việc phải shop, cửa hàng hay chợ truyền thống để mua tìm kiếm sản phẩm Thay vào Hình 3.12: Giao diện tìm kiếm (h) Giao diện thơng tin liên hệ Mô tả: Hiển thị thông tin liên hệ cho người dùng muốn liên hệ với chủ sở hữu quản lý trang web Đồng thời tương tác với hình khác Quay trang chủ, Khuyến nghị, Tìm kiếm, Chatbot, … Hình 3.13: Giao diện liên hệ 95 (i) Giao diện Chatbot Mô tả: Hiển thị Chatbot tự động liên hệ với người dùng Hình 3.14: Giao diện Chatbot (j) Giao diện khuyến nghị sản phẩm Mô tả: Hiển thị danh sách sản phẩm khuyến nghị mua, chưa mua hay đánh giá sản phẩm khơng có sản phẩm gợi ý Hình 3.15: Giao diện Khuyến nghị 96 (k) Giao diện thống kê Mô tả: Hiển thị thơng tin tồn thống kê cho Người quản lý dễ dàng xử lý Thống kê dựa biểu đồ nhằm biết sản phẩm bán chạy, biết doanh thu tháng số lượng đơn hàng Hình 3.16: Giao diện thống kê (l) Giao diện quản lý đơn hàng Mơ tả: Hiển thị thơng tin tồn đơn hàng cho Người quản lý dễ dàng thao tác thay đổi 97 Hình 3.17: Giao diện quản lý đơn hàng (m) Giao diện quản lý danh mục/ sản phẩm Mơ tả: Hiển thị thơng tin tồn danh mục sản phẩm cho Người quản lý dễ dàng thao tác thay đổi Người quản lý thay đổi thơng tin bên trường liệu danh mục sản phẩm cập nhật lưu Hình 3.18: Giao diện quản lý danh mục 98 Hình 3.19: Giao diện quản lý sản phẩm (n) Giao diện Crawler data Mô tả: Hiển thị bảng điều khiển hành động Crawler data Biết truy xuất liệu từ trang web Hình 3.20: Giao diện Crawler data 99 Chương MƠ TẢ CÁC TIỆN ÍCH CHỨC NĂNG 4.1 Chức khuyến nghị 4.1.1 Lựa chọn phương pháp Nhóm chúng em lựa chọn phương pháp Hệ thống khuyến nghị lọc cộng tác cụ thể Item-item collaborative filtering để xác định mức độ quan tâm user tới item dựa mức độ quan tâm xác định item similarities Từ đó, hệ thống gợi ý items gần giống với items mà user có độ quan tâm cao Chuẩn hóa liệu với việc trừ trung bình cộng cột nhằm để tạo giá trị riêng âm dương q trình tính tốn Ở giá trị dương thích giá trị âm khơng thích Cịn giá trị giá trị trung gian thể việc chưa xác định user có thích item hay không? Sử dụng function Cosine Similarity hàm công thức tính cos góc vector Với u1 u2 vector tương ứng theo user1 user2 sau chuẩn hóa Trong CF, missing rating xác định dựa thông tin k-NN Chỉ xét với user rated item xét Các trọng số xác định dựa similarity user Cơng thức dùng để dự đốn rating cho u i là: Trong N(u, i) tập hợp k users neighborhood (similarity cao nhất) u mà đánh giá i Chúng ta tính tốn similarity items 100 recommend items gần giống với item u thích user số lượng items thường nhỏ số lượng users 4.1.2 Ví dụ Một ví dụ để hiểu dễ dàng cách thực nhóm chúng em: Với Utility matrix cho trước.[5] Tính rating trung bình cộng i Sau chuẩn hóa liệu ta có số âm dương Từ đưa ma trận user có tính tương đồng cơng thức: 101 Để cuối cho ma trận kết sau: 102 Cụ thể ô màu đỏ thể cho item gợi ý cho user Trên ví dụ để hiểu phương pháp mà nhóm thực 4.2 Chức Chatbot 4.2.1 Cách làm việc Hình 4.1: Mơ hình làm việc Chatbot TP-Shop Người dùng thực tương tác với chat bot cách gửi tin nhắn hay hành động đó, gửi lên FB page truyền vào FB sever để xử lý sau truyền tín hiệu đến webhook để hiểu loại tin nhắn từ phía java chạy lệnh trả lại cho FB sever tin nhắn trả lời đồng thời FB Sever chuyển tiếp tin nhắn để trả lời người dùng 4.2.2 Thực Vì Facebook Developer hỗ trợ thư viện báo cáo hướng dẫn NodeJS nên nhóm chúng em lựa chọn thư viện mở Messenger4j Github.[30] 103 Hình 4.2: Thư viện mở Messenger4j Và cách thức thực sau: • Tải thư viện xuống thông qua Maven com.github.messenger4j messenger4j 1.0.0 • Cấu hình cách cung cấp biến giá trị mơi trường APP_SECRET, VERIFY_TOKEN, PAGE_ACCESS_TOKEN • Tạo mơi trường Heroku: Hiện trang developer Facebook không chấp nhận việc sử dụng localhost để sử dụng API Facebook nên triển khai ứng dụng lên Heroku • Tạo trang Facebook: Tạo trang page Facebook để quản lý Chatbot • Tạo cấu hình Facebook thơng qua trang developers.facebook.com • Tạo dựng Webhook • Triển khai ứng dụng lên môi trường Heroku tạo trước Ngồi cịn sử dụng tích hợp thêm cơng cụ hỗ trợ Chatfuel 104 Hình 4.3: Tích hợp thêm cơng cụ Chatfuel cho Chatbot Sử dụng thêm công cụ Chatfuel để gây dựng dễ dang thực nhiều kịch cho Chatbot nhằm tạo thêm phong phú quản lý dễ dàng hơn.[25] 105 Chương KẾT QUẢ ĐẠT ĐƯỢC VÀ HƯỚNG PHÁT TRIỂN 5.1 Kết đạt • Xây dựng thành công trang web bán hàng thời trang với nhiều tiện ích cho người dùng • Giao diện chương trình thân thiện, dễ sử dụng, thay đổi giao diện • Thực kiểm thử phần mềm mức độ lập trình • Hiểu nắm kiến thức mơ hình kiến trúc MVC • Chương trình tự crawl liệu giúp xử lý liệu nhanh chóng • Thực tính Chatbot khuyến nghị sản phẩm cho người dùng • Tăng khả làm việc nhóm 5.2 Ưu điểm • Hồn thành u cầu đặt ban đầu, có đầy đủ tính cần thiết ứng dụng thương mại điện tử • Giao diện đơn giản, bố cục hợp lý, người dùng dễ dàng theo tác ứng dụng • Tốc độ phản hồi thao tác nhanh, tối ưu hóa suất người dùng • Sinh viên thực nắm cách thức làm ứng dụng bán hàng, hiểu biết ngôn ngữ Java • Ứng dụng triển khai nghiệm thu thành cơng máy thật • Hồn thành việc áp dụng thuật toán gợi ý Collaborative filtering Contentbased filtering vào ứng dụng Phục vụ việc gợi ý sản phẩm cho người dùng Gợi ý sản phẩm phù hợp dựa lịch sử đánh giá sản phẩm xem họ để tăng tỉ lệ mua hàng, từ tăng doanh thu 5.3 Nhược điểm • Cịn hạn chế số tính năng: o Chưa tối ưu mở rộng nâng cao tính o Tối ưu code chưa tốt nên tốc độ tương tác ứng dụng cịn chậm 106 • Hệ thống gợi ý chưa hiệu với trường hợp chưa có liệu, thời gian cập nhật lại liệu gợi ý chậm thời gian thực 5.4 Hướng phát triển • Xây dựng chứa cịn thiếu, hồn thiện chức có • Tối ưu hóa code để tăng tốc độ tương tác • Tối ưu hóa CSDL hợp lý • Phát triển thêm nhiều tính so sánh hay săn deal giảm giá • Mở rộng thêm kịch chuyên sâu Chatbot • Mở rộng nhiều tảng • Tích hợp thêm thuật tốn khuyến nghị cho người dùng khuyến nghị cho người dùng sản phẩm mua nhiều 107 TÀI LIỆU THAM KHẢO Tài liệu Tiếng Việt [1] Spring MVC - Hướng Dẫn Java: https://huongdanjava.com/vi/spring-mvc [2] Developer MoMo: https://developers.momo.vn/ [3] Spring MVC – Tạo RESTful Web Service với Spring MVC: https://stackjava.com/spring/spring-mvc-restful-web-service.html [4] Hướng dẫn sử dụng Java Jsoup phân tích HTML: http://o7planning.org/vi/10399/huong- dan-su-dung-java-jsoup-phan-tich-html [5] Machine Learning bản: https://machinelearningcoban.com/2017/05/24/collaborativefiltering/ [6] MVC gì: https://vietadsgroup.vn/mvc-la-gi-nhung-y-nghia-cua-mvc.html [7] Tổng quan Java: https://hocjava.com/tong-quan/ [8] Tổng quan Spring Framework: http://code24h.com/tong-quan-ve-spring- framework-d10777.htm [9] Tổng quan hệ quản trị sở liệu MySql-DB Ahire: https://dbahire.com/tong-quan-ve-he-quan-tri-co-so-du-lieu-mysql [10] ORM gì: https://danglong.name.vn/orm-la-gi/ [11] Stack java – Hibernate gì: https://stackjava.com/hibernate/series-hibernate- phan-1-gioi-thieu-ve-hibernate-framework.html [12] TinoGroup – HTML, CSS, Javascipt gì: https://wiki.tino.org/html-css- javascript-la-gi/ [13] Bootstrap gì: https://mona.media/bootstrap-la-gi/ [14] Codelearn – dùng Jsoup để Crawler: https://codelearn.io/sharing/dung-jsoup- java-de-crawl-truyen-onepiece [15] Chatbot gì: https://latrongnhon.com/chatbot-la-gi-ung-dung-thuc-te-cua- chatbot-trong-kinh-doanh/ [16] Ứng dụng máy học hệ thống khuyến nghị: https://bitly.com.vn/yejmbm 108 Tài liệu Tiếng Anh [17] Ekstrand, Michael D., John T Riedl, and Joseph A Konstan (2011) “Collaborative filtering recommender systems.” Foundations and Trends® in Human–Computer Interaction 4.2 [18] Jure Leskovec, Anand Rajaraman, Jeffrey David Ullman, Stanford University, California (2014), “Recommendation Systems” [19] Ekstrand, Michael D., John T Riedl, and Joseph A Konstan (2011) “Collaborative filtering recommender systems” [20] Linden, G; Smith, B; York, J (22 January 2003) "Amazon.com recommendations: item-to-item collaborative filtering" [21] Documentation - 5.5 - Hibernate ORM: https://hibernate.org/orm/documentation/5.0 [22] Jsoup: https://jsoup.org/ [23] Messenger Platform: https://developers.facebook.com/docs/messengerplatform/ [24] Deploying Spring Boot Applications to Heroku | Heroku Dev Center: https://devcenter.heroku.com/articles/deploying-spring-boot-apps-to-heroku [25] Chatfuel: https://chatfuel.com/ [26] Getting Started on Heroku with Java | Heroku Dev Center: https://devcenter.heroku.com/articles/getting-started-with-java [27] W3Schools Online Web Tutorials: https://www.w3schools.com/ [28] MySql Tutorial: https://www.mysqltutorial.org/ [29] Spring Tutorial – Tutorialspoint: https://www.tutorialspoint.com/spring/index.htm Mã nguồn mở [30] Messenger4j: https://github.com/messenger4j/messenger4j 109 ... em chọn đề tài ? ?Xây dựng trang web thời trang với tiện ích chatbot, khuyến nghị sản phẩm để nâng cao trải nghiệm người dùng? ??, 1.2 Mục ? ?ích đề tài Trang web thực dựa hai mục ? ?ích sau: Thứ nghiên... PHÁT – 17520884 KHÓA LUẬN TỐT NGHIỆP XÂY DỰNG TRANG WEB THỜI TRANG VỚI CÁC TIỆN ÍCH CHATBOT, KHUYẾN NGHỊ SẢN PHẨM ĐỂ NÂNG CAO TRẢI NGHIỆM NGƯỜI DÙNG Fashion website with support utility to enhance... giúp người tiêu dùng đưa định lựa chọn hàng hóa họ Đó lí nhóm chúng em chọn đề tài ? ?Xây dựng trang Web thời trang với tiện ích Chatbot, khuyến nghị sản phẩm để nâng cao trải nghiệm người dùng? ??