Thiết kế giao diện người dùng

Một phần của tài liệu XÂY DỰNG ỨNG DỤNG WEBSITE TỔNG HỢP VÀ TÓM TẮT TIN TỨC (Trang 35)

CHƯƠNG 2 THIẾT KẾ VÀ XÂY DỰNG HỆ THỐNG

2.2 Thiết kế giao diện người dùng

Phần giao diện người dùng là phần thiết yếu để người dùng có thể tiếp cận và sử dụng kết quả mà mơ hình tạo ra. Ở đây, chúng em sử dụng môi trường web, được phát triển dựa trên nền tảng Java với Framework Spring Boot, từ đó, cho ra giao diện người dùng một cách tối ưu nhất giúp việc giao tiếp giữa Front-end và Back-end dễ dàng. Việc quản lý và kiểm duyệt lại các nội dung cho đội ngũ Amin cũng dễ dàng hơn.

2.2.1 Các chức năng chính

2.2.1.1 Admin có phần đăng nhập quản lý bài viết(thêm sửa xóa)

2.2.1.2 Hiển thị ra trang chủ các bài viết theo sắp xếp thời gian mới nhất 2.2.1.3 Hiển thị ra trang chủ các bài viết theo sắp xếp thời gian mới nhất

2.2.2 Phân quyền cho User

Có 3 loại User:

− Khách đã đăng ký tài khoản: User − Khách chưa đăng ký tài khoản: Guest − Người quản trị cấp cao nhất: Amin

2.2.3 Nội dung trên trang

Các nội dung sau khi được xử lý sẽ được phân loại và trình bày trên trang web, tuỳ theo các thẻ được gắn nhãn từ trước, các bài báo sẽ được phân loại vào các chỉ mục xác định từ trước

Các bài viết sẽ được trình bày ngắn gọn có cấu trúc gồm: − Tiêu đề (đính kèm là link bài gốc)

− Ảnh đại diện cho bài viết

− Nội dung bài viết (30% bài viết gốc) − Thanh chức năng text to speech

2.2.4 Cấu trúc trang web thực tế

2.2.4.1 Trang chủ

2.2.4.2 Trang tin tức theo nhãn

2.2.4.3 Trang thơng tin chi tiết từ bài

Hình : Trang chủ website

Hình : Trang hiển thị thơng tin theo nhãn

2.3 Chuẩn bị dữ liệu đầu vào

2.3.1 Thu thập dữ liệu

Các nội dung được lấy từ các nguồn chính thống như: tuoitre.vn; VnExpress.vn; Zing.vn; thanhnien.vn; Vietnamnet.vn; laodong.vn; dantri.com.vn

2.3.1.1 Phân tích dữ liệu từ website:

Các nội dung của báo điện tử thường sẽ có cấu trúc như sau:

Ví dụ:

Tiêu đề bài báo

Mô tả bài báo

Ảnh đại diện của bài báo

Nội dung bài báo

2.3.1.2 Bóc tách dữ liệu từ mã nguồn của web: 2.2.1.3.1 Xác định thành phần cần thu thập

- Link bài viết - Thời gian bài đăng - Tiêu đề bài viết - Mô tả bài viết

- Ảnh đại diện của bài viết - Nội dung bài viết

2.2.1.3.2 Phân tích và bóc tách dữ liệu từ mã nguồn

Với các thành phần được liệt kê ở trên, đối với mỗi trang web sẽ có một cấu trúc mã nguồn khác nhau. Vì vậy, trong tài liệu này xin chỉ đề cập đến việc phân tích và bóc tách dữ liệu từ mã nguồn của trang tuoitre.vn.

2.2.1.3.3 Đối với Link bài viết

Các bài viết sẽ được hiện thị ở trang chủ và các trang con của nó ở dạng tiêu đề kèm theo link bài viết bằng thẻ <a> và có thuộc tính href chứa link đến bài viết đó. Sử dụng thư viện bs4 và request của Python để xử lý theo các bước:

- Bước 1: Gửi một request với tham số là link trang chủ .

- Bước 2: Lấy nội dung mã nguồn của request bằng phương thức content của thư viện request.

- Bước 3: Sử dụng thư viện bs4 để định dạng lại cho nội dung mã nguồn lấy được từ request.

- Bước 4: Sử dụng phương thức findAll() của thư viện bs4 để có thể tìm kiếm được tất cả các thẻ <h2> chứa link trỏ đến bài viết.

- Bước 5: Sử dụng phương thức find() của thư viện bs4 để tìm tất các link trỏ đến bài viết nằm trong thẻ <a>.

Mã nguồn:

# Nạp thư viện

