ĐẠI HỌC ĐÀ NẴNGKHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

ĐỒ ÁN CƠ SỞ 1ĐỀ TÀI: Website ẩm thực

Sinh viên thực hiện : VÕ TRẦN QUỐC ANH Lớp : 19IT1Giảng viên hướng dẫn : ThS. Nguyễn Văn Bình

Đà nẵng, tháng 7 năm 2020

ĐẠI HỌC ĐÀ NẴNGKHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

ĐỒ ÁN CƠ SỞ 1

ĐỀ TÀI: Website bán nội thất

Đà Nẵng, tháng 7 năm 2020

MỞ ĐẦU

Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa được xem là một

trong những yếu tố mang tính quyết định trong hoạt động của các chính phủ, tổ chức,

cũng như các công ty, nó đóng vai trò hết sức quan trọng, có thể tạo ra những bước đột

phá mạnh.

Cùng với sự phát triển không ngừng về kỹ thuật máy tính và mạng điện tử,

công nghệ thông tin cũng có được những bước phát triển vượt bậc. Mạng Internet là

một trong những sản phẩm có giá trị hết sức to lớn, đã và đang trở thành một công cụ

không thể thiếu, là nền tảng chính cho sự truyền tải, trao đổi thông tin trên toàn cầu.

Giờ đây, mọi việc liên quan đến thông tin trở nên thật dễ dàng cho người sử

dụng; chỉ cần có một máy tính kết nối internet và một dòng tìm kiếm trên Internet thì

gần như lập tức... cả thế giới về vấn đề mà bạn đang quan tâm sẽ hiện ra, có đầy đủ

thông tin, hình ảnh và âm thanh.

Trong cuộc sống hằng ngày, việc trang trí nội, làm đẹp cho ngôi nhà của mình

thật là đẹp là một điều ai cũng quan tâm

Vì vậy, chúng tôi đã thực hiện đồ án “XÂY DỰNG WEBSITE BÁN NỘI

THẤT”. Khách hàng có thể xem các mặt hàng đồ gỗ được chọn lọc thật kĩ lưỡng .

Khách hàng còn có thể tham khảo thông tin về một số nhà hàng thông qua website.

Với sự hướng dẫn tận tình của thầy Nguyễn Văn Bình đã giúp em hoàn thành

báo cáo đề tài này. Tuy đã cố gắng hết sức tìm hiểu, phân tích thiết kế và cài đặt hệ

thống nhưng chắc rằng không tránh khỏi những thiếu sót. Em rất mong nhận được sự

thông cảm và góp ý của quý thầy cô. Em xin chân thành cảm ơn.

SV thực hiện: Võ Trần Quốc Anh / Mã SV: 19IT002

LỜI CẢM ƠN

Để hoàn thành chuyên đề báo cáo học phần đồ án cơ sở 1 này trước tiên em xin

gửi lời cảm ơn đến các thầy cô giáo KHOA CÔNG NGHỆ THÔNG TIN VÀ

TRUYỀN THÔNG.

Đặc biệt cảm ơn thầy giáo Nguyễn Văn Bình , người đã tận tình hướng dẫn và

giúp đỡ nhóm em trong suốt quá trình thực hiện đồ án này để nhóm em hoàn thành bài

báo cáo một cách tốt nhất.

Tuy nhiên đây là lần đầu tiên chúng em được tiếp xúc, tìm hiểu về bài báo cáo

học phần đồ án cơ sở 1 này cùng với trình độ kiến thức và kinh nghiệm còn hạn chế

nên chúng em không thể tránh khỏi những sai sót. Chúng em rất mong nhận được

những nhận xét, đánh giá, đóng góp ý kiến từ thầy cô để rút ra kinh nghiệm từ bài báo

cáo học phần này và chuẩn bị tốt hơn cho những bài báo cáo học phần sau.

NHẬN XÉT

………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….………………………………..………………………………………………………….

NHẬN XÉT(Của giảng viên hướng dẫn)

................................................................................................................................……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………

Mục lục

Chương 1 Ý tưởng thiết kế website …………………………………………….11.1 TỔNG QUAN.........................................................................................................11.2 MỘT SỐ YÊU CẦU CỦA WEBSITE..........................................................................11.3 XÁC ĐỊNH ĐỐI TƯỢNG NGƯỜI DÙNG....................................................................11.4 PHÂN TÍCH MỘT SỐ WEBSITE BÁN HÀNG....................................................1,2,3,41.5 NHỮNG KHÓ KHĂN CỦA NGƯỜI SỬ DỤNG............................................................4

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG.......................................52.1 Ý TƯỞNG WEBSITE...............................................................................................52.2 MÔ HÌNH THIẾT KẾ HỆ THỐNG.............................................................................52.3 CHỨC NĂNG........................................................................................................62.4 THIẾT KẾ CHI TIẾT.........................................................................................6,7,8

CHƯƠNG 3 TRIỂN KHAI XÂY DỰNG..........................................................93.1 TRANG CHỦ:...............................................................................................9,10,113.2 TRANG SẢN PHẨM:.......................................................................................11,123.3 TRANG BÁN HÀNG:............................................................................................123.4 TRANG LIÊN HỆ:............................................................................................12,133.5 TRANG CHI TIẾT............................................................................................13,14

DANH MỤC BẢNG

Bảng 1 Mô hình thiết kế hệ thống...................................................................................5

DANH MỤC HÌNH ẢNH

Hình 1. 1 Giao diện trang chủ website Designhunter......................................................2Hình 1. 2 Giao diện chức năng website Designhunter....................................................2Hình 1. 3 Giao diện trang chủ website Designhunter......................................................3Hình 1. 4 Giao diện chức năng website Designhunter....................................................4

Hình 3. 1 Trang chủ website...........................................................................................8Hình 3. 2 Trang chủ website...........................................................................................8Hình 3. 3 Trang chủ website...........................................................................................9Hình 3. 4 Trang chủ website...........................................................................................9Hình 3. 5 Footer trang chủ............................................................................................10Hình 3. 6 Trang giới thiệu.............................................................................................10Hình 3. 7 Trang giới thiệu.............................................................................................11Hình 3. 8 Trang danh sách sản phẩm............................................................................11Hình 3. 9 Trang liên hệ..................................................................................................12Hình 3. 10 Trang liên hệ................................................................................................12Hình 3. 11 Trang hiển thị sự kiện..................................................................................13Hình 3. 12 Trang chi tiết...............................................................................................13Hình 3. 13 Trang chi tiết...............................................................................................13

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

STT Cụm từ Viết tắt1 Thương mại điện tử TMDT2 Công nghệ thông tin CNTT

Chương 1 Ý tưởng thiết kế website

1.1 Tổng quanHiện nay, sự phát triển nhanh chóng của CNTT đã và đang thay đổi cách con

người tiếp cân với thông tin. Thay vì sử dụng những phương tiện truyền thống để nắm

bắt thông tin như báo giấy, tạp chí,... con người đang dần chuyển sang dùng những

phương tiện hiện đại như internet, truyền hình,... Chính vì thế, việc xây dựng một

website để cung cấp thông tin cho người sử dụng mọi lúc, mọi nơi, là một việc cần

thiết.Chính vì thế thiết kế nội thất giữ vai trò quan trọng trong việc cải thiện tâm trạng,

sức khỏe và tinh thần làm việc của mỗi chúng ta.. Nắm bắt được nhu cầu đó, nhóm

chúng em đã có ý tưởng thiết kế một website ẩm thực để cung cấp thông tin cho người

sử dụng.

1.2 Một số yêu cầu của websitePhải có giao diện đẹp, dễ nhìn, tập trung vào nội dung cần truyền tải, không quá

cầu kỳ. Dễ sử dụng, sắp xếp và liên kết các trang thành phần một cách logic, rành

mạch. Ngôn ngữ trang web phải thuần Việt, dễ hiểu, cách viết phải rõ ràng, cách trình

bày đẹp. Nội dung truyền tải phải phù hợp, chính xác, lựa chọn những món ăn gần gũi,

không quá cầu kỳ. Trang web có phần giao diện liên hệ, bình luận bài viết để người sư

dụng có thể liên hệ, góp ý cho website. Trang web có giao diện cho người quản trị

website.

1.3 Xác định đối tượng người dùngWebsite của chúng em hướng tới đối tượng người dùng là phần đông những

người dùng phổ thông muốn tiếp cận với những công thức nấu ăn hoặc tìm hiểu về nội

thất của các nơi sản xuất và cung cấp cho người dùng.

1.4 Phân tích một số website ẩm thựcWebsite Furniture: http://www.designhunter.co.uk

1

Hình 1.1 Giao diện trang chủ website DesignHunter

Về giao diện: Trang Delish có giao diện đẹp, tối ưu tốt. Website cung cấp rất

nhiều các sản phẩm đẹp. Bên cạnh đó, website còn cung cấp nhiều tin tức như các sản

phẩm mới, các đồ dùng và đồ trang trí nhà bếp, xu hướng ẩm thực, đầu bếp, các thông

tin bên lề của các cuộc triển lãm ... Hơn nữa, website còn đăng tải một số mặt hàng

được bày bán trên một số trang TMDT như amazon để người dùng có thể đặt hàng

hoặc đặt trước sản phẩm.

Hình 1.2 Giao diện chức năng website Delish

2

Về chức năng: Người dùng có thể đăng nhập hoặc để lại email để nhận thông

báo từ Delish. Delish không có nhiều tính năng cho người dùng, không có đánh giá và

bình luận cho bài viết, website chỉ có một vài khảo sát sau bài viết về ẩm thực.

Về nhược điểm: Vì Delish chuyên về website đưa tin tức nên chứa ít công thức

nấu ăn. Website có giao diện đơn giản, ít tính năng cho người dùng. Những công thức

nấu ăn trên website còn quá cầu kỳ, các món ăn còn chưa gần gũi với phần đông người

dùng.

1.5 Những khó khăn của người sử dụng

Qua tham khảo một số website bán nội thất hàng đầu của Việt Nam và quốc tế,

chúng tôi nhận ra một số khó khăn của người dùng khi tìm sản phẩm và không hình

dung được kích cỡ cho vừa vặn với ngôi nhà của mình (nơi muốn đặt).

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

2.1 Ý tưởng website

Website được tạo ra nhằm giúp mọi người làm cho không gian sống của mình

trở nên ấn tượng, đẹp đẽ hơn mà còn ảnh hưởng trực tiếp đến sức khỏe, tinh thần (tâm

trạng, tình cảm) của những người sống trong nhà.Có thể là nơi bạn thấy thật sự thoải

mái nhất sau những giờ làm việc mệt mỏi.

2.2 Mô hình thiết kế hệ thống

Thành phần Yêu cầu thông tin

Xây dựng Trang chủ

Giới thiệu những sản phẩm, đẹp mắt, ấn tượng nhất. Làm cho người xem cảm nhận được sự tươi sáng, tràn đầy năng lượng phong cách thiết kế. Xây dựng các liên kết đến các trang thông tin khác của website.

Trang AboutGiới thiệu các sản phẩm, các của hàng nổi tiếng gần người dùng nhất, được thực khách đánh giá cao, kèm các thông tin cơ bản.

3

Trang sản phẩmGiới thiệu các sản phẩm theo từng phòng, như là: phòng khách,phòng ăn,phòng ngủ….Sản phẩm sẽ được chia ra phù hợp theo từng phòng mà bạn chọn.

Trang chi tiếtCung cấp các thông tin chi tiết về các sản phẩm, sản phẩm được làm từ vật liệu gì, được bán ở đâu, cửa hàng nào gần bạn nhất.

Trang liên hệCung cấp các thông tin cơ bản về website như: địa chỉ email, số điện thoại, địa chỉ, bản đồ,… Có thể gửi thông tin phản hồi trực tiếp từ website đến email.

Bảng 1 Mô hình thiết kế hệ thống

2.3 Chức Năng

2.3.1 Đối với khách hàngAi cũng đều mong muốn được sống và làm việc trong một không gian đẹp, điều này có tác động tích cực đến tâm lý cũng như là tư duy hành động của con người. Nhiều nghiên cứu khoa học cũng như những khảo sát tâm lý đã khẳng định tính đúng đắn và xác thực của điều này. Tại một văn phòng có cách bài trí bàn làm việc,tủ tài liệu thông minh, tiện dụng sẽ giúp nhân viên cảm thấy công việc được xử lý hiệu quả hơn. Cũng như trong chính căn nhà của bạn có thể giúp bạn giảm mệt mỏi. Đó cũng chính là mục tiêu mà Website của chúng tôi muốn hướng tới để giúp bạn.

2.3.2 Đối với người quản lý websiteĐể thông tin trên website được chính xác và những nội dung tương tác từ người

dùng là phù hợp, website có một đội ngũ những người quản lý. Những người quản lý

có thể thêm, sửa hoặc xóa nội dung trên website; kiểm duyệt những đánh giá và bình

luận của người dùng trước khi được đăng lên; nhận góp ý từ chủ của những nhà hàng

để điều chỉnh thông tin một cách hợp lý.

2.4 Thiết kế chi tiếtÐể tạo ra một Website có chất lượng đòi hỏi có sự nghiên cứu kỹ về Website,

phải biết những gì cần làm, những thông tin nào cần có trong website và để đưa tất cả

4

các ý tưởng đó vào việc xây dựng một trang web nhóm em đã làm theo những bước

sau đây:

Bước 1: Giai đoạn định hướng:

Mục đích cần đạt tới của website là bắt mắt và dễ dàng sử dụng đối với nhiều

đối tượng khách hàng.

Đối tượng cần nhắm tới: những người muốn trang trí cho tổ ấm của mình,

những người có đam mê với nội thất, đồ gia dụng.

Bước 2: Sau khi xác định được các điểm trên, tiếp theo:

Dự định các chức năng và chuẩn bị thông tin cho website. Lên ý tưởng về cấu

trúc của website, sắp xếp và lựa chọn các nhánh, các tiêu đề và các tiêu đề phụ để có

thể tìm kiếm thông tin hữu ích một cách dễ dàng, không lãng phí thời gian của người

sử dụng.

Chọn các từ khoá thích hợp để thuận tiện cho việc tìm kiếm và sử dụng các

dịch vụ tìm kiếm.

Bước 3:

Lựa chọn các hình ảnh đưa lên website từ các trang web nội thất khác nhau, từ

video quá trình chế tạo từ các nhà sản xuất,…

Chuyển đổi các hình ảnh đến vị trí thích hợp và có sự chỉnh sửa về màu sắc và

kích cỡ cho phù hợp.

Bước 4:

Sử dụng HTML(ngôn ngữ đánh dấu siêu văn bản) kết hợp với Bootstrap để

chia layout, tạo khung sườn cơ bản cho trang web. Sau đó thêm các thành phần chi tiết

vào website để để thỏa mãn yêu cầu về mặt thông tin. Tiếp theo, sử dụng JQuery,

JavaScript để tạo các hiệu ứng, bắt sự kiện trong website, giúp website hấp dẫn, tiện

lợi hơn đối với người sử dụng.

Bước 5:

Chúng ta cần lựa chọn nhà cung cấp dịch vụ Internet để đưa website lên

Internet: thiết lập tên miền, đăng kí tên website với các nhà tìm kiếm, quảng cáo và

5

khuyếch trương website đối với các khách hàng muc tiêu. Có thể thực hiện được điều

này thông qua các phương pháp truyền thống như gửi thư, truyền thanh, truyền hình

cũng như các biển hiệu quảng cáo hoặc các phương pháp hiện đại như thông qua các

trang mạng xã hội(facebook, twitter, zalo,..), các app ứng dụng trên điện thoại.

Một điều quan trọng là thông qua các công cụ tìm kiếm tiện ích như (Lycos,

AltaVista, Google...) để đảm bảo rằng website phải thật nổi bật. Ðây là việc tốn rất

nhiều thời gian

Triển khai xây dựng

2.5 Trang chủ:

Hình 3.1 Trang chủ website

Trang chủ với giao diện đơn giản, giúp người dùng dễ dàng nhìn thấy các thông tin cần thiết.

6

Hình 3.2 Trang chủ website

Hình 3.3 Trang chủ website

Trang chủ còn có thông tin về những sản phẩm nổi bật(top trending), để giúp người dùng có thể dễ chọn lựa.

7

Hình 3.4 Trang chủ website

Liên kết với phần mềm trên điện thoại giúp mọi người dễ dàng tìm kiếm các món ăn, nhà hàng mọi lúc mọi nơi.

Hình 3.5 Footer trang chủPhần footer: tóm tắt những nội dung quan trọng của trang web, giúp người

dùng chuyển đến những trang mong muốn.

2.6 Trang công ty:Bao gồm những thành phần sau:- Phần header:

8

Hình 3.6 Trang nhà hàng

- Phần thân:+ Danh sách các nhà thiết kế của công ty:

Hình 3.7 Trang nhà hàng

2.7 Trang món ăn:Giới thiệu cho người dùng những món ăn ngon, mang đậm nét ẩm thực Việt

Nam, đa dạng về thành phần, loại món, phong cách nấu ăn theo từng vùng miền.

9

Hình 3.8 Trang danh sách món ăn

2.8 Trang liên hệ:Cung cấp cho người dùng những thông tin liên hệ cần thiết đến người quản lý

website: số điện thoại, địa chỉ email, địa chỉ,… Và có thể gửi phản hồi trực tiếp từ website.

Hình 3.9 Phần liên hệ

2.9 Trang chi tiếtCung cấp cho người dùng thông tin về sản phẩm, ngày sự kiện sale sản phẩm,

… Thông tin về vật liệu, giá, nơi bán gần nhất….

10

Hình 3.10 Trang đếm ngày xảy ra sự kiện

Hình 3.11 Trang chi tiết

Hình 3.12 Trang chi tiết

11

DANH MỤC TÀI LIỆU THAM KHẢO

1. Tham khảo các món ăn, nhà hàng: http://www.designhunter.co.uk/

2. Tham khảo tài liệu thiết kế web tại: https://www.w3schools.com/

3. Tham khảo tài liệu Bootstrap tại: https://getbootstrap.com/

5. Tham khảo một số hình ảnh tại: https://kayllas.com/