Bài tập lớn môn thiết kế web Đề bài thiết kế trang web cho một của hàng bán thời trang thiết kế trang web cho một của hàng bán vé máy bay

Tên đề tài : Thiết kế trang web cho một của hàng bán vé máy bay Trong kỷ nguyên số hóa ngày nay, việc đi lại không chỉ là nhu cầu thiết yếu mà còn phản ánh phong cách sống hiện đại và xu

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

Bộ môn: Thiết kế Web

BÀI TẬP LỚN MÔN: THIẾT KẾ WEB

Đề bài: Thiết kế trang web cho một của hàng bán thời trang

Giảng viên giảng dạy: Trịnh Duy Hùng

Sinh viên thực hiện: Dương Đình Đạt

Lớp: 2310A04

Mã sinh viên: 23A1001D0066

Hà Nội, 2024

MỤC LỤC

PHẦN 1: ĐẶT VẤN ĐỀ 3

1 Tên đề tài 3

2 Phân tích đề tài: 3

3 Kết luận 4

4 Tài liệu tham khảo 4

PHẦN 2: NỘI DUNG 5

1 Cơ sở lí thuyết 5

2 Cấu trúc thiết kế web: 5

3 Sơ đồ các trang web 6

PHẦN 1: ĐẶT VẤN ĐỀ

1 Tên đề tài : Thiết kế trang web cho một của hàng bán vé máy bay

Trong kỷ nguyên số hóa ngày nay, việc đi lại không chỉ là nhu cầu thiết yếu mà còn phản ánh phong cách sống hiện đại và xu hướng toàn cầu hóa Ngành hàng không, với vai trò cầu nối giữa các quốc gia và vùng lãnh thổ, đang chứng kiến sự bùng nổ về nhu cầu và sự đa dạng trong lựa chọn của khách hàng

Sự phát triển vượt bậc của công nghệ thông tin và mạng internet đã tạo điều kiện thuận lợi cho việc đặt vé máy bay trực tuyến, giúp người dùng tiết kiệm thời gian

và công sức Một trang web chuyên nghiệp không chỉ giúp khách hàng dễ dàng tìm kiếm, so sánh giá vé mà còn mang đến trải nghiệm đặt vé nhanh chóng, tiện lợi và

an toàn

Một website bán vé máy bay chuyên nghiệp cần cung cấp thông tin chi tiết về các chuyến bay, giá vé, chính sách ưu đãi và hỗ trợ khách hàng tận tâm Đồng thời, nó phải có giao diện thân thiện, tích hợp các công nghệ hiện đại để đáp ứng nhu cầu ngày càng cao của người dùng, từ việc lên kế hoạch cho chuyến công tác, kỳ nghỉ gia đình, đến những hành trình khám phá thế giới

2 Phân tích đề tài:

a.Yêu cầu

- "Thiết kế trang web bán vé máy bay" là một trang web phục vụ mục đích kinh doanh và đặt vé trực tuyến, cần đáp ứng đầy đủ các tiêu chí sau:

- Bố cục hợp lý, rõ ràng, dễ dàng sử dụng

- Giao diện thân thiện, ấn tượng, mang phong cách hiện đại

- Trang chủ phải cung cấp thông tin khái quát về các dịch vụ hàng không, khách hàng có cảm giác chuyên nghiệp và đáng tin cậy

- Các trang con và liên kết cần trình bày chi tiết về các chuyến bay, giá vé, hãng hàng không, lịch trình và các dịch vụ liên quan

b.Chức năng

- Thiết kế và hỗ trợ các công ty hàng không và dịch vụ du lịch trong việc triển khai hệ thống đặt vé trực tuyến

- Hỗ trợ hình thành mạng lưới đặt vé rộng khắp trong nước và quốc tế

- Tạo sự kết nối nhanh chóng và tiện lợi giữa khách hàng và các hãng hàng không

- Tích hợp các công cụ thanh toán trực tuyến an toàn và đa dạng

- Cung cấp chức năng tìm kiếm và so sánh chuyến bay dựa trên giá vé, thời gian,

và các ưu đãi

- Đảm bảo hỗ trợ quảng bá thương hiệu và dịch vụ qua các tính năng tích hợp quảng cáo

- Tăng tính tiện lợi và lựa chọn cho khách hàng khi lên kế hoạch di chuyển

- Xây dựng giao diện độc đáo, đảm bảo mọi tính năng hoạt động mượt mà, phù hợp cả trên máy tính và thiết bị di động

3 Kết luận

a Kết quả đạt được:

- Giao diện trực quan và bắt mắt: Thiết kế bằng Photoshop cho phép tạo ra các hình ảnh sắc nét, phối màu hài hòa, và trình bày bố cục rõ ràng, thể hiện phong cách thời trang phù hợp cho cả nam và nữ

- Hệ thống phân loại rõ ràng: Các danh mục sản phẩm được thiết kế với bố cục hợp lý, dễ dàng định hướng cho người xem

- Khả năng trình bày sản phẩm nổi bật: Mỗi sản phẩm được thiết kế với thông tin trực quan, từ hình ảnh chất lượng cao đến các yếu tố thẩm mỹ, thu hút sự chú ý của khách hàng

b Hạn chế

- Giới hạn về chức năng động: Vì thiết kế được thực hiện chủ yếu bằng

Photoshop và lưu bằng tính năng Save for Web, website chỉ là một dạng tĩnh,

không có các tính năng tương tác như giỏ hàng, thanh toán trực tuyến hay tìm kiếm sản phẩm

- Chưa tích hợp công nghệ hiện đại: Thiếu các yếu tố tối ưu trải nghiệm người dùng (UX/UI), chẳng hạn như phản hồi khi nhấn vào các nút hoặc chuyển đổi trang

- Khó khăn trong triển khai thực tế: Mặc dù giao diện đã hoàn thiện, nhưng để đưa vào vận hành thực tế sẽ cần sự hỗ trợ từ các lập trình viên để chuyển đổi thiết kế sang ngôn ngữ lập trình phù hợp

4 Tài liệu tham khảo

- Website bán hàng của cửa hàng bán vé máy bay Traveloka

PHẦN 2: NỘI DUNG

1 Cơ sở lí thuyết

- Xây dựng giao diện Website bằng phần mềm Photoshop:

+ Photoshop là phần mềm thiết kế đồ họa mạnh mẽ, cho phép tạo ra giao diện trang web với hình ảnh sắc nét, bố cục khoa học, và màu sắc hài hòa

+Tính năng Save for Web trong Photoshop được sử dụng để tối ưu hóa hình ảnh

và xuất file ở định dạng JPG cho việc chuyển đổi sang giao diện HTML

- Trong Photoshop, chúng tôi sử dụng các công cụ hỗ trợ như hiệu ứng gradient, shadow, và motion blur để tạo điểm nhấn cho banner, đảm bảo chúng nổi bật và thu hút sự chú ý của người dùng

- Thiết kế được thực hiện với mục tiêu đảm bảo tính thân thiện trên các thiết bị (máy tính, điện thoại, máy tính bảng)

- Các thành phần giao diện được căn chỉnh cẩn thận để phù hợp với kích thước màn hình khác nhau, đảm bảo trải nghiệm người dùng tốt nhất

2 Cấu trúc thiết kế web:

- Gồm các layout: Trang chủ,Vé máy bay,Hoạt động & Vui chơi, Hỗ trợ

- Số lương trang: 59 trang

- Gam màu chủ đạo: xanh dương (#3434d9) và đỏ (#e3435d)

- Ý tưởng thiết kế:

+ Trang chủ: hiển thị được một số sản phẩm nổi bật mà khi nhấn vào sản phẩm

đó sẽ hiện ra những trang con có thông tin chi tiết về sản phẩm (tên, mã sản phẩm, giá cả, size, mô tả, chất liệu và hướng dẫn)

+ Sản phẩm mới: cập nhật những mẫu mã mới nhất của shop Khi nhấn vào sản phẩm đó sẽ hiện ra những trang con có thông tin chi tiết về sản phẩm (tên, mã sản phẩm, giá cả, size, mô tả, chất liệu và hướng dẫn)

+ Nam: đề xuất lên được những sản phẩm mới nhất và nổi bật nhất của nam về từng kiểu mẫu Khi nhấn vào sản phẩm đó sẽ hiện ra những trang con có thông tin chi tiết về sản phẩm (tên, mã sản phẩm, giá cả, size, mô tả, chất liệu và hướng dẫn)

+ Nữ: đề xuất lên được những sản phẩm mới nhất và nổi bật nhất của nữ về từng kiểu mẫu Khi nhấn vào sản phẩm đó sẽ hiện ra những trang con có thông tin chi tiết về sản phẩm (tên, mã sản phẩm, giá cả, size, mô tả, chất liệu và hướng dẫn)

3 Sơ đồ các trang web

a Trang chủ

Logo shop Trang chủ Vé máy bay Hoạt đọng & Vui chơi Hỗ trợ

Banner

Sự kiện 1

Sản phẩm 1 Sản phẩm 2 Sản phẩm 3

Footer

b Vé máy bay

Nội dung vé của khách

Footer

c Hoạt động & Vui chơi

Logo shop Trang chủ Vé máy bay Hoạt động & Vui chơi Hỗ trợ

Banner Sản phẩm 1 Sản phẩm 2 Sản phẩm 3

Sản phẩm 4 Sản phẩm 5 Sản phẩm 6

Footer

d Hỗ trợ

Logo shop Trang chủ Sản phẩm mới Nam Nữ

Footer