Tiểu luận môn học thiết kế web tên đề tài thiết kế website cho cửa hàng đồng hồ đức thịnh

Y BAN NHÂN DÂN TỈNH BÌNH DƯƠNG TRƯỜNG ĐẠI HỌC TH DẦU MỘT KHOA KỸ THUẬT – CÔNG NGHỆ TIỂU LUẬN MÔN HỌC THIẾT KẾ WEB TÊN ĐỀ TÀI: THIẾT KẾ WEBSITE CHO CỬA HÀNG ĐỒNG HỒ ĐỨC THỊNH GVHD: THS NGUYỄN HỮU VĨNH SVTH: LÊ ĐỖ ĐỨC THỊNH MSSV: 1824801030266 LỚP: D18PM04 BÌNH DƯƠNG - 07/2020 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh TRƯỜNG ĐẠI HỌC TH DẦU MỘT KHOA KỸ THUẬT – CÔNG NGHỆ NHẬN XÉT VÀ CHẤM ĐIỂM CA GIẢNG VIÊN Họ tên giảng viên: Nguyễn Hữu Vĩnh Tên đề tài: THIẾT KẾ WEBSITE CHO CỬA HÀNG ĐỒNG HỒ ĐỨC THỊNH Nội dung nhận xét: Điểm: Bằng số: Bằng chữ: GIẢNG VIÊN CHẤM (Ký, ghi rõ họ tên) THS.NGUYỄN HỮU VĨNH SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh LỜI NĨI ĐẦU Ngày với cơng nghệ thơng tin bùng nổ việt nam đạt đến mức mà hầu hết người biết đến sử dụng Internet việc thiết kế website bán hàng đồng hồ mạng kênh thông tin thiếu giúp khách hàng tìm thấy sản phẩm, dịch vụ mà bạn cung cấp Thiết kế website bán hàng đồng hồ có nhiều điểm ưu việt so với cách mua, bán hàng trực tiếp truyền thống Kỹ thuật số giúp tiết kiệm đáng kể chi phí nhờ chi phí vận chuyển trung gian, chi phí giao dịch đặc biệt giúp tiết kiệm thời gian để người đầu tư vào hoạt động khác Hơn nữa, thương mại điện tử cịn giúp người tìm kiếm tự động theo nhiều mục đích khác nhau, tự động cung cấp thông tin theo nhu cầu sở thích người Giờ đây, người ngồi nhà để mua sắm thứ theo ý muốn website bán hàng mạng giúp ta làm điều Chính vậy, công nghệ mã nguồn mở trở nên ý tính Giá thành rẻ hỗ trợ nhiều mạng giúp ta nhanh chóng Thiết kế website bán hàng thân thiện dễ sử dụng với người dùng Chính báo cáo chọn đề tài về: “Thiết kế website cửa hàng đồng hồ Đức Thịnh” Đây hệ thống đơn giản đủ mạnh phép khách hàng nhanh chóng tìm sản phẩm mà mong muốn Đề tài tiểu luận gồm phần phân chương sau: Chương 1: Khảo sát phân tích hệ thống Chương 2: Giới thiệu công nghệ Chương 3: Giao diện website Chương 4:Kết luận hướng phát triển SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh MỤC LỤC BẢNG THÔNG TIN TRANG DANH SÁCH CÁC KÝ TỰ, CHỮ VIẾT TẮT CHƯƠNG KHẢO SÁT VÀ PHÂN TÍCH HỆ THỐNG .9 TÊN ĐỀ TÀI CHỨC NĂNG .9 YÊU CẦU ĐẶT RA MỤC TIÊU CỦA ĐỀ TÀI 10 Ý NGHĨA CỦA ĐỀ TÀI .10 ĐỐI TƯỢNG CỦA ĐỀ TÀI 10 MỘT SỐ TRANG CHÍNH CỦA WEBSITE .10 CHƯƠNG GIỚI THIỆU CÔNG NGHỆ 11 Giới Thiệu Về HTML 11 1.1 HTML gì? 11 1.2 Công dụng HTML 12 1.3 Định dạng HTML 12 Giới thiệu Adobe Dreamweaver 12 Ngôn ngữ CSS 13 Ngôn ngữ Javascript 13 CHƯƠNG 3: GIAO DIỆN CHƯƠNG TRÌNH 14 Đặc Tả Giao Diện .14 1.1 Giao diện trang chủ 14 1.2 Giao diện trang đồng hồ nam 16 1.3 Giao diện trang đồng hồ nữ 17 1.4 Giao diện đồng hồ cặp 18 1.5 Giao diện phụ kiện đồng hồ 19 1.6 Giao diện giới thiệu 21 1.7 Giao diện trang liên hệ 22 SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web 1.8 GVHD: Nguyễn Hữu Vĩnh Giao diện trang Fanpage 22 1.9 Giao diện tìm kiếm sản phẩm 23 1.10 Giao diện giỏ hàng .24 1.11 Giao diện trả góp 24 1.12 Giao diện đổi trả 25 1.13 Giao diện bảo hành 26 1.14 Giao diện vận chuyển 27 1.15 Giao diện đăng nhập 28 1.16 Giao diện đăng ký 29 1.17 Giao diện hãng đồng hồ 30 1.18 Giao diện đồng hồ bán chạy lượt truy cập 31 1.19 Giao diện đồng hồng hãng Casio 32 1.20 Giao diện đồng hồ hãng Rolex .33 1.21 Giao diện đồng hồ hãng Citizen 34 1.22 Giao diện đồng hồ hãng Seiko .35 1.23 Giao diện đồng hồ hãng Bulova 36 1.24 Giao diện đồng hồ hãng Orient 37 1.25 Giao diện đồng hồ hãng Titan 38 1.26 Giao diện đồng hồ hãng Tissot .39 1.27 Giao đồng hồ hãng Fossil 40 1.28 Giao diện chi tiết đồng hồ 41 1.29 Giao diện chi tiết đồng hồ nam 42 1.30 Giao diện chi tiết đồng hồ nữ 43 1.31 Giao diện chi tiết đồng hồ cặp 43 CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 44 Kết đạt được: 44 Việc chưa làm được: 44 Hướng phát triển đề tài 45 TÀI LIỆU KHAM KHẢO 45 SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh DANH MỤC HÌNH Hình 1 Giao diện trang chủ .15 Hình Giao diện trang đồng hồ nam 16 Hình Giao diện trang đồng hồ nữ 17 Hình Giao diện trang đồng hồ cặp .19 Hình Giao diện phụ kiện đồng hồ 20 Hình Giao diện giới thiệu .21 Hình Giao diện trang liên hệ 22 Hình Giao diện trang Fanpage .23 Hình Giao diện tìm kiếm sản phẩm 23 Hình 10 Giao diện giỏ hàng .24 Hình 11 Giao diện trả góp 25 Hình 12 Giao diện trả góp 26 Hình 13 Giao diện bảo hành 27 Hình 14 Giao diện vận chuyển 28 Hình 15 Giao diện đăng nhập 29 Hình 16 Giao diện đăng ký .30 Hình 17 Giao diện hãng đồng hồ .31 Hình 18 Giao diện đồng hồ bán chạy 32 Hình 19 Giao diện đồng hồng hãng Casio .33 Hình 20 Giao diện đồng hồ hãng Rolex 34 Hình 21 Giao diện đồng hồ hãng Citizen 35 Hình 22 Giao diện đồng hồ hãng Seiko 36 Hình 23 Giao diện đồng hồ hãng Bulova 37 Hình 24 Giao diện đồng hồ hãng Orient 38 Hình 25 Giao diện đồng hồ hãng Titan 39 Hình 26 Giao diện đồng hồ hãng Tissot 40 Hình 27 Giao đồng hồ hãng Fossil 41 Hình 28 Giao diện chi tiết đồng hồ 42 Hình 29 Giao diện chi tiết đồng hồ nam 42 Hình 30 Giao diện chi tiết đồng hồ nữ .43 Hình 31 Giao diện chi tiết đồng hồ cặp 43 SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh BẢNG THÔNG TIN TRANG S Tên Trang Chức trang TT Trang Chủ Trang Đồng Hồ Nam, Nữ Và Đây trang cửa hàng, giới thiệu sơ lược cửa hàng, loại đồng hồ bán chạy cửa hàng Đây trang giúp cho khách hàng dễ dàng lọc sản phẩm theo nhu cầu Đồng Hồ cặp Trang Đăng Người dùng đăng ký tài khoản để trở thành khách hàng cửa hàng Trang Đăng Nhập Người dùng đăng nhập tài khoản để đặt mua sản phẩm cửa hàng Trang Đổi Mật Khẩu Đây trang mà khách hàng có nhu cầu đổi mật muốn Trang Danh Mục Sản Phẩm Đây trang khách hàng xem tham khảo loại sản phẩm có sẵn cửa hàng để tùy ý lựa chọn Trang Chi Tiết Đồng Hồ Đây trang khách hàng nhấn vào loại đồng hồ để xem chi tiết Ký Trang Trả góp Trang Các Hãng Đồng Hồ Đây trang giúp cho khách hàng xem, chọn hãng đồng hồ mà muốn mua cách nhanh chóng Trang Giỏ Hàng Đây trang khách hàng cần xem lại sản phẩm chọn Trang Chính sách bảo hành Trang gồm sách bảo hành cửa hàng mà khách hàng tham khảo 1 Khách hàng tra cứu thơng tin hỗ trợ trả góp từ cửa hàng Trang Đổi Trả Trang giúp khách hàng hiểu rõ quy trình đổi trả sản phầm mua từ cửa hàng SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web Trang Vận chuyển Hệ Trang giới thiệu Đây trang giúp cho người xem biết thêm thông tin cửa hàng Trang 16 Trang giúp khách hàng tìm kiếm thơng tin liên hệ đến website cách nhanh chóng Trang giúp khách hàng xem qua phương thức vận chuyển cửa hàng Trang Liên 14 GVHD: Nguyễn Hữu Vĩnh Fanpage Trang giúp khách hàng đến trang liên kết với Fanpage cửa hàng DANH SÁCH CÁC KÝ TỰ, CHỮ VIẾT TẮT Từ viết tắt Giải thích CSDL Cơ sở liệu ĐVT Đơn vị tính CNTT Công Nghệ thông tin LH Loại Hoa HTML Hyper Text Markup Language CSS Cascading Style Sheet CHƯƠNG KHẢO SÁT VÀ PHÂN TÍCH HỆ THỐNG TÊN ĐỀ TÀI “THIẾT KẾ WEBSITE CHO CỬA HÀNG ĐỒNG HỒ ĐỨC THỊNH” CHỨC NĂNG SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Đây Website bán giới thiệu sản phẩm cửa hàng, công ty đến người tiêu dùng với chi tiết mặt hàng với giá xác Có chức sau: - Cho phép cập nhật hàng vào CSDL - Hiển thị danh sách mặt hàng theo loại - Hiển thị hàng hóa khách hàng chọn mua - Hiển thị thông tin khách hàng - Quản lý đơn đặt hàng - Cập nhật hàng hóa, nhà sản xuất,loại hàng,tin tức - Xử lý đơn hàng - Thống kê khách hàng mua ngày, khoảng thời gian YÊU CẦU ĐẶT RA a Thiết bị phần mềm - Máy tính thiết kế web - Phần mềm thiết kế Web: Dreamwear,sothink,flast b Yêu cầu trang web Hệ thống có phần: Thứ nhất: phần khách hàng: Khách hàng người có nhu cầu mua sắm hàng hóa, họ tìm kiếm mặt hàng cần thiết từ hệ thống đặt mua mặt hàng Vì phải có chức sau: - Hiển thị danh sách mặt hàng cửa hàng để khách hàng xem, lựa chọn mua - Khách hàng xem thông tin tin tức mới, khuyến trang web - Sau khách hàng chọn đặt hàng hàng trực tiếp phải lên đơn hàng để khách hàng nhập thơng tin mua hàng xem hoá đơn mua hàng Thứ hai: Dành cho người quản trị: Người làm chủ ứng dụng có quyền kiểm soát hoạt động hệ thống Người cấp username password để đăng nhập hệ thống thực chức mình: SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh - Chức cập nhật, sửa, xoá mặt hàng, loại hàng, nhà sản xuất, tin tức.(phải kiểm sốt đƣợc hệthống) Nó địi hỏi xác - Tiếp nhận kiểm tra đơn đặt hàng khách hàng Hiển thị đơn đặt hàng - Thống kê theo ngày, khoảng thời gian Ngồi chức trang Web phải thiết kế cho dễ hiểu, giao diện mang tính dễ dùng đẹp mắt cho khách hàng thấy thơng tin cần tìm, cung cấp thông tin quảng cáo hấp dẫn, tin tức khuyến để thu hút khách hàng Điều quan trọng phải đảm bảo an tồn tuyệt đối thơng tin khách hàng trình đặt mua qua mạng Đồng thời trang Web phải đổi mới, hấp dẫn MỤC TIÊU CỦA ĐỀ TÀI + Thiết kế Website cho cửa hàng bán đồng hồ Ý NGHĨA CỦA ĐỀ TÀI + Đưa sản phẩm công ty đến đến gần với người tiêu dùng + Quảng bá thương hiệu ĐỐI TƯỢNG CỦA ĐỀ TÀI + Đối tượng nghiên cứu chủ yếu sản phẩm đồng hồ nhiều thương hiệu khác MỘT SỐ TRANG CHÍNH THỨC CỦA WEBSITE + Trang chủ: Đây trang giới thiệu sơ lược sản phẩm cửa hàng + Trang Giới thiệu: Đây trang giúp cho khách hàng xem biết thêm thông tin cửa hàng + Trang liên hệ: Đây trang mà khách hàng liên hệ với shop + Trang đăng ký: Người dùng đăng ký tài khoản để trở thành khách hàng trang + Trang đăng nhập: Người dùng đăng nhập tài khoản để đặt mua sản phẩm trang + Trang sản phẩm: Đây trang khách hàng xem tham khảo mặt hàng cửa hàng có sẵn để lựa chọn SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Hình 18 Giao diện đồng hồ bán chạy 1.19Giao diện đồng hồng hãng Casio Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Casio để từ lựa chọn sản phẩm phù hợp cho SVTH: Lê Đỗ Đức Thịnh – D18PM04 29 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Hình 19 Giao diện đồng hồng hãng Casio 1.20 Giao diện đồng hồ hãng Rolex Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Rolex để từ lựa chọn sản phẩm phù hợp cho SVTH: Lê Đỗ Đức Thịnh – D18PM04 30 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Hình 20 Giao diện đồng hồ hãng Rolex 1.21Giao diện đồng hồ hãng Citizen Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Citizen để từ lựa chọn sản phẩm phù hợp cho SVTH: Lê Đỗ Đức Thịnh – D18PM04 31 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Hình 21 Giao diện đồng hồ hãng Citizen 1.22Giao diện đồng hồ hãng Seiko Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Seiko để từ lựa chọn sản phẩm phù hợp cho SVTH: Lê Đỗ Đức Thịnh – D18PM04 32 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh s Hình 22 Giao diện đồng hồ hãng Seiko SVTH: Lê Đỗ Đức Thịnh – D18PM04 33 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh 1.23Giao diện đồng hồ hãng Bulova Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Bulova để từ lựa chọn sản phẩm phù hợp cho Hình 23 Giao diện đồng hồ hãng Bulova SVTH: Lê Đỗ Đức Thịnh – D18PM04 34 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh 1.24Giao diện đồng hồ hãng Orient Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Orient để từ lựa chọn sản phẩm phù hợp cho Hình 24 Giao diện đồng hồ hãng Orient SVTH: Lê Đỗ Đức Thịnh – D18PM04 35 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh 1.25Giao diện đồng hồ hãng Titan Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Titan để từ lựa chọn sản phẩm phù hợp cho Hình 25 Giao diện đồng hồ hãng Titan SVTH: Lê Đỗ Đức Thịnh – D18PM04 36 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh 1.26Giao diện đồng hồ hãng Tissot Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Tissot để từ lựa chọn sản phẩm phù hợp cho Hình 26 Giao diện đồng hồ hãng Tissot SVTH: Lê Đỗ Đức Thịnh – D18PM04 37 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh 1.27Giao đồng hồ hãng Fossil Mục đích: Khi vào trang này, khách hàng thấy danh sách mẫu đồng hồ hãng Fossil để từ lựa chọn sản phẩm phù hợp cho SVTH: Lê Đỗ Đức Thịnh – D18PM04 38 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Hình 27 Giao đồng hồ hãng Fossil 1.28 Giao diện chi tiết đồng hồ Mục đích: Khi vào trang này, khách hàng xem thơng tin chi tiết sản phẩm SVTH: Lê Đỗ Đức Thịnh – D18PM04 39 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Hình 28 Giao diện chi tiết đồng hồ 1.29 Giao diện chi tiết đồng hồ nam Hình 29 Giao diện chi tiết đồng hồ nam SVTH: Lê Đỗ Đức Thịnh – D18PM04 40 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh 1.30 Giao diện chi tiết đồng hồ nữ Hình 30 Giao diện chi tiết đồng hồ nữ 1.31 Giao diện chi tiết đồng hồ cặp Hình 31 Giao diện chi tiết đồng hồ cặp SVTH: Lê Đỗ Đức Thịnh – D18PM04 41 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN Trong thời buổi cơng nghiệp hóa nay, việc buôn bán qua mạng trở nên phổ biến với hầu hết người Đây xu hướng xã hội người với cú nhấp chuột dễ dàng đặt mua loại đồng hồ mà ưng ý cách dễ dàng thời gian đến tận cửa hàng để mua Việc mua bán giúp tiết kiệm thời gian tiền bạc người lựa chọn loại đồng hồ với giá đa dạng phù hợp với nhu cầu cá nhân người Vì thế, sau tiến hành khảo sát em định xây dựng trang web bán đồng hồ mà cụ thể “Xây dựng website cho cửa hàng đồng hồ Đức Thịnh”với chức cần thiết cho trang web bn bán cần có em thấy nhu cầu mua sắm thị trường tiềm khai thác bn bán Website “Đồng hồ Đức thịnh” thứ dùng để quảng bá cho cửa hàng, thứ hai kênh thông tin cho người, thứ ba địa tin cậy để khách hàng u thích thời trang tìm mua cho loại đồng hồ chất lượng đẹp Qua trình nghiên cứu cố gắng thực hướng dẫn tận tình giảng viên, giúp đỡ bạn bè khóa học đồ án nghiên cứu thể điều sau: Kết đạt được: Xây dựng thành công website thời trang cho Cửa hàng đồng hồ Đức Thịnh đáp ứng yêu cầu người sử dụng - Tìm hiểu nắm công cụ để xây dựng website như: Adobe Dreamweaver CS6, ngơn ngữ lập trình Website như: HTML, Javascript, CSS - Giao diện website thiết kế đơn giản, thân thiện dễ sử dụng Việc chưa làm được: - Việc biểu diễn thông tin website chưa linh hoạt - Phân tích thiết kế chưa hồn chỉnh - Nhiều chức thiếu chưa sử dụng Hướng phát triển đề tài Vì thời gian khơng cho phép kiến thức thiết kế web hạn chế nên em chưa tìm hiểu rõ kỹ đề tài Vì đề tài cịn có nhiều thiếu sót, mong thầy giúp SVTH: Lê Đỗ Đức Thịnh – D18PM04 42 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh đỡ chúng em nhiều em tiếp tục tìm hiểu sâu cơng nghệ này, nhằm mục đích xây dựng website: + Giao diện đẹp, thân thiện với người dùng, có nhiều chức tương tác tốt với người dùng + Xây dựng, bổ sung tính cịn thiếu hay chưa thật hồn chỉnh q trình sử dụng TÀI LIỆU KHAM KHẢO - Tài liệu giảng môn “Thiết kế website” thầy Nguyễn Hữu Vĩnh - Website WWW: http://www.hiepsiit.com - Tham khảo thư viện trường - Website https://coccoc.com/search#query=Webcoban.vn SVTH: Lê Đỗ Đức Thịnh – D18PM04 43 ... THỐNG TÊN ĐỀ TÀI “THIẾT KẾ WEBSITE CHO CỬA HÀNG ĐỒNG HỒ ĐỨC THỊNH” CHỨC NĂNG SVTH: Lê Đỗ Đức Thịnh – D18PM04 Tiểu Luận Thiết Kế Web GVHD: Nguyễn Hữu Vĩnh Đây Website bán giới thiệu sản phẩm cửa hàng, ... trang web bán đồng hồ mà cụ thể “Xây dựng website cho cửa hàng đồng hồ Đức Thịnh? ??với chức cần thiết cho trang web bn bán cần có em thấy nhu cầu mua sắm thị trường tiềm khai thác bn bán Website ? ?Đồng. .. Chính báo cáo tơi chọn đề tài về: ? ?Thiết kế website cửa hàng đồng hồ Đức Thịnh? ?? Đây hệ thống đơn giản đủ mạnh phép khách hàng nhanh chóng tìm sản phẩm mà mong muốn Đề tài tiểu luận gồm phần phân