from bs4 import BeautifulSoup import requests

# Gửi request cho trang https://tuoitre.vn news = requests.get(‘https://tuoitre.vn’)

# Định dạng lại mã nguồn lấy được từ request soup = BeautifulSoup(news.content, "html.parser")

# Tìm tất cả các thẻ chứa tiêu đề

# Tìm tất cả các thẻ <a> và lấy thuộc tính href chứa link trỏ đến bài viết

links = [link.find('a').attrs["href"] for link in titles]

2.2.1.3.4 Đối với các thành phần khác

Các bài viết đều có chung 1 mẫu và khơng thay đổi nhiều tuỳ bài viết, từ đó có thể xác định chính xác những thẻ nào chứa các thành phần như: tiêu đề, thời gian đăng bài, mô tả bài viết, ảnh đại diện bài viết và nội dung bài viết. Vẫn sử dụng thư viện bs4 để tách được các thành phần này ra khỏi mã nguồn và đưa về trạng thái văn bản thuần tiền xử lý.

Mã nguồn:

# Lấy tiêu đề bài viết

title = soup.find("h1", class_="article-title").text # Lấy ngày đăng bài viết

date = soup.find("div", class_="date-time").text # Lấy mô tả bài viết

abstract = soup.find("h2", class_="sapo").text # Lấy nội dung bài viết

body = soup.find("div", id="main-detail-body").text # Lấy ảnh đại diện bài viết

image = body.img['src']

2.3.2 Bóc tách & Lọc dữ liệu về dạng chuẩn

Văn bản đầu vào có thể chứa nhiều ký tự thừa, dấu câu thừa, khoảng trắng thừa, các từ viết tắt, viết hoa, ... điều này có thể làm ảnh hưởng tới các bước ở sau này nên chúng ta cần phải xử lý văn bản thu được. Chúng ta sẽ biến đổi văn bản về các chữ cái thường và loại bỏ các khoảng trắng thừa.

2.2.1.4Bóc tách dữ liệu

Văn bản sẽ được tách ra từ các thẻ html bởi thư viện bs4. Từ đó, loại bỏ được các thành phần dư thừa như tên thẻ và các thành phần khác của file html.

2.2.1.5 Lọc dữ liệu về dạng chuẩn

Văn bản được loại bỏ các ký tự đặc biệt, các ký tự xuống dòng và các ký tự khơng có nhiều ý nghĩa. Khi đó văn bản vẫn có thể khơng thay đổi nhiều và có khả năng giữ nguyên nội dung ban đầu của văn bản.

2.4 Xử lý dữ liệu đã chuẩn hoá

2.4.1 Tách câu trong văn bản 2.4.2 Tách từ trong câu 2.4.2 Tách từ trong câu

2.4.3 Sử dụng kỹ thuật chuyển từ thành vector số thực

Để phục vụ cho phương pháp tóm tắt ở bước tiếp theo, cần chuyển các câu văn (độ dài ngắn khác nhau) thành các vector số thực có độ dài cố định, sao cho vẫn phải đảm bảo được "độ khác nhau" về ý nghĩa giữa 2 câu cũng tương tự như độ sai khác giữa 2 vector tạo ra.

2.4.4 Xây dựng đoạn văn bản tóm tắt

Với việc áp dụng 3 thuật tốn trên để xử lý văn bản, kết quả trả ra là các đoạn văn có nội dung tương tự nhau, nhưng chúng cần phải được xác định độ giống nhau so với văn bản gốc, từ đó sẽ quyết định nội dung được sử dụng là của thuật toán nào.

Việc này cũng cho phép cho việc xử lý nội dung các bài báo ở các trang khác nhau có thể được lọc ra và loại bỏ các bài viết bị trùng lặp nội dung, tránh gây tiêu tốn tài nguyên của hệ thống.

CHƯƠNG 3. KẾT QUẢ THỰC NGHIỆM

3.1 Nộp bản cứng

Sinh viên (hoặc nhóm sinh viên với tối đa 3 thành viên làm chung một đề tài) nộp 01 quyển đồ án TTCS tại văn phịng khoa CNTT trước ngày bảo vệ ít nhất 03 ngày. Mỗi quyển đồ án phải có các đặc điểm sau:

 Được in một mặt hoặc hai mặt nhằm tiết kiệm khơng gian lưu trữ.

 Được đóng bìa mềm và có bìa bóng kính. Lưu ý: khơng dùng bìa cứng.

 Quyển phải có chữ ký của sinh viên sau Lời cam đoan và của giảng viên hướng dẫn.

3.1.1 Nộp bản mềm

Sinh viên nộp bản mềm đồ án TTCS theo Giảng viên hướng dẫn. Mỗi sinh viên hoặc nhóm sinh viên phải nộp đủ toàn bộ các nội dung được làm trong đồ án TTCS (quyển file mềm dạng .docx và .pdf; project bao gồm cả mã nguồn và hướng dẫn cài đặt). Tất cả đặt trong cùng 1 thư mục và được đặt tên theo: manhom_tendetai_tengvhd_nam.rar. Sinh viên hoặc nhóm sinh viên nộp cho GVHD dưới dạng link tới file đã gửi lên cloud (google, microsoft, v.v.) hoặc copy cho GVHD.

3.2 Bản quyền kết quả nghiên cứu

Đồ án TTCS của sinh viên thường thuộc một trong hai kiểu sau đây:

 Thực hiện một nhiệm vụ nào đó để hồn thành quá trình học tập. Sinh viên tự tìm điều kiện làm việc để hồn thành đồ án. Do đó, sinh viên có quyền khai thác và sử dụng đồ án của mình vào những việc khác. Đồng thời, Khoa Công

nghệ thông tin có tồn quyền sử dụng các kết quả của đồ án và cam kết chia sẻ các kết quả trong bản đồ án cho tất cả những ai quan tâm và có yêu cầu.

 Thực hiện một đề tài, một nhiệm vụ trong ý đồ chiến lược, trong chương trình khoa học và lao động sản xuất của giảng viên hướng dẫn, của cơ sở đào tạo

(trung tâm, viện nghiên cứu, các công ty, v.v.), của cơ sở đào tạo cung cấp các phương tiện và điều kiện làm việc khác (máy móc, sách vở, điện thoại, truy cập internet, máy in, dụng cụ thiết bị thí nghiệm, kinh phí, v.v.). Trong trường hợp

này, tồn bộ bản quyền của đồ án không thuộc về sinh viên. Sinh viên chỉ là

một người tham gia thực hiện nên không được tuỳ tiện sử dụng ở những nơi khác với mục đích khác. Khi sinh viên thực hiện một đề tài theo hình thức này, vai trị của giảng viên hướng dẫn là định hướng, cung cấp các tài liệu tham khảo (nếu có), tạo điều kiện cơ sở vật chất (chỗ ngồi, máy tính, máy in, vật tư tiêu hao, phương tiện thông tin liên lạc, internet v.v.) để hồn thành cơng việc.

KẾT LUẬN Kết luận chung

Xem Mục Error: Reference source not found

Hướng phát triển

(Nếu có)

Kiến nghị và đề xuất

TÀI LIỆU THAM KHẢO

[1] T. H. Cormen, C. E. Leiserson, and R. L. Rivet, Introduction to Algorithm. MIT Press, McGraw-Hill, 1990.

[2] J. W. DuBois, S. Schuetze-Coburn, S. Cumming, and D. Paolino, “Outline of discourse transcription,” in Talking Data: Transcription and Coding in Discourse

Research, J. A. Edwards and M. D. Lampert, Ed. Hillsdale, NJ: Lawrence

Erlbaum Associates, 1993, pp. 45-89.

[3] J. M. Airey, J. H. Rohfl, F. Brooks Jr., “Towards Image Realism with Interactive Update Rates in Complex Virtual Building Environments,” Comptuer Graphics, Vol. 24, No. 2, pp. 41-50, 1990.

[4] S. Brandt, G. Nutt, T. Berk, M. Humphrey, “Soft Real time Application Execution with Dynamic Quality of Service Assurance,” in Proceedings of the Sixth

IEEE/IFIP International Workshop on Quality of Service, Hawaii, USA, May

1998, pp. 154-163.

[5] K. Riley, “Language theory: Applications versus practice,” presented at the Conf. of the Modern Language Association, Boston, MA, December 27-30, 1990. [6] J. Jones. (1991). Networks (2nd ed.) [Online]. Available: http://www.atm.com.

PHỤ LỤC Phụ lục 1. Mẫu trang bìa chính của đồ án

HỌC VIỆN KỸ THUẬT MẬT MÃ

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN MÔN HỌC

THỰC TẬP CƠ SỞ Đề tài:

ÁP DỤNG MƠ HÌNH HỌC SÂU TRONG BÀI TỐN PHÂN LOẠI ẢNH

Sinh viên thực hiện: LÊ LUNG LINH AT150302

TRẦN THU HÀ AT150345 Nhóm 68

Giảng viên hướng dẫn: ThS. LÊ ĐỨC THUẬN

Hà Nội, 10-2021

Phụ lục 2. Mẫu trang bìa phụ của đồ án

HỌC VIỆN KỸ THUẬT MẬT MÃ

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN MƠN HỌC

THỰC TẬP CƠ SỞ Đề tài:

ÁP DỤNG MƠ HÌNH HỌC SÂU TRONG BÀI TOÁN PHÂN LOẠI ẢNH

Sinh viên thực hiện: LÊ LUNG LINH AT150302

NGUYỄN VĂN NAM AT150033 TRẦN THU HÀ AT150345

Nhóm 68

Giảng viên hướng dẫn: ThS. LÊ ĐỨC THUẬN

Hà Nội, 10-2021

Phụ lục 3. Mẫu nhận xét đồ án

ĐÁNH GIÁ QUYỂN ĐỒ ÁN THỰC TẬP CƠ SỞ

(Dùng cho giảng viên hướng dẫn)

Tên giảng viên đánh giá:......................................................................................

Họ và tên Sinh viên:...........................................MSSV:.....................................

Tên đồ án:............................................................................................................

.............................................................................................................................

Chọn các mức điểm phù hợp cho sinh viên trình bày theo các tiêu chí dưới đây:

Rất kém (1); Kém (2); Đạt (3); Giỏi (4); Xuất sắc (5)

Có sự kết hợp giữa lý thuyết và thực hành (20)

1

Nêu rõ tính cấp thiết và quan trọng của đề tài, các vấn đề và các giả thuyết (bao gồm mục đích và tính phù hợp) cũng như phạm vi ứng dụng của đồ án

1 2 3 4 5 2 Cập nhật kết quả nghiên cứu gần đây nhất (trong nước/quốc tế) 1 2 3 4 5 3 Nêu rõ và chi tiết phương pháp nghiên cứu/giải quyết vấn đề 1 2 3 4 5 4 Có kết quả mơ phỏng/thưc nghiệm và trình bày rõ ràng kết quả

đạt được 1 2 3 4 5

Có khả năng phân tích và đánh giá kết quả (15)

5 Kế hoạch làm việc rõ ràng bao gồm mục tiêu và phương pháp

thực hiện dựa trên kết quả nghiên cứu lý thuyết một cách có hệ thống 1 2 3 4 5 6 Kết quả được trình bày một cách logic và dễ hiểu, tất cả kết quả

đều được phân tích và đánh giá thỏa đáng. 1 2 3 4 5 7

Trong phần kết luận, tác giả chỉ rõ sự khác biệt (nếu có) giữa kết quả đạt được và mục tiêu ban đầu đề ra đồng thời cung cấp lập luận để đề xuất hướng giải quyết có thể thực hiện trong tương lai.

1 2 3 4 5

Kỹ năng viết quyển đồ án (10)

8

Đồ án trình bày đúng mẫu quy định với cấu trúc các chương logic và đẹp mắt (bảng biểu, hình ảnh rõ ràng, có tiêu đề, được đánh số thứ tự và được giải thích hay đề cập đến trong đồ án, có căn lề, dấu cách sau dấu chấm, dấu phẩy v.v), có mở đầu chương và kết luận chương, có liệt kê tài liệu tham khảo và có trích dẫn đúng quy định

1 2 3 4 5

9 Kỹ năng viết xuất sắc (cấu trúc câu chuẩn, văn phong khoa học,

lập luận logic và có cơ sở, từ vựng sử dụng phù hợp v.v.) 1 2 3 4 5

Thành tựu nghiên cứu khoa học (5) (chọn 1 trong 3 trường hợp)

0a SVNC khoa học giải 3 cấp Viện trở lên/các giải thưởng khoa học (quốc tế/trong nước) từ giải 3 trở lên/ Có đăng ký bằng phát minh sáng chế 1

0b

Được báo cáo tại hội đồng cấp Viện trong hội nghị sinh viên nghiên cứu khoa học nhưng không đạt giải từ giải 3 trở lên/Đạt giải khuyến khích trong các kỳ thi quốc gia và quốc tế khác về chun ngành như TI contest.

2

1

0c Khơng có thành tích về nghiên cứu khoa học 0

Điểm tổng /50

Điểm tổng quy đổi về thang 10

Nhận xét khác (về thái độ và tinh thần làm việc của sinh viên)

............................................................................................................................. ............................................................................................................................. ............................................................................................................................. ............................................................................................................................. ............................................................................................................................. ............................................................................................................................. Ngày: … / … / 20… Người nhận xét (Ký và ghi rõ họ tên)

Một phần của tài liệu XÂY DỰNG ỨNG DỤNG WEBSITE TỔNG HỢP VÀ TÓM TẮT TIN TỨC (Trang 35)