Báo cáo bài tập lớn đề bài trang web bán giày dép

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (7.64 MB, 31 trang )

<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

TRƯỜNG ĐẠI HỌC MỞ HÀ NỘI KHOA CƠNG NGHỆ THƠNG TIN

BÁO CÁO BÀI TẬP LỚN

Mơn: Thiết kế Web

Đề bài:Trang web bán giày dép

Giảng viên hướng dẫn:

</div><span class="text_page_counter">Trang 2</span><div class="page_container" data-page="2">

1. Xác định và phân tích yêu cầu...4

2. Phác thảo ý tưởng thiết kế...4

3.Bố cục layout của các trang...6

4. Sơ đồ phân cấp trang web...8

5. Sketch...9

Phần 3: Tài liệu tham khảo...30

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

Phần 1: Giới thiệu 1. Lý do chọn đề tài

Trong những năm gần đây, công nghệ thông tin không ngừng phát triển một cách mạnh mẽ và hiện đại. Sự ra đời của công nghệ thông tin làm phong phú bộ mặt xã hội, đời sống con người được nâng cao rõ rệt, đóng góp to lớn cho sự phát triển của nhân loại. với xu thế tồn cầu hóa nền kinh thế giới, đặc biệt nhu cầu trao đổi hàng hóa ngày càng tăng cả về số lượng và chất lượng, nhu cầu sử dụng Internet ngày càng nhiều và các hình thức kinh doanh trên mạng ngày càng đa dạng và phong phú rất được nhiều người sử dụng và ưa chuộng

Vì vậy, nhiều cửa hàng đã áp dụng phương pháp bán hàng qua mạng để khách hàng dễ dàng tìm kiếm thơng tin mà khơng cần nhiều thời gian và chi phí, mang thơng tin đến với mọi người với mục đích chính là giúp khách hàng có thể đặt mua giày dép qua mạng một cách nhanh chóng, tiện lợi và tiết kiệm chi phí.

Khách hàng đến với chúng tơi có thể lựa chọn những mẫu giày dép mới nhất, đẹp nhất, phù hợp với sở thích và nhu cầu của bản thân, thoải mái thể hiện cá tính thơng qua những thiết kế cho các năm, thiết kế bán và thiết kế theo từng hạng mục

Từ những vấn đề trên, em chọn đề tài “thiết kế website bán giày dép” 2. Mục đích của đề tài

- Mục đích của đề tài thiết kế website bán điện thoại di động là thiết kế ra một nền tảng trực tuyến để người dùng có thể tiện lợi tìm kiếm, mua sắm và tận hưởng các sản phẩm từ nhiều thương hiệu và mẫu mã khác nhau, nhằm mang lại sự tiện ích, đa dạng sản phẩm và trải nghiệm mua sắm tốt nhất cho khách hàng.

- Mục tiêu chính của trang web bán giày dép là đáp ứng nhu cầu của khách hàng với việc cung cấp thông tin chi tiết về từng sản phẩm, bao gồm hình ảnh, mơ tả, thông số kỹ thuật và. Điều này giúp khách hàng có cái nhìn tổng quan và đánh giá chất lượng của sản phẩm trước khi quyết định mua. - Một mục tiêu quan trọng khác là tạo ra một giao diện người dùng thân thiện,

dễ sử dụng và hấp dẫn. Trang web cần có một cấu trúc dễ nhìn, tìm kiếm nhanh chóng và chức năng phân loại sản phẩm thông minh.

- Mục tiêu cuối cùng của trang web là tạo ra một nền tảng kinh doanh hiệu quả. Thiết kế trang web phải tối ưu hóa q trình mua sắm, xử lý đơn hàng và thanh toán để tăng khả năng chuyển đổi từ lượt truy cập thành giao dịch thành công. Đồng thời, việc xây dựng và duy trì một quan hệ khách hàng tốt thơng qua chăm sóc sau bán hàng và dịch vụ hậu mãi là yếu tố quan trọng để xây dựng lòng tin và tạo sự trung thành từ khách hàng..

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

3. Kết quả mong muốn đạt được

- Phân tích yêu cầu ban đầu, dùng những kiến thức đã học để triển khai. - Thành thạo sử dụng photoshop để thiết kế giao diện web

- Sử dụng HTML và css để hoàn thành trang web từ bản thiết kế .psg. - Màu sắc Website hài hòa bố cục cân đối.

- Thu hút được sử chứ ý của người dùng.

- Website hiển thị phù hợp trên nhiều thiết bị có độ rộng khác nhau.

- Website được thiết kế rõ ràng, những người khơng có nhiều kinh nghiệm về cơng nghệ có thể sử dụng dễ dàng

- Đáp ứng đầy đủ được yêu cầu, nhu cầu của người sử dụng - Nội dung: đầy đủ, chính xác, phù hợp với nội dung website lập ra

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

Phần 2: Nội dung

1. Xác định và phân tích yêu cầu

