BÁO CÁO ĐỒ ÁN CƠ SỞ 1 ĐỀ TÀI: XÂY DỰNG GIAO DIỆN WEBSITE VỀ SỨC KHỎE. ThS. NINH KHÁNH CHI

Với lòng biết ơn sâu sắc nhất, nhóm em xin gửi lời cảm ơn chân thành tới toàn thể các thầy cô giáo trong khoa Công nghệ thông tin và Truyền Thông Việt Hàn – Đại học Đà Nẵng, những người

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ

TRUYỀN THÔNG VIỆT-HÀN

BÁO CÁO ĐỒ ÁN CƠ SỞ 1

ĐỀ TÀI: XÂY DỰNG GIAO DIỆN WEBSITE

VỀ SỨC KHỎE

Sinh viên thực hiện : Đỗ Hữu Hùng

Giảng viên hướng dẫn : ThS NINH KHÁNH CHI

Đà Nẵng, tháng 05 năm 2021

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ

TRUYỀN THÔNG VIỆT-HÀN

ĐỒ ÁN CƠ SỞ 1

ĐỀ TÀI: XÂY DỰNG GIAO DIỆN WEBSITE VỀ

BÁN ĐỒ HANDMADE

Đà Nẵng, tháng 05 năm 2021

LỜI CẢM ƠN

Sinh viên 1

Đỗ Hữu Hùng

Trên thực tế không có sự thành công nào mà không gắn liền với những sự hỗ trợ, giúp đỡ dù ít hay nhiều, dù trực tiếp hay gián tiếp của người khác Trong suốt quãng thời gian năm năm từ khi bắt đầu học tập tại giảng đường trường Công nghệ thông tin và Truyền Thông Việt Hàn– Đại học Đà Nẵng, nhóm em đã nhận được rất nhiều sự quan tâm, giúp đỡ của thầy cô và các bạn

Với lòng biết ơn sâu sắc nhất, nhóm em xin gửi lời cảm ơn chân thành tới toàn thể các thầy cô giáo trong khoa Công nghệ thông tin và Truyền Thông Việt Hàn – Đại học Đà Nẵng, những người đã dạy dỗ và truyền đạt vốn kiến thức vô cùng quý báu của mình cho chúng em trong suốt quãng thời gian học tại đây Những tình cảm và kiến thức mà thầy cô đã gửi trao cho chúng em sẽ là hành trang cho chúng em để bước đi trên những đoạn đường tương lai

Nhóm em cũng xin gửi lời cảm ơn sâu sắc tới Cô giáo – Thạc sĩ Trịnh Thị Ngọc Linh, người đã tận tình hỗ trợ và dẫn dắt chúng nhóm em trong suốt quá trình thực hiện đồ án để có được kết quả một cách tốt nhất

Một lần nữa nhóm em xin được chân thành cảm ơn!

NHẬN XÉT

………

… ………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

MỤC LỤC

Trang

MỞ ĐẦU 6

I Giới thiệu 6

II Cấu trúc đồ án 6 Chương 1 Tổng quan về đề tài _7

I Phân tích yêu cầu: 7

1 Giới thiệu: _7

2 Yêu cầu đặt ra: 7

3 Chức năng: _8

4 Phân bổ thời gian thực hiện: _8

5 Hạn chế: _8

6 Các ngôn ngữ lập trình được sử dụng: 8

Chương 2 Phân tích và thiết kế hệ thống _9

I Phân tích hệ thống 9

II Thiết kế hệ thống _9

1 Sơ đồ khối quản lý Thông Tin 9

2 Sơ đồ khối chức năng Tìm kiếm _10

3 Sơ đồ khối chức năng Phản Hồi – Liên Hệ _11

Chương 3 Triển khai xây dựng 13

I Danh sách thư mục cài đặt: 13

II Cấu trúc của Website _13

1 Header: _13

2 Banner: _13

3 Footer: _14

4 Các trang Website thành phần: 14

Chương 4 Kết luận và phương hướng phát triển 17

I Kết quả: 17

1 Đối với người dùng, trang Web đã mang lại được: _17

2 Đối với người quản trị, trang Web đã đưa ra được: _17

II Phương hướng phát triển: _17

1 Mục tiêu: _17

2 Tính khả thi: _17

3 Thị trường: 17

4 Đối thủ cạnh tranh: _17

5 Chiến lược cạnh tranh: _18

6 Phát triển và bổ sung: _18

7 Hệ thống đối tác: _18

8 Chính sách đầu tư: 18

Tổng kết 19

Tài Liệu Tham Khảo 20

Phụ Lục _21

DANH MỤC BẢNG

Trang

Bảng 1 Phân bổ thời gian 7

DANH MỤC CỤM TỪ VIẾT TẮT

MỞ ĐẦU

I Giới thiệu

II Cấu trúc đồ án

- Chương 1: Tổng quan về đề tài

- Chương 2: Phân tích và thiết kế hệ thống

- Chương 3: Triển khai và xây dựng

- Chương 4: Kết luận và phương hướng phát triển

“Handmade” Hầu hết chúng ta đều hiểu nôm na handmade là làm bằng

tay, đối lập với machine made( làm bằng máy) như hầu hết các sản phẩm gia dụng được sản suất hàng loạt ngày nay Chỉ đơn thuần là trang trí thêm hay sửa đổi lại một món đồ có sẵn có vốn là mặt hàng sẳn xuất hàng loạt cũng không thể biến nó thành sản phẩm handmade.

“ưu điểm” Độc đáo, lạ mắt, không đụng hàng là ưu điểm tuyệt vời của

đồ handmade kinh doanh đồ handmade thực sự bùng nổ và trở nên "hút khách".

Đặc biệt hơn chúng ta đang ở thời đại 4.0 , công nghệ vốn đang rất phát

triển và nắm được vấn đề đó , nhóm chúng em đưa ra dự án về Website “Bán

đồ handmade” phục vụ nhu cầu đó

- Tổng Kết

- Tài Liệu Tham Khảo

- Phụ Lục

Chương 1 Tổng quan về đề tài

Chương 2 Phân tích yêu cầu:

Tên đề tài: “XÂY DỰNG GIAO DIỆN WEBSITE VỀ SỨC KHỎE”

Chương 3 Giới thiệu:

WEBSITE “Bán đồ Handmade" hỗ trợ người dùng tìm đến với đồ thủ công handmade một cách dễ dàng và nhanh chóng, trang web sẽ hiển thị các vật dụng

và giá tiền Giúp người dùng dễ chọn lựa

Chương 4 Yêu cầu đặt ra:

 Thiết bị và phần mềm:

- Máy tính có thể thiết kế được web

- Phần mềm thiết kế web: Sublime Text 3

 Yêu cầu trang web:

Hệ thống có 2 phần:

Thứ nhất: Phần người dùng:

Người dùng là những người có nhu cầu tìm hiểu, tìm kiếm thông tin về đồ handmade, họ sẽ tìm kiếm đồ handmade phù hợp với họ đẹp mặt và giá cả hợp lý Vì thế phải có các chức năng sau:

- Hiển thị danh sách thông tin các đồ handmade để người dùng nắm rõ

- Sau khi người dùng tìm kiếm thì xuất ra cho họ giá cả

Thứ hai: Phần dành cho người quản trị:

Người làm chủ trang web, có quyền kiểm soát mọi hoạt động của hệ thống Người này tiếp nhận đóng góp ý kiến của người dùng và phát triển trang web liên tục

- Chức năng cập nhật, sửa, xóa các thông tin, nhà cung ứng dịch vụ Đòi hỏi sự chính xác tuyệt đối

- Tiếp nhận những đóng góp của người dùng , kiểm tra đóng góp và cập nhật

Kèm theo đó là thiết kế trang web hoàn toàn dễ sử dụng đối với người dùng, đáp ứng đúng nhu cầu của người dùng Điều quan trọng là phải đảm bảo thông tin chuẩn xác trong quá trình sử dụng của người dùng, tạo sự yên tâm với người dùng khi sử dụng trang web Đồng thời trang web phải luôn đổi mới, hấp dẫn

Chương 5 Chức năng:

- Đăng nhập và Đăng ký

- Hiển thị thông tin các sản phẩm

- Hiển thị tìm kiếm sản phẩm

- Hiển thị gợi ý những loại hàng và mức giá

- Cho phép khách hàng gửi ý kiến phản hồi, góp ý

1 Phân bổ thời gian thực hiện:

Từ 22/03/2021 đến 04/04/2021 Tìm hiểu đề tài, phân tích thiết kế hệ thống

Từ 05/04/2021 đến 08/04/2021 Tìm hiểu công cụ hỗ trợ thiết kế và xây dựng Website

Từ 09/04/2021 đến 12/05/2021 Thiết kế và xây dựng Website

