Từ những phần mềm quản lý giúp cho công việc bán hàng của cửa hàng trở nên nhanh chóng và dễ dàng, ngày nay công nghệ thông tin đã phát triển mạnh mẽ hơn nữa, Website ra đời không chỉ đá
Trang 1ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
ĐỒ ÁN CƠ SỞ 1
ĐỀ TÀI:
Showroom Trưng bày sản phẩm tạo kiểu và chăm
sóc tóc nam The Family
Sinh viên thực hiện : NGUYỄN XUÂN THỊNH (19IT5)
DƯƠNG VĂN LỘC (19IT4)
Giảng viên hướng dẫn : THS HÀ THỊ MINH PHƯƠNG
Đà nẵng, tháng 8 năm 2020
Trang 2ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
ĐỒ ÁN CƠ SỞ 1
Ngày nay, cùng với sự phát triển của đất nước ngành Công nghệ thông tin
đã có những bước phát triển mạnh mẽ không ngừng và tin học đã trở thành chiếc chìa khóa dẫn đến thành công cho nhiều cá nhân trong nhiều lĩnh vực, hoạt động Với những ứng dụng của mình, ngành Công nghệ thông tin đã góp phần mang lại nhiều lợi ích mà không ai có thể phủ nhận được Đặc biệt là trong lĩnh vực quản lý kinh tế, tin học đã góp phần tạo ra sự thay đổi nhanh chóng cho bộ mặt xã hội Nhất là khi việc tin học hóa vào công tác quản lý, bán hàng là một trong những yêu cầu cần thiết đối với các doanh nghiệp hiện nay.
Từ những phần mềm quản lý giúp cho công việc bán hàng của cửa hàng trở nên nhanh chóng và dễ dàng, ngày nay công nghệ thông tin đã phát triển mạnh mẽ hơn nữa, Website ra đời không chỉ đáp ứng cho các khách hàng đến trực tiếp cửa hàng mua sản phẩm mà nó còn phục vụ cho những khách hàng ở xa Không những thế, việc giới thiệu, quảng bá hình ảnh về cửa hàng, công ty được mở rộng trên quy mô lớn giúp cho việc kinh doanh, buôn bán, trao đổi tin tức thuận lợi hơn rất nhiều, mang lại hiệu quả kinh tế cao hơn và tạo uy tín trong lòng khách hàng.
Chính vì lợi ích mà Website mang lại mà các cửa hàng, công ty đã áp dụng
nó để phát triển công việc kinh doanh và giới thiệu cửa hàng của mình Trong số đó, làm đẹp cho nam giới cũng là một ngành sử dụng nhiều đến Website Do vậy, nhóm em lựa chọn đề tài thiết kế Website trưng bày các sản phẩm tạo kiểu và chăm sóc tóc cho nam giới nhằm đưa đến cho khách hàng thông tin chính xác và những chia sẻ thực tế về sản phẩm giúp nam giới tự tin hơn về vẻ ngoài của mình
Đà Nẵng, tháng 8 năm 2020
Trang 3MỞ ĐẦU 1.1 Tên đề tài.
Showroom Trưng bày sản phẩm tạo kiểu và chăm sóc tóc nam The Family
1.2 Lý do chọn đề tài.
Trong cuộc sống hiện đại ngày nay việc chăm chút ngoại hình nói chung và tạo phong cách nói riêng là một điều cần thiết Không chỉ riêng chị em mới
có quyền làm đẹp, cánh mày râu cũng phải xuất hiện thật ấn tượng, chỉn chu trong mọi tình huống Và mái tóc quyết định rất lớn về ngoại hình của cánh mày râu
1.3 Hướng tiếp cận của đề tài
Đề tài hướng đến tiệm baber cut có quy mô vừa
1.4 Ưu điểm của đề tài
- Giao diện thân thiện dễ sử dụng
- Tìm kiếm thông tin sản phẩm, thông tin nhà cung cấp nhanh chóng dễ dàng
- Cập nhật xu hướng mới nhất đến người dùng
Nhược điểm
- Tốc độ xử lý còn chậm
1.5 Ý nghĩa và lý luận thực tế của đề tài
- Giúp nhóm em hiểu rõ về quy trình và nghiệp vụ gian hàng trực tuyến
- Tiếp cận và làm quen với các yêu cầu thực tế của cửa hàng cho một website bán hàng.
- Ứng dụng đề tài vào quá trình giới thiệu sản phẩm cho các cửa hàng vừa
- Nâng cấp Website để phục vụ các yêu cầu trong quá trình bán hàng của cửa hàng.
1.6 Cấu trúc của báo cáo
- Trang bìa.
- Lời mở đầu.
- Lời cảm ơn.
- Nhận xét của giáo viên hướng dẫn.
- Mục lục.
- Danh mục các bảng.
- Danh mục hình
Phần I : Mở đầu
1.1 Tên đề tài.
1.2 Lý do chọn đề tài.
Trang 41.3 Hướng tiếp cận của đề tài.
1.4 Ưu khuyết điểm của đề tài.
1.5 Ý nghĩa lý luận và ý nghĩa thực tiễn của đề tài.
1.6 Cấu trúc của báo cáo.
Phần II : Nội Dung
Chương I : Nội Dung
Chương II : Nghiên cứu tổng quan
Chương III : Phân tích thiết kế hệ thống
Phần III : Thực nghiệm , đánh giá kết quả và hướng phát triển
Chương IV : Triển khai xây dựng
Phần IV : Kết luận
Chương V :Kết luận và hướng phát triển
LỜI CẢM ƠN
Chúng em xin chân thành cảm ơn các thầy các cô trong khoa Công nghệ thông tin
đã trang bị những kiến thức quý báu cho chúng em trong suốt quá trình học tập và làm đề tài tại Khoa Công Nghệ Thông Tin Và Truyền Thông Đại Học Đà Nẵng Nhờ công lao giảng dạy, chỉ bảo tận tình của các thầy các cô mà nhóm em đã có được những kiến thức chuyên ngành về công nghệ thông tin để thực hiện Đồ Án
Cơ Sở 1 này
Đặc biệt, chúng em xin chân thành cảm ơn Cô Hà Thị Minh Phương đã tận tình
hướng dẫn, chỉ bảo, đưa ra những đóng góp ý kiến rất hữu ích và quý báu cho chúng em trong suốt quá trình thực hiện đề tài này
Chúng em xin gửi lời cám ơn đến gia đình, bạn bè đã động viên, chia sẻ và cung cấp các tài liệu hữu ích cho nhóm
Mặc dù đã cố gắng nỗ lực thực hiện đề tài với quyết tâm cao nhưng chắc hẳn đề tài không thể tránh khỏi những thiếu sót Nhóm em rất mong nhận được những ý kiến đóng góp ý kiến của thầy cô và các bạn để đề tài của chúng em ngày càng hoàn thiện và hướng tới áp dụng thực tế hơn
Nhóm em xin chân thành cảm ơn!
Đà Nẵng ,tháng 08 năm 2020
Nhóm sinh viên thực hiện Nguyễn Xuân Thịnh Dương Văn lộc
Trang 5NHẬN XÉT (Của giảng viên hướng dẫn)
Trang 6
MỤC LỤC
Trang
MỞ ĐẦU 1
Phần 1 Giới thiệu 2
1.1 Tên đề tài 2
1.2 Lý do chọn đề tài 2
1.3 Hướng tiếp cận của đề tài 2
1.4 Ưu điểm của đề tài 2
1.5 Ý nghĩa và lý luận thực tế của đề tài 2
1.6 Cấu trúc của báo cáo 2
Chương 1 Cơ sở lý thuyết 7
1.1 Công cụ 7
1.2 Ngôn ngữ 7
Chương 2 Phân tích thiết website 9
2.1 Yêu cầu 9
2.1.1 Yêu cầu chức năng 9
2.1.2 Yêu cầu phi chức năng 9
2.2.1 Interface 9
2.2.2 Login 10
2.2.3 Các sản phẩm 10
Chương 3 The Family – website trưng bày giới thiệu sản phẩm tạo kiểu và chăm sóc tóc nam 10
3.1 Giao diện 10
Chương 4 Kết luận 14
1 Kết quả đạt được 14
2 Hướng phát triển 15
TÀI LIỆU THAM KHẢO 15
DANH MỤC HÌNH Trang Hình 3.1 – Trang chủ The Family 10
Hình 3.2 – Trang chủ The Family 10
Hình 3.3 – Trang chủ The Family 11
Hình 3.4 – Trang chủ The Family 11
Hình 3.5 – Trang sản phẩm 12
Hình 3.6 – Trang thông tin chi tiết sản phẩm 12
Hình 3.7 – Trang đánh giá sản phẩm 13
Hình 3.8 – Form đăng nhập 13
Trang 7Hình 1.3 - Html
CHƯƠNG 1 CƠ SỞ LÝ THUYẾT
1.1 Công cụ
Ngày nay có rất nhiều công cụ hỗ trợ cho việc lập trình, thiết kế website.
Và trong đồ án HT-Phone này, em sẽ sử sụng các công cụ sau:
+ Visual Studio Code là phiên bản mới nhất của chương trình soạn thảo văn bản được sử dụng nhiều bởi web developers, coders, và
programmers Nó sẵn có cho Mac, Windows, Linux và cho phép tải về
và sử dụng miễn phí.
Việc lựa chọn một môi trường lập trình thích hợp cũng góp phần vào thành công của việc xây dựng website phục vụ cho đồ án này.
Hình 1.1 – Visual Studio Code
1.2 Ngôn ngữ
Đồ án này chủ yếu chú trọng về phần giao diện (Front end) nên em
đã sử dụng các ngôn ngữ thiết kế web cở bản sau:
- HTML (HyperText Markup Language): là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các thành phần cơ bản (như tiêu đề, đoạn văn, hình ảnh, video, button, input box, audio, ) của website.
ngôn ngữ mô tả style (phong cách) hiển thị của các đối tượng HTML Chẳng hạn như: vị trí hiển thị, màu
Trang 8Hình 1.6 - Bootstrap
sắc, kích thước, vị trí CSS giúp chúng ta tránh phải sử dụng các rắc rối của HTML, dễ dàng định nghĩa style cho các thẻ cũng như dễ quản lý.
- Javascript: là một ngôn ngữ lập trình có thể chạy được trên trình duyệt giúp xây dựng các chức năng tương tác với người dùng như các hiệu ứng chuyển, animation, các sự kiện click chuột, kéo thả chuột,
Hình 1.5 - Javascript
- Bootstrap: là một CSS Framework mã nguồn mở giúp chúng ta có thể CSS nhanh chóng cho các đối tượng HTML Nó giúp chúng ta đơn giản & dễ dàng hơn trong thiết kế giao diện và hỗ trợ responsive Đây là một trong những CSS Framework phổ biến nhất hiện nay.
- jQuery: là một thư viện của Javascript được xây dựng giúp việc xây dựng các chức năng trên website sử dụng javascript trở nên đơn giản
và thuận tiện hơn rất nhiều.
Hình 1.4 - CSS
Trang 9Hình 1.7 - jQuery Với nhũng ngôn ngữ này,chúng em đã hoàn toàn có thể xây dựng
website này
CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ WEBSTE
2.1 Yêu cầu
1.1.1 Yêu cầu chức năng
- Người dùng có thể đăng nhập và đăng ký với trang web.
- Người dùng được phép tìm kiếm thông tin sản phẩm theo những tiêu chí khác nhau.
- Liệt kê những sản phẩm hot nhất hiện nay.
- Hiển thị đầy đủ thông tin chi tiết từng sản phẩm.
- Hiển thị thông tin liên hệ để người dùng có thể phản hồi khi có thắc mắc.
1.1.2 Yêu cầu phi chức năng
- Tính tiện dụng: Giao diện thân thiện, dễ sử dụng đối với những người dùng mới.
- Tính tương thích: Tương thích với hầu hết các trình duyệt web.
2.2 Các bước thiết kế
1.1.3 Interface:
Thiết kế giao diện phù hợp và đầy dủ các chức năng như yêu cầu đặt ra.
- Trang chủ: Navbar, Chia sản phẩm theo từng loại
- Trang thông tin chi tiết sản phẩm: Liệt kê toàn bộ thông tin sản phẩm như giá cả, thành phần, thời gian sản xuất ,nguồn gốc
- Trang hỗ trợ khách hàng: Phản hồi của khách hàng và câu hỏi cần mà khách hàng cần tư vấn, liên hệ trực tiếp với chủ website.
2.2.2 Login
Người dùng đăng ký và đăng nhập thông tin
Trang 101 Người dùng chọn đăng nhập.
1.1.4 Các sản phẩm
Chọn vào sản phẩm để xem thông tin chi tiết:
- Tên sản phẩm.
- Hình ảnh của sản phẩm.
- Giá của sản phẩm.
- Bình luận, đánh giá.
- Thông tin chi tiết của sản phẩm.
- Đánh giá sản phẩm.
CHƯƠNG 3 The Family – website trưng bày giới thiệu sản phẩm tạo kiểu và chăm sóc tóc nam
Sau đây là những phần mà nhóm chúng em đã hoàn thành trong bài báo cáo này (còn có rất nhiều ý tưởng, dự định chưa thể thực hiện được do khả năng, hy vọng rằng có thể hoàn thiện hơn trong thời gian tới):
3.1 Giao diện
Giao diện được xây dựng khá hoàn chỉnh, tương ứng với từng đối tượng người dùng có thanh menu riêng, chứa các khả năng có thể thực hiện.
Trang 11Hình 3.1 - Trang chủ The Family
Hình 3.2 - Trang chủ The Family
Trang 12Hình 3.3 - Trang chủ The Family
Hình 3.4 - Trang chủ The Family
Trang 13Hình 3.5 - Trang sản phẩm
Hình 3.6 - Trang thông tin chi tiết sản phẩm.
Trang 14Hình 3.7 - Trang đánh giá sản phẩm
- Đăng nhập vào tài khoản (có hỗ trợ chức năng tìm kiếm mật khẩu khi quên mật khẩu).
Hình 3.9 - Form đăng nhập
Chương 4 KẾT LUẬN
1 Kết quả đạt được
Xây dựng một website giới thiệu sản phẩm sử dụng công nghệ lập trình mới, hiện đại có nhiều sự thú vị và hấp dẫn và cũng có nhiều thách thức đối với chúng em Thứ nhất, mặc dù thương mại điện tử không còn mới lạ nữa nhưng đối với chúng em thời gian được tiếp cận nó rất ít Thứ hai, đây là lần đầu tiên chúng em thật sự tiếp xúc làm việc với các ngôn ngữ web để
Trang 15xây dựng website Do đó, quá trình thực hiện đồ án gặp khá nhiều khó khăn, mất nhiều thời gian để có thể hiểu nắm được cách làm việc với nó, có những lúc tưởng như không thể hoàn thành kịp tiến độ, vẫn có một vài chỗ chưa hoàn thành kịp cho báo cáo này Ngoài ra, để xây dựng một trang web thành công thì giao diện cũng là một yếu tố rất quan trọng bậc nhất, nó phải
là sự kết hợp hài hòa giữa sự hấp dẫn, lôi cuốn người dùng với sự đơn giản, thân thiện, dễ sử dụng Về mặt này thì nhóm chúng em thật sự không có năng khiếu về thẫm mỹ nên giao diện khá đơn giản.
Qua quá trình thực hiện đồ án này, em cũng đã học hỏi, có được nhiều kiến thức hay hơn Về mặt lý thuyết, em đã nắm rõ hơn và sâu hơn kiến thức về lập trình website và phương pháp tạo ra một trang web hoàn chỉnh, nắm rõ hơn về các ngôn ngữ web đề từ đó em có thể vận dụng tốt hơn cho tương lai, công việc sau này Cũng qua thời gian làm đồ án này, em cũng đã
có những trải nghiệm chân thật nhất có thể là nghề nghiệp sau này của bản thân.
2 Hướng phát triển
Em sẽ cố gắng có thể để phát triển và khắc phục đề tài này theo các hướng sau:.
- Liên kết với hệ cơ sở dữ liệu.
- Liên kết với các đối tác là baber shop
- Đưa vào triển khai ứng dụng trên thực tế
TÀI LIỆU THAM KHẢO
1 Head First HTML and CSS: A Learner's Guide to Creating Standards-Based Web Pages.
2 Learn Bootstrap 4 by Freetuts.
3 Javascript: The Good Parts.