Đồ Án Cơ Sở 1 - Đề Tài - Thiết Kế Giao Diện Website Tour Du Lịch

 ĐỒ ÁN CƠ SỞ 1 Đề tài THIẾT KẾ GIAO DIỆN WEBSITE TOUR DU LỊCH MỞ ĐẦU Ngày nay, du lịch đang trở thành một lối sống mới Du lịch không đơn thuần là tham quan mà còn phải khám phá, trải nghiệm, khôn[.]

- -ĐỒ ÁN CƠ SỞ 1

Đề tài: THIẾT KẾ GIAO DIỆN WEBSITE TOUR DU LỊCH

MỞ ĐẦU

Ngày nay, du lịch đang trở thành một lối sống mới Du lịch không đơnthuần là tham quan mà còn phải khám phá, trải nghiệm, không chỉ nghehướng dẫn viên thuyết trình mà phải có sự tham gia, tương tác lẫn nhau.Rất nhiều người đã và đang tìm đến một loại hình du lịch mới - du lịch trảinghiệm Đúng như tên gọi của nó, đây là loại hình du lịch mong muốnđem lại cho khách hàng những trải nghiệm độc đáo, thậm chí là lần đầutiên tham gia một hoạt động nào đó, thu hút du khách bởi sự năng động,mới lạ, hấp dẫn và đầy thử thách Tuy nhiên, loại hình du lịch này vẫnchưa phổ biến ở Việt Nam Bằng chứng là chỉ một vài tỉnh thành ở nước tamới bắt đầu để ý đến loại hình này và không nhiều công ty lữ hành đưavào khai thác Miền Bắc có tour trải nghiệm làng quê ở làng cổ Đường Lâm(Hà Nội) hay làng Yên Đức (Quảng Ninh) Khu vực miền Trung có các tourkhám phá Cù lao Chàm và làm nông dân ở làng rau Trà Quế (QuảngNam) Tây Nguyên có tour “Đà Lạt xanh” với hoạt động thu hoạch rau vàdâu tây

Mặc dù đang là xu hướng phát triển nhưng du lịch trải nghiệm vẫn còn xa

lạ đối với các cơ quan, công ty lữ hành lẫn du khách Nhu cầu du lịch củangười dân đang tăng trưởng khá nhanh và ngày càng đa dạng, đòi hỏinhững tour mới lạ Nhưng thực tế các công ty lữ hành chỉ cung cấp sốlượng rất ít tour du lịch trải nghiệm Ngoài ra, những nghiên cứu về du lịchrất nhiều nhưng nghiên cứu về du lịch trải nghiệm thì rất khiêm tốn

Nhận thấy được tiềm năng to lớn cho loại hình du lịch còn bị bỏ ngỏ này,Một trong những cách tốt nhất để khám phá văn hóa và lối sống của địaphương nơi mình đến là trải nghiệm tour du lịch để cảm nhận Hiểuđượcnhững vấn đề trên , chúng em đã thiết kế một website nhằm giải quyếtvấn đề đó

LỜI CẢM ƠN

Chúng em xin gửi lời cảm ơn chân thành và sâu sắc đến các thầy côđặc biệt là giảng viên ThS Nguyễn Văn Bình trong thời gian qua đã giúp đỡchúng em trong việc hoàn thành bài báo cáo đồ án cơ sở

Mặc dù gặp nhiều khó khăn trong việc hoàn thành bài đồ án này,tuy nhiên chúng em vẫn cố gắng để thực hiện hoàn chỉnh nhất bài báocáo Tuy nhiên, vì chưa có đầy đủ kỹ năng cũng như kinh nghiệm để hoànthành bài báo cáo đồ án nên chúng em vẫn còn nhiều thiếu sót Rất mongđược sự đóng góp ý kiến của thầy cô để bài báo cáo đồ án được hoànthiện hơn, em xin chân thành cảm ơn

MỤC LỤC

Trang

CHƯƠNG 1: GIỚI THIỆU

1 1.1 Tổng quan 1

1.2 Phương pháp, kết quả 2

1.3 Cấu trúc đồ án 2

CHƯƠNG 2: NGHIÊN CỨU TỔNG QUAN 3

2.1 Các phương pháp 3

2.2 Hạn chế còn tồn tại 4

2.3 Kết luận 4

2.4 Cơ sở lý thuyết 4

2.4.1 Sử dụng phần mềm Visual Studio Code 4

2.4.2 Website tĩnh 6

2.4.3 JQuery, Javascript, Boostrap 6

CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ HỆ THỐNG 8

3.1 Phạm vi 8

3.1.1 Những việc sẽ làm 8

3.1.2 Những việc không làm 8

3.2 Đối tượng hướng đến 8

3.3 Chức năng 8

3.4 Người sử dụng 8

3.5 Yêu cầu của từng người sử dụng 8

3.5.1 Quản trị viên 8

3.5.2 Người dùng……… … 8

CHƯƠNG 4: TRIỂN KHAI XÂY DỰNG HỆ THỐNG 9

4.1 Mô hình tổng quan của hệ thống nghiên cứu 9

CHƯƠNG 5: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 215.1 Kết luận 215.2 Hướng phát triển 21

Hình 18 - Trang quản lí 16Hình 19 - Trang quản lí 17

Hình 20 - Trang quản lí 17

Hình 21 - Dữ liệu khách hàng 18

Hình 22 - Tin nhắn 18

Hình 23 - Tin nhắn 19

Hình 24 - Bản đồ 19

CHƯƠNG 1: GIỚI THIỆU

1.1 Tổng quan

Ngày nay, du lịch đang trở thành một lối sống mới Du lịch không đơnthuần là tham quan mà còn phải khám phá, trải nghiệm, không chỉ nghehướng dẫn viên thuyết trình mà phải có sự tham gia, tương tác lẫn nhau Rấtnhiều người đã và đang tìm đến một loại hình du lịch mới - du lịch trảinghiệm Đúng như tên gọi của nó, đây là loại hình du lịch mong muốn đemlại cho khách hàng những trải nghiệm độc đáo, thậm chí là lần đầu tiên thamgia một hoạt động nào đó, thu hút du khách bởi sự năng động, mới lạ, hấpdẫn và đầy thử thách Tuy nhiên, loại hình du lịch này vẫn chưa phổ biến ởViệt Nam

Mặc dù đang là xu hướng phát triển nhưng du lịch trải nghiệm vẫn còn xa

lạ đối với các cơ quan, công ty lữ hành lẫn du khách Nhu cầu du lịch củangười dân đang tăng trưởng khá nhanh và ngày càng đa dạng, đòi hỏi nhữngtour mới lạ Nhưng thực tế các công ty lữ hành chỉ cung cấp số lượng rất íttour du lịch trải nghiệm Ngoài ra, những nghiên cứu về du lịch rất nhiềunhưng nghiên cứu về du lịch trải nghiệm thì rất khiêm tốn

Nhận thấy được tiềm năng to lớn cho loại hình du lịch còn bị bỏ ngỏ này, Mộttrong những cách tốt nhất để khám phá văn hóa và lối sống của địa phươngnơi mình đến là trải nghiệm tour du lịch để cảm nhận được vấn đề đặt ratrên Hiểuđược những vấn đề ,chúng em đã thiết kế một website nhằm giảiquyết vấn đềđó

Nội dung thực hiện bao gồm trang chủ, đăng ký, trang tìm kiếm, trang đặttour, trang tin tức, trang liên hệ, trang tư vấn, hỗ trợ khách hàng, công việc

dành cho quản lý

1.2 Phương pháp, kết quả

- Phương pháp: Để xây dựng một trang web tìm tour du lịch, đầu tiên

chúng ta phải hình thành ý tưởng của mình Tiếp theo, chúng ta sẽ thamkhảo các trang web có sẵn để tiếp thu những kiến thức để định hướng ýtưởng, phác thảo ý tưởng của mình ra giấy, nắm được các kiến thức vềngôn ngữ lập trình như sử dụng HTML, CSS, PHP, JavaScript, Bootstrap,JQuery,… cuối cùng chúng ta sẽ bắt đầu vào việc thực hiện dự án

- Kết quả: Có được một trang web giúp cho mọi đối tượng người dùng tìm

3.5 Yêu cầu của từng người sử dụng

- Chương 4: Triển khai xây dựng hệ thống

4.1 Mô hình tổng quan của hệ thống nghiên cứu

4.2 Thiết kế chi tiết

- Chương 5: Kết luận và hướng phát triển

5.1 Kết luận

5.2 Hướng phát triển

CHƯƠNG 2: NGHIÊN CỨU TỔNG QUAN

2.1 Các phương pháp

- Các website tương tự hiện có: Hiện nay, các website tìm kiếm tour du lịchxuất hiện khá nhiều trên internet Khi bạn tìm kiếm từ khóa “Tìm kiếmtour du lịch” trên Google sẽ xuất hiện nhiều trang tìm kiếm việc làm như :

du lịch VietNam, Du lịch viet, Vietnamtourism,…

Hình 1 – dulichvietnam.com.vn

Hình 2 - dulichviet.vn

Hình 3 - vietnamtourism.com

- Những trang web tìm kiếm tour du lịch thường có giao diện bắt mắt, thânthiện với người dùng, dễ dàng sử dụng và độ uy tín khá cao, thu hút người dùng

2.2 Hạn chế còn tồn tại

- Hiện nay có rất nhiều website tour du lịch với vô vàn loại hình, đa dạng

về dịch vụ, thuận tiện cho người dùng và rất tối ưu vì mới mẻ nên vẫnđang trên đường hoàn thiện, những hạn chế của các website hiện nay là :+ Các tour du lịch đăng tuyển vẫn chưa phân ra một cách chi tiếtnhất

+ Các danh mục về phương tiện đi lại, chỗ ở,…vẫn còn hạn chế

+ Người tìm tour du lịch khi tìm tour du lịch vẫn không có được sự hỗtrợ từ website, nên sẽ rất khó khăn cho người dùng trong việc tìm ratour du lịch phù hợp với bản thân

+ Trong phần chi tiết các tour cụ thể, không có những phần đánh giácủa những người đã từng tham gia trước để có thể phản hồi mộtcách chân thực nhất về sự chuyên nghiệp của website và tạo độ tincậy cho người dùng

+ Nhà tuyển dụng khi muốn đăng tải thông tin họ phải cung cấp phícho chủ trang web

2.3 Kết luận

- Chúng ta cần một trang web gần gủi với người dùng nhất, cập nhật đầy

đủ các loại hình dịch vụ, các chức thông tin chi tết về tour du lịch

mã thông minh, snippets, và cải tiến mã nguồn Nó cũng chophép tùy chỉnh, do đó, người dùng có thể thay đổi theme, phímtắt, và cá tùy chọn khác Nó miễn phí và là phần mềm mã nguồn

mở, mặc dù gói tải xuống chính thì là có giấy phép

Hình 4 - Giao diện Visual Studio Code

b Ưu điểm:

- Hỗ trợ lập trình trên nhiều ngôn ngữ như C/C++, C#, F#,Visual Basic, HTML, CSS, JavaScript Phiên bảnVisual Studio

2015 có hổ trợ ngôn ngữ Python

- Visual Studio là một công cụ hỗ trợ việc Debug một cách mạnh

mẽ, dễ dàng nhất (Break Point, xem giá trị của biến trong quátrình chạy, hỗ trợ debug từng câu lệnh)

- Giao diện Visual Studio rất dễ sử dụng đối với người mới bắtđầu.

- Visual Studio hỗ trợ phát triển ứng dụng desktop MFC, WindowsForm, Universal App, ứng dụng mobileWindows Phone 8/8.1,Windows 10, Android (Xamarin), iOS và pháttriển website WebForm, ASP.NET MVC và phát triển MicrosoftOffice

- Visual Studio hỗ trợ kéo thả để xây dựng ứng dụng một cáchchuyên nghiệp, giúp các bạn mới bắt đầu có thể tiếp cận nhanhhơn

- Visual Studio cho phép chúng ta tích hợp những extension từbên ngoài như Resharper (hổ trợ quản lý và viết mã nhanh chocác ngôn ngữ thuộc Net), hay việc cài đặt thư viện nhanhchóng thông qua Nuget

- Visual Studio được sử dụng đông đảo bởi lập trình viên trêntoàn thế giới

2.4.2 Website tĩnh

a Đặc điểm

- Website tĩnh có thể hiểu là website với dữ liệu không được thayđổi thường xuyên

- Nó không có cơ sở dữ liệu ở bên dưới hệ thống

- Không có công cụ để điều khiển được nội dung gián tiếp

- Để thay đổi được nội dung trên trang web thì người quản trị phảitruy cập vào mã lệnh để thay đổi thông tin

b Ưu điểm:

- Dễ dàng quản lý nội dung

- Dễ dàng nâng cấp và bảo trì

- Có thể xây dụng được web lớn

- Thường sử dụng tương tác với người dùng cao

c Khuyết điểm :

- Chi phí xây dựng cao

- Nếu web lớn có thể cần thêm nhân sự chuyên ngành

2.4.3 JQuery, Javascript, Boostrap

a Khái niệm :

- JavaScript là một ngôn ngữ lập trình của HTML và WEB Nó là nhẹ

và được sử dụng phổ biến nhất như là một phần của các trangweb, mà sự thi hành của chúng cho phép Client-Side script tươngtác với người sử dụng và tạo các trang web động Nó là một ngônngữ chương trình thông dịch với các khả năng hướng đối tượng

- JQuery là một thư viện JavaScript nhanh, nhỏ và giàu tính năng.

Nó làm cho mọi thứ như chuyển đổi và thao tác tài liệu HTML, xử

lý sự kiện, hoạt hình và Ajax đơn giản hơn nhiều với API dễ sửdụng, hoạt động trên vô số trình duyệt Với sự kết hợp giữa tínhlinh hoạt và khả năng mở rộng, jQuery đã thay đổi cách hàng triệungười viết JavaScript

- Bootstrap là một bộ công cụ mã nguồn mở để phát triển với HTML,

CSS và JS Nhanh chóng tạo nguyên mẫu cho ý tưởng của bạnhoặc xây dựng toàn bộ ứng dụng của bạn với các biến và hỗn hợpSass của chúng tôi, hệ thống lưới đáp ứng, các thành phần dựng

sẵn mở rộng và các plugin mạnh mẽ được xây dựng trên jQuery.

b Đã ứng dụng :

- Css để có thể thiết lập màu sắc và bố cụ của website

- Bootstraps để có thể hiển thị website trên nhiều thiết bị để có thểphù hợp với nhiều đối tượng sử dụng hơn

- Javascript, JQuery để xử lý các sự kiện của các liên kết, nút bấm

và các cài đặt

CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ HỆ THỐNG

3.1 Phạm vi

3.1.1 Những việc sẽ làm

- Cung cấp cho người sử dụng, nhà quản lý một giao diện việc làmnăng động cùng những chức năng cần thiết để thao tác, cũng nhưtương tác với trang web, có thể quản lý hoạt động của người dùng

để theo dõi tình hình phát triển của trang web

3.1.2 Những việc không làm

- Hệ thống không quản lý xét duyệt, đánh giá chất lượng tour giữangười dùng và nhà lữ hành, sau khi đăng kí được tour giai đoạn tiếptheo hoàn toàn do nhà cung cấp dịch vụ quyết định

3.2 Đối tượng hướng đến

- Đối tượng hướng đến chủ yếu là những người có sở thích du lịch, nhữngngười muốn được trải nghiệm và khám khá thêm về cuộc sống và khungcảnh thiên nhiên, những doanh nghiệp đang cần quảng bá tour du lịch

3.3 Chức năng

- Đăng nhập/ Đăng ký

- Quản lý tour

- Xem thông tin về tour du lịch

- Tìm kiếm tour,phòng,phương tiện

- Đăng tải thông tin về tour

- Gữi thông tin liên hệ

3.4 Người sử dụng

- Quản trị viên

- Người tìm kiếm tour

3.5 Yêu cầu của từng người sử dụng

CHƯƠNG 4: TRIỂN KHAI XÂY DỰNG HỆ THỐNG

4.1 Mô hình tổng quan của hệ thống nghiên cứu

Hình 5 - Mô hình phân tích tổng quan hệ thông nghiên cứu

4.2 Thiết kế chi tiết

- Trang chủ: Là trang liên kết với các trang còn lại, cung cấp những thông

tin về tour du lịch có thể bạn thích, các thông tin lớn,…

Hình 6 - Trang chủ

+ Phần Header trên Hình 6 bao gồm các nút bấm liên kết với những nộidung khác như Tour, Khách sạn, Dịch vụ, Giới thiệu, Tin tức, Liên hệ,… + Phía dưới phần Header là phần Banner, tại đây chúng ta có thể xem tintức các tour phù hợp với người dùng theo các loại hình phương tiện

Hình 7 - Trang chủ

+ Tiếp theo là phần tour du lịch có thể bạn thích như Hình 7, ở đây cónhững thông tin nổi bậc có thể bạn sẽ quan tâm,…

Hình 8 – Trang chủ

+ Phần thông tin về tên của một số tour du lịch nổi bật, giá cả như Hình

8 sẽ giới thiệu cho người dùng, và chỉ số đanh giá để nâng cao uy tín

và độ tin cậy cao,…

- Tin tức : Là trang giúp khách hàng trong việc cập nhập tin tức xung

quanh tới việc du lịch, có thêm kinh nghiệm và những thông tin thú vịmới,… như sau:

Hình 9– Tin tức

- Khách sạn: Là trang hiển thị các khách sạn để người dùng có thể chọn

nơi lưu trú (Hình 10)

Hình 10– Khách sạn

+ Đầu tiên là thông tin khách sạn (Hình 11), phần thông tin này sẽ khác

với thông tin khách sạn ở Trang chủ là hiển thị cụ thể hơn về chi tiếtkhách sạn

Hình 11 – Thông tin khách sạn

+ Bên trái là phần Đề xuất, tại đây đề xuất thể loại phòng, vị trí, cơ sởvật chất, Bên phải là phần tìm kiếm, sẽ có phạm vi giá để bạn điềuchỉnh phù hợp với khả năng và book phòng để kiểm tra.(Hình 12)

Hình 12 – Đề xuất

+ Ở phần thông tin khách sạn ( Hình 11), sẽ có nút bấm để xem cụ thểchi tiết về tất cả các phòng hiện đang có ở khách sạn đó Sau đó chọnHotel Ezi nó sẽ hiện cụ thể như Hình 13:

Hình 13 – Cụ thể chi tiết phòng khách sạn

- Dịch vụ: Là trang mà người dùng có thể xem thông tin dịch vụ của các

loại hình (Hình 7), các lượt đánh giá của một số người dùng khác đã từngtrải nghiệm (Hình 14)

Hình 14 – Đánh giá người dùng

Hình 15 – Giới thiệu

- Giới thiệu: Đây là trang cung cấp cho bạn quá trinh hình thanh và phát

triển của Sun Tour, những bài viết tư vấn, hổ trợ cho bạn trong việc tìmkiếm một tour du lịch chất lượng (Hình 15)

Hình 16 – Footer

- Footer (Hình 16):

+ Phần đầu như hình trên là phần Đăng kí người dùng có thể để lại gmail

để nhận thêm một số cập nhập thông tin ưu đãi của tour

+ Phần dưới là cung cấp một số thông tin nổi bật của trang web như vềĐại Nội-Huế, Blog, Thông tin và địa chỉ liên hệ và phần quick link.

Hình 17 – Liên hệ

- Liên hệ: Trang này giúp người dùng phản hồi các ý kiến cá nhân, hoặc có

nhu cầu trao đổi về vấn đề hợp tác (Hình 17)

Hình 18 – Trang quản lý

- Trang Admin dành cho quản trị viên (admin) là trang mà ở đó quản trị

viên có thể chỉnh sửa (sửa thông tin, xem thông tin, xóa thông tin) nhữngnội dung

Hình 19 – Trang quản lý

Hình 20 – Trang quản lý

+ Ở trang quản lí sẽ hiện tổng quan về tổng tour, tổng thu, số lượng kháchnhư Hình 20, và biểu đồ tăng trưởng ( Hình 19) sẽ khái quát tốc độ củatừng loại hình dịch vụ, giúp cho người quản lý dễ dàng kiểm soát thông tintrên trang chủ hơn

+ Mục dữ liệu khách hàng như Hình 21: sẽ lưu thông tin của khách hàng từng đăng kí tour và sử dụng các loại hình dịch vụ ở Sun Tour.

Hình 21 – Dữ liệu khách hàng

+ Tin nhắn : ở đó admin sẽ là người nhận được các tin nhắn gmail được gữi đến từ phía khách hàng ( Hình 22 )

Hình 22 – Tin nhắn

+ Người quản trị có thể phản hồi lại nội dung của khách hàng được gữi đến như hình 23:

Hình 23 – Tin nhắn

+ Bản đồ như Hình 24 : cập nhập địa chỉ chi tiết trụ sở chính, giả sử cónhiều nơi làm việc khác nhau thì sẽ ghi chú từng tên cơ sở để dễ dàngphân vùng quản lí

Hình 24 – Bản đồ