Từ 12/05/2021 đến 23/05/2021 Hoàn thiện mã nguồn của Website

Từ 24/05/2021 đến 30/05/2021 Hoàn thiện báo cáo, Slide và nộp lên hệ thống

Bảng 1 Phân bổ thời gian

2 Hạn chế:

- Trong quá trình thực hiện đề tại, không tránh khỏi những thiếu sót do yếu

tố chủ quan và khách quan

+ Chưa có kết nối database để lưu trữ và trích xuất dữ liệu nhanh

chóng, tiện lợi + Tốc độ tải trang chưa được tối ưu đến mức tốt nhất

3 Các ngôn ngữ lập trình được sử dụng:

- JavaScript là ngôn ngữ lập trình

- HTML cung cấp cấu trúc nội dung

- CSS tạo kiểu cho sự xuất hiện của nội dung

- Bootstrap và Jquery hỗ trợ thiết kế Website nhanh chóng

Chương 6 Phân tích và thiết kế hệ thống

Chương 7 Phân tích hệ thống

Qua quá trình phân tích dự án và xây dựng hướng phát triển cho hệ thống mới chúng em đã tạo dựng một hệ thống bao gồm:

- Trang thông tin sản phẩm

- Quản lý sản phẩm: tên sản phẩm, đơn giá

Chương 8 Thiết kế hệ thống:

Chương 9 Sơ đồ khối quản lý Thông Tin:

Hình 1 - Sơ đồ khối quản lý Thông Tin

Chương 10 Sơ đồ khối chức năng Tìm kiếm:

Chọn đối tượng cần tìm kiếm

Kết quả tìm kiếm

CSDL

hình 3-Sơ đồ khối chức năng Tìm Kiếm

Chương 11 Sơ đồ khối chức năng Phản Hồi – Liên Hệ:

Hình 2 - Sơ đồ khối chức năng Phản Hồi - Liên Hệ

Chương 12 Triển khai xây dựng

I Danh sách thư mục cài đặt:

Hình 3 - Thư mục cài đặt

- image: chứa file ảnh của toàn bộ Website

- Các trang thành phần của Website bao gồm cả Index

- Trong từng thư mục có:

+ File CSS của trang

+ File HTML của trang

II Cấu trúc của Website

- Nội dung của trang được chia thành các thành phần: Header, Banner, Content và Footer

Hình 4 - Header

2 Banner:

Hình 5 – Banner

3 Footer:

Hình 6 - Footer

4 Các trang Website thành phần:

- Trang chủ

- Contact

- Search

a) Trang chủ:

Hình 7 - Trang chủ

Hình 8 - Contact

c, Search:

Chương 13 Kết luận và phương hướng phát triển

I Kết quả:

1 Đối với người dùng, trang Web đã mang lại được:

- Toàn bộ thông tin mà người dùng cần tìm kiếm mang tính xác thực cực kì cao

- Xem chi tiết toàn bộ thông tin về sản phẩm

- Cho phép người dùng góp ý và được phản hồi trực tiếp từ quản trị viên

- Xem toàn bộ những sản phẩm cần đến

- Trang web đơn giản dễ sử dụng đối với hầu hết người dùng

- Có thể dùng được trên mọi thiết bị công nghệ hiện nay

2 Đối với người quản trị, trang Web đã đưa ra được:

- Tiếp nhận và phản hồi ý kiến người dùng dễ dàng

- Chức năng cập nhật dữ liệu có mặt trực tiếp trên trang web

- Có thể làm việc trên nhiều loại thiết bị

- Dễ dàng kiểm soát hoạt động toàn bộ hệ thống

II Phương hướng phát triển:

1 Mục tiêu:

- Với tư tưởng tất cả vì sự tiện ích và nhanh chóng tiếp cận sản phẩm handmade của người dùng nên Website sẽ liên tục cập nhật những thông tin mới nhất với độ xác thực cao để mang lại sự yên tâm với người dùng khi sử dụng trang web Khắc phục lỗi tức thời khi phát hiện để mang lại sự nhanh chóng, thuận tiện khi người dùng sử dụng Không ngừng cố gắng phát triển hình ảnh Website để tạo hình ảnh tốt đẹp trong mắt người dùng

- Không những phát triển trên các trình duyệt, chúng tôi còn muốn thuận tiện hơn cho người dùng bằng cách đưa Website thành một ứng dụng trên các thiết bị công nghệ

Do vậy, trong thời gian sau này sẽ bổ sung các chức năng:

- Giỏ hàng để người dùng thêm hàng vào giỏ trước khi mua

- Tạo tài khoản và đăng bán những sản phẩm mà khách hàng muốn

- Phát triển lên nhiều nền tảng khác nhau trên các thiết bị công nghệ

- Liên hệ trực tiệp với những bác sĩ, chuyên gia tư vấn y tế để được hỗ trợ trực tiếp

2 Tính khả thi:

- Chi phí vừa phải, không tốn chi phí quá cao

- Giao diện dễ sử dụng và phù hợp với mọi người sử dụng

3 Thị trường:

- Chúng tôi nhắm đến hầu như tất cả mọi ngời trong và ngoài nước,khi tìm kiếm thực phẩm dựa trên tình trạng hiện tại của cơ thể để đáp ứng nhu cầu

sử dụng của người dùng

4 Đối thủ cạnh tranh:

- Hiện tại có rất ít Website tương tự , nên việc canh tranh là cũng nhẹ nhàng

5 Chiến lược cạnh tranh:

- Cố gắng đẩy mạnh thêm ưu điểm của Website, nâng cao tính chính xác cho từng thông tin mang lại cho người dùng

- Cố gắng khắc phục sớm nhất có thể những khuyết điểm của Website nếu có

- Cập nhật thông tin và phản hồi góp ý người dùng sớm nhất có thể

- Cố gắng phát triển lên nhiều nền tảng khác nhau để người dùng sử dụng nhanh chóng

6 Phát triển và bổ sung:

- Bổ sung cơ sở dữ liệu lưu trữ thêm thông tin, có thể trích xuất và tìm kiếm, chỉnh sửa thông tin nhanh chóng, tiện dụng Bổ sung thêm thanh tìm kiếm nhanh

- Hiếm ít một website nào phát triển mạnh mẽ mà không có sự đóng góp to lớn từ khách hàng Vì vậy, nếu website phát triển ổn định và tính đến vấn

đề dài lâu, việc chuyển hướng và phát triển website lên thành một cộng đồng là điều thiết yếu Một số chức năng bổ sung:

+ Cho phép đăng nhập, đăng ký tài khoản để mọi người có thể trao đổi, hỏi đáp, thảo luận cùng nhau

+ Cho phép bình luận, chia sẻ dưới các bài đăng

7 Hệ thống đối tác:

- Liên hệ hợp tác với nhiều bác sĩ để người dùng có thể liên hệ trực tiếp để được nghe tư vấn

- Đưa thêm nhiều địa điểm mua thuốc chính thức uy tín

- Liên kết với nhiều điểm bán đồ handmade uy tín nhất

8 Chính sách đầu tư:

- Đang tìm hiểu và tìm kiếm nhà đầu tư nếu chiến lược dự án thành công

Tổng kết

Có thể nói rằng, sản phẩm đồ handmade đối với nhiều người nó không đơn giản

là một món đồ bình thường mà là một món đồ tuy đơn giản, tuy làm thủ công nhưng lại có sức hút, sức hấp dẫn không thể chối từ Ngày nay, khi mà mạng xã hội và Internet ngày càng phát triển thì bạn có thể dễ dàng thấy rằng, chỉ cần gõ cụm từ "Đồ handmade" thì hàng trăm nghìn kết quả phù hợp được Google gợi ý Cùng với đó, sự phát triển của mạng xã hội đã giúp đồ handmade đến gần hơn với khách hàng.Sự thành công của Website là nhờ một phần đóng góp rất lớn của tất

cả người dùng Chúng tôi sẽ cố gắng tiếp thu ý kiến của người dùng để có thể đáp ứng đủ nhu cầu của đại đa số người dùng khi đến với chúng tôi Với những khó khan bước đầu sẽ không tránh khỏi nhưng chúng tôi sẽ không nản lòng Với tư tưởng " vì sự tiện ích và nhanh chóng cho khách hàng" chúng tôi hi vọng rằng thời gian không xa nữa sẽ có nhiều người đến và giúp chúng tôi cùng phát triển Website vì cộng đồng mọi người này

Xin chân thành cảm ơn tất cả

Tài Liệu Tham Khảo

1 Thư viện CSS và Bootstrap: https://getbootstrap.com/

https://w3school.com/

2 Thư viện js: https://fancyapps.com/fancybox/

3 Thư viện CSS: https://animate.style/

Phụ Lục