Logo của Helios Trang sức bạc Helios được sáng lập vào năm 2016 bởi một nhóm các nghệ nhân Việt Nam - Có niềm đam mê với trang sức, với mục tiêu tạo ra những sản phẩm trang sức mang đậm
GIỚI THIỆU VỀ HEIOS
Giới thiệu chung về doanh nghiệp
Trang sức bạc Helios được sáng lập vào năm 2016 bởi một nhóm các nghệ nhân Việt Nam - Có niềm đam mê với trang sức, với mục tiêu tạo ra những sản phẩm trang sức mang đậm phong cách ĐỘC ĐÁO - CHẤT NGẦU và phù hợp với xu hướng thị trường hiện đại
Với tinh thần sáng tạo và kỹ thuật chế tác tinh xảo, trang sức bạc Helios nhanh chóng thu hút được sự chú ý từ giới trẻ Mỗi mẫu trang sức của Helios đều mang đậm dấu ấn của sự tinh tế và đẳng cấp, đồng thời thể hiện sự kết hợp tuyệt vời giữa phong cách truyền thống và hiện đại
Bên cạnh việc sáng tạo, Helios còn được biết đến với chất lượng sản phẩm và dịch vụ chăm sóc khách hàng chuyên nghiệp - mang đến cho khách hàng những trải nghiệm trọn vẹn.
Tuyên bố sứ mệnh và giá trị
“Đem những chế tác, sản phẩm được tạo ra từ đôi bàn tay thuần
Việt vươn tầm thế giới.”
+ Sáng tạo: Helios luôn không ngừng sáng tạo cho ra đời những sản phẩm được thiết kế thủ công, tỉ mỉ dành cho cả nam giới và nữ giới
+ Sự kết hợp hoàn hảo: “CHUẨN - CHẤT - NGẦU” là điều
Helios cam kết đem đến cho khách hàng
+ Lắng nghe: Helios luôn sẵn lòng lắng nghe ý kiến từ khách hàng, không ngừng đổi mới sao cho phù hợp với nhu cầu của khách hàng.
Thông tin liên hệ
+ Store 1: Số 4, Ngõ 104 Lê Thanh Nghị, Hai Bà Trưng, Tp Hà Nội + Store 2: 672, Nguyễn Trãi, P Thanh Xuân Bắc, Q Thanh Xuân, Tp
ĐÁNH GIÁ WEBSITE HIỆN TẠI
Đánh giá content của website hiện tại
Hình 2 Trang chủ của Helios
Trang chủ là trang đầu tiên mà người dùng thường truy cập khi vào một trang web Trang chủ có vai trò rất quan trọng trong việc tạo ấn tượng, cung cấp thông tin, hướng dẫn điều hướng và thúc đẩy mua hàng của người dùng Ở đây trang chủ của Helios được tạo ra với thiết kế khá ấn tượng và cung cấp đầy đủ thông tin cho khách hàng về thông tin của hàng, các chính sách, danh mục sản phẩm, thanh tìm kiếm, giỏ hàng
Theo nghiên cứu của Forrester Research cho thấy 43% khách truy cập trang web luôn tìm đến thanh tìm kiếm, Tuy nhiên Helios lại chưa tối ưu công cụ tìm kiếm của mình khi chưa kết hợp với việc được ra gợi ý từ khóa, tính năng tự động hoàn thành
Màu sắc mà homepage của Helios chủ đạo là màu đen, xám, trắng thể hiện được sự mạnh mẽ, độc đáo như hình ảnh mà thương hiệu mang lại
Có phần chi tiết trước khi đi vào Subsidiary pages giúp khách hàng có thể nhanh chóng đến trang mà họ quan tâm
Hình 3 Chi tiết danh mục sản phẩm giúp khách hàng dễ lựa chọn
Tuy nhiên trang có liên kết với các trang khác ở phần ‘Eyewear’ và
‘Global shop’ tuy nhiên lại đặt vị trí chèn giữa các trang con gây rối thanh header Helios lại để phần mô tả chi tiết sản phẩm ở trang home page, điều này làm hạn chế không gian truyền tải câu chuyện hơn, vì khi người dùng vào trang homepage họ sẽ dễ bị ấn tượng bởi những câu chuyện mà doanh nghiệp truyền tải hơn rồi mới bắt đầu vào trang sản phẩm
1.2 Trang con (Subsidiary pages) a Trang giới thiệu (About us)
Trang giới thiệu thường được xem là không quan trọng và nhiều trang web bỏ qua phần này nhưng đây là một sai lầm Theo một nghiên cứu cho thấy có tới 52% người dùng truy cập trang About Us đầu tiên khi họ truy cập vào trang web Một trang giới thiệu tốt có thể đem lại những lợi ích cho doanh nghiệp như: Xây dựng uy tín cho doanh nghiệp, cung cấp thông tin sản về phẩm hoặc dịch vụ, kết nối với những khách hàng mục tiêu, tạo dấu ấn thương hiệu Nội dung hiện tại của trang web Helios khá chỉn chu khi cung cấp đầy đủ các thông tin lịch sử hình thành, sứ mệnh của Helios, ý nghĩa của các tác phẩm được chế tác và tên thương hiệu cũng được nêu rõ Việc thêm các hình ảnh minh họa cũng là một điểm cộng tránh sự nhàm chán cho trang giới thiệu, tuy nhiên các hình ảnh có kích thước và căn chỉnh không đồng đều có thể sẽ gây khó chịu cho người xem b Trang liên hệ (Store)
Trang này cung cấp những thông tin về địa chỉ và số điện thoại của từng cơ sở của Helios Ở trang liên hệ này mặc dù cung cấp đầy đủ thông tin tại từng cơ sở tuy nhiên Helios vẫn chưa chỉnh chu về font chữ hay kích cỡ chữ, cách làm nổi bật từng nơi
Hình 4 Trang liên hệ (Store) c Trang sản phẩm (Jewelry, Accessories và Gift)
Hình 5 Trang sản phẩm (Jewelry, Accessories và Gift)
Theo Katie Sherwin - chuyên gia về UX đến từ Nielsen Norman Group, ở mức tối thiểu, các trang sản phẩm phải có những thành phần cốt lõi sau (Sherwin, 2019):
• Hình ảnh sản phẩm có thể nhận dạng được
• Chế độ xem phóng to của hình ảnh sản phẩm
• Mô tả sản phẩm ngắn gọn và đầy đủ thông tin
• Giá, bao gồm mọi khoản phí bổ sung dành riêng cho sản phẩm
• Khả năng xóa các tùy chọn sản phẩm, chẳng hạn như màu sắc và kích thước
• Tình trạng sẵn có của sản phẩm
• Cách để thêm một sản phẩm vào giỏ hàng và phản hồi khi nó được thêm vào
Trang sản phẩm của Helios đáp ứng đầy đủ các yêu cầu cơ bản của một trang sản phẩm của một website thương mại điện tử.Helios cung cấp đầy đủ các thông tin về tên và giá sản phẩm, hình ảnh và video minh họa đẹp, rõ nét, nhiều góc độ giúp đánh giá sản phẩm được khách quan hơn
Thanh lọc sản phẩm nằm bên trái màn hình - hỗ trợ người dùng có thể lọc sản phẩm một cách dễ dàng, điều này cũng tăng trải nghiệm của khách hàng khi muốn tìm một sản phẩm nào đó
Hình 6 Thanh lọc sản phẩm nằm bên trái màn hình của Helios
Về trang chi tiết sản phẩm thì các thông tin về chi tiết về thông tin các sản phẩm cũng được mô tả một cách rõ ràng chính xác và ngắn gọn về chất liệu, bảo hành và câu chuyện của từng sản phẩm Bên cạnh đó còn cung cấp bảng size dành cho những chiếc nhẫn của Helios có kết hợp với nút ‘Thêm vào giỏ hàng’, ‘Mua ngay’, tùy chỉnh số lượng giúp thuận tiện hơn khi khách hàng muốn mua sản phẩm
Hình 7 Bảng mô tả kích cỡ sản phẩm của Helios
Cùng với đó là các phản hồi của khách hàng từ tiêu cực đến tích cực và có cả tính năng phản hồi bằng hình ảnh và video giúp cho người dùng có thể có một đánh giá khách quan về sản phẩm để có những trải nghiệm tốt nhất khi mua sản phẩm Ngoài ra đây là phương tiện để Helios có thể thu thập các ý kiến từ khách hàng để có những sửa đổi, cải tiến cần thiết để ngày càng mang lại sự hài lòng đến với khách hàng
Hình 8 Phản hồi từ khách hàng của Helios
Tại trang sản phẩm chi tiết Helios còn bổ sung phần các sản phẩm liên quan, tuy phần này không bắt buộc nhưng đây là một điểm cộng dành cho Helios khi thêm phần này để tăng tính trải nghiệm tại đây Khách hàng có thể tìm thấy những sản phẩm tương tự về mẫu mã mà không gặp nhiều khó khăn vì quá nhiều sản phẩm
Tuy nhiên Helios chỉ phân loại danh mục sản phẩm theo từng dòng sản phẩm, nên bổ sung thêm các sản phẩm bán chạy nhất và nổi bật nhất vì các sản phẩm của Helios về nhẫn, dây chuyền, vòng tay rất nhiều việc này có thể gây khó khăn trong việc tìm kiếm các sản phẩm phù hợp với bản thân Thêm các danh mục này còn giúp tăng tính chuyên nghiệp của trang Web
Hình 9 Helios cung cấp những sản phẩm có liên quan
Những thông tin về sản phẩm Helios còn cung cấp thêm mục các câu hỏi thường gặp Tuy nhiên mục này nên có một mục riêng dành cho nó để khách hàng có thể thấy dễ dàng hơn
Hình 10 Những câu hỏi thường gặp d Trang giỏ hàng và trang thanh toán
Trang giỏ hàng khá đầy đủ thông tin đơn hàng giúp khách hàng dễ dàng kiểm tra trước khi thanh toán và có nút dẫn nhanh sang trang thanh toán khá tiện lợi
Trang thanh toán được thiết kế dễ nhìn, đầy đủ thông tin và dễ dàng sử dụng đối với mọi người và phương thức thanh toán được Helios cung cấp gồm cả hình thức phí cod và thanh toán online điều này là một điều cần thiết vì nó tạo sự thuận tiện cho khách hàng, tăng tính trải nghiệm và tăng lượng khách hàng cho Helios e Trang bộ sưu tập (Collection)
Trang tổng hợp các bộ sưu tập theo câu chuyện và ý nghĩa riêng Mỗi câu chuyện và hình ảnh của thương hiệu truyền tải khá bắt mắt và thu hút
Hình 13 Trang bộ sưu tập
Đánh giá cấu trúc của website hiện tại
Hình 16 Cấu trúc của website hiện tại
Cấu trúc website hiện tại là cấu trúc phân cấp (Hierarchical structure) Lúc này, website được tổ chức thành các danh mục và danh mục con trong khi đó vẫn có sự sắp xếp theo thứ tự cố định Việc sử dụng dạng cấu trúc kết hợp này phù hợp với một website bán hàng và có nhiều dòng sản phẩm Đồng thời giúp cải thiện trải nghiệm người dùng bằng cách cung cấp điều hướng rõ ràng và nhất quán, cho phép người dùng tìm thấy những gì họ cần một cách dễ dàng và nhanh chóng.
Đánh giá hệ thống điều hướng của website hiện tại
Website hiện tại sử dụng thanh điều hướng theo chiều ngang (Horizontal navigation bar) Ở giao diện trên điện thoại thì website sử dụng hamburger menu để phù hợp với kích thước màn hình điện thoại theo nguyên tắc RWD
Hình 17 Hệ thống điều hướng của website hiện tại
Breadcrumb trail giúp người dùng hình dung nội dung được cấu trúc như thế nào và cách điều hướng trở lại các trang web trước đó, đồng thời có thể xác định vị trí hiện tại trong một loạt trang web Breadcrumb trail hiển thị các vị trí trong đường dẫn mà người dùng đã đi để đến trang web hoặc nó hiển thị vị trí của trang web hiện tại trong tổ chức của trang web (W3C, 2016) Việc sử dụng breadcrumb trail rất phù hợp với website bán hàng như Helios khi sản phẩm được phân thành nhiều cấp khác nhau, giúp tối ưu hóa quá trình tìm kiếm sản phẩm của khách hàng
Hình 18 Breadcrumb trail của website hiện tại
Đánh giá look & feel của website hiện tại
Sử dụng font - size đồng nhất b Typeface
Website của Helios sử dụng kiểu chữ Amiri, serif, một font chữ tối giản, được thiết kế để thích ứng với màn hình kỹ thuật số ở mọi kích cỡ tối ưu trải nghiệm đọc cho người dùng (Kim Ngọc, 2022)
Hình 19 Website hiện tại sử dụng font-size đồng nhất
4.2 Màu sắc và độ tương phản a Color scheme
Hình 20 Color scheme của website hiện tại
Website hiện tại sử dụng màu sắc phù hợp với bộ nhận diện thương hiệu và định vị của doanh nghiệp - thương hiệu trang sức cao cấp, sang trọng, tinh tế và chất lượng cao b Độ tương phản
Theo kết quả phân tích của Google Lighthouse, một số văn bản ở website hiện tại của Helios có độ tương phản thấp so với màu nền khiến nhiều người dùng khó đọc hoặc không thể đọc được, chẳng hạn như chữ màu vàng trên nền trắng (Google Lighthouse, 2022), dẫn đến làm giảm trải nghiệm người dùng
Hình 21 Màu văn bản và màu nền của website hiện tại có độ tương phản thấp
Ngoài ra, khi tiến hành kiểm tra tỷ lệ tương phản màu sắc bằng cách sử dụng Adobe Color thì cũng cho ra kết quả rằng việc sử dụng chữ màu vàng trên nền trắng là không phù hợp (Adobe Color, n.d.)
Hình 22 Tỷ lệ tương phản màu sắc của website hiện tại không phù hợp
Hình 24 Page layout a Vị trí logo
Logo đóng vai trò như một điểm mốc định hướng cho người dùng khi họ lần đầu tiên truy cập một trang và giúp họ xác định trang web họ đang truy cập (Whitenton, 2016) Biết được điều đó, logo của Helios được hiển thị với kích thước lớn ở vị trí trung tâm giúp thu hút người dùng Tuy nhiên, một nghiên cứu được thực hiện bởi Nielsen Norman Group đã chỉ ra rằng, logo ở giữa làm giảm website usability (khả năng sử dụng trang web), ảnh hưởng đến trải nghiệm người dùng và điều hướng của website (Whitenton, 2016) Điều này cũng khiến kích thước navigation bar trở nên quá lớn kết hợp với thiết kế ở dạng Freezes chứ không phải Scrolls with site, có nghĩa là khi người dùng cuộn trang web thì navigation bar vẫn giữ nguyên vị trí Việc đặt logo ở vị trí như vậy làm thu hẹp không gian hiển thị của website, nội dung Vị trí logo trên website hiện tại Page layout của website hiện tại hình ảnh không được hiển thị đầy đủ do bị navigation bar ảnh hưởng khiến người dùng cảm thấy khó khăn trong việc tiếp cận thông tin b Footer
Theo chuyên gia đến từ Hubspot, không có công thức cụ thể nào để thiết kế một footer mà còn tùy thuộc vào mục đích của website và những yếu tố khác liên quan đến người dùng, tuy nhiên footer của một website thường nên bao gồm những phần như sau (Fitzgerald, 2022):
• Thông báo bản quyền (Copyright Notice)
• Liên kết chính sách quyền riêng tư (Privacy Policy Link)
• Sơ đồ trang web (Sitemap)
• Thông tin liên lạc (Contact Information)
• Biểu tượng truyền thông xã hội (Social Media Icons)
• Mẫu đăng ký email (Email Sign-up Form)
Hình 25 Footer của website hiện tại
Hiện tại website footer của Helios đã được thiết kế khá đầy đủ tuy nhiên footer vẫn còn thiếu một số phần quan trọng như Logo, Sitemap, Priacy Policy Link
4.4 Mobile - Friendly layout - Responsive web design (RWD)
Hình 26 Số liệu thống kê về việc truy cập web bằng điện thoại di động trên toàn thế giới Điện thoại di động chiếm khoảng một nửa lưu lượng truy cập web trên toàn thế giới Trong quý cuối cùng của năm 2023, thiết bị di động (không bao gồm máy tính bảng) đã tạo ra 58,67% lưu lượng truy cập trang web toàn cầu Điện thoại di động và điện thoại thông minh liên tục tăng ở mức 50% kể từ đầu năm 2017, trước khi vượt qua con số này vào năm 2020
Việc xây dựng một mobile-friendly website giờ đây trở nên quan trọng hơn bao giờ hết và Helios chưa làm được điều đó khi website của Helios chưa thể sử dụng tốt trên cả máy tính và điện thoại di động Kết quả sau khi thực hiện Mobile-Friendly Test cho thấy rằng website hiện tại của Helios chưa đạt yêu cầu của một mobile-friendly website (Google Search Console, 2022)
Hình 27 Website hiện tại chưa đtaj yêu cầu của một mobile-friendly website
Và thiết kế web đáp ứng - Responsive Web Design (RWD) là một trong những cách giúp website của Helios trở nên thân thiện với thiết bị di động hơn Theo dữ liệu từ GoodFirms, 73,1% nhà thiết kế web cho rằng non-responsive design là lý do hàng đầu khiến khách truy cập rời khỏi trang web (Sebastian, 2023)
Thiết kế web đáp ứng, được định nghĩa ban đầu bởi Ethan Marcotte trong A List Apart, đáp ứng nhu cầu của người dùng và thiết bị họ đang sử dụng Bố cục thay đổi dựa trên kích thước và khả năng của thiết bị (Marcotte, 2010) Cũng theo Nielsen Norman Group, thiết kế web đáp ứng (RWD) là một phương pháp phát triển web tạo ra những thay đổi linh hoạt về giao diện của trang web, tùy thuộc vào kích thước màn hình và hướng của thiết bị được sử dụng để xem nó RWD là một cách tiếp cận vấn đề thiết kế cho vô số thiết bị có sẵn cho khách hàng, từ điện thoại nhỏ đến màn hình máy tính để bàn khổng lồ (Schade, 2014) Dưới đây là một số sự thay đổi trong giao diện website của Helios khi truy cập trên hai loại thiết bị - Laptop/Desktop và Mobile phone:
ĐỀ XUẤT THAY ĐỔI
Đề xuất thay đổi về content
Phần trang chủ Helios nên cải thiện thanh tìm kiếm Tối ưu phần header, chỉnh sửa và sắp xếp các thanh điều hướng hợp lý hơn
1.2 Trang con (Subsidiary pages) a Đề xuất thay đổi trang giới thiệu
Như đã được nêu ở phần trước thì trang giới thiệu được Helios đầu tư khá chỉnh chu tuy nhiên Helios cần chỉnh lại các hình ảnh ở trang này cần được chỉnh cùng kích cỡ và căn chỉnh đồng đều với nhau để tránh gây khó chịu cho người xem b Đề xuất thay đổi trang liên hệ
Trang liên hệ được Helios trình bày rất chi tiết và đầy đủ thông tin tuy nhiên nên thay đổi về font và kích cỡ chữ hợp lý hơn và các địa chỉ nên được làm nổi bật hơn c Đề xuất thay đổi trang sản phẩm
Về phần danh mục sản phẩm Helios nên bổ sung thêm danh mục sản phẩm bán chạy nhất, sản phẩm mới, nổi bật nhất d Đề xuất thay đổi trang bộ sưu tập
Bố cục, tỷ lệ giữa hình ảnh và chữ cần được chỉnh lại so cho phù hợp hơn e Đề xuất thêm mục Q&A
FAQs giúp trang web tối ưu hóa SEO, cải thiện thứ hạng và tăng lượt truy cập trang web Bên cạnh đó, FAQs cũng giúp tăng chuyển đổi, tăng doanh số Chính vì vậy nên tách mục này thành một trang con thay vì đặt phần này trong trang sản phẩm.
Đề xuất thay đổi look and feel
2.1 Đề xuất tăng độ tương phản
Theo phân tích về độ tương phản mà chúng tôi đã đề cập trước, chữ trắng trên nền vàng khiến người dùng khó đọc hoặc không thể đọc được (Google Lighthouse, 2022) và việc kết hợp hai màu này với nhau cũng được đánh giá là không phù hợp (Adobe Color, n.d.) Đồng thời, theo một nghiên cứu của Nielsen Norman Group, độ tương phản không đủ giữa màu văn bản và nền làm giảm trải nghiệm người dùng vì những lý do sau (Sherwin, 2015):
• Tính dễ đọc bị ảnh hưởng
• Khả năng phát hiện và tìm thấy bị giảm
• Niềm tin của người dùng giảm sút
• Việc đọc thông tin khi sử dụng di động càng trở nên khó khăn hơn trong điều kiện ánh sáng quá cao
• Khả năng tiếp cận bị giảm nghiêm trọng đối với người dùng có thị lực kém hoặc suy giảm nhận thức
• Căng thẳng nhận thức tăng lên Để khắc phục vấn đề này, chúng tôi đề xuất tăng độ tương phản bằng cách thay đổi từ nền vàng chữ trắng thành nền đỏ chữ đen, đây cũng là hai màu được lấy từ color scheme của website hiện tại nhằm đảm bảo tính đồng nhất Đề xuất này đã được kiểm chứng thông qua Adobe Color và nhận được kết quả đạt chuẩn Sự điều chỉnh này không chỉ giúp tăng độ tương phản mà còn tạo điểm nhấn thu hút người dùng, có tác động đến hành vi mua của người dùng, tạo cảm giác khẩn trương, tránh bỏ lỡ cơ hội (theo tạp chí “Management Decision”)
Hình 30 Kết quả kiểm chứng cho nền đỏ chữ đen bởi Adobe Color
2.2 Đề xuất thay đổi về trang sản phẩm
Việc sử dụng hình ảnh có kích thước quá lớn, không phù hợp với màn hình của người dùng, sẽ làm cho trang web trở nên khó sử dụng và gây rối mắt Người dùng sẽ cảm thấy bất tiện khi phải cuộn trang hoặc phải thực hiện các thao tác khác để có thể xem được hình ảnh đầy đủ Dựa trên điều đó, chúng tôi đề xuất Helios nên thay đổi kích thước hình ảnh từ 720x720 pixels sang 470x470 pixels trong trang mô tả sản phẩm để tối ưu hóa trải nghiệm chọ người dùng
Hình 31 Trang sản phẩm của website hiện tại chưa tối ưu
2.3 Đề xuất thay đổi về Page Layout
2.3.1 Thay đổi vị trí logo từ giữa sang bên trái
Như đã đề cập, logo ở giữa làm giảm website usability (khả năng sử dụng trang web), ảnh hưởng đến trải nghiệm người dùng và điều hướng của website (Whitenton, 2016) Vậy nên, chúng tôi đề xuất nên di chuyển logo sang bên trái hoặc bên phải của website
Việc đặt logo bên trái hoặc bên phải cũng là một nhân tố quyết định đến trải nghiệm người dùng Câu hỏi đặt ra là: nên chọn bên trái hay bên phải? Một nghiên cứu khác của Whitenton đã đưa ra kết luận rằng người dùng có khả năng nhớ các logo được hiển thị ở vị trí truyền thống trên cùng bên trái website cao hơn 89% so với các logo được đặt ở bên phải (Whitenton, 2016) Thêm vào đó, vào năm 2017, Nielsen Norman Group
WEB PALNNING
Xác định mục đích và target audience của website
1.1 Website goals a Mục đích chính (Primary goal)
Mục đích bán hàng trên website b Mục đích phụ (Secondary goal)
- Cung cấp thông tin doanh nghiệp và sản phẩm đến khách hàng
- Tăng độ uy tín cho doanh nghiệp
- Hỗ trợ doanh nghiệp giúp tăng độ nhận diện
1.2 Website objectives Để đạt được các mục đích của website, chúng tôi đặt ra các mục tiêu SMART như sau:
- Tăng doanh số bán hàng của dòng sản phẩm của bộ sưu tập mới
“The Shape of Love” của Helios lên 150 sản phẩm/tháng trong vòng 6 tháng
- Đạt được tỷ lệ chuyển đổi từ lần xem sản phẩm đến mua hàng trực tuyến tăng từ 2% lên 4% trong vòng 3 tháng
- Tăng lượng tương tác trên các nền tảng truyền thông xã hội của Helios lên 40% qua các chiến dịch quảng cáo và nội dung sáng tạo trong vòng 6 tháng
- Phát triển một dòng sản phẩm mới của Helios dựa trên phản hồi từ khách hàng và xu hướng thị trường, đảm bảo rằng nó phản ánh phong cách và giá trị của thương hiệu
- Triển khai chiến lược quảng cáo và tiếp thị để tăng 10% doanh số bán hàng trong dịp lễ lớn như Giáng sinh và Valentine's Day trong vòng 2 tháng trước mỗi sự kiện
1.3 Target audience a Đặc điểm nhân khẩu học (Demographic characteristics)
Khu vực sống Đa dạng vùng miền tại Việt Nam Tôn giáo Bất kỳ
Nghề nghiệp Bất kỳ Thu nhập Trên 15 triệu VNĐ/ tháng b Đặc điểm hành vi (Behavioral characteristics)
Phong cách sống Lịch lãm, mạnh mẽ, cá tính
Sở thích Quan tâm sâu về tính độc nhất, thể hiện chủ nghĩa cá nhân hoàn hảo đối với mỗi người
Giao tiếp xã hội Tự tin, sáng tạo và quyết đoán
Thường xuyên gặp những người đối tác, bạn bè
Hành vi mua hàng Thường lựa chọn sản phẩm dựa trên ấn tượng khi xem quảng cáo Trung thành với hãng trang sức Nghiên cứu về câu chuyện của mỗi sản phẩm trước khi ra quyết định
Nhu cầu về sản phẩm
Quan trọng ý nghĩa mà sản phẩm mang lại Bền bỉ, thời trang, khó bị lỗi thời
Sản phẩm cần độc đáo, mới lạ và ý nghĩa c Đặc điểm tâm lý (Psychographic characteristics)
Tính cách Thích thể hiện bản thân, mạnh mẽ, có cá tính riêng
Sự quan tâm Sự tinh tế và chất lượng
Quan trọng tính nghệ thuật Thể hiện cá tính riêng
Nỗi sợ Sản phẩm không chính hãng, đại trà
Thiếu sự nam tính Không ứng dụng được vào trang phục hằng ngày
Tầng lớp xã hội Trung lưu
Thói quen mua sắm Ưu tiên sự tiện lợi mà mua sắm online mang lại, vì khối lượng công việc nhiều Trong các dịp lễ đặc biệt d Target audience profile
Xác định content của website
+ Tên và logo doanh nghiệp Helios rõ ràng giúp nâng cao độ nhận diện thương hiệu
+ Sử dụng slideshow hoặc các thẻ để hiển thị những dòng sản phẩm mới, sự kiện, chương trình khuyến mãi
+ Sử dụng các icon giỏ hàng, tìm kiếm ở header để khách hàng có thể theo dõi thông tin đơn hàng,
+ Sử dụng các lời kêu gọi mua hàng (call-to-action)
+ Cung cấp lý do tại sao người dùng nên truy cập và tương tác với trang web
+ Liên kết đến các trang con cung cấp thông tin chi tiết như sản phẩm, các chính sách, thông tin liên hệ,…
+ Cung cấp các tin tức, thông báo và chương trình ưu đãi mới nhất
+ Sử dụng các liên kết điều hướng dễ dàng xác định nơi tìm thấy thông tin hoặc tính năng cụ thể trên trang web
+ Sử dụng Search Feature kèm theo các tính năng Autocomplete, Autosuggest, Filters & facets
Website sẽ bao gồm các trang con sau:
- Trang Giới thiệu – Tóm tắt lịch sử hình thành và phát triển, câu chuyện của thương hiệu, tuyên bố giá trị và sứ mệnh
- Trang các sản phẩm quà tặng
- Trang các bộ sưu tập
- Trang các sản phẩm sale
- Trang Câu hỏi thường gặp (FAQs) – Về đặt hàng, giao hàng, sản phẩm
- Trang Chính sách – Đặt hàng, thanh toán, giao hàng, đổi trả, khách hàng thân thiết
- Trang Liên hệ – Thông tin liên hệ (Địa chỉ cửa hàng, email, số điện thoại, hotline, liên kết mạng xã hội, ngày và giờ làm việc), mẫu đăng ký email, CTAs, chatbox.
Lựa chọn bố cục website
Hình 32 Lựa chọn bố cục website
Cấu trúc kết hợp giữa cấu trúc tuyến tính (Linear/Tutorial Structure) và cấu trúc phân cấp (Hierarchical structure) sẽ được giữ lại vì nhận thấy được tính phù hợp với mục tiêu của website, đối tượng người dùng mà website hướng đến và nội dung mà Helios muốn đem đến cho khách hàng mục tiêu Tuy nhiên có một vài sự thay đổi ở các nhánh trong cấu trúc website do sự thay đổi ở phần nội dung.
Xác định hệ thống điều hướng website
4.1 Thanh điều hướng theo chiều ngang (horizontal navigation bar)
Hình 33 Thanh điều hướng theo chiều ngang
Thiết kế look and feel của website
Chúng tôi quyết định giữ nguyên font-size và kiểu chữ Amiri, serif trước đó
5.2 Màu sắc và độ tương phản Để đảm bảo tính đồng nhất với bộ nhận diện thương hiệu của Helios, chúng tôi sẽ sử dụng color scheme của website cũ cho website mới Ngoài ra color scheme hiện tại cũng đang thể hiện rất tốt định vị của thương hiệu nên rất phù hợp để tiếp tục sử dụng
Hình 35 Giữ nguyên color scheme của website cũ
Phát triển kế hoạch kiểm tra, xuất bản và duy trì website
6.1 Tự kiểm tra (Self testing) & kiểm tra nội bộ (Internal testing)
Giai đoạn đầu tiên của quá trình kiểm tra trang web trước khi xuất bản là tự kiểm tra (Self testing) hoặc kiểm tra nội bộ (Internal testing) Trong giai đoạn này, doanh nghiệp hoặc nhóm phát triển web nội bộ của doanh nghiệp kiểm tra và đánh giá cấu trúc và bố cục trang, cách phối màu và các yếu tố khác của trang web Quá trình kiểm tra cần thực hiện theo các bước như sau:
(1) Đảm bảo rằng tất cả hình ảnh và animated elements đều hoạt động như dự định Xác minh mã trang không chứa lỗi chính tả của tên hình ảnh hoặc tệp đa phương tiện và không liên kết đến vị trí thư mục không hợp lệ hoặc trang web bên ngoài
(2) Kiểm tra các công cụ điều hướng và tìm kiếm cũng như kiểm tra cấu trúc của trang web để xác định xem khách truy cập có thể tìm thấy tất cả các trang một cách dễ dàng hay không.\
(3) Kiểm tra tất cả các liên kết để đảm bảo chúng hoạt động bình thường và không có liên kết nào bị hỏng
(4) Xác nhận rằng có một văn bản tương đương cho tất cả các thành phần không phải văn bản để đáp ứng các nguyên tắc WAI dành cho hình ảnh và đa phương tiện
(5) Sử dụng bất kỳ công cụ tối ưu hóa nào do công cụ thiết kế web hoặc
CMS cung cấp, chẳng hạn như xác thực và dọn dẹp HTML, kiểm tra khả năng truy cập và tốc độ trang web
(6) Đảm bảo tuân thủ RWD bằng cách sử dụng các trình duyệt, thiết bị và kích thước màn hình khác nhau để thực hiện các bước 1 đến 5
(7) Khắc phục mọi vấn đề và kiểm tra lại toàn bộ để xác minh xem các sửa đổi của bạn có giải quyết được vấn đề và không tạo ra bất kỳ vấn đề mới nào không
6.2 Kiểm tra khán giả mục tiêu (Target Audience TestiGi)
Giai đoạn thử nghiệm thứ hai liên quan đến việc tuyển dụng một nhóm nhỏ làm người thử nghiệm Quan sát người kiểm tra hoặc sử dụng các công cụ phân tích để xác định những điều sau:
- Những trang nào có vẻ hấp dẫn họ?
- Những trang nào có vẻ khiến họ không quan tâm?
- Họ dành bao nhiêu thời gian cho các trang khác nhau?
- Họ truy cập hoặc bỏ qua những liên kết nào?
- Họ điều hướng trang web dễ dàng như thế nào?
- Họ có bất kỳ lúc nào tỏ ra bối rối hoặc thất vọng không?
Yêu cầu người thử nghiệm hoàn thành một bản khảo sát để họ có thể bày tỏ ý kiến thẳng thắn của mình Ngoài việc xác định các cài đặt cụ thể (chẳng hạn như phiên bản trình duyệt, độ phân giải màn hình và kích thước và loại thiết bị) mà người kiểm tra đang sử dụng, khảo sát phải bao gồm các câu hỏi trả lời các nguyên tắc UX sau:
- Nội dung của trang web có đáp ứng được nhu cầu, mong muốn và mong đợi của bạn đối với nội dung tại trang web?
- Nội dung của trang web có thú vị và có giá trị không?
- Điều hướng trang web dễ hay khó?
6.3 Publish a Tên miền (Domain Name)
Sau khi xem xét và đánh giá các lựa chọn tên miền, chúng tôi quyết định sử dụng tên miền heliosjewels.vn cho website vì những lý do sau:
“.vn” quen thuộc và tin cậy: Phần mở rộng tên miền “.vn” là tên miền quốc gia của Việt Nam Ngày nay, “.vn” là phần mở rộng tên miền được sử dụng rộng rãi, tăng cường độ tin cậy, cải thiện SEO địa phương, bảo vệ thương hiệu, có thể hưởng ưu đãi về thuế và pháp lý và tạo dựng niềm tin với khách hàng Theo nghiên cứu từ Domain Name Stat, Vào tháng 2/2024 tổng số tên miền có phần mở rộng “.vn” lên tới 705.147 (Domain Name Stat, 2024)
Hình 37 Thống kê số tên miền vn (Domain Name Stat, 2024)
Ngắn gọn và đơn giản: Theo nghiên cứu từ Domain Registration.com, độ dài tên miền phổ biến nhất là khoảng 12 ký tự heliosjewels có độ dài vừa đủ 12 ký tự giúp người dùng dễ nhớ, dễ đọc và dễ để gõ tìm kiếm Đồng nhất với các nền tảng mạng xã hội như Facebook, Instagram và TikTok b Server Space
Hình 38 Website của Helios sẽ được host bởi một công ty web hosting c Kiểm tra lại các trang đã xuất bản
Sau khi xuất bản cần kiểm tra lại để đảm bảo:
- Hình ảnh được hiển thị đúng cách
- Không có liên kết bị hỏng nào tồn tại
- Các yếu tố tương tác hoạt động bình thường
- Sửa hoặc cập nhật tệp trang trên máy tính cục bộ nếu cần và tải tệp trang đã sửa lên máy chủ
- Không có lỗi ở nội dung
Các bước duy trì và cập nhật nội dung website:
- Đánh giá nội dung hiện tại, xác định nội dung lỗi thời, không còn phù hợp hoặc ít được quan tâm
- Lập kế hoạch cập nhật thông tin (hình ảnh, bài viết blog )
- Call-to-action thường xuyên và thay đổi để thu hút khách truy cập và thu thập phản hồi hoặc kết quả cần thiết
- Đảm bảo khách truy cập website có thể tìm thấy nội dung bằng cách duy trì hệ thống điều hướng chức năng bao gồm tính năng tìm kiếm và liên kết hoạt động tới tất cả các trang trong website
- Sử dụng phân tích để theo dõi lượt xem website, chia sẻ nội dung bằng phương tiện truyền thông xã hội và nội dung xu hướng Thực hiện thay đổi nội dung hoặc chức năng khi cần thiết để đáp ứng mục tiêu website
- Đánh giá và triển khai các công nghệ mới nhằm nâng cao mục tiêu website cũng như tăng khả năng truy cập và khả năng sử dụng của website.
