BÁO CÁO DELIVERABLE 1 – LẬP KẾ HOẠCH WEB

 Khách hàng có nhu cầu tìm kiếm và khám phá các sản phẩm thời trang phản ánh phong cách và sở thích của họ, bao gồm cả việc sử dụng bộ lọc và tìm kiếm theo danh mục, màu sắc, kích cỡ, v

TRƯỜNG ĐẠI HỌC KINH TẾ - ĐẠI HỌC ĐÀ NẴNG

KHOA THƯƠNG MẠI ĐIỆN TỬ

––––––––––

BÁO CÁO DELIVERABLE 1 – LẬP KẾ HOẠCH WEB

Giáo viên hướng dẫn: Trương Hồng Tuấn Nhóm F Lớp: 47K22.2

Trần Văn Hà Dương Khánh Linh Cao Thị Thùy Trang Đinh Quốc Việt

MỤC LỤC

I Giới thiệu về tổ chức: SICKO 3

1 Lịch sử: 3

2 Sứ mệnh: 3

3 Mục tiêu: 3

4 Cách tiếp cận: 4

5 Tầm nhìn: 4

II Xác định mục đích và đối tượng mục tiêu của trang web: 4

1 Chân dung khách hàng mục tiêu: 4

2 Nhu cầu, mong muốn, kỳ vọng của khách hàng mục tiêu: 4

3 Mục đích của trang web: 5

III Xác định nội dung chung của website: 6

1 Homepage: 6

2 Trang con: 6

IV Cấu trúc website: 7

V Hệ thống điều hướng của trang web: 7

VI Thiết kế giao diện của trang web: 11

VII Kiểm tra, xuất bản và duy trì trang web: 16

1 Kiểm tra trang web: 16

2 Xuất bản và duy trì trang web: 17

VIII Xem lại trang web hiện tại: 17

pg 2

I Giới thiệu về tổ chức: SICKO

Từ nền tảng vững chắc của Hard Mode, một thương hiệu tiên phong trong phân khúc thời trang đường phố giá rẻ, đã ghi dấu ấn mạnh mẽ với giới trẻ Việt Nam nhờ chất lượng sản phẩm vượt trội và trải nghiệm mua sắm tuyệt vời Trên nền tảng thành công đó, SICKO ra đời như một bước tiến mới, mang đến cho khách hàng những trải nghiệm thời trang cao cấp hơn

SICKO chú trọng đầu tư vào chất liệu cao cấp, đường may tỉ mỉ và thiết kế sáng tạo, tạo nên những sản phẩm thời trang không chỉ đẹp mắt mà còn bền bỉ theo thời gian

SICKO không chỉ là một thương hiệu thời trang, mà còn là một phong cách sống SICKO khuyến khích giới trẻ tự tin thể hiện bản thân và theo đuổi đam

mê SICKO đồng hành cùng bạn trên mọi hành trình, giúp bạn luôn tự tin và tỏa sáng

Tạo ra những bộ sưu tập thời trang độc đáo, phản ánh cá tính và phong cách của giới trẻ địa phương, đồng thời cam kết với việc sử dụng nguyên liệu và quy trình sản xuất bền vững để bảo vệ môi trường

 Phát triển mạng lưới phân phối rộng khắp để đáp ứng nhu cầu mua sắm của khách hàng

 Liên tục cải tiến quy trình sản xuất và sử dụng nguyên liệu thân thiện với môi trường

 Tạo ra các chiến lược tiếp thị sáng tạo và hiệu quả để tăng cường sự nhận diện thương hiệu và tăng doanh số bán hàng

4 Cách tiếp cận:

 Sử dụng mạng xã hội và các nền tảng trực tuyến để tương tác và tiếp cận khách hàng mục tiêu

 Tạo ra các sản phẩm độc đáo và giới hạn để tạo ra sự kích thích và mong đợi

từ phía khách hàng

 Xây dựng một trải nghiệm mua sắm độc đáo thông qua cửa hàng vật lý và trực tuyến, tập trung vào dịch vụ và trải nghiệm cá nhân hóa cho khách hàng

 Xây dựng mối quan hệ chặt chẽ với cộng đồng trẻ qua các sự kiện, hoạt động xã hội và chiến dịch quảng cáo địa phương

Trở thành nguồn cảm hứng và biểu tượng cho các bạn trẻ yêu thời trang Sicko không chỉ cung cấp sản phẩm thời trang chất lượng cao mà còn mang lại trải nghiệm mua sắm độc đáo và tinh tế

 Nam nữ nằm trong khoảng từ 17 - 35 trên phạm vi toàn quốc

 Khách hàng mục tiêu có thu nhập trung bình - khá

 Tâm lý: Yêu thích thời trang đường phố, năng động và cá tính

 Hành vi:

o Quan tâm đến chất lượng sản phẩm và trải nghiệm mua sắm

o Có khả năng chi trả cho các sản phẩm thời trang chất lượng cao

o Sẵn sàng thử nghiệm những xu hướng thời trang mới

a Nhu cầu:

pg 4

 Khách hàng có nhu cầu tìm kiếm và khám phá các sản phẩm thời trang phản ánh phong cách và sở thích của họ, bao gồm cả việc sử dụng bộ lọc và tìm kiếm theo danh mục, màu sắc, kích cỡ, và giá cả

 Họ muốn có thông tin chi tiết về sản phẩm, bao gồm hình ảnh chất lượng cao, mô tả sản phẩm đầy đủ và thông số kỹ thuật

 Khách hàng cần một trang web mua sắm trực tuyến dễ sử dụng, mượt

mà và tiện lợi, từ việc duyệt sản phẩm đến thanh toán và giao hàng

 Khách hàng có thể nhận được thông tin về các chương trình khuyến mãi, giảm giá và sự kiện đặc biệt từ trang web

b Mong muốn:

Khách hàng mục tiêu của thương hiệu thời trang trẻ mong muốn trang web của doanh nghiệp cung cấp trải nghiệm mua sắm trực tuyến tiện lợi và dễ dàng Họ muốn thấy một giao diện hiện đại, hấp dẫn và dễ sử dụng Trang web cần cung cấp thông tin chi tiết về sản phẩm, hình ảnh chất lượng cao,

và các tính năng như tìm kiếm và lọc sản phẩm để giúp họ dễ dàng tìm kiếm

và mua sắm Đồng thời, khách hàng mong đợi có các tùy chọn thanh toán và giao hàng linh hoạt và thuận tiện

c Kỳ vọng:

SICKO kỳ vọng rằng doanh nghiệp sẽ cung cấp những sản phẩm độc đáo, chất lượng và giá trị tốt Họ mong đợi sự đa dạng và linh hoạt trong sản phẩm, kết hợp với trải nghiệm mua sắm thuận tiện và dễ dàng Khách hàng cũng mong muốn được tương tác và nhận được hỗ trợ chuyên nghiệp từ doanh nghiệp, cũng như thấy thương hiệu tham gia vào các hoạt động trách nhiệm xã hội và môi trường

Mục đích của SICKO không chỉ là tạo ra một nền tảng mua sắm và biểu đạt phong cách cá nhân mà còn là một cơ hội kinh doanh thú vị, tiếp cận được nhiều khách hàng mục tiêu từ đó gia tăng doanh số Trang web giúp tiếp cận đến một lượng lớn khách hàng tiềm năng, không chỉ trong khu vực địa lý mà

còn trên toàn thế giới Nó cung cấp một cách tiếp cận thuận tiện và linh hoạt cho cả người bán và khách hàng, giúp tối ưu hóa quy trình mua sắm và giao dịch

Một trang web chuyên nghiệp và phản ánh chất lượng có thể giúp xây dựng uy tín và sự tin cậy cho thương hiệu của người bán Thông qua các chiến lược tiếp thị trực tuyến, doanh nghiệp có thể thu hút và thu thập thông tin của khách hàng tiềm năng mới

 Ai: SICKO - một thương hiệu thời trang đường phố

 Cái gì: Cung cấp quần áo và phụ kiện thời trang đường phố độc đáo, chất lượng cao

 Tại sao: sản phẩm chất lượng và giá rẻ

 Ở đâu: Bao gồm thông tin liên hệ và địa chỉ cửa hàng

 Chức năng tìm kiếm: Cho phép người dùng dễ dàng tìm thấy các sản phẩm cụ thể

 Banner, hình ảnh : để nhận diện SICKO

 Shop: gồm danh mục sản phẩm, hình ảnh sản phẩm chất lượng, thông tin mô tả sản phẩm, video sản phẩm, review

 Blog: Nội dung chủ yếu là text, hướng dẫn , các phong cách thời trang

 Liên hệ

 Chăm sóc khách hàng: nội dung chính sách mua hàng, đổi trả, bảo mật

 Liên hệ: thông tin liên hệ SICKO

pg 6

IV Cấu trúc website:

Kết hợp Hierarchical Navigation và Global Navigation, người dùng có thể dễ dàng tìm thấy thông tin họ cần.Việc sử dụng Hierarchical Navigation giúp tăng trải nghiệm người dùng, khiến trang web trở nên dễ sử dụng và trực quan hơn, cải thiện khả năng tìm kiếm của trang web, người dùng sẽ dễ dàng tìm thấy các sản phẩm cụ thể

Global Navigation dẫn đến các trang quan trọng như:

 Trang chủ

 Sản phẩm

 Tin tức

 Liên hệ Hierarchical Navigation cung cấp điều hướng chi tiết đến các loại sản phẩm

cụ thể Khi người dùng chọn một loại sản phẩm cụ thể, trang web sẽ hiển thị danh sách các sản phẩm thuộc loại đó

Giúp người dùng dễ dàng tìm thấy thông tin họ cần bằng cách tổ chức nội dung theo cách phù hợp với nhu cầu:

 Sử dụng các thẻ phân loại: Thẻ phân loại giúp người dùng phân loại nội dung theo các chủ đề hoặc loại nội dung

 Sử dụng chức năng tìm kiếm: Chức năng tìm kiếm giúp người dùng nhanh chóng tìm thấy thông tin họ cần

 Sử dụng các liên kết liên quan: Các liên kết liên quan giúp người dùng chuyển đổi giữa các trang web có liên quan

Hệ thống liên kết văn bản trên trang web: Các liên kết văn bản được bố

trí ở vị trí dễ thấy trên trang web, hỗ trợ người dùng điều hướng và tìm kiếm thông tin, sản phẩm một cách thuận tiện Định dạng liên kết phù hợp với mục đích của trang web, đồng thời thay đổi màu sắc khi được kích hoạt

 Trang chủ: Dẫn về trang chủ

 Sản phẩm: Dẫn đến trang con hiển thị các sản phẩm

 Blog: Dẫn đến trang con tin tức

 Liên hệ: Dẫn đến trang con "Liên hệ"

Hệ thống liên kết hình ảnh trên trang web:

 Hình ảnh logo: Thể hiện thương hiệu và tạo dấu ấn cho doanh nghiệp

 Hình ảnh sản phẩm: Giới thiệu sản phẩm một cách trực quan, sinh động, thu hút sự chú ý của khách hàng Khi nhấn vào sẽ dẫn đến trang thông tin chi tiết và đặt hàng sản phẩm

 Hình ảnh banner xoay vòng: Quảng bá các sản phẩm, dịch vụ hoặc chương trình khuyến mãi của doanh nghiệp Khi nhấn vào sẽ dẫn đến trang sản phẩm hoặc dịch vụ liên quan

pg 8

 Hình ảnh icon liên hệ: Cung cấp thông tin liên lạc của doanh nghiệp, hỗ trợ khách hàng dễ dàng kết nối Khi nhấn vào sẽ mở hộp thoại Messenger, liên kết đến số điện thoại hoặc địa chỉ của doanh nghiệp

Liên kết ẩn: Menu hamburger của Sản phẩm Khi click vào menu

hamburger, danh mục sản phẩm chính sẽ hiện ra

Danh mục sản phẩm chính:

 Bao gồm các danh mục sản phẩm chính như “Áo”, “Áo khoác”,

“Quần”, “Cặp sách”, “Phụ kiện”

 Khi click vào một danh mục sản phẩm chính, danh sách các danh mục sản phẩm con tương ứng sẽ hiện ra

Danh mục sản phẩm con:

 Bao gồm các danh mục sản phẩm chi tiết hơn trong danh mục sản phẩm chính

 Ví dụ: Danh mục sản phẩm con "Áo" có thể bao gồm "Áo Polo",

"Áo thun Unisex", "Áo sơ mi",

 Khi click vào một danh mục sản phẩm con, danh sách các sản phẩm thuộc danh mục con đó sẽ hiển thị

Các nút đồ họa liên kết:

 Thanh tìm kiếm sẽ có nút liên kết với thao tác thực hiện việc lọc thông tin theo từ khóa

 Tại “Tài khoản” sẽ có nút liên kết đến trang con Đăng nhập/đăng ký tài khoản

 Tại “Giỏ hàng” sẽ có nút liên kết đến trang con phần giỏ hàng (nơi khách hàng đã lưu các sản phẩm)

 Tại “Thông báo” sẽ có nút liên kết đến trang con hiển thị các thông báo

Trang con (Subsidiary pages): Xuất hiện dưới thanh điều hướng (Navigation Bar) và thụt vào lề trái

 Trang chủ: Liên kết văn bản dẫn đến trang chủ

 Danh mục: Liên kết văn bản dẫn đến trang con hiện tại

Trang đích (Landing/entry pages): Xuất hiện dưới thanh điều hướng (Navigation Bar) và thụt vào lề trái

 Tên danh mục: Liên kết văn bản dẫn đến trang con

 Tên sản phẩm: Văn bản hiển thị tên sản phẩm

Primary Navigation (Thanh công cụ chính): Bao gồm các liên kết chính

đến các trang quan trọng của trang web, bao gồm:

 Trang chủ: Dẫn về trang chủ của website

 Sản phẩm: Dẫn đến trang danh mục sản phẩm

 Blog: Dẫn đến trang blog của website

 Liên hệ: Dẫn đến trang liên hệ của website

Subsidiary Navigation (Thanh điều hướng phụ): Xuất hiện trên các trang

con của mục Sản phẩm Bao gồm các liên kết đến các danh mục sản phẩm con:

pg 10

 Áo: Dẫn đến trang danh mục sản phẩm "Áo".

 Quần: Dẫn đến trang danh mục sản phẩm "Quần"

 Phụ kiện: Dẫn đến trang danh mục sản phẩm "Phụ kiện"

Contextual Navigation (Thanh điều hướng ngữ cảnh): Xuất hiện trên các

trang con của các danh mục sản phẩm con Bao gồm các liên kết đến các loại sản phẩm cụ thể trong từng danh mục:

 Áo:

o Áo thun Unisex

o Áo sơ mi

 Quần:

o Quần short

o Quần dài

 Phụ kiện:

o Ví

o Nón

o Vớ

o Túi xách

Adaptive Navigation (Điều hướng thích ứng):Thay đổi và hiển thị các liên

kết phù hợp với từng ngữ cảnh của trang web

Trên trang sản phẩm "Áo thun", thanh điều hướng sẽ hiển thị các liên kết đến các loại áo thun khác nhau, như áo thun nam, áo thun nữ, áo thun cổ tròn, áo thun cổ V

Trên trang blog, thanh điều hướng sẽ hiển thị các liên kết đến các bài viết blog mới nhất hoặc các bài viết blog liên quan đến chủ đề đang đọc

Hình ảnh đóng vai trò vô cùng quan trọng trong việc tạo ấn tượng và thu hút người dùng khi truy cập website Chúng có khả năng tác động trực tiếp đến thị giác của người xem, dẫn đến quyết định đánh giá chất lượng thiết

kế web và thương hiệu

Sử dụng hình ảnh hiệu quả:

 Truyền tải thông điệp nhanh chóng: Hình ảnh có thể truyền tải thông điệp một cách trực quan và dễ hiểu hơn so với văn bản, giúp người xem nắm bắt nội dung website một cách nhanh chóng

 Nâng cao trải nghiệm người dùng: Hình ảnh đẹp mắt và phù hợp sẽ giúp tăng tính thẩm mỹ cho website, thu hút sự chú ý của người xem và tạo trải nghiệm tốt hơn cho họ

 Tăng hiệu quả kinh doanh: Sử dụng hình ảnh hiệu quả có thể giúp doanh nghiệp thu hút khách hàng tiềm năng, tăng tỷ lệ chuyển đổi

và thúc đẩy doanh số bán hàng

Yếu tố thiết kế hình ảnh:

 Phù hợp với phong cách thương hiệu: Hình ảnh cần đồng nhất với phong cách thiết kế chung của website và thương hiệu, thể hiện được bản sắc và giá trị của doanh nghiệp

 Chất lượng cao: Hình ảnh cần có độ phân giải cao, rõ ràng và sắc nét để tạo ấn tượng tốt với người xem

 Liên quan đến nội dung: Hình ảnh cần có liên quan mật thiết đến nội dung website để giúp người xem dễ dàng hiểu được thông điệp

mà doanh nghiệp muốn truyền tải

pg 12

2 Phông chữ và kiểu chữ:

Font chữ Kode Mono là một font chữ sans-serif hiện đại, năng động, phù hợp với giới trẻ là đối tượng website nhắm tới Nhóm lựa chọn Kode Mono làm font chữ chính cho website của bạn bởi những lý do sau:

Dễ đọc và rõ ràng:

Font chữ Kode Mono:

Kode Mono có nét chữ vuông vắn nhưng vẫn đảm bảo sự rõ ràng và dễ đọc cho người dùng Nhờ vậy, nội dung website sẽ được truyền tải một cách hiệu quả, giúp người dùng dễ dàng tiếp thu thông tin

Hiện đại và năng động:

Kode Mono mang phong cách hiện đại, năng đọng, phù hợp với xu hướng hiện nay Font chữ này góp phần tạo nên giao diện website chuyên nghiệp

và thu hút, giúp nâng cao hình ảnh

Linh hoạt và đa dạng:

Kode Mono có nhiều kiểu chữ (Regular, Italic, Bold, etc.) và độ dày khác nhau, cho phép sử dụng linh hoạt trong từng trường hợp Ví dụ:

 Font chữ Kode Mono Regular: Dùng cho nội dung chính, mô tả sản phẩm, dịch vụ

 Font chữ Kode Mono Bold: Dùng cho tiêu đề, danh mục sản phẩm, thông tin quan trọng

Tương thích tốt:

Kode Mono là font chữ web được Google Fonts hỗ trợ, đảm bảo tương thích tốt với nhiều trình duyệt và thiết bị Nhờ vậy, website sẽ hiển thị đẹp mắt và đồng nhất trên mọi nền tảng

Lựa chọn bảng màu:

Màu sắc chủ đạo: Nhóm lựa chọn màu trắng làm gam màu chủ đạo cho website Bảng màu được phối hợp dựa trên các nguyên tắc phối màu cơ bản trong thiết kế

pg 14

Lý do lựa chọn:

Màu trắng mang đến cảm giác tươi mới, năng động và trẻ trung, tạo sự cân bằng

Phối màu trắng đơn sắc: Sử dụng một màu chủ đạo hoặc nhiều sắc độ khác nhau của cùng một màu giúp tạo sự hài hòa, thống nhất cho website

Lợi ích:

 Tăng tính thẩm mỹ: Bảng màu đẹp mắt sẽ thu hút sự chú ý của khách hàng và tạo ấn tượng tốt về thương hiệu

 Nâng cao trải nghiệm người dùng: Bảng màu dễ nhìn sẽ giúp khách hàng dễ dàng tìm kiếm thông tin và sản phẩm trên website

 Thể hiện bản sắc thương hiệu: Bảng màu phù hợp sẽ giúp thể hiện phong cách và giá trị của thương hiệu Sicko

Nội dung chính là phần quan trọng nhất của website, nơi thu hút sự chú ý của khách hàng và truyền tải thông điệp của doanh nghiệp Nhóm thiết kế

sẽ bố trí nội dung chính ở vị trí trung tâm của giao diện web, đảm bảo dễ nhìn và dễ tiếp cận cho người dùng bằng cách sắp xếp nội dung hợp lý:

 Sử dụng tiêu đề rõ ràng: Sử dụng tiêu đề rõ ràng và súc tích để người dùng dễ dàng hiểu được nội dung của từng phần

 Sử dụng hình ảnh và video: Hình ảnh và video giúp thu hút sự chú ý

và tăng tính hấp dẫn cho nội dung

 Sử dụng phông chữ dễ đọc: Chọn phông chữ dễ đọc và phù hợp với phong cách của website

 Sử dụng bố cục khoa học: Bố trí nội dung hợp lý, khoa học và dễ nhìn

Logo:

Là yếu tố nhận diện thương hiệu quan trọng, giúp người dùng dễ dàng nhận biết và ghi nhớ

Vị trí: Góc trên cùng header, chính giữa menu điều hướng, vị trí dễ nhận thấy nhất

Menu điều hướng:

Giúp người dùng dễ dàng điều hướng đến các trang khác trong website

Bố trí dựa trên các mục chính: giới thiệu, sản phẩm, dịch vụ, đối tác, tin tức, liên hệ,

Slider/banner quảng cáo:

Hiển thị ngay dưới phần header, thu hút sự chú ý của người dùng Giúp quảng bá sản phẩm, dịch vụ và tăng tính hấp dẫn cho website Hình ảnh phải được lựa chọn kỹ lưỡng, thiết kế đẹp mắt

pg 16