- Hiện nay, với xu hướng công nghệ thông tin thời đại 4.0, khi mà mọi gia đình cá nhân đều dễ dàng truy cập từ điện thoại, máy tính, laptop. Nên việc có thể giải trí từ Internet là một việc cần thiết để bắt kịp xu thế chiếm lấy thị phần. MINHDUC một thương hiệu chuyên cung cấp về giày dép cần thiết kế một trang web để cung cấp dịch vụ mua bán trên đó.

- Đối tượng khách hàng:

⁺ Khách hàng có độ tuổi từ 6 tuổi trở lên. ⁺ Giới tính: cả nam và nữ.

⁺ Khách hàng chính của trang web bán giày dép là những người trong độ tuổi từ 15 đến 28 tuổi. Đây là nhóm tuổi trẻ, đang trong giai đoạn thanh niên và trẻ trung, có nhu cầu mua sắm giày dép để đáp ứng nhu cầu cá nhân và công việc

- Khách hàng trong nhóm tuổi này có gu thẩm mỹ đa dạng và đa chiều trong thiết kế. Họ có thể quan tâm đến các thương hiệu, kiểu dáng tính năng, màu sắc và phù hợp với nhu cầu sử dụng cá nhân của mình.

2. Phác thảo ý tưởng thiết kế

- Giao diện hấp dẫn: website cần có giao diện đẹp mắt, chuyên nghiệp. Sử dụng màu sắc phù hợp, hình ảnh hấp dẫn, hình ảnh hấp dẫn và bố cục tổ chức logic để tạo cảm giác thú vị cho người dùng

- Khám phá sản phẩm mới: Cung cấp danh sách các sản phẩm mới nhất, các xu hướng thời trang hiện tại, hoặc các sản phẩm độc quyền để khách hàng có thể khám phá và tiếp cận những lựa chọn mới nhất.

- Đáp ứng và tương thích di động: Đảm bảo rằng website được thiết kế để đáp ứng tốt trên các thiết bị di động, đảm bảo trải nghiệm người dùng mượt mà và thuận tiện trên cả điện thoại di động và máy tính bảng.

- Gam màu chủ đạo: Màu trắng(#ffffff), Màu xanh(#00acfc), màu đen (#303030). Lý do chọn 3 màu này vì giúp tạo cảm giác tươi mới và sáng tạo

⁺ Màu trắng (#ffffff) được sử dụng làm màu nền chủ đạo, mang đến cảm giác tươi mới, sạch sẽ và tinh khiết. Màu trắng cũng thể hiện tính đơn giản và tạo khơng gian trống rộng, giúp các yếu tố khác trên trang web nổi bật hơn.

⁺ Màu xanh (#2f92f7) và Màu Đen(#303030) được sử dụng để làm màu chủ đạo thứ cấp, tạo điểm nhấn và sự nổi bật cho các phần quan trọng trên trang web. Màu xanh tươi tắn thường được liên kết với sự sáng tạo, trẻ trung và năng động.Màu đen tạo sự tương phản với màu trắng

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

làm nổi bật nội dung chính của trang website, giúp người dùng có thể chú ý tốt hơn tới phần nội dung chính của trang web.

⁺ Phương pháp phối màu: Tương phản(complementary)

⁺ Gồm các trang sau: Trang chủ, Trang nam, Trang nữ, Trang bé nam, Trang bé nữ, Trang hỗ trợ, Trang đăng nhập, Trang Đăng ký, Trang quan tâm, Trang giỏ hàng, Trang thơng tin sản phẩm, Trang thanh tốn đơn hàng.

⁺ Độ sâu 3:

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

● Độ sâu 2 (Trang nữ, Trang bé nam, Trang bé nữ, Trang hỗ trợ, Trang đăng nhập, Trang quan tâm, Trang giỏ hàng, Trang thông tin sản phẩm): khi người dùng truy cập vào trang web sẽ ở trang chủ khi bấm vào các nút trên header sẽ đến các trang nam, nữ, bé nam, bé nữ, đăng nhập, hỗ trợ, quan tâm, giỏ hàng; khi ở trang chủ bấm vào hình ảnh sản phẩm sẽ đến trang thơng tin sản phẩm.

● Độ sâu 3 (Trang thông tin sản phẩm, trang thanh toán đơn hàng, trang đăng ký): khi ở các trang nam, nữ, bé nam, bé nữ bấm vào hình ảnh sản phẩm sẽ đến đến độ sâu 3 là trang thông tin sản phẩm; khi ở trang đăng nhập bấm vào “đăng ký” sẽ đến trang đăng ký; khi ở trang thông tin sản phẩm bấm “mua ngay” hoặc ở trang giỏ hàng bấm thanh toán đơn hàng sẽ đến trang thanh toán đơn hàng.

- Font chữ: Arial - Logo:

3.Bố cục layout của các trang 3.1. Bố cục của Trang chủ