Báo cáo đồ án cuối kỳ môn thiết kế giao diện người dùng đề tài website du lịch

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA KHOA HỌC VÀ KĨ THUẬT THÔNG TIN

BÁO CÁO ĐỒ ÁN CUỐI KỲ
MÔN THIẾT KẾ GIAO DIỆN NGƯỜI DÙNG
Đề tài: Website du lịch

GVHD: ThS. Tạ Thu Thủy
Nhóm sinh viên thực hiện: 3

1. Mai Trọng Dũng

MSSV: 19521393

2. Lê Thị Phương Thanh

MSSV: 19522231

3. Nguyễn Lê Thanh

MSSV: 19522238

4. Nguyễn Hồng Việt

MSSV: 19522517

5. Lê Tuấn Anh

MSSV: 18520451

❀❀ Tp. Hồ Chí Minh, 05/2021 ❀❀


IE106 – Thiết kế Giao diện Người dùng

NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................
...........................................................................................................................................

……., ngày……...tháng……năm 2021
Người nhận xét

(Ký tên và ghi rõ họ tên)

2|Page


IE106 – Thiết kế Giao diện Người dùng

BẢNG PHÂN CÔNG, ĐÁNH GIÁ THÀNH VIÊN:
Bảng 1: Bảng phân công, đánh giá thành viên
Họ và tên

MSSV

Đánh giá

Phân cơng
-

Tuần 1:

-

Tuần 1: Hồn thành

-

Tuần 2: Hoàn thành

-

Tuần 3: Hoàn thành

+ Soạn các câu hỏi
khảo sát, lập bảng khảo
sát (google form)
+ Đưa ra các giải pháp
dựa vào yêu cầu của
khách hàng.
+ Soạn bản báo cáo C1
-

Tuần 2:
+ Viết báo cáo C2
+ Thiết kế giao diện
website thử nghiệm

Mai Trọng
Dũng

Tuần 3:
+ Thiết kế giao diện

19521393

cho phần Trang chủ,
Khám phá nhiều hơn
nữa
+ Viết báo cáo
+ Thiết kế toàn bộ
trang thông tin về

COVID-19,

trang

thông tin chi tiết khi
Đặt xe máy và đặt ơ tơ,
tour và đặt phịng
+ Thiết kế bổ sung giao
diện cho trang đăng
nhập, đăng kí.

3|Page


IE106 – Thiết kế Giao diện Người dùng

+ Thiết kế giao diện
cho trang địa điểm du
lịch

yêu

thích

“TP.HCM”
-

Tuần 4:
+ Tạo tương tác giao

-

Tuần 4: Hoàn thành

-

Tuần 5: Hoàn thành

-

Tuần 1: Hoàn thành

-

Tuần 2: Hồn thành

diện cho phần trang
chủ, thơng tin Covid19
+ Viết báo cáo
-

Tuần 5:
+ Viết báo cáo đồ án
+ Đề xuất ra giải pháp
cho trang web trong
tương lai.

-

Chỉnh sửa toàn bộ những

lỗi mà nhóm gặp phải sau
khi được góp ý trong
buổi báo cáo đồ án

-

Tuần 1:
+ Soạn các câu hỏi
khảo sát
+ Tìm ưu, nhược điểm
của website Vntrip
+ Đưa ra một số giải

Lê Thị
Phương

pháp dựa vào yêu cầu

19522231

của khách hàng

Thanh
-

Tuần 2:
+ Thiết kế giao diện
website thử nghiệm

4|Page

IE106 – Thiết kế Giao diện Người dùng

+ Thiết kế chi tiết giao
diện tour, đặt phịng,
đăng kí
-

Tuần 3:

-

Tuần 3: Hồn thành

-

Tuần 4: Hoàn thành

-

Tuần 5: Hoàn thành

-

Tuần 1: Hoàn thành

+ Thiết kế giao diện,
phủ màu cho phần Đặt
phòng, khuyến mãi

+ Thiết kế giao diện,
phủ màu cho phần giỏ
hàng, di chuyển (thuê
xe , đặt vé), bài viết
tour
-

Tuần 4:
+

Tạo

tương

tác

(prototype) cho trang
giỏ hàng , tạo tương tác
chọn mua hàng ( di
chuyển , tour )
-

Tuần 5:
+ Tìm ưu điểm, đưa ra
phương pháp phát triển
trong tương lai

-

Tuần 1:

+ Soạn các câu hỏi
khảo sát
+ Tìm ưu, nhược điểm

Nguyễn Lê
Thanh

19522238

của website Klook
+ Soạn lời mở đầu cho
bài báo cáo
+ Đưa ra một số giải
pháp dựa vào yêu cầu
của khách hàng

5|Page


IE106 – Thiết kế Giao diện Người dùng

-

Tuần 2:

-

Tuần 2: Hoàn thanh

-

Tuần 3: Hoàn thành

+ Thiết kế giao diện
website chi tiết: Trang
chủ, khuyến mãi, di
chuyển,

khám

phá

nhiều hơn nữa
-

Tuần 3:
+ Thiết kế giao diện
cho phần trang chủ,
khám phá nhiều hơn
nữa
+ Phối màu
+ Thiết kế phần gợi ý
ẩm thực
-

Tuần 4:

-

Tuần 4: Hoàn thành

-

Tuần 5: Hồn thành

+ Thiết kế slide thuyết
trình cho đồ án cuối kì
-

Tuần 5:
+ Đánh giá ưu điểm
cho trang web

-

Tuần 1:

-

Tuần 1: Hoàn thành

-

Tuần 2: Hoàn thành

-

Tuần 3: Hoàn thành

+ Soạn các câu hỏi

khảo sát
+ Tìm ưu, nhược điểm
của website travel
Nguyễn
Hồng Việt

+ Đưa ra một số giải
19522517

pháp dựa vào yêu cầu
của khách hàng
-

Tuần 2:
+ Thiết kế giao diện
website thử nghiệm

-

Tuần 3:

6|Page


IE106 – Thiết kế Giao diện Người dùng

+ Thiết kế giao diện,
phủ màu cho phần
Tour, đăng nhập, đăng
kí

-

-

Tuần 4: Hồn thành

Tuần 4:
+

Tạo

tương

tác

(prototype) cho các
trang

“di

chuyển”,

“tour”, “đặt phịng” và
-

blog các món ăn tại các

Tuần 5: Hồn thành

vùng miền.

-

Tuần 5:
+ Tìm nhược điểm,
đưa ra phương án khắc
phục, hướng phát triển
trong tương lai.

-

Tuần 1:

-

Tuần 1:

+ Tìm ưu, nhược điểm + Hồn thành
của website chudu24
-

Tuần 2:
+ Thiết kế giao diện

-

Tuần 2:

+ Hoàn thành

website thử nghiệm

Lê Tuấn

-

Tuần 3:

-

Tuần 3:

+ Thiết kế giao diện:

Anh

di chuyển

+ Hoàn thành

+ Thiết kế giao diện:
thông tin review về các

-

Tuần 4:

địa điểm được u + Hồn thành
thích
-

Tuần 4:

-

Tuần 5:

7|Page


IE106 – Thiết kế Giao diện Người dùng

+ Tạo tương tác giao + Hoàn thành
diện cho phần Tour,
Khám phá nhiều hơn
-

Tuần 5:
+ Đánh giá khuyết
điểm cho trang web

8|Page


IE106 – Thiết kế Giao diện Người dùng

LỜI MỞ ĐẦU
Du lịch được mệnh danh là “ngành cơng nghiệp khơng khói”, đem đến lợi nhuận
cao và việc làm hàng năm cho nhiều doanh nghiệp và cá nhân. Tuy vậy do tác động của
đại dịch COVID-19, ngành du lịch cần có sự định hướng mới sao cho phù hợp với tình
hình chung, đồng thời khai thác những điểm đến mới lạ, đòi hỏi những doanh nghiệp
muốn duy trì và phát triển dịch vụ của mình phải có cách tiếp cận người tiêu dùng hợp
lý, đúng đắn và hiệu quả.

Thông qua những khảo sát thực tế thực hiện với đối tượng chủ yếu là người trẻ,
đa số là sinh viên và người lao động có kinh nghiệm dưới 1 năm, nhóm 3 thu về những
ý kiến và nhận xét có thể nghiên cứu và tìm kiếm giải pháp. Đây là những người chưa
có thu nhập hoặc thu nhập còn thấp, nhưng lại mong muốn được đi chơi để có nhiều trải
nghiệm và thư giãn sau khi học tập và làm việc. Do đó họ có những nhu cầu về một
phương pháp để có thể lựa chọn và lên kế hoạch du lịch sao cho thật kinh tế, có được
nhiều thơng tin về nơi mình dự định ghé thăm và được hỗ trợ để tối ưu chi phí và thời
gian cho chuyến đi, thơng qua những ưu đãi về giá vé phương tiện đi lại, rút ngắn thời
gian di chuyển hoặc chờ đợi và nhiều lựa chọn khác.

Do đó, nhóm chúng tơi đã tiến hành xây dựng kế hoạch và thiết kế giao diện phù
hợp với người sử dụng trên nền tảng website. Giao diện được thiết kế với các chức năng
có thể hỗ trợ người dùng tất cả các bước trong suốt quá trình lựa chọn điểm đến du lịch,
đặt vé và các dịch vụ trong và sau hành trình. Với mơi trường ứng dụng thân thiện, dựa
trên trải nghiệm thực tế, kết nối với nhiều doanh nghiệp hoạt động trong lĩnh vực cũng
như đề xuất những lựa chọn có lợi nhất cho người sử dụng, website hy vọng gặt hái
được thành công thông qua lượt sử dụng ứng dụng, số người đăng kí và lựa chọn các
gói dịch vụ, các giao dịch thành công giữa người dùng và doanh nghiệp, cũng như số
lượng review tích cực thu về từ khách hàng trước đó.

Dự án thiết kế giao diện website du lịch của nhóm 3 được hồn thiện trong thời
gian giới hạn cũng như khả năng còn hạn chế của các thành viên trong nhóm nên chắc

9|Page


IE106 – Thiết kế Giao diện Người dùng

chắn không tránh khỏi nhiều thiếu sót. Nhóm rất mong nhận được những ý kiến đóng

góp q báu từ Cơ và các bạn để sửa chữa, tiếp thu thêm kinh nghiệm trong tương lai.
Sau đây, nhóm chúng tơi sẽ trình bày về phần mềm, quy trình thiết kế giao diện
và giao diện hồn chỉnh qua các chương sau:
• Chương 1: Quy trình khảo sát phần mềm
• Chương 2: Thiết kế phác thảo giao diện
• Chương 3: Giao diện website hồn chỉnh
• Chương 4: Tương tác giao diện
• Chương 5: Kết luận

10 | P a g e


IE106 – Thiết kế Giao diện Người dùng

DANH MỤC CÁC BẢNG, HÌNH ẢNH

Danh mục các bảng:
Bảng 1: Bảng phân cơng, đánh giá thành viên………………………………………. 03
Danh mục hình ảnh:
Hình 1.1: Độ tuổi người tham gia khảo sát .............................................................................. 15
Hình 1.2: Khảo sát về thói quen đi du lịch cùng với ai của người Việt ................................... 16
Hình 1.3: Khảo sát về thói quen đi du lịch cùng với ai của Quandme (được trích dẫn trong
Marketing AI) ........................................................................................................................... 16
Hình 1.4: Khảo sát về số lượng thành viên đi du lịch .............................................................. 16
Hình 1.5: Nhu cầu du lịch trong nước/ nước ngoài của người Việt ......................................... 17
Hình 1.6: Khảo sát nhu cầu đi du lịch theo tour hay tự túc ..................................................... 17
Hình 1.7: Phiếu khảo sát người dùng có tham khảo website du lịch để lên kế hoạch ............. 18
Hình 1.8: Mong muốn của khách hàng khi sử dụng các dịch vụ website du lịch .................... 18
Hình 1.9: Khảo sát thời gian đi du lịch của du khách.............................................................. 19
Hình 1.10: Phiếu khảo sát chi phí người dùng sẵn sang chi trả cho chuyến du lịch ............... 19

Hình 1.11: Phiếu khảo sát chi phí khách hanh thường chọn khi đi du lịch ............................. 20
Hình 1.12: Hình ảnh trang web của Klook.com ....................................................................... 21
Hình 1.13: Hình ảnh trang web của Vntrip.vn ......................................................................... 22
Hình 1.14: Hình ảnh trang web của travel.com.vn .................................................................. 27
Hình 2.1.1: Bản phác thảo thử nghiệm trang chủ .................................................................... 31
Hình 2.1.2.2: Bản phác thảo thử nghiệm khuyến mãi .............................................................. 31
Hình 2.1.2.3: Yêu cầu của người dùng về website phần "Di Chuyển" ..................................... 32
Hình 2.1.2.4: Yêu cầu của người dùng về website phần "Di Chuyển" ..................................... 32
Hình 2.1.2.5: Yêu cầu của người dùng về website phần "Đặt phòng" ..................................... 32
Hình 2.1.2.6: Yêu cầu của người dùng về website phần "Tour" .............................................. 33
Hình 2.1.2.7: Yêu cầu của người dùng về website phần "Khám phá nhiều hơn nữa" ............. 33
Hình 2.2.2.8: Yêu cầu của người dùng về website phần "Di Chuyển" ..................................... 36
Hình 2.1.2.9: Yêu cầu của người dùng về website phần "Khám phá nhiều hơn nữa" ............. 37
Hình 3.1: Giao diện website mẫu ............................................................................................. 40
Hình 3.2: Sơ đồ minh họa cho trang web ................................................................................. 40
Hình 3.3: Giao diện phần trang chủ ........................................................................................ 41
Hình 3.4: Bài viết review về địa điểm du lịch ở TP.HCM ........................................................ 42
Hình 3.5: Bài viết review về địa điểm du lịch Đà Nẵng ........................................................... 43
Hình 3.6: Bài viết review Vũng Tàu ......................................................................................... 44
Hình 3.7: Giao diện khuyến mãi ............................................................................................... 45
Hình 3.8: Giao diện cho thuê xe máy ....................................................................................... 46
Hình 3.9: Giao diện thông tin của trang Thuê xe máy ............................................................. 47
Hình 3.10: Giao diện Thuê xe ô tô ........................................................................................... 48
Hình 3.11: Giao diện thông tin đặt xe ô tô ............................................................................... 49
Hình 3.12: Giao diện "Phương tiện khác" ............................................................................... 50
Hình 3.13: Giao diện đặt vé máy bay ....................................................................................... 51
Hình 3.14: Giao diện phần đặt vé tàu ...................................................................................... 52
Hình 3.15: Giao diện đặt vé xe khách ...................................................................................... 53

11 | P a g e

IE106 – Thiết kế Giao diện Người dùng
Hình 3.16: Giao diện Đặt phòng .............................................................................................. 54
Hình 3.17: Giao diện bài viết chi tiết đặt phòng khách sạn ..................................................... 55
Hình 3.18: Giao diện Tour ....................................................................................................... 56
Hình 3.19: Giao diện bài viết về Tour ...................................................................................... 57
Hình 3.20: Giao diện phần Khám phá nhiều hơn nữa ............................................................. 58
Hình 3.21: Bài review về địa điểm ẩm thực Đà Nẵng .............................................................. 59
Hình 3.22: Bài review về địa điểm ẩm thực Đà Lạt ................................................................. 60
Hình 3.23: Bài review về địa điểm ẩm thực TP.HCM .............................................................. 61
Hình 3.24: Bài review về địa điểm ẩm thực Hà Nội................................................................. 62
Hình 3.25: Bài review về địa điểm ẩm thực Vũng Tàu............................................................. 63
Hình 3.26: Bài review về địa điểm ẩm thực Nha Trang ........................................................... 64
Hình 3.27: Bài review về địa điểm ẩm thực Bến Tre ............................................................... 65
Hình 3.28: Giao diện chọn ngôn ngữ cho trang web ............................................................... 66
Hình 3.29: Giao diện tiền tệ cho trang web ............................................................................. 66
Hình 3.30: Giao diện phần đăng nhập ..................................................................................... 66
Hình 3.31: Giao diện phần Đăng kí ......................................................................................... 66
Hình 3.32: Giao diện về trợ giúp người dùng .......................................................................... 67
Hình 3.33: Giao diện trợ giúp – các câu hỏi thường gặp ........................................................ 67
Hình 3.34: Giao diện phần thông tin COVID (1) ..................................................................... 68
Hình 3.35: Giao diện thông tin về COVID (2) ......................................................................... 69
Hình 3.36: Giao diện về thông tin COVID (3) ......................................................................... 70
Hình 3.37: Giao diện thông tin về COVID (4) ......................................................................... 71
Hình 3.38: Giao diện giỏ hàng trống ....................................................................................... 72
Hình 3.39: Giao diện Giỏ hàng ................................................................................................ 72
Hình 3.40: Giao diện Giỏ hàng ................................................................................................ 73
Hình 3.41: Giao diện giỏ hàng khi điền thông tin đặt hàng..................................................... 73
Hình 3.42: Giao diện điền thông tin khi đặt hàng .................................................................... 74

Hình 3.43: Giao diện khi người dùng đăng nhập tài khoản..................................................... 74
Hình 3.44: Giao diện tài khoản của người dùng ...................................................................... 74
Hình 4.1: Hình ảnh về tổng thể tương tác giao diện ................................................................ 76
Hình 4.2: Tạo tương tác cho Trang chủ ................................................................................... 77
Hình 4.3: Tạo tương tác cho trang Khuyến mãi ....................................................................... 77
Hình 4.4: Tương tác trên trang Di chuyển ............................................................................... 77
Hình 4.5: Tạo tương tác cho trang Đặt phòng ......................................................................... 78
Hình 4.6: Tương tác giao diện trên trang Tour ....................................................................... 78
Hình 4.7: Tương tác trên trang Khám phá nhiều hơn .............................................................. 78
Hình 4.8: Tương tác giao diện trên trang Gợi ý ...................................................................... 79
Hình 4.9: Tương tác giao diện Đăng nhập - Đăng kí .............................................................. 80
Hình 4.10: Tương tác giao diện cho Giỏ hàng ......................................................................... 80
Hình 4.11: Tạo tương tác giao diện cho Thông tin điểm đến .................................................. 81
Hình 4.12: Tương tác giao diện cho Review ẩm thực .............................................................. 81

12 | P a g e


IE106 – Thiết kế Giao diện Người dùng

MỤC LỤC
LỜI MỞ ĐẦU ................................................................................................................ 9
DANH MỤC CÁC BẢNG, HÌNH ẢNH .................................................................... 11
Chương 1:

KHẢO SÁT, PHÂN TÍCH, THAM KHẢO ...................................... 15

1.1.1

Khảo sát yêu cầu: ................................................................................... 15

1.1.2

Phân tích yêu cầu và đề xuất giải pháp .................................................. 20

1.2.1

Website của Klook.com ......................................................................... 21

1.2.2

Website của Vntrip.vn ........................................................................... 22

1.2.3

Website của Chudu24.com .................................................................... 25

1.2.4

Website của Travel.com.vn ................................................................... 27

Chương 2:

PHÁC THẢO GIAO DIỆN................................................................. 31

Chương 3:

GIAO DIỆN WEBSITE HOÀN CHỈNH........................................... 40

Chương 4:

TƯƠNG TÁC GIAO DIỆN ................................................................ 74

Chương 5:

KẾT LUẬN ........................................................................................... 82

13 | P a g e


IE106 – Thiết kế Giao diện Người dùng

TÀI LIỆU THAM KHẢO........................................................................................... 84

14 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Chương 1:

KHẢO SÁT, PHÂN TÍCH, THAM KHẢO

Khảo sát yêu cầu khách hàng và phân tích u cầu
1.1.1 Khảo sát u cầu:
-

Chúng tơi đã tạo form khảo sát người dùng về một website du lịch và tham khảo
kết quả khảo sát của 1 trang khác (Marketing AI) để có sự đánh giá khách quan
hơn.

Link khảo sát: />Kết quả khảo sát của trang đánh giá du lịch Marketing AI:
/>Sau khi hoàn thành khảo sát với gần 150 phản hồi, chúng tơi đã có phản hồi tích cực sau
về phía người dùng:
Về độ tuổi tham gia khảo sát:
-

Đa số nằm trong khoảng từ 18 tuổi đến 35 tuổi.

Hình 1.1: Độ tuổi người tham gia khảo sát

Nhu cầu của người dùng khi tham khảo các trang web du lịch:
Theo bảng khảo sát, thì người Việt Nam thường có xu hướng đi du lịch cùng với gia
đình là nhiều nhất chiếm 67,4%. Đối chiếu với bảng khảo sát của Quandme, cũng cho
kết quả tương đồng.

15 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Hình 1.2: Khảo sát về thói quen đi du lịch cùng với ai của người Việt

Hình 1.3: Khảo sát về thói quen đi du lịch cùng với ai của Quandme (được trích dẫn trong Marketing AI)

Tiếp đến là kết quả khảo sát số lượng người thường đi du lịch chung với nhau. Cao nhất
là phương án khoảng 5 người (80,6%).

Hình 1.4: Khảo sát về số lượng thành viên đi du lịch

Chúng tôi nhận thấy nhu cầu du lịch của người Việt Nam từ các độ tuổi khác nhau, phần
lớn nhu cầu là ở trong nước. So sánh với kết quả của trang Marketing AI cũng cho kết
quả tương đồng với 89% du lịch trong nước và 11% du lịch nước ngoài.

16 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Hình 1.5: Nhu cầu du lịch trong nước/ nước ngoài của người Việt

Phần lớn, người Việt Nam thường đi du lịch tự túc nhiều hơn là đi du lịch theo tour. Đối
chiếu với bảng thống kê của trang Marketing AI, ta cũng thấy sự tương đồng về kết quả
giữa tự túc (87%) và theo tour (22%).

Hình 1.6: Khảo sát nhu cầu đi du lịch theo tour hay tự túc

Ta có thể nhận thấy lý do người Việt Nam ưa thích loại hình du lịch tự túc (dựa trên
bảng thống kê của trang Marketing AI) bởi vì:
•
•
•
•
•
•
•

Thích tự lên kế hoạch: 60%
Thích vì sự linh hoạt: 59%
Có thể đi đâu tùy thích 56%

Giá rẻ: 42%
Lịch trình thoải mái: 40%
Có thể làm mọi thứ theo ý mình: 31%
Có thể đi cùng bạn bè: 6%

17 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Khi chúng tôi thăm dị ý kiến khách hàng về vấn đề có tham khảo các trang web giới
thiệu về du lịch trước khi chuẩn bị lên kế hoạch, thì đa số đều nhận được trả lời là có
(78,1%).

Hình 1.7: Phiếu khảo sát người dùng có tham khảo website du lịch để lên kế hoạch

Mong muốn được nhận các thông tin như: khuyến mãi (bao gồm: giá vé tàu xe, dịch vụ
ăn uống,…), địa điểm được du khách yêu thích, đánh giá cao, dịch vụ đặt phòng khách
sạn, phương tiện du lịch,…cũng được khách hàng quan tâm khi sử dụng một trang web
về du lịch. Cụ thể như sau:

Hình 1.8: Mong muốn của khách hàng khi sử dụng các dịch vụ website du lịch

Khảo sát về thời gian đi du lịch của khách hàng, ta nhận thấy nhu cầu đi vào ngày nghỉ,
dịp tết là cao nhất, chiếm 65,4%.

18 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Hình 1.9: Khảo sát thời gian đi du lịch của du khách

Về mức chi phí khách hàng sẵn sàng chi trả, tỉ lệ cao nhất chiếm 45,9% là mức chi trả
từ 3 triệu đến 10 triệu. Tiếp đến là dưới 3 triệu, chiếm 38.5%

Hình 1.10: Phiếu khảo sát chi phí người dùng sẵn sang chi trả cho chuyến du lịch

Tiếp đến, là kết quả khảo sát các phương tiện thường được sử dụng nhất của khách hàng,
ta nhận thấy, nhu cầu đi lại bằng xe máy chiếm tỉ lệ cao nhất, khoảng 61%, tiếp đến là
máy bay với 50,7%

19 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Hình 1.11: Phiếu khảo sát chi phí khách hanh thường chọn khi đi du lịch

1.1.2 Phân tích yêu cầu và đề xuất giải pháp
-

Thông qua bảng khảo sát, chúng tôi nhận thấy khách hàng thường chọn đi du lịch
cùng với gia đình, bạn bè, số lượng khoảng 5 người. Từ đó, chúng tơi sẽ đưa ra các
đề xuất, gợi ý những gói dịch vụ phù hợp với từng nhu cầu của một nhóm khách
hàng riêng (dịch vụ đặt phịng đơi/ đơn, giá vé phương tiện di chuyển, dịch vụ ăn
uống,…)

-

Du lịch tự túc chiếm phần ưu thế nhiều hơn là theo tour bởi lý do chính là họ thích
tự mình lập kế hoạch cho chuyển đi mà không phải phụ thuộc vào kế hoạch theo
dịch vụ tour. Chính vì vậy, chúng tơi sẽ đưa ra các gợi ý về địa điểm mà được du
khách yêu thích dựa vào lượt rating của khách hàng đã trải nghiệm,…

-

Kết hợp với các Youtuber chuyên review về du lịch như: Khoai Lang Thang, Chan
La Cà, Fahoka Xê dịch,…để tạo ra những video review chân thực nhất những trải
nghiệm trong chuyến đi để khách hàng cảm thấy an tâm khi sử dụng dịch vụ của
chúng tôi. Không những thế, mọi người cịn có thể tham khảo những bài đánh giá
thông qua những khách hàng đã từng trải nghiệm sử dụng dịch vụ của công ty.

-

Chúng tôi sẽ hợp tác với các hãng phương tiện (máy bay, tàu, ô tơ,…), khách sạn,
nhà hàng,… để có thể đề xuất các khuyến mãi như đặt vé, đặt phòng, các dịch vụ
ăn uống,…

-

Ngoài ra, khách hàng thường chọn xe máy là phương tiện u thích trong chuyến
du lịch của mình có lẽ bởi sự tiện lợi và chi phí rẻ. Vì thế chúng tôi sẽ mở thêm
dịch vụ cho thuê xe máy và các ưu đãi để khách hàng có một trải nghiệm tuyệt vời
trong chuyến đi của mình.

20 | P a g e


IE106 – Thiết kế Giao diện Người dùng

-

Thông qua khảo sát, khách hàng thường đi du lịch vào các ngày lễ, kì nghỉ. Vào lúc
đó, lượng khách tăng cao, có thể khiến cho chi phí của khách hàng tăng. Nhưng với
chính sách bình ổn giá và có ưu đãi tích điểm cho khách hàng thân thiết nên khách
hàng sẽ không phải lo lắng về vấn đề đó.

-

Một vấn đề cũng được nhiều khách hàng quan tâm đó chính là vấn đề về vệ sinh an
tồn thực phẩm. Chính vì thế, ngồi những dịch vụ nhà hàng uy tín có liên kết với
cơng ty chúng tơi, chúng tơi cịn giới thiệu cho quý vị thêm những quán ăn “hè
phố” được bộ y tế chứng nhận vệ sinh an toàn thực phẩm và được thực khách, du
khách đánh giá cao trong các bài review.
Tìm hiểu, nghiên cứu ứng dụng liên quan

1.2.1 Website của Klook.com

Hình 1.12: Hình ảnh trang web của Klook.com

Các nút phần header được ẩn
phần đường viền, khi di
chuyển trỏ chuột mới hiện lên.
ƯU
ĐIỂM

Có bảng sổ xuống để người
dùng lựa chọn.
Nút được bo trịn viền, có hiện

màu khi bấm chọn hoặc hiển
thị là đang ở trang đấy.

21 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Thiết kế dạng lưới, nội dung
phân chia rõ ràng.

Có nhiều dịch vụ tiện ích khác
như: Blog, gợi ý dịch vụ,…

NHƯỢC Phần header của trang để cỡ
ĐIỂM
chữ hơi nhỏ, không cân xứng
với trang.

1.2.2 Website của Vntrip.vn

Hình 1.13: Hình ảnh trang web của Vntrip.vn

22 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Cỡ chữ vừa phải, khơng
có chân. Có khoảng trắng

giữa các mục. Có thanh
màu cam hiển thị giúp
người dùng biết mình
đang ở trang nào.
ƯU
ĐIỂM

Khi chọn vào phần cẩm
nang thì trang web sẽ tự
động tạo ra một tab khác
để người dùng có thể dễ
dàng tìm hiểu song song
giữa khách sạn, máy bay
mình cần với bài viết
tham khảo về nơi đó để
người dùng dễ lựa chọn.
Trang khơng có giỏ hàng.

Thanh menu khơng được
giữ lại khi chuyển xuống
các phần dưới của trang.

23 | P a g e


IE106 – Thiết kế Giao diện Người dùng

Các mục giới thiệu về các
NHƯỢC
ĐIỂM

combo khách sạn, máy
bay , hot deal hơi to , tạo
cảm giác nhìn bị rối và khi
kéo xuống thì chỉ nhìn
thấy một nửa của các mục
ở trên khơng thể so sánh
để lựa chọn các mục với
nhau được.
Phần hỗ trợ nếu kéo xuống
cuối trang sẽ che đi các
trang thông tin ( Facebook,
Instagram ,…) của trang.

Rút kinh nghiệm dựa trên ưu khuyết điểm:
-

Thêm mục giỏ hàng để khách hàng có thể lựa chọn mua chuyến bay, khách sạn.

-

Thiết kế phần hỗ trợ sao cho không che các thông tin khác.

-

Tạo kích cỡ các mục thơng tin combo khách sạn, vé máy bay phù hợp để thuận
mắt người dùng.

-

Giữ lại thanh menu khi di chuyển xuống phần dưới của trang để mang lại sự tiện
lợi cho người dùng.

-

Đánh dấu trang hiện tại để người dùng biết mình đang ở trang nào.

24 | P a g e


IE106 – Thiết kế Giao diện Người dùng

1.2.3

Website của Chudu24.com

Hình 1.1: Hình ảnh trang web của Chudu24.com

Font chữ dễ nhìn, có
những mục dùng chữ in
hoa.

ƯU
ĐIỂM
Thiết kế kiểu lưới, dễ sử
dụng.

25 | P a g e