5.3. Mơ hình sử dụng
Hình 5.1. Kiến trúc hệ thống
Website bán hàng là ứng dụng web được thiết kế theo mơ hình 3 Tier, một kiến trúc kiểu Client-Server. Mục đích của thiết kế này là để tách tách các lớp riêng biệt, hoạt động riêng biệt, cải thiện khả năng bảo trì và tái sử dụng.
5.3.1. Presentation tier
Lớp giao diện, bao gồm các thành phần xử lý giao diện GUI, được người dùng nhìn thấy, lớp này bao gồm phần đầu và phần cuối của các yêu cầu và dữ liệu xử lý. Nhiệm vụ chính là hiển thị dữ liệu và nhận dữ liệu từ người dùng.
5.3.2. Logic tier
Lớp này sử dụng máy chủ ứng dụng và các xử lý logic nghiệp vụ, cung cấp chức năng cho ứng dụng để lưu và xử lý dữ liệu. Ví dụ, lớp này theo dõi và lưu các tùy chọn của người dùng khi người dùng đăng nhập vào trang web và mua hàng của họ. Lúc này, khách hàng đăng nhập vào trang web và được hiển thị phương thức vận chuyển đã chọn trước đó hoặc hàng hóa đã duyệt trước đó. Các loại thanh tốn do người dùng này thực hiện cũng có thể được lưu trong lớp nghiệp vụ và sau đó được sử dụng khi người dùng đăng nhập lại.
5.3.3. Data tier
Lớp cuối cùng để xử lý các yêu cầu dữ liệu cuối cùng, dữ liệu thu được ở lớp nghiệp vụ cũng có ở đây, có thể tìm kiếm, trích xuất, cập nhật. Lớp này là một hệ thống quản
46 lý cơ sở dữ liệu, cung cấp quyền truy cập cho người dùng vào dữ liệu ứng dụng. Lớp dữ liệu có thể được kết nối trực tiếp với cơ sở dữ liệu hoặc nó có thể gửi dữ liệu đến dịch vụ dữ liệu để xử lý chúng.
47 Chương 6: THỰC HIỆN 6.1. Màn hình chính: 6.1.1. Giao diện Hình 6.1. Màn hình home 6.1.2. Mơ tả
Màn hình Home là nơi hiển thị tổng quan của trang web. Người dùng có thể xem các bài hát nổi bật, các bài hát gợi ý muốn nghe, bài hát yêu thích, các đối tác âm nhạc.
6.2. Màn hình xếp hàng
6.2.1. Giao diện
Hình 6.2. Màn hình xếp hạng
48 Màn hình xếp hạng bao gồm các bài hát nổi bật, người nghe vào có thể nghe các bài hát yêu thích, tải về, thêm vào danh sách yêu thích
6.3. Màn hình radio
6.3.1. Giao diện
Hình 6.3. Màn hình radio nổi bật
6.3.2. Mơ tả
Màn hình radio này bao gồm các Radio nổi bật, postcast, radio nghe lại hoặc các tin tức của âm nhạc mới nhất.
6.4. Màn hình theo dõi
6.4.1. Giao diện
49
6.4.2. Mơ tả
Màn hình này hiển thị tất cả các danh sách, các tin tức về các nghệ sĩ, các bài hát, tin về nghệ sĩ đó, người dùng có thể nhấn vào để xem, nghe các bài hát của nghệ sĩ đó.
6.5. Màn hình cá nhân
6.5.1. Giao diện
Hình 6.5. Màn hình các bài hả u thích, playlist
6.5.2. Mơ tả
Màn hình này bao gồm các bài hát đã yêu thích, playlist, album, mv, nghệ sĩ, tải lên, người dùng có thể lựa chọn nghe từng bài hát hoặc phát tất cả các bài trong danh sách.
6.6. Màn hình thay đổi giao diện
6.6.1. Giao diện
50
6.6.2. Mô tả
Màn hình này giúp người dùng có thể thay đổi hình nền của website nghe nhạc, có nhiều sự lựa chọn về giao diện như giao diện theo chủ đề, giao diện theo hình nghệ sĩ, giao diện màu tối, giao diện màu sáng.
6.7. Màn hình chi tiết bài hát
6.7.1. Giao diện
Hình 6.7. Màn hình play nhạc
6.7.2. Mơ tả
Màn hình này hiển thị thơng tin chi tiết của bài hát người dùng đang nghe. Tại đây:
- Nếu người dùng muốn dừng thì bấm nút pause.
- Nếu người dùng muốn nghe sang bài kế tiếp hoặc bài trước thì nhấn nút next left, right
- Nếu người dùng muốn lặp lại bài hát thì nhấn nút bên trái nút left.
- Người dùng muốn tua nhanh thì kéo thanh timeline và tăng giảm âm lượng thì kéo thanh loa.
51
KẾT LUẬN
7.1. Ưu điểm của đồ án:
- Giao diện đơn giản, người dùng dễ thao tác trên website. - Tốc độ phản hồi nhanh.
7.2. Hạn chế của đồ án:
- Tuy đã đáp ứng được nhu cầu cơ bản của đề tài đưa ra nhưng còn rất nhiều thiếu sót, chưa hồn thiện các chức năng như đã đưa ra lúc ban đầu.
7.3. Hướng phát triển của đồ án:
- Mở rộng quy mô ứng dụng phần mềm.
- Cải thiện các chức năng đã được phát triển của phần mềm.
- Xây dựng thêm các chức năng mới, khuyến nghị, cũng như hoàn thiện các chức năng cũ.
- Tiếp tục nâng cao chất lượng của UI và UX.
- Hoàn thiện các chức năng chưa được phát triển như trong kế hoạch ban đầu.
7.4. Kết quả đạt được
- Các chức năng cơ bản như nghe nhạc theo bài hát, album, tải nhạc, yêu thích. - Làm quen các sơ đồ UML như usecase, class, object, … và thiết kế hệ thống
bằng thiết kế UML.
52
TÀI LIỆU THAM KHẢO
[1] Phan Trung Hiếu (2021), Bài giảng môn Công nghệ Web và Ứng dụng, Khoa CNPM, Trường ĐH. Công Nghệ Thông Tin.
[2] Thương Nguyễn, “Tất tần tật về jQuery- Các phương thức hay sử dụng”, [Online], Available: https://viblo.asia/p/tat-tan-tat-ve-jquery-cac-phuong-thuc-hay-su-dung- p1-Az45bz2z5xY.
[3] Webcoban, “Danh sách các thuộc tính CSS”, [Online], Available: