Please use this identifier to cite or link to this item:
https://er.chdtu.edu.ua/handle/ChSTU/6889| Title: | Web-платформа компанії з надання послуг у сфері туризму |
| Authors: | Рудницька , Юлія Володимирівна Дмитренко, Софія Станіславівна |
| Keywords: | верстка;база данних;JavaScript;phpMyAdmin;Web-платформа |
| Issue Date: | 11-Jun-2024 |
| Abstract: | Сфера туризму через COVID-19 та війну в Україні зазнала значних змін. Оскільки туризм має пряме відношення до економіки країни, то багато країни зазнали певних складностей. Особливо ті, в яких туризм складає основу бізнесу та економіки країни. В свою чергу сфера туризму має значний вплив на розвиток та популяризацію культури та історії країни. Мета роботи і задачі. Метою кваліфікаційної роботи є розробка web-платформи з надання послуг у сфері туризму. Для досягнення поставленої мети в кваліфікаційній роботі бакалавра треба виконати наступні завдання: - Аналіз вимог: проаналізувати вимоги, що стоять перед розробкою даної платформи. - Аналіз існуючих аналогів: розглянути існуючі аналоги на ринку та провести їхнє оцінювання. - Створення макетів: на основі проведеного аналізу аналогів створити макети майбутнього сайту. - Розробка платформи: за допомогою обраних інструментів реалізувати платформу. Об’єкт дослідження: дослідження є розробка web-платформи з надання послуг у сфері туризму. Предмет дослідження: дослідження є web-платформа з надання послуг в сфері туризму. |
| URI: | https://er.chdtu.edu.ua/handle/ChSTU/6889 |
| Appears in Collections: | 126 Інформаційні системи та технології (Web-технології, web-дизайн) |
Files in This Item:
| File | Description | Size | Format | |
|---|---|---|---|---|
| РЕП_БАК_Дмитренко_WEB-2011.pdf Restricted Access | 2.34 MB | Adobe PDF | View/Open Request a copy |
Items in DSpace are protected by copyright, with all rights reserved, unless otherwise indicated.
Extracted text
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІЕРСИТЕТ
ФАКУЛЬТЕТ ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ І СИСТЕМ
Кафедра інформаційних технологій проектування
Пояснювальна записка
до кваліфікаційної роботи
_______________________________бакалавра_____________________________
(освітньо-кваліфікаційний рівень)
на тему: Web-платформа компанії з надання послуг у сфері туризму
Виконав: студентка 4 курсу, групи WEB-2011
Спеціальність 126 “Інформаційні
системи та технології”
ОП “Web-технології, Web-дизайн”
Дмитренко С.С.
(прізвище та ініціали)
Керівник ___Рудницька Ю.В., PhD _
(прізвище та ініціали)
Рецензент _Дідук В.А., к.т.н., доцент
(прізвище та ініціали)
Черкаси – 2024 року
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ
(назва вузу)
Факультет ФІТІС Кафедра Інформаційних технологій проектування
Освітній рівень бакалавр
Спеціальність 126 “Інформаційні системи та технології”
Освітня програма “Web-технології Web-дизайн”
ЗАТВЕРДЖУЮ:
зав.Кафедри Прокопенко Т.О.
“______” __________________2024р.
ЗАВДАННЯ
На кваліфікаційну роботу студенту
Дмитренко Софії Станіславівні
(прізвище, ім’я, по-батькові)
1. Тема проекту (роботи) Web-платформа компанії з надання послуг у сфері туризму
Керівник проекту(роботи) РУДНИЦЬКА Ю.В.,PhD
Затверджена наказом Черкаського державного технологічного університету № 60/04
вСітдр 2о6к. 0п2о.д20а2н4н я студентом роботи 29 травня 2024 р.
3. Вихідні дані до проекту (роботи) Середовище розробки Visual Studio Code; XAMPP; Мова
розмітки HTML / CSS; Мова програмування – Javascript, PHP, web-інтерфейс для
адміністрування баз даних MySql – PhpMyAdmin.
4. Зміст розрахунково-пояснювальної записки (перелік питань, що їх належить
розробити)
ВСТУП; 1. ОГЛЯД ІСНУЮЧИХ РІШЕНЬ ТА ПОСТАНОВКА ЗАДАЧІ; 1.1 Огляд
предметної області; 1.2 Огляд аналогів; 1.3 Порівняння та аналіз аналогів; 1.4
Постановка задачі; Висновок до розділу 1; 2. ПРОЕКТУВАННЯ WEB-
ПЛАТФОРМИ; 2.1 Визначення характеристик web-платформи; 2.2 Етапи розробки
web-платформи; 2.3 Функціональні елементи та дизайн сторінок; Висновок до
розділу 2; 3. РЕАЛІЗАЦІЯ WEB-ПЛАТФОРМИ; 3.1 Обрання середовища розробки
та інструментів; 3.2 Верстка сторінок; 3.3 Реалізація елементів інтерфейсу та
функцій через Javascript 3.4 Робота з phpMyAdmin; Висновок до розділу 3;
ВИСНОВКИ; СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ; ДОДАТКИ.
5.Перелік графічного матеріалу (з точним зазначенням обов’язкових креслень)
1) Рисунок: Етапи створення проєкту;
2) Рисунок: Структура сайту;
3) Рисунок: Головна сторінка.
6. Консультанти з проекту із зазначенням розділів проекту, що їх стосуються
Підпис, дата
Розділ Консультант
Завдання видав, завдання
прийняв
7. Дата видачі завдання 29 лютого 2024 р.
Керівник Рудницька Ю.В.
(підпис)
Завдання прийняв до виконання ________
(підпис)
Календарний план
Пор. № Назва етапів дипломного проекту Термін виконання Примітка
етапів проекту
Підготовча стадія
Постановка задачі Виконано
Підготовка завдання Виконано
Погодження завдання Виконано
Затвердження завдання Виконано
Основна стадія
Підбір матеріалів Виконано
Аналіз шляхів рішення задачі Виконано
Розрахунок основних параметрів роботи Виконано
Вибір кінцевого варіанту проектного рішення Виконано
Оформлення первісної редакції роботи Виконано
Заключна стадія
Узгодження проектних рішень з керівником Виконано
Оформлення пояснювальної записки Виконано
Попередній захист роботи Виконано
Затвердження роботи Виконано
Рецензування роботи Виконано
Захист роботи
(підпис) (ПІБ)
Керівник проекту ______________________________________________
АНОТАЦІЯ
До кваліфікаційної роботи бакалавра на тему «Web-платформа компанії з
надання послуг у сфері туризму».
Виконав студент групи WEB-2011 Дмитренко Софія Станіславівна.
Кваліфікаційна робота бакалавра містить: сторінок, рисунків, 1
таблицю, 25 використане джерело.
Актуальність теми. Сфера туризму через COVID-19 та війну в Україні
зазнала значних змін. Оскільки туризм має пряме відношення до економіки країни,
то багато країни зазнали певних складностей. Особливо ті, в яких туризм складає
основу бізнесу та економіки країни. В свою чергу сфера туризму має значний вплив
на розвиток та популяризацію культури та історії країни.
Мета роботи і задачі. Метою кваліфікаційної роботи є розробка web-
платформи з надання послуг у сфері туризму. Для досягнення поставленої мети в
кваліфікаційній роботі бакалавра треба виконати наступні завдання:
- Аналіз вимог: проаналізувати вимоги, що стоять перед розробкою даної
платформи.
- Аналіз існуючих аналогів: розглянути існуючі аналоги на ринку та провести
їхнє оцінювання.
- Створення макетів: на основі проведеного аналізу аналогів створити макети
майбутнього сайту.
- Розробка платформи: за допомогою обраних інструментів реалізувати
платформу.
Об’єкт дослідження: дослідження є розробка web-платформи з надання
послуг у сфері туризму.
Предмет дослідження: дослідження є web-платформа з надання послуг в
сфері туризму.
Ключові слова: верстка, JavaScript, phpMyAdmin, база данних.
ANNOTATION
To the bachelor's qualification work on the topic ‘Web-platform of the company
providing services in the field of tourism’.
Performed by a student of the group WEB-2011 Dmitrenko Sofia Stanislavivna.
Bachelor's qualification work contains: pages, figures, 1 table, references.
Relevance of the topic. The tourism industry has undergone significant changes
due to COVID-19 and the war in Ukraine. Since tourism is directly related to the country's
economy, many countries have experienced certain difficulties. Especially those in which
tourism is the backbone of the country's business and economy. In turn, tourism has a
significant impact on the development and promotion of the country's culture and history.
A significant advantage of tourism development is the establishment of social ties and
personal development in society.
Purpose of the work and research objectives. The purpose of the qualification work
is to develop a web platform for the provision of services in the field of tourism.
To achieve this goal in a bachelor's thesis, the following tasks must be completed:
Requirements analysis: analyse the requirements for the development of the
platform in question.
Analysing existing analogues: to consider existing analogues on the market and
evaluate them.
Create mockups: based on the analysed analogues, create mockups of the future
website.
Platform development: to implement the platform using the selected tools.
Object of study: the study is the development of a web platform for the provision
of services in the field of tourism.
Subject of research: the research is a web platform for providing services in the
field of tourism.
Keywords: layout, JavaScript, phpMyAdmin, database.
ЗМІСТ
ВСТУП ............................................................................................................................. 4
РОЗДІЛ 1. ОГЛЯД ІСНУЮЧИХ РІШЕНЬ ТА ПОСТАНОВКА ЗАДАЧІ ........ 7
1.1 Огляд предметної області ................................................................................... 7
1.2 Огляд аналогів .................................................................................................... 10
1.3 Порівняння та аналіз аналогів ........................................................................ 18
1.4 Постановка задачі .............................................................................................. 19
Висновок до розділу 1 .............................................................................................. 20
РОЗДІЛ 2. ПРОЕКТУВАННЯ WEB-ПЛАТФОРМИ ........................................... 22
2.1 Визначення характеристик web-платформи ................................................ 22
2.2 Етапи розробки web-платформи ..................................................................... 27
2.3 Функціональні елементи та дизайн сторінок ............................................... 28
Висновок до розділу 2 .............................................................................................. 35
РОЗДІЛ 3. РЕАЛІЗАЦІЯ WEB-ПЛАТФОРМИ .................................................... 36
3.1 Обрання середовища розробки та інструментів. ......................................... 36
3.2 Верстка сторінок ................................................................................................ 43
3.3 Реалізація елементів інтерфейсу та функцій через Javascript .................. 53
3.4 Робота з phpMyAdmin ....................................................................................... 57
Висновок до розділу 3 .............................................................................................. 58
ВИСНОВКИ ................................................................................................................. 59
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ .................................................................. 2
ЧДТУ 242013.003.ПЗ
Зм. Лист № докумемента Підпис Дата
Розроб. Дмитренко С.С
. Літ. Лист Листів
Перев. Рудницька Ю.В Web-платформа компанії з надання послуг Н 2 46
Реценз.. Дідук В.А. у сфері туризму
ФІТІС,
Н.контр. Рудницька Ю.В
Пояснювальна записка
Затв. ПрокопенкоТ.О. кафедра ІТП, WEB-2011
`
СПИСОК СКОРОЧЕНЬ ТА УМОВНИХ ПОЗНАЧЕНЬ
HTML – Мова розмітки документів.
CSS - каскадна таблиця стилів.
JS – Javascript
XAMPP - кросплатформна збірка локального web-сервера, що містить Apache
PhpMyAdmin – web-інтерфейс для адміністрування баз даних MySQL.
Лист
ЧДТУ 242013.003 ПЗ
3
Зм Арк. № докум. Пiдпис. Дата
нт
`
ВСТУП
Сфера туризму активно розвивається впродовж останніх років. Все більше
людей здійснюють поїздки чи то робочі, чи з метою відпочинку. Головна ідея –
швидкість, комфорт та зрозумілість. Тому розробка web-платформи з надання
послуг в сфері туризму значно полегшить життя. Адже у користувачів з’явиться
можливість зробити вибір, отримати консультацію та забронювати поїздку.
Також компанія має значні переваги в даній розробці. Популяризація в
інтернеті та залучення нових користувачів. Реклама в соціальних мережах є одним
з ключових інструментів для поширення платформи серед потенційних клієнтів.
Оцінюючи сучасні аналоги маємо висновок: переважна більшість таких
сайтів спрямована не надання послуг, а на ознайомлення, що може ускладнювати
залучення нових користувачів. Сайти візитки, які працюю як реклама агенції чи
платформи є досить застарілим інструментом для розвитку туристичної агенції.
Перевага нашої розробки полягає в тому, що користувач може ознайомитися з
послугами, де є детальний опис, враховані найпопулярніші запитання та відгуки,
що дає можливість пересвідчитися в оцінці платформи іншими користувачами.
Така ідея допоможе розвивати web-платформу та залучати нових клієнтів.
Актуальність розробки web-платформи компанії з надання послуг у сфері
туризму полягає в тому, що сфера туризму має постійний ріст та активний
розвиток. Це спричинено факторами карантину та війни. Тому зараз розвиток
туризму йде з урахуванням всіх ризиків, що можуть загрожувати бізнесу. Для того,
щоб зробити замовлення, купити якийсь товар, переглянути фільм, знайти потрібну
інформацію, отримати консультації та багато інших дій не потрібно виходити
кудись, чекати в черзі з метою отримання послуг, для цього потрібен лише
пристрій.
Метою кваліфікаційної роботи бакалавра є розробка багатофункціональної
web-платформи, яка базується на сучасному підході до аналізу потреб ринку,
Лист
ЧДТУ 242013.003 ПЗ
4
Зм Арк. № докум. Пiдпис. Дата
нт
`
розширення функціоналу та покращення якості і орієнтованості саме на споживача
для надання послуг в сфері туризму
Задачі що слід виконати для досягнення поставленої мети:
1. Аналіз ринку. Проаналізувати сферу туризму, які чинники на неї
впливають та які ризики варто враховувати при розвитку web-платформи.
2. Огляд аналогів та порівняння. Огляд існуючих аналогів на ринку,
визначення сильних та слабких сторін. Порівняльний аналіз з метою
визначення переваг кожного конкурента для задіяння цих знань при
власній розробці.
3. Визначенні вимог до розробляємої web-платформи. На основі огляду
аналогів формуватиметься технічні характеристики web-платформи.
4. Створення макетів сайту. Створення макетів включає в себе результат
огляду аналогів та розроблені технічні характеристики до web-платформи.
Також розроблена структура сайту.
5. Розробка web-платформи. Розробка відповідно до макету та технічних
характеристик платформи, таких як онлайн-бронювання, форми
зворотного зв'язку.
Об'єктом дослідження є процес розробки web-платформи з надання послуг
у сфері туризму.
Предметом дослідження є web-платформа з надання послуг в сфері туризму.
Платформа дає можливість зробити бронювання туру онлайн, що може значно
зекономити час користувача на оформлення бажаної поїздки. Важливим
визначенням для дослідження є оцінка наявних підходів до розробки web-
платформи для взаємодії того, хто надає послуги і того хто отримує. Орієнтуючись
на зібрану інформацію ми розробимо якісну та багатофункціональну web-
платформу.
Методами дослідження даної теми є наступні:
1. Аналіз вимог клієнтів: Збір вимог та потреб клієнтів щодо
функціональності та зручності web-платформи.
Лист
ЧДТУ 242013.003 ПЗ
5
Зм Арк. № докум. Пiдпис. Дата
нт
`
2. Дослідження конкурентів: Аналіз web-сайтів інших туристичних агентств
для виявлення сильних та слабких сторін, можливостей та загроз.
3. Проектування інформаційної архітектури: Визначення структури та
навігації сайту для оптимізації простору web-платформи.
4. UX/UI дизайн: Розробка естетичного і зручного інтерфейсу та його
елементів.
5. Технічна розробка: Використання програмних мов та технологій для
створення функціональності сайту та його компонентів.
Практичне значення розробленої web-платформи для туристичної агенції
полягає в наданні зручного та ефективного інструменту для залучення клієнтів та
забезпечення їхніх потреб у бронюванні подорожей.
Лист
ЧДТУ 242013.003 ПЗ
6
Зм Арк. № докум. Пiдпис. Дата
нт
`
РОЗДІЛ 1.
ОГЛЯД ІСНУЮЧИХ РІШЕНЬ ТА ПОСТАНОВКА ЗАДАЧІ
1.1 Огляд предметної області
Сфера туризму за останні декілька років значно розширилась, зараз більшість
туристичних агенції працює онлайн, а менеджер консультує з будь якої точки світу.
Туризм у багатьох країнах світу є пріоритетним напрямом розвитку національної
економіки, що зумовлено його динамічністю, високою прибутковістю та великим
позитивним соціально-економічним і культурним впливом. Однак туристична
галузь є специфічним і досить складним об'єктом державного управління. [1]
Оскільки світ зіткнувся з безпрецедентною глобальною надзвичайною
ситуацією в галузі охорони здоров'я, соціальної та економічної ситуації,
спричиненою пандемією COVID-19, подорожі та туризм є одними з найбільш
постраждалих секторів, оскільки практично в усіх країнах світу не працюють
літаки, закриті готелі та запроваджені обмеження на поїздки.
OECD очікує, що міжнародний туризм впаде приблизно на 80% у 2020 році.
Особливо потерпають напрямки, які значною мірою покладаються на
міжнародний, діловий та розважальний туризм, при цьому багато прибережних,
регіональних та сільських районів почуваються краще, ніж міста.
Обнадійливі новини про вакцини посилили надії на відновлення, але виклики
залишаються, і очікується, що сектор залишатиметься в режимі виживання до кінця
2021 року.
Внутрішній туризм відновився і допомагає пом'якшити вплив на робочі місця
та бізнес у деяких напрямках. Однак справжнє відновлення стане можливим лише
тоді, коли повернеться міжнародний туризм. Це вимагає глобальної співпраці та
науково обґрунтованих рішень, щоб обмеження на поїздки можна було безпечно
зняти.[6]
Лист
ЧДТУ 242013.003 ПЗ
7
Зм Арк. № докум. Пiдпис. Дата
нт
`
Виживання бізнесу в усій туристичній екосистемі перебуває під загрозою без
постійної державної підтримки, і хоча уряди вжили вражаючих заходів, щоб
пом'якшити удар по туризму, мінімізувати втрату робочих місць і забезпечити
відновлення у 2021 році та в наступні роки, необхідно зробити більше і більш
скоординовано.[6]
Більшість світових держав проголосили туристичну індустрію одним із
пріоритетних напрямів розвитку національної економіки та культури, що сприяє
збільшенню валового внутрішнього продукту, інвестицій, модернізації
інфраструктури, валютних надходжень, розвитку торгівлі і промисловості, сприяє
створенню нових галузей. [1]
Загалом, туризм - це можливість наблизити сучасну людину до природного
довкілля, це унікальна можливість мирного взаємозбагачення. [2] В сучасному
світі, особливо в Україні, людина живе в надзвичайному напружені через останні
події ментальний стан суспільства зазнав значних змін. Відносно кількості
населення, кількість випадків депресії виводить Україну на сумне перше місце у
рейтингу, випереджаючи США, Австралію та Естонію, рівень депресії у яких
становить 5,9 відсотка. [3] Суспільство зазнає змін, що погано відображаються в
сфері життя людей, адже через постійне напруження можуть виникати проблеми
на роботі, в сім’ї та в побутових справах. Тому важливим є мати можливість
відволіктись та відпочити. Саме це є ключовим фактором розвитку туризму в
різних країнах. Більшість людей шукає можливість поїхати на відпочинок з метою
відволіктися. Неймовірні краєвиди, природа, різні нові міста все це надзвичайно
сильно приваблює більшість людей. В загальному, суспільство не може не
впливати на природу. Навіть у період свого відпочинку людина так чи інакше
взаємодіє з природою. Особливо ця взаємодія відбувається через такий активний
вид відпочинку як туризм. Подорожі у вільний час пов'язані з від'їздом за межі
постійного проживання, один з видів активного відпочинку, який поєднує
відновлення продуктивних сил людини з оздоровчими, пізнавальними,
спортивними та культурними розважальними цілями. Туризм можна сміло визнати
Лист
ЧДТУ 242013.003 ПЗ
8
Зм Арк. № докум. Пiдпис. Дата
нт
`
як один із способів природокористування, оскільки перебуваючи на природі,
людина так чи інакше використовує навколишнє середовище, його ресурси. [3]
Туризм варто розуміти як практичний і теоретичний спосіб відпочинку.
Людина збагачує свій внутрішній світ та поновлює ментальний стан. Це позитвно
відображає на здоров’я людини, що в свою чергу мають пряме відношення до її
функціонування в суспільстві. Туризм може бути різним, як пасивним та і
активним. Активний вид туризму включає активну діяльність це можуть бути різні
тури та екскурсії, які включають в себе походи, сходження горами, подорожі
історичними місяцями, в яких багато піших прогулянок. Також є пасивний вид
туризму, який включає різні круїзи, подорожі на автобусах та літаках.
Регулярна туристична діяльність і участь в туристичних змаганнях являється
ефективною компенсацією праці, викликають у людини радість життя, служить
загартуванням і збільшують фізичну життєдіяльність організму.[3]
Під час своїх мандрівок і походів, як в межах своєї країни і за кордоном
знайомляться з країною і її людьми, їх життя, знайомляться з національною
культурою. Вони розширюють і поглиблюють свої знання в області ботаніки,
зоології, геології, географії, метеорології, астрономії, сільського і лісового
господарства, історії культури і мистецтва. [3]
Однією з місій туризму є популяризація історії і формуванню світогляду.
Згідно з визначенням Всесвітньої туристичної організації ООН, культурний
туризм - це «переміщення людей з переважно культурних мотивів, таких як
навчальні тури, тури з метою ознайомлення з мистецтвом і культурою, поїздки на
фестивалі та інші культурні заходи, відвідування визначних місць і пам'яток,
подорожі з метою вивчення природи, фольклору або мистецтва, а також
паломництво». [4]
Під час подорожей і походів як по своїх країнах, так і в інших країнах туристи
знайомляться з країною, її людьми, їх життям і національною культурою. Вони
розширюють і поглиблюють свої знання в області ботаніки, зоології, географії,
геології, метеорології і астрономії, сільського і лісового господарства, історії і
культури. Правильно організована подорож або похід вносить важливий внесок в
Лист
ЧДТУ 242013.003 ПЗ
9
Зм Арк. № докум. Пiдпис. Дата
нт
`
розвиток загальноосвітньої підготовки. Завдяки постійному переміщенню по
місцевості, вмінню користуватися картою і компасом, активній участі в різного
роду іграх на місцевості і туристичних змаганнях розширюють кругозір кожного
учасника змагань.
Отже, сфера туризму активно розвивається та має великі перспективи в
майбутньому. Адже вона включає історію, спілкування та вираження власних
емоцій, що є дуже важливим в сучасному світі. В свою чергу пізнання різних
культур дітьми формує їхню особистість та розширює спектр знань в світовій та
власній історії. Це дає можливість зрозуміти важливість збереження культурної
спадщини та ідентичності.
1.2 Огляд аналогів
В сфері туризму є технології, завдяки яким туризм розвивається, пошук
потрібної інформації по турах, огляд готелів, транспорту та інших місць,
порівняння цін та вигідних пропозицій, пошук авіаквитків, квитків на потяг, а
також відгуки інших користувачів. Сфера туризму активно розвивається ще й
завдяки відгукам, адже коли користувач шукає якийсь тур, орієнтуючись
наприклад на країну, йому важливо розуміти, які краще готелі обирати, де можна
смачно перекусити та які місця рекомендовано відвідати. Серед аналогів сайту
туристичної агенції можуть бути інші we-ресурси, які пропонують схожі послуги
та функціонал. Це можуть бути сайти інших туристичних агентств, онлайн системи
для бронювання, портали для порівняння цін на подорожі тощо. Важливо провести
докладний аналіз конкурентів та визначити свої конкурентні переваги для
привернення клієнтів.
Розгляд та дослідження інших аналоги, які мають спільні риси та задачі з
даним проєктом, на сучасному ринку. Огляд аналогів включає визначення
необхідних аспектів на яких будуватиметься розробка даної платформи.
Аналіз web-сайтів конкурентів полягає у вивченні та оцінці стратегій онлайн-
суперників для виявлення їхніх сильних і слабких сторін у порівнянні з вашими.
Лист
ЧДТУ 242013.003 ПЗ
10
Зм Арк. № докум. Пiдпис. Дата
нт
`
Він включає вивчення різних аспектів їхньої присутності в Інтернеті - структури
web-сайту, зміст якість, оптимізація ключових слів, стратегія посилань - а також
їхні платформи в соціальних мережах.[5]
Оцінка аналогів та їх ключових технічних характеристик важлива для
розуміння конкурентного середовища та визначення переваг та недоліків в
порівнянні зі створюваною платформою для надання послуг в сфері туризму.
Оцінка аналогів допоможе нам визначити найбільш важливі функції та можливості
для нашої власної платформи, а також забезпечити відповідність потребам
користувачів та ринковим очікуванням.
Онлайн-туристична агенція (OTA) - це бізнес, який дозволяє користувачам
шукати та бронювати туристичні продукти, такі як авіаквитки, житло, оренда
автомобілів, тури, круїзи тощо. Іншими словами, ОТА є посередниками між
постачальниками туристичних послуг (авіакомпаніями, готелями, туроператорами
тощо) та клієнтами (зазвичай це мандрівники або інші ОТА).
ОТА часто діють як туроператори, формуючи туристичні пакети, а також
надають додаткову інформацію, пов'язану з подорожами, як-от відгуки, поради
тощо.
Нижче ми оглянемо кілька переваг даної системи.
1. Зручність. Сьогодні, коли в Інтернеті так багато інформації, мандрівники
користуються послугами ОТС, щоб легко знайти та забронювати житло на
надійному web-сайті. ОТА надають можливість порівнювати ціни,
розташування та типи помешкань. Можливість відфільтрувати тисячі
об'єктів нерухомості до одного, який відповідає цілям подорожі, є безцінним
інструментом, який економить години часу.
2. Програми лояльності. Більші туристичні оператори мають програми
лояльності, які винагороджують мандрівників за бронювання декількох
подорожей через їхній сайт, включаючи номери (або ліжка), оренду
автомобілів, квитки на літак та заходи.
Лист
ЧДТУ 242013.003 ПЗ
11
Зм Арк. № докум. Пiдпис. Дата
нт
`
3. Рішення, що ґрунтуються на ціні. Онлайн-туристичні агенції часто вважають
найдешевшим місцем для бронювання та найкращим місцем для пошуку
пакетних пропозицій.
4. Великі рекламні та маркетингові бюджети. Рекламні кампанії, орієнтовані на
знижки та вигідні пропозиції, допомагають сформувати у споживачів
уявлення про те, що ОТА - найкраще місце для бронювання.
5. Безпечні глобальні платежі та захист мандрівників. ОТА надають
мандрівникам можливість здійснювати безпечні та надійні платіжні операції
у валюті, якій вони надають перевагу.
OTA стали дуже популярними серед подорожуючих через їхню зручність,
широкий вибір послуг та можливість порівнювати ціни різних постачальників.
При розгляді аналогів враховуватиметься наступні елементи:
Дизайн: При розгляді дизайну неможливо надати конкретну оцінку, адже
така позиція є цілком суб’єктивна і кожною людиною сприйматиметься по різному.
При розгляді аналогів, які є близькими по ідеї майбутній платформі оцінка
ґрунтуватиметься на відповідності дизайнерського підходу на всіх сторінка. Тобто
чи поєднанні вони між собою єдиним дизайнерським рішенням, чи
використовуються єдині шрифти на всіх сторінках чи немає перенавантаження
різними стилями. Це є важливим, оскільки на цьому базуватиметься перше
враження про платформу.
Єдиний стиль: В сучасному світі індивідуальний стиль платформи є
важливим, оскільки на цьому створюється бренд. В свою чергу брендованість при
розвитку сайту дає пізнаваність та успіх. Тому важливим є заснування єдиного
стилю ще на початку створення платформи.
Фільтри: При представлені великої кількості пропозицій необхідним є
створення фільтрів, адже це значно полегшить пошук потрібного варіанта
користувачем.
Відгуки та оцінки: Платформа повинна надавати можливість залишити
відгук, чи задати питання користувачеві, щоб дізнатися якусь інформацію.
Лист
ЧДТУ 242013.003 ПЗ
12
Зм Арк. № докум. Пiдпис. Дата
нт
`
Додаткові пропозиції та бонуси: Розміщення додаткових акцій та бонусів,
щоб зацікавити користувача.
Контактні дані: Платформа має надавати додаткові дані для можливості
зв’язатися з компанією.
Форми для заповнення: Дуже важливим та необхідним є комунікація з клієнт
та отримання зворотного зв`язку.
Адаптація під різні розміри: Для більш зручного використання платформа
повинна бути адаптована до різних розмірів екрану.
Меню. Для кожної платформи є індивідуальна підхід при створенні. Проте
якщо на сторінці довго прокручувати, то краще.
Анімація. Анімаційні елементи роблять сайт більш цікавішим, оскільки
користувач бачить відгук сайту на його переміщення, обрання та натискання.
Далі розглянемо декілька аналогів WEB-платформ компанії з надання послуг
у сфері туризму.
Booking.com.
Рисунок 1.1 – Головна сторінка сайту Booking.com
Лист
ЧДТУ 242013.003 ПЗ
13
Зм Арк. № докум. Пiдпис. Дата
нт
`
1. Дизайн. На сайті підтримується один дизайн та кольорова гама. Відсутні
зайві елементи, які б ускладнювали переміщення на сайті чи ознайомлення з
інформацією. Будь яка компанія - це певний бренд. Хоч платформа немає
логотипу, а лише назву в лівій верхній позиції - це не зменшує значення двох
основних кольорів, з якими поєднується сайт - синій та білий.
2. Єдиний стиль. На всьому сайті присутній єдиний стиль. Кожна сторінка
містить в собі відповідні шрифти, немає по ним перевантаження. Платформа
не поєднує в собі відразу декілька стилів шрифтів, чи виділяє інформацію по
різному. Все гармонічна оформлено і чітко видно.
3. Фільтри. На цій платформі є широкий вибір послуг. На Booking пропонується
великий вибір готелів, авіаквитків автобусних маршрутів та таксі. Завдяки
фільтрам користувач може відкоригувати за своїми вподобаннями ціни, дати
та країни. Це дає можливість шукати більш цілеспрямовано та не звертати
уваги на потрібні пропозиції. Завдяки фільтрам платформа надає всі
результати, які відповідають побажанням клієнтів.
4. Відгуки та оцінки. Відгуки та оцінки інших користувачів дає можливість
отримати більш ґрунтовну оцінку, ніж спиратися маркетинговий опис та
рекламу. Не на всіх пропозиціях споживач знайде відгуки. Оцінка є, за 10
бальною шкалою
5. Додаткові пропозиції та бонуси. На сайті наявні спеціальні пропозиції,
промокоди та акції для користувачів. Для постійних клієнтів можуть бути
додаткові бонуси та пропозиції в особистому кабінеті.
6. Контактні дані. Платформа надає контактні дані своїх постачальників:
телефони, адреси та електронні пошти, що дозволяє користувачеві
сконтактувати з постачальником та проконсультуватися відносно якоїсь
послуги.
7. Форми для заповнення. Дуже важливим та необхідним є комунікація з клієнт
та отримання зворотного зв`язку. На платформі є можливість заповнити
форму реєстрації та залишити відгук. Реєстрація зручна і швидко, потрібно
лише надати електронну пошту і туди надійде лист.
Лист
ЧДТУ 242013.003 ПЗ
14
Зм Арк. № докум. Пiдпис. Дата
нт
`
8. Адаптація під різні розміри. Платформою зручно користуватися як на
мобільному пристрої так і на більшому екрані.
9. Меню. На Booking не фіксоване, тому виникає незручність, що якщо
потрібно дивитися інші послуги потрібно прокручувати вверх.
10. Анімація. На платформі немає ніяких анімаційних елементів. Елемент не
збільшує розмір при наведені, лише кнопки стають на відтінок темніші.
Одним з недоліків є сплата комісії. Оскільки постачальники послуг, які
використовую платформу для поширення своїх послуг платять комісію, то це може
впливати на ціни для користувачів. Також на деяких пропозиціях стоять обмеження
по коментарях або взагалі закриті. Така функція зменшує бажання користувача до
співпраці та зниження довіри.
В деяких випадках користувач зіштовхується з відсутністю гнучких умов для
скасування бронювань.
JoinUp
Рисунок 1.2 – Головна сторінка сайту JoinUP
1. Дизайн. Сайт поєднує в собі теплі кольори, оранжевий та жовтий. Основним
є білий. На сайті є символи, які відповідають за певні функції: пошук,
особистий кабінет чи контакти.
Лист
ЧДТУ 242013.003 ПЗ
15
Зм Арк. № докум. Пiдпис. Дата
нт
`
2. Єдиний стиль. На всьому сайті присутній єдиний стиль. Шрифти на кожній
сторінці відповідні. В компанії є власний логотип, який має досить спільні
риси з кольоровою гамою сайту.
3. Фільтри. На сайті наявно багато пропозицій. Спочатку користувач обирає
країну, в яку планує здійснити поїздку, а потім налаштовує фільтр відповідно
до своїх бажань: дата вильоту та повернення, кількість ночей та
подорожуючих, готель та інші потрібні аспекти. Фільтри досить розширені,
що значно полегшує пошук.
4. Відгуки та оцінки. На сайті відгуки відсутні, також немає форми, щоб їх
залишити.
5. Додаткові пропозиції та бонуси. На сайті немає жодних представлених
пропозицій чи акцій.
6. Контактні дані. На цій платформі наявні контактні дані менеджерів, з якими
можна зв’язатися у разі потреби, також є електронна пошта.
7. Форми для заповнення. Після обрання бажаного туру користувач може
заповнити форму, а відповідний менеджер зв’яжеться в зручний для
користувача час.
8. Адаптація під різні розміри. Платформою зручно користуватися як на
мобільному пристрої так і на більшому екрані.
9. Меню. На цій платформі меню фіксоване, тому користувачеві зручно в будь
який момент перейти на інші сторінку.
10. Анімація. На платформі наявні анімаційні елементи: збільшення зображень
при наведенні, активність різних позначок, все це робить сайт більш живим.
Імперія Тур.
Рисунок 1.3 – Головна сторінка сайту Імперія Тур
Лист
ЧДТУ 242013.003 ПЗ
16
Зм Арк. № докум. Пiдпис. Дата
нт
`
1. Дизайн. Сайт розроблений з дуже мінімалістичним дизайном. Де основою є
білий колір, а елементи на які потрібно звернути увагу блакитним. Такий
підхід дає можливість зосередити увагу на тому, що представляє компанія та
що може зацікавити клієнта.
2. Єдиний стиль. Сайт зроблений в одному стилі. Також у компанії наявний
логотип, який представлений в меню, посередині. Це відразу привертає
увагу, та забезпечує пізнаваність компанії.
3. Фільтри. На сайті відсутні фільтри, всі пропозиції представлені по
категоріях.
4. Відгуки та оцінки. На платформі відгуки відсутні, також немає форми, щоб
їх залишити.
5. Додаткові пропозиції та бонуси. На сайті немає жодних представлених
пропозицій чи акцій.
6. Контактні дані. На сайті наявні контактні дані менеджерів, з якими можна
зв’язатися у разі потреби, також представлений перехід на компанію в
соціальних мережах.
7. Форми для заповнення. Жодних форм на сайті немає, всі бронювання та
консультації відбуваються виключно за допомогою телефонної розмови.
8. Адаптація під різні розміри. Платформою зручно користуватися як на
мобільному пристрої так і на більшому екрані.
9. Меню. На сайті меню “бургер”, але при гортанні сторінки вниз, потрібно
повертатися для того аби обрати іншу сторінку для ознайомлення.
10. Анімація. На платформі відсутні будь-які анімаційні елементи.
Лист
ЧДТУ 242013.003 ПЗ
17
Зм Арк. № докум. Пiдпис. Дата
нт
`
1.3 Порівняння та аналіз аналогів
Таблиця 1.1 Порівняння аналогів
Критерії Опис Booking JoinUp Імперія тур
Дизайн Відповідність дизайну Відповідає Відповідає Відповідає
на всіх сторінках
Єдиний Застосування єдиного Відповідає Відповідає Відповідає
стиль дизайнерського рішення
до всіх елементів
Фільтри Присутність фільтрів на Наявні Наявні Відсутні
платформі
Відгуки та Коментарі від інших Наявні Відсутні Відсутні
оцінки клієнтів
Додаткові Акції, промокоди, Наявні Відсутні Відсутні
пропозиції знижки
та бонуси
Контактні Наявність контактів для Наявні Наявні Наявні
дані зв’язку з представником
послуг
Форми для Форма для бронювання Наявні Наявні Відсутні
заповнення
Адаптація Можливість Наявна Наявна Наявна
під різні користуватися
розміри платформою не залежно
від розміру екрану
Меню Доступ до меню Нефіксоване Фіксоване Нефіксоване
Анімація Наявність анімаційних Наявні Наявні Відсутні
елементів
По порівняльній таблиці можна зробити висновок, що кожен сайт, по
визначеним метрикам огляду є індивідуальним. Переваги та недоліки присутні на
кожній платформі. Відсутність фільтрів на платформі Імперія Тур ускладнює
пошук бажаної подорожі, проте на сайті наявні контактні дані, що дає можливість
користувачу зв’язатися з консультантом для уточнення. Також відсутність
фіксованого меню ускладнює навігацію. Booking.com з відсутністю фіксованого
меню робить навігацію складною, оскільки інформації на сайті багато. JoinUp та
Лист
ЧДТУ 242013.003 ПЗ
18
Зм Арк. № докум. Пiдпис. Дата
нт
`
Імперія Тур не мають ніяких відгуків попередніх користувачів, що може понизити
довіру майбутніх споживачів.
1.4 Постановка задачі
Оскільки на меті стоїть розробка web-платформи з надання послуг у сфері
туризму коректно сформована задача допоможе чітко визначити етапи, необхідні
інструменти та час необхідний для реалізації проєкту.
Функціональність включає в себе реєстраційні форми та форми зворотного
зв’язку, можливість залишити відгук, бронювання послуг, ознайомлення з
пропозиціями та зв’язок з менеджером.
Платформа для надання послуг в сфері туризму є важливим і потужним
інструментом, який значно спрощує та поліпшує процес планування та бронювання
подорожей для користувачів. Ідея платформи полягає в полегшенні процесу вибору
та бронювання турів, а також у забезпеченні доступу до широкого спектру
туристичних послуг. Отже, платформа для надання послуг в сфері туризму можна
вважати як інструмент, що значно полегшує та покращує досвід користувачів у
сфері туризму.
Така платформа, в сучасному світі, є однією з систем, що надає користувачам
можливість знаходити, обирати та бронювати туристичні послуги. Це значно
спрощує планування подорожі для споживача. Дана платформа об'єднує в собі
функціонал фізичної агенції туристичних послуг, систему бронювання, а також
міститиме додаткові сервіси, такі як рекомендації та відгуки користувачів,
спрямовані на полегшення процесу планування та здійснення подорожей.
Ідея даної платформи полягає в полегшення клієнтові самого процесу
планування подорожі. В сучасному світі надзвичайно багато інновації, які щодня
набирають всі більше попиту. Проте не всі споживачі можуть бути з ними знайомі.
Сама система планування подорожі може суттєво відрізняти в кожній країні. Проте
цей процес можна значно полегшити, якщо користувача матиме можливість
Лист
ЧДТУ 242013.003 ПЗ
19
Зм Арк. № докум. Пiдпис. Дата
нт
`
ознайомитися з туром на сайті, почитати про нього відгуки інших користувачів та
забронювати дати.
Web-платформа – це динамічність в використанні та споживанні, дана
платформа це постійне оновлення та додавання нових турів, аналіз клієнтів та їхніх
відгуків та покращення сайту для подальшого росту та розвитку ідеї.
Отже, сайт туристичної агенції є важливим інструментом для надання послуг
та залучення клієнтів. Основна мета сайту полягає в тому, щоб забезпечити зручний
та інформативний простір для клієнтів, які шукають інформацію про можливі
подорожі та актуальні тури. Основною задачею сайту є мінімізувати час
планування та зробити його більш легким.
У сучасному світі зростає популярність туризму, а також – кількість людей,
які шукають інформацію та роблять бронювання онлайн. Тому наявність якісного
та зручного сайту туристичної агенції стає надзвичайно важливою для
конкурентоспроможності на ринку туристичних послуг. Реалії нашого життя
полягають в тому, що все диджіталізується. Це допомагає людям отримати
необхідні їм послуги в пришвидшеному варіанті. Тобто питання полягає в тому, що
відвідування туристичної агенції з метою бронювання майбутньої подорожі є
незручним та «застарілим» способом. Таким чином створюючи зручний простір
для пошуку бажаного відпочинку, клієнт зможе сам в зручний для себе час
розглянути актуальність турів, їхній опис та чим вони цікаві, а потім обрати
бажаний для себе тур, заповнити форму бронювання з зручним часом для дзвінка і
тобі консультанта зв’яжеться для уточнення питань.
Висновок до розділу 1
В першій розділі розглянуто сферу туризму як бізнес та інструмент пізнання
навколишнього світу. В сучасному світі, де постають питання культурної
спадщини, а особливо в Україні це відчувається дуже гостро, важливим є надати
можливість людям дізнатися краще свою історію та історію своєї країни.
Лист
ЧДТУ 242013.003 ПЗ
20
Зм Арк. № докум. Пiдпис. Дата
нт
`
Також туризм посідає одну з ключових ролей в світовому значенні. Роки
COVID-19 дали можливість людям зрозуміти вважливість комунікації та
суспільної діяльності. Це допомагає пізнати культуру мислення та світосприйняття
один одного, що покращує суспільні зв’язки.
У порівнянні трьох туристичних платформ, кожна має свої унікальні
переваги та недоліки. Платформа Booking вирізняється чітким дизайном, єдиним
стилем, наявністю фільтрів та відгуків користувачів, що надає змогу клієнтам
робити інформовані вибори. Однак, не зважаючи на відсутність анімаційних
елементів, сплата комісії та обмежені можливості коментарів можуть впливати на
загальне враження користувачів.
Сайт JoinUP приваблює теплими кольорами, наявністю логотипу та
фіксованим меню, що полегшує навігацію. Розширені фільтри дозволяють клієнтам
детально налаштовувати пошук, але відсутність відгуків та додаткових пропозицій
може бути недоліком для деяких користувачів.
Імперія Тур має мінімалістичний дизайн та зосереджується на базових
функціях. Відсутність фільтрів, відгуків, додаткових пропозицій та анімаційних
елементів обмежує функціональність сайту, але наявність контактних даних та
адаптація під різні розміри екранів забезпечують зручність користування.
Загалом, вибір платформи залежить від конкретних потреб користувачів:
Booking підходить для тих, хто цінує гнучкість і розширені можливості, JoinUP
пропонує зручну навігацію та деталізовані фільтри, а Імперія Тур орієнтується на
простоту та базовий функціонал.
Лист
ЧДТУ 242013.003 ПЗ
21
Зм Арк. № докум. Пiдпис. Дата
нт
`
РОЗДІЛ 2.
ПРОЄКТУВАННЯ WEB-ПЛАТФОРМИ
2.1 Визначення характеристик web-платформи
В другому розділі розглянемо проєкт з точки зору технічних показників та
показників якості. В даному розділі сформується опис майбутньої розробки та які
цілі ставляться на меті.
Загалом технічні характеристики – це досить детальний і вичерпний
«документ», який описує всі технічні процедури та вимоги, пов'язані з розробкою
продукту. Він охоплює всю важливу, детальну інформацію про процес розробки
продукту та поставлені технічні задачі, виконання яких свідчитиме з оцінку роботи
по завершенню проєкту.
Також є поняття функціональної характеристики, яка відрізняється за ідеєю
від технічних характеристик. Технічні характеристики іноді плутають з
функціональними характеристиками. Хоча обидва документи по цих
характеристикам закладають основу для успішного проєкту, але між ними є
ключові відмінності.
Функціональні характеристики базуються на бізнес-вимогах. Вони
фокусуються на користувацькому досвіді, дивлячись на функціональність
продукту. На відміну від них, технічні характеристики фокусуються на
внутрішньому програмуванні. Вони включають в себе плани впровадження,
тестування та переваги конкретних функцій. Це дає можливість розробити продукт,
який успішно вийде на ринок та зарекомендує себе.
Функціональні вимоги прописуються більш конкретно та структуровано
після фідбеку користувачів. Оскільки тоді розробники мають чітке розуміння, що
саме потрібно вдосконалити в розробці та покращити в майбутніх оновленнях
платформи. Проте базуючись на оцінці аналогів ми зможемо описати
Лист
ЧДТУ 242013.003 ПЗ
22
Зм Арк. № докум. Пiдпис. Дата
нт
`
функціональні вимоги до нашого продукту, що покращить його
конкурентоспроможність.
Технічні характеристики використовуються з метою постановки конкретних
задач перед розробкою. Вони визначаються з урахуванням вимог користувачів,
стратегії розвитку продукту та специфікацій індустрії туризму. Так розроблювана
WEB-платформа наступні показники продукту:
1. Дизайн,
2. Єдиний стиль
3. Фільтри
4. Відгуки та оцінки
5. Додаткові пропозиції та бонуси
6. Контактні дані
7. Форми для заповнення
8. Адаптація під різні розміри
9. Меню
10. Анімація.
Ці параметри визначають частково структуру та робочий схему сайту, а
також її здатність адаптуватися до змін у вимогах та обсягу даних. Важливим
етапом в розробці є аналіз вимог до платформи з технічної, економічної, такі як
ресурси та системи на розробку та підтримку платформи, технологічні вимоги та
можливості для оптимізації процесів.
Детальний огляд технічних аспектів продукту, необхідних для успішної
реалізації та експлуатації платформи для надання послуг у сфері туризму.
Є декілька важливих аспектів, які потрібно враховувати при створені
візуального враження про web-платформу.
Дизайн. Це перше враження, адже при вході на платформу користувач
зосереджується свою увагу на певних елементах інтерфейсу. Тому важливо, щоб
елементи мали відповідний розмір та колір і перше враження про сайт було
позитивне. Зараз в дизайні переважає мінімалізм. В загальному дизайн має декілька
основних аспектів, які впливають на користувача.
Лист
ЧДТУ 242013.003 ПЗ
23
Зм Арк. № докум. Пiдпис. Дата
нт
`
1. Перше враження та реакція: дизайн нашої платформи є першим, з чим
користувач зіштовхується, і від нього залежить перше враження та
подальші дії користувача. Чи буде бажання в нього залишитися? Якщо
дизайн привабливий та професійний, це може позитивно вплинути на
сприйняття продукту.
2. Сприйняття та використання: зручний та інтуїтивно зрозумілий дизайн
полегшує та спростовує використання платформи, зменшуючи кількість
помилок користувача та час, потрібний для досягнення мети. Важливо
дотримуватися мінімалізму в розміщенні елементів. Не потрібно
навантажувати платформу багатьма розділами, користувач має отримати
основну ідею того, яку інформацію він отримає на даній платформі.
3. Емоційна реакція: дизайн може викликати емоційну реакцію у
користувачів. Привабливий та естетично приємний дизайн може створити
позитивні асоціації та викликати бажання повертатися до продукту знову.
4. Довіра: професійний дизайн може сприяти підвищенню довіри
користувачів до продукту або бренду. Якщо платформа виглядає
неналежно та не відповідає певним вимогам, це може викликати сумніви
щодо надійності та якості продукту.
5. Уповільнення або прискорення прийняття рішення: дизайн впливає на
швидкість, з якою користувачі можуть зрозуміти, що робити на
платформі. Завантаження сторінок, чіткість навігації та простота
використання можуть прискорити процес взаємодії з платформою та
прийняття рішення користувачем.
6. Рішення про покупку або дії: добре спроектований дизайн може
підвищити конверсію, адже він може створити відчуття впевненості в
продукті або послузі, а також полегшити процес прийняття рішення про
покупку.
Єдиний стиль. Єдиний стиль на платформі є важливим аспектом, який
впливає на загальне сприйняття користувачами та забезпечує узгодженість всіх
Лист
ЧДТУ 242013.003 ПЗ
24
Зм Арк. № докум. Пiдпис. Дата
нт
`
елементів інтерфейсу. Кожен елемент має гармонійно поєднуватися з іншими,
створюючи цілісний та професійний вигляд платформи.
1. Загальна гармонія: єдиний стиль допомагає створити цілісний вигляд
платформи. Всі елементи дизайну, включаючи шрифти, кольори, відступи та
кнопки, повинні виглядати узгоджено, що робить сайт естетично приємним
та зручним для користувачів. Наприклад, використання однакових шрифтів
на всіх сторінках забезпечує візуальну гармонію та сприяє легкості читання.
2. Інтуїтивність: єдиний стиль полегшує користувачам навігацію по платформі.
Коли всі елементи оформлені в одному стилі, користувачам легше
орієнтуватися та знаходити необхідну інформацію. Це знижує ймовірність
помилок і забезпечує більш приємний досвід використання.
3. Професійний вигляд: узгодженість стилю демонструє професіоналізм та
увагу до деталей. Користувачі, що бачать платформу з єдиним стилем, більше
довіряють бренду та вважають його надійним. Наприклад, однакове
оформлення кнопок та заголовків створює відчуття надійності та високої
якості.
4. Емоційна стабільність: єдиний стиль допомагає створити стабільний
емоційний фон. Коли користувачі переходять з однієї сторінки на іншу і
бачать той самий стиль, це викликає почуття знайомості та комфорту. Це
може позитивно вплинути на емоційний зв’язок користувача з брендом.
5. Узгодженість бренду: єдиний стиль сприяє впізнаваності бренду.
Використання однакових кольорів, шрифтів та інших елементів дизайну на
всіх сторінках платформи допомагає користувачам ідентифікувати бренд
серед конкурентів. Наприклад, наявність фірмових кольорів на всіх сторінках
робить бренд легко впізнаваним і запам’ятовується.
6. Підвищення ефективності взаємодії: єдиний стиль дозволяє користувачам
швидше освоїти платформу та ефективніше взаємодіяти з нею. Узгодженість
елементів зменшує час, необхідний для розуміння структури сайту, що
сприяє більш швидкому досягненню користувачами своїх цілей.
Лист
ЧДТУ 242013.003 ПЗ
25
Зм Арк. № докум. Пiдпис. Дата
нт
`
Наявність анімаційних елементів.
Наявність анімації на платформі дає можливість відчути її «живою». Тобто
користувач бачить реакцію сайту на свої дії, що робить певний емоційний зв’язок
та покращує довіру до нас. Тому ми виокремили декілька аспектів анімації на
платформі.
1. Типи анімації: застосування різних видів анімації, які використовуються
на web-сайті. Наприклад, перехідні анімації, анімації завантаження,
ефекти наведення, анімації руху, зміна розмірів, а також анімації для
інтерактивних елементів, таких як кнопки, форми, іконки. Проте, ми в
розробці використаємо лише декілька видів, орієнтуючись на 2-3, щоб не
перенавантажувати сторінки.
2. Призначення анімації: також потрібно врахувати мету анімації та як вона
впливає на користувача. Анімація може використовуватися для
покращення UX, спрямовуючи увагу користувача або підвищуючи
видимість важливих елементів.
3. Тривалість та плавність: використовуватимемо короткі, плавні анімації,
які сприяють кращій взаємодії, тоді як довгі або "важкі" анімації можуть
викликати затримки або роздратування у користувачів.
4. Оптимізація для різних пристроїв: оптимізація анімації для мобільних
пристроїв, планшетів та настільних комп'ютерів. Анімації повинні
адаптуватися до різних розмірів екранів та платформ без втрати якості.
Адаптивність для різних пристроїв.
Адаптивність в наш час є дуже важливим елементом, адже користувач може
працювати з платформою не тільки з ноутбука, а й з мобільного пристрою. Тому
нашою метою є уникнення «перетягування сторінки» на мобільних пристроях.
1. Відповідність різним розмірам екрану: інтерфейс і компоненти
автоматично підлаштовуються під різні розміри екрану. Це забезпечує
оптимальний користувацький досвід незалежно від того, чи використовує
користувач настільний комп'ютер, ноутбук, планшет або смартфон.
Лист
ЧДТУ 242013.003 ПЗ
26
Зм Арк. № докум. Пiдпис. Дата
нт
`
2. Використання адаптивного дизайну: ми згадували цей аспект, який
дозволяє елементам переміщуватися, розтягуватися або зменшуватися
залежно від розміру екрану.
3. Гнучкі зображення та елементи: важливо, щоб зображення та медіа-
елементи (відео, графіка) також були адаптивними. Це забезпечує їхнє
правильне відображення та масштабує їх, щоб уникнути деформації або
перевантаження екрану.
4. Простота навігації та використання: адаптивність також означає, що
навігація повинна бути зрозумілою і легкою незалежно від пристрою.
Адаптивні елементи інтерфейсу (наприклад, меню, кнопки) повинні
залишатися зручними та доступними на будь-якому пристрої.
У цілому, написання технічних характеристик допомагає забезпечити
успішну реалізацію проекту шляхом уточнення вимог, визначення стандартів та
керування ризиками.
2.2 Етапи розробки web-платформи
Розробка даної платформи включатиме в себе декілька етапів, завдяки яким
отримаємо результат. В даному проєкті є декілька ключових етапів: визначення
технічних характеристик, визначення функціональних характеристик створення
макету сайта, розробка і наповнення контентом та тестування.
Рисунок 2.1 – Етапи створення проєкту
Лист
ЧДТУ 242013.003 ПЗ
27
Зм Арк. № докум. Пiдпис. Дата
нт
`
Нижче наведено опис етапів, які будуть виконані для досягнення бажаного
результату при розробці платформи.
1. Визначення технічних характеристик: на цьому етапі визначено головні
характеристики для розробки платформи, а також їхні вимоги.
2. Створення макету сайту: на цьому етапі розроблено макети сторінок сайту
на основі порівняння аналогів.
3. Розробка та наповнення контентом: на цьому етапі – написання коду для
платформи та наповнення відповідним контентом. підключення бази
даних.
2.3 Функціональні елементи та дизайн сторінок
Взаємодія з користувачем. В даному пункті ми опише те, яким чином
користувач взаємодіяти з платформою. Який її опис, призначення та кінцевий
результат.
1. Пошук турів.
Опис: можливість шукати тури та подорожі, вивчати опис та бачити
оцінку туру. Метою є зручний та зрозумілий пошук, що полегшить
орієнтування споживача на платформі.
Призначення: надання користувачам зручного способу знаходження та
обрання туру, яке відповідає їх потребам.
2. Бронювання турів.
Опис: можливість бронювати доступні тури безпосередньо через
платформу.
Призначення: забезпечення зручності та ефективності у процесі
бронювання подорожей для користувачів.
Фільтри. Фільтри на платформі є ключовим інструментом для користувачів,
які допомагають знаходити потрібну інформацію та приймати рішення швидше та
ефективніше. Добре розроблені фільтри значно покращують користувацький
досвід, забезпечуючи зручність та точність у пошуку.
Лист
ЧДТУ 242013.003 ПЗ
28
Зм Арк. № докум. Пiдпис. Дата
нт
`
1. Інструмент пошуку: фільтри є одним із перших інструментів, з якими
користувачі взаємодіють на платформі під час пошуку послуг або продуктів.
Якщо фільтри дозволяють швидко знайти потрібну інформацію, це
позитивно вплине на подальше використання платформи.
2. Довіра: надійні та точні фільтри сприяють підвищенню довіри до платформи.
Якщо користувачі бачать, що фільтри працюють коректно та повертають
відповідні результати, вони більше довіряють платформі. Це може також
сприяти підвищенню лояльності та частоті використання.
3. Уповільнення або прискорення прийняття рішення: фільтри можуть значно
впливати на швидкість прийняття рішень. Якщо фільтри налаштовані
правильно, користувачі можуть швидко знайти потрібну інформацію та
прийняти рішення.
4. Рішення про покупку або дії: фільтри можуть суттєво вплинути на конверсію.
Коли користувачі можуть легко відсіяти непотрібні опції та знайти саме те,
що їм потрібно, це підвищує ймовірність здійснення покупки або іншої
цільової дії.
Відгуки та знижки. Відгуки та знижки є важливими компонентами
платформи, що впливають на рішення користувачів та їхній досвід взаємодії з
продуктом. Вони допомагають створити довіру, залучити нових клієнтів та
підвищити задоволеність наявних.
1. Перше враження та реакція: відгуки та знижки одразу привертають увагу
користувачів, оскільки вони шукають надійність і вигідні пропозиції.
Якщо користувач бачить позитивні відгуки та доступні знижки, це
сприяє формуванню позитивного першого враження про платформу.
2. Емоційна реакція: позитивні відгуки викликають у користувачів відчуття
задоволення та впевненості в обраному продукті або послузі. Знижки, у
свою чергу, викликають радість та почуття вигоди від покупки. Це
створює позитивні асоціації з платформою та спонукає до подальшої
взаємодії.
Лист
ЧДТУ 242013.003 ПЗ
29
Зм Арк. № докум. Пiдпис. Дата
нт
`
3. Довіра: відгуки інших користувачів відіграють ключову роль у
формуванні довіри до платформи. Чесні та деталізовані відгуки
підвищують рівень довіри, оскільки нові користувачі бачать реальні
враження від попередніх клієнтів. Знижки та спеціальні пропозиції також
сприяють довірі, показуючи, що платформа цінує своїх клієнтів.
4. Уповільнення або прискорення прийняття рішення: відгуки та знижки
можуть значно впливати на швидкість прийняття рішень. Чіткі та
позитивні відгуки допомагають користувачам швидко переконатися в
якості продукту, а наявність знижок може стати вирішальним фактором
для швидкого прийняття рішення про покупку.
Меню. Меню повинно бути зручним, при гортанні сайту аби користувачеві
не довелось повертатись вгору, щоб перейти на іншу сторінку меню краще зробити
фіксованим. Таким чином користувач не відчуватиме дискомфорту від постійного
гортання сторінки.
1. Розмір тексту та видимість: меню повинно бути помітним, при
маленькому шрифті відчуватиметься певний дискомфорт при вивченні
наявних сторінок. Також розмір сторінки представленої в меню не
повинен бути довгим – коротка лаконічна назва, що вказує на зміст
сторінки.
2. Адаптивність: меню повинно адаптуватися під різні розміри для
зручності використання на різних платформах та уникнення потреби
користуватися горизонтальною прокруткою.
Контактні дані. Наявність контактних даних дає користувачеві зв'язатися з
компаніє в зручний час для уточнення даних.
Довіра: розміщення контактних даних, електронної пошти, посиланб на різні
соціальні мережі дає користувачеві можливість довіряти компанії.
Сторінки та їх наповнення. Важливим при розробці проєкту – це продумати
сторінки та їх наповнення, яка інформація може зацікавити користувача. По
правилам створення тексту потрібно враховувати наступне. Текст не повинне
Лист
ЧДТУ 242013.003 ПЗ
30
Зм Арк. № докум. Пiдпис. Дата
нт
`
обтяжувати клієнта, якщо платформа стосується надання конкретних послуг
конкретної сфери, то потрібно зосередити увагу саме на формуванні переваг.
Головна сторінка.
Головна сторінка — це перше враження відвідувача про платформу. Вона
повинна містити основну інформацію: що за компанія та що компанія надає.
Головна сторінка є представленням головної ідеї та дії, яку виконує платформа.
1. Ключова інформація та меню: на головній сторінці розміщуватиметься
фіксоване меню та ідея компанії, що показує які саме послуги надає
компанія. Меню розміщую логотип компанії та ключові розділи: Головна,
Про Нас, Тури, Забронювати.
2. Секція про нас: короткий опис про компанію та що вона пропонує.
3. Секція тури: в даній секції представлено декілька турів різних напрямків.
4. Секція пропозиція: в цій секції користувач бачить знижку, яка на разі діє
на сайті.
Рисунок 2.1 – Макет головної сторінки
Лист
ЧДТУ 242013.003 ПЗ
31
Зм Арк. № докум. Пiдпис. Дата
нт
`
Сторінка «Про нас».
Сторінка «Про нас» надає інформацію про саму компанію, більш детально її
описуючи з точки зору досвіду на ринку, а також її цінності. Сторінка «Про нас»
повинна закріпити довіру користувача до даної платформи, направляючи його
таким чином на співпрацю.
1. Коротка історія (презентація) компанії: мета вказати користувачеві, що
компанії можна довіряти, тому тут представлено переваги компанії.
2. Відгуки: оцінка компанії іншими користувачами підвищує довіру та
показує переваги компанії.
Рисунок 2.3 – Макет сторінки про нас
Сторінка "Тури".
Ця сторінка презентує тури, які надає платформа.
Лист
ЧДТУ 242013.003 ПЗ
32
Зм Арк. № докум. Пiдпис. Дата
нт
`
1. Всі тури: презентувати кожен тур, демонструючи зображення та опис
туру.
2. Фільтри: за допомогою фільтрів користувач зможе відфільтрувати
потрібну інформацію. На платформі будуть наявні наступні фільтри:
Показати все, відвідати країну, туристичні маршрути та екскурсії.
3. Оцінка та кнопка Book: після опису туру наявна оцінка та кнопка
забронювати, що перенаправляє користувача на сторінку Забронювати.
Рисунок 2.4 – Макет сторінки тури
Сторінка "Забронювати".
Сторінка "Забронювати" дозволяє користувачам здійснити бронювання,
надаючи необхідну інформацію через заповнення форми.
1. Форма бронювання: форма містить вісім полів: прізвище, ім’я, номер
телефону, email, промокод (генеруються при кожному вході на сторінки
Забронювати), тур (при переході з сторінки тури вказується назва туру при
переході через меню випадаючий список), дати відправки та прибуття.
Лист
ЧДТУ 242013.003 ПЗ
33
Зм Арк. № докум. Пiдпис. Дата
нт
`
2. Кнопка Send: при натисканні форма записується в базу даних. Оскільки в
формі є обов’язкові поля, то при відсутності в них інформації форма не
відправиться.
Рисунок 2.5 – Макет сторінки забронювати
Ці сторінки з їх наповненням забезпечують повноцінний досвід для
користувачів на платформі з надання туристичних послуг. Нижче наведена
структура сайту та приклад побудови навігації на сторінці та зв’язок між
сторінками на сайті.
Лист
ЧДТУ 242013.003 ПЗ
34
Зм Арк. № докум. Пiдпис. Дата
нт
`
Рисунок 2.6 – Структура сайту
Висновок до розділу 2
В другому розділі сформовано опис майбутньої готової web-платформи. При
розробці платформи для надання туристичних послуг важливо приділити увагу
продуманому наповненню сторінок, яке задовольнятиме потреби користувачів.
Головна сторінка повинна забезпечувати позитивне перше враження, пропонуючи
ключову інформацію про компанію та її послуги. Сторінка "Про нас" зміцнює
довіру, надаючи детальний опис компанії та відгуки клієнтів. Сторінка "Тури"
демонструє різноманітність пропозицій з можливістю зручного фільтрування, а
сторінка "Забронювати" спрощує процес бронювання, надаючи зручну форму для
заповнення. Таким чином, кожна сторінка виконує свою роль у забезпеченні
повноцінного та зручного досвіду користувачів, що сприяє підвищенню довіри та
задоволеності клієнтів, а також збільшує ймовірність повторних взаємодій з
платформою.
Лист
ЧДТУ 242013.003 ПЗ
35
Зм Арк. № докум. Пiдпис. Дата
нт
`
РОЗДІЛ 3.
РЕАЛІЗАЦІЯ WEB-ПЛАТФОРМИ
3.1 Обрання середовища розробки та інструментів.
Середовище розробки є важливим аспектом на початку роботи з проєктом,
адже воно впливає на декілька факторів, які або пришвидшать розробку або
сповільнять її. Також налаштування та можливість налаштування кожного
середивища.
Вибір середовища для розробки платформи є критичним етапом, що визначає
не тільки технологічні можливості, але й успіх проекту в цілому. Правильно обране
середовище забезпечує зручність розробки, ефективність роботи команди, а також
якість та надійність кінцевого продукту. Ось кілька ключових аспектів, які
підкреслюють важливість цього вибору:
1. Технічні можливості та сумісність: середовище розробки має підтримувати
всі необхідні технології та інструменти, які будуть використовуватися у
проекті. Це включає мови програмування, фреймворки, бази даних та інші
компоненти. Сумісність з існуючими системами та можливість інтеграції з
іншими сервісами є вирішальними факторами.
2. Продуктивність та масштабованість: обране середовище повинне
забезпечувати високу продуктивність та можливість масштабування
платформи.
3. Зручність для розробника: кожне середовище відносно зручності має досить
суб’єктивну оцінку. Проте зручне та інтуїтивно зрозуміле середовище
розробки дозволяє підвищити продуктивність, зменшити кількість помилок
та прискорити процес розробки.
4. Гнучкість та адаптивність: середовище повинне бути достатньо гнучким,
щоб підтримувати зміни в проекті та адаптуватися до нових вимог. Це
особливо важливо для динамічних проектів, де вимоги можуть змінюватися
протягом часу.
Лист
ЧДТУ 242013.003 ПЗ
36
Зм Арк. № докум. Пiдпис. Дата
нт
`
Враховуючи ці аспекти, правильний вибір середовища розробки допоможе
створити надійну, ефективну та безпечну платформу, яка задовольнятиме потреби
користувачів та сприятиме досягненню бізнес-цілей.
1. Visual Studio Code
Visual Studio Code є одним з найпопулярніших та найбільш широко
використовуваних середовищ розробки на сьогодні. Це безкоштовне інтегроване
середовище розробки, яке підтримує багато мов програмування, включаючи
JavaScript, TypeScript, Python та багато інших. Він має розширення, що дозволяють
розширити його функціональність, що забезпечує широкі можливості для
розробки.
2. IntelliJ IDEA
IntelliJ IDEA є другим дуже популярним середовищем розробки, особливо
для Java-розробки. Воно підтримує багато мов програмування, включаючи Java,
Kotlin, Groovy, Scala та багато інших. IntelliJ IDEA має потужну систему
рефакторингу, що дозволяє легко змінювати код та покращувати його.
3. Eclipse
Eclipse є одним з найбільш популярних середовищ розробки для Java-
розробки. Воно підтримує багато мов програмування, таких як C++, Python, PHP та
інших. Eclipse має широкий набір інструментів для аналізу коду та підтримує
системи контролю версій, такі як Git.
4. Atom
Atom є безкоштовним відкритим середовищем розробки, який був
розроблений компанією GitHub. Воно має широкі можливості для настроювання та
підтримує багато мов програмування, включаючи JavaScript, HTML, CSS, Python
та інші.
6. Sublime Text
Sublime Text є дуже швидким та легким середовищем розробки з великою
кількістю плагінів та розширень. Це дуже популярне середовище розробки для
JavaScript, а також підтримує Python, HTML, CSS та інші мови програмування.
7. NetBeans
Лист
ЧДТУ 242013.003 ПЗ
37
Зм Арк. № докум. Пiдпис. Дата
нт
`
NetBeans є інтегрованим середовищем розробки для Java, що дозволяє
створювати web-додатки, мобільні додатки та інші проекти. Воно підтримує також
PHP, C/C++, HTML та інші мови програмування.
8. CodeLite
CodeLite є відкритим та безкоштовним середовищем розробки для C++, PHP
та інших мов програмування. Воно має потужний редактор коду та підтримує
багато функцій для аналізу та відлагодження коду.
9. Brackets
Brackets є відкритим середовищем розробки для web-розробки, який був
розроблений компанією Adobe. Воно має зручний інтерфейс зі швидкими
функціями редагування та підтримує багато мов програмування, таких як HTML,
CSS, JavaScript та інших.
10. Aptana Studio
Aptana Studio є відкритим та безкоштовним середовищем розробки для web-
розробки, що підтримує багато мов програмування, таких як HTML, CSS,
JavaScript, PHP, Ruby та інших. Воно має потужний інтерфейс зі зручними
інструментами для редагування та аналізу коду.
Кожне з них має свої переваги та недоліки та може бути корисним для певних
задач та проектів. Вибір середовища розробки залежить від багатьох факторів,
таких як мова програмування, яку ви використовуєте, тип проекту, його розмір та
складність, та особистих уподобань програміста. Загалом, використання
відповідного середовища розробки може допомогти підвищити ефективність та
продуктивність роботи програміста, дозволяючи йому швидше та ефективніше
створювати програми та додатки.[7]
Для даного проєкту прийнято обрати середовищем розробки Visual Studio
Code. Це інструмент, який поєднує в собі зручність, потужність та гнучкість, що
робить його ідеальним середовищем для розробки
Вибір був зупинений на даному середовищу, тому що:
1. Безкоштовність та відкритий код: VS Code є безкоштовним редактором з
відкритим вихідним кодом. Це дозволяє використовувати його без
Лист
ЧДТУ 242013.003 ПЗ
38
Зм Арк. № докум. Пiдпис. Дата
нт
`
ліцензійних обмежень, а також сприяє активному розвитку та підтримці
спільнотою розробників.
2. Кросплатформеність: VS Code працює на всіх основних операційних
системах, включаючи Windows, macOS та Linux. Це забезпечує зручність
роботи на різних пристроях.
3. Легка вага та швидкість: на відміну від важких середовищ розробки, VS
Code є легким та швидким. Він швидко завантажується, працює без
затримок, що дозволяє ефективно використовувати час на розробку.
4. Розширюваність та налаштовуваність: однією з головних переваг VS Code
є можливість встановлення розширень, які додають нові функції та
покращують існуючі.
5. Інтелектуальні функції редагування коду: VS Code пропонує потужні
інструменти для редагування коду, включаючи автодоповнення,
інтеграцію з Git, підсвічування синтаксису та рефакторинг.
На даній платформі використовується мова розмітки HTML / CSS. HTML
створює ієрархічну структуру web-сторінки, використовуючи заголовки, абзаци,
списки і таблиці. Така структура допомагає користувачеві легше орієнтуватися на
сайті. Також за допомогою HTML відображається текст, зображення, таблиці, відео
та аудіо.
CSS може змінювати налаштування текстових блоків. Розробник задає
шрифт, розмір цього шрифту, колір тексту і фону. Подібних властивостей дуже
багато, а сучасні версії CSS дають змогу навіть працювати з анімацією.
Завдяки HTML / CSS є можливість розробити якісну та адаптивну верстку
для платформи, яка забезпечить зручність користування на будь-якому пристрої та
зробить інтерфейс привабливим і функціональним. Ось декілька переваг:
1. Семантична розмітка: використання семантичних елементів HTML5
(таких як <header>, <nav>, <article>, <section>, <footer>) дозволяє створити
чітку структуру документа, що полегшує навігацію як для користувачів,
так і для пошукових систем.
Лист
ЧДТУ 242013.003 ПЗ
39
Зм Арк. № докум. Пiдпис. Дата
нт
`
2. Каскадні стилі (CSS): CSS дозволяє відокремити візуальне оформлення
від структури HTML, що робить код чистішим і більш організованим. За
допомогою CSS можна легко змінювати вигляд елементів, створювати
складні макети та додавати анімації, що значно покращує користувацький
досвід.
3. Адаптивний дизайн: використання медіа-запитів CSS дозволяє
створювати адаптивний дизайн, який автоматично підлаштовується під
різні розміри екрану. Це гарантує, що платформа зручна для користування
як на настільних комп’ютерах, так і на мобільних пристроях,
забезпечуючи позитивний користувацький досвід на всіх екранах.
4. Флексбокс і Грід: CSS технології, такі як Flexbox та CSS Grid Layout,
дозволяють створювати складні та адаптивні. Вони забезпечують
гнучкість у розташуванні елементів, що дозволяє створювати різноманітні
дизайни та макети для різних потреб.
5. Перехідні ефекти та анімації: CSS також дозволяє додавати перехідні
ефекти та анімації, які роблять взаємодію з платформою більш
динамічною та привабливою. Це може покращити користувацький досвід,
надаючи зворотний зв'язок та роблячи інтерфейс більш інтуїтивно
зрозумілим.
6. Підтримка сучасних браузерів: HTML5 і CSS3 підтримуються всіма
сучасними браузерами, що забезпечує сумісність та стабільну роботу
платформи на різних пристроях та операційних системах.
Таким чином, HTML і CSS є потужними та гнучкими інструментами, який
дозволить створити якісну, адаптивну та привабливу web-платформу.
Мовою програмування для даної платформи обрано Javascript. Нижче
наведено декілька причин чому мовою програмування обрано JS.
1. Інтерактивність та динамічний контент: JavaScript дозволяє додавати
інтерактивні елементи на web-сторінки, роблячи їх більш живими та
зручними для користувачів. Наприклад, обробка подій, таких як
натискання кнопок, введення даних у форми або динамічне завантаження
Лист
ЧДТУ 242013.003 ПЗ
40
Зм Арк. № докум. Пiдпис. Дата
нт
`
контенту без перезавантаження сторінки (AJAX), значно покращує
користувацький досвід.
2. Адаптивність та кросбраузерна сумісність: JavaScript підтримується всіма
сучасними web-браузерами, що дозволяє створювати кросбраузерні
додатки. Крім того, за допомогою бібліотек та фреймворків можна
забезпечити адаптивність та коректну роботу платформи на різних
пристроях і операційних системах.
Дану мову використано для генерації промокоду, передачі даних в певні
рядки та задіяння слайдерів на платформі.
Для серверної частини використано XAMPP. Це програмне забезпечення
включає в себе Apache сервер, MySQL базу даних, а також підтримку мов
програмування PHP і Perl. Використання XAMPP обумовлено наступними
перевагами:
1. Легкість встановлення та налаштування: XAMPP є зручним інструментом
для швидкого розгортання локального web-сервера.
2. Повноцінне середовище для розробки: XAMPP забезпечує повний набір
інструментів, необхідних для web-розробки.
3. Підтримка популярних технологій: XAMPP підтримує Apache, MySQL і
PHP - найбільш популярні технології для web-розробки.
4. Зручність використання: XAMPP має простий та інтуїтивно зрозумілий
інтерфейс, що дозволяє легко керувати всіма компонентами серверного
середовища. Це спрощує процес запуску, зупинки та налаштування
серверів, а також управління базами даних.
5. Кросплатформеність: XAMPP доступний для Windows, macOS та Linux,
що дозволяє використовувати його на будь-якій з цих платформ без змін в
конфігурації.
6. Безпека: XAMPP включає в себе ряд інструментів для забезпечення
безпеки, таких як можливість встановлення паролів для MySQL та
phpMyAdmin.
Лист
ЧДТУ 242013.003 ПЗ
41
Зм Арк. № докум. Пiдпис. Дата
нт
`
Загалом, вибір XAMPP для серверної частини проекту є логічним та
ефективним рішенням. Це програмне забезпечення надає всі необхідні інструменти
для створення, тестування та розгортання web-додатків, забезпечуючи простоту
використання, надійність та підтримку сучасних технологій.
Для управління базами даних на web-платформі використовуватиметься
phpMyAdmin разом із MySQL. Це потужне поєднання забезпечує ефективне та
зручне управління даними.
MySQL — це одна з найпопулярніших систем управління базами даних
(СУБД) з відкритим вихідним кодом. Використання MySQL для web-платформи
має кілька вагомих переваг:
1. Швидкість і продуктивність: MySQL відомий своєю високою
продуктивністю і здатністю обробляти великі обсяги даних швидко та
ефективно.
2. Масштабованість: MySQL здатний масштабуватись, що дозволяє
обслуговувати як невеликі проекти, так і великі web-платформи з великою
кількістю користувачів і запитів.
3. Надійність і стабільність: MySQL має багаторічний досвід використання
у виробничих середовищах і відзначається високим рівнем стабільності та
надійності.
4. Безкоштовність: MySQL є безкоштовним для використання, що робить
його доступним для проектів будь-якого масштабу.
PhpMyAdmin
phpMyAdmin — це web-інтерфейс для управління MySQL базами даних. Він
надає широкий спектр можливостей для адміністрування баз даних через зручний
графічний інтерфейс:
1. Зручність використання: phpMyAdmin має інтуїтивно зрозумілий
інтерфейс, що спрощує процес управління базами даних навіть для
користувачів з невеликим досвідом.
Лист
ЧДТУ 242013.003 ПЗ
42
Зм Арк. № докум. Пiдпис. Дата
нт
`
2. Функціональність: phpMyAdmin дозволяє виконувати всі основні операції
з базами даних, такі як створення, редагування, видалення таблиць,
записів, запитів і багато іншого.
3. Підтримка SQL-запитів: phpMyAdmin дозволяє виконувати ручні SQL-
запити, що дає розробникам гнучкість і контроль над базами даних.
4. Управління користувачами та правами доступу: За допомогою
phpMyAdmin можна легко керувати обліковими записами користувачів і
встановлювати права доступу до баз даних.
5. Імпорт та експорт даних: phpMyAdmin підтримує імпорт та експорт даних
у різних форматах (наприклад, CSV, SQL), що полегшує перенесення
даних між різними середовищами.
6. Безпека: phpMyAdmin дозволяє налаштовувати різні рівні безпеки,
включаючи SSL-з'єднання та захист паролем, що допомагає забезпечити
безпечне адміністрування баз даних.
Використання MySQL разом із phpMyAdmin для серверної частини web-
платформи є оптимальним вибором завдяки їх потужності, зручності та широким
можливостям. Це поєднання забезпечує ефективне управління базами даних,
високу продуктивність та надійність, що є ключовими факторами для успішної
розробки та експлуатації web-додатків
3.2 Верстка сторінок
Верстка сайту — це процес створення структури та оформлення web-
сторінки за допомогою HTML (HyperText Markup Language) та CSS (Cascading Style
Sheets). Цей процес включає організацію вмісту на web-сторінці таким чином, щоб
він був чітко структурований, візуально привабливий та зручний для користувачів.
Нижче наведено декілька аспектів верстки.
HTML:
- Відповідає за структуру web-сторінки.
Лист
ЧДТУ 242013.003 ПЗ
43
Зм Арк. № докум. Пiдпис. Дата
нт
`
- Включає елементи, такі як заголовки, параграфи, списки, зображення,
посилання та інші структурні компоненти.
CSS:
- Відповідає за зовнішній вигляд web-сторінки.
- Стилізує HTML-елементи за допомогою кольорів, шрифтів, відступів,
вирівнювання та інших параметрів.
Верстка є важливою оскільки, відповідає за ряд факторів, які впливають на
загальне сприйняття сайту.
Чому верстка важлива:
1. Зручність користування (User Experience): якісна верстка забезпечує
зручну навігацію та покращує взаємодію користувачів з web-сторінкою.
2. Адаптивний дизайн: верстка дозволяє створювати адаптивні сайти, які
добре відображаються на різних пристроях: від комп'ютерів до
смартфонів. В сучасному світі це надзвичайно важливо, оскільки велика
частка користувачів заходить на сайти саме з мобільних пристроїв.
3. Брендінг та естетика: візуальна привабливість сайту, досягнута завдяки
якісній верстці, сприяє створенню позитивного іміджу компанії чи
продукту. Відповідність корпоративному стилю та сучасним тенденціям
дизайну підвищує довіру до ресурсу.
При верстці сторінок використовувались:
- теги для позначення заголовків: h1, h3;
<h1>Про нас</h1>, <h3>Чому варто обрати нас?</h3>
- блочні теги з метою, щоб взяти контент в контейнер: div, завдяки
використанню атрибутів id і class в подальшому даний тег стилізується.
<div class="content">
<h3>Про нас</h3>
<p>Привіт! На зв'язку компанія Travel., яка зробить все заради
твоєї комфортної та цікавої поїздки!
Ми пропонуємо відвідати країну, різноманітні тури та захоплюючі
екскурсії. Хвилюєшся що потрібно продумувати
проїзд та витрати? Залиш це нам і насолоджуйся поїздкою!
</p>
<a href="about.html" class="btn">read more</a>
</div>
Лист
ЧДТУ 242013.003 ПЗ
44
Зм Арк. № докум. Пiдпис. Дата
нт
`
- теги для позначення розділу: section, також завдяки атрибутам даний тег
можна стилізувати.
<section class="home-about">
<div class="image">
<img src="images/about-us-h.jpeg">
</div>
<div class="content">
<h3>Про нас</h3>
<p>Привіт! На зв'язку компанія Travel., яка зробить все заради
твоєї комфортної та цікавої поїздки!
Ми пропонуємо відвідати країну, різноманітні тури та захоплюючі
екскурсії. Хвилюєшся що потрібно продумувати
проїзд та витрати? Залиш це нам і насолоджуйся поїздкою!
</p>
<a href="about.html" class="btn">read more</a>
</div>
</section>
- для позначення тексту використовувались: p, span;
<p>Привіт! На зв'язку компанія Travel., яка зробить все заради твоєї
комфортної та цікавої поїздки!
Ми пропонуємо відвідати країну, різноманітні тури та захоплюючі
екскурсії. Хвилюєшся що потрібно продумувати
проїзд та витрати? Залиш це нам і насолоджуйся поїздкою!
</p>
<span>traveler</span>
- для зображень: img;
<img src="images/about-us-h.jpeg">
- тег для позначення гіперпосилання, яке використовується для переходу з
однієї сторінки на іншу: а;
<a href="about.html" class="btn">read more</a>
- тег для позначення форми: form;
<form action="book_form.php" method="post" class="book-form"
id="bookingForm">
<div class="flex">
<div class="inputBox">
<span>ім'я</span>
<input type="text" placeholder="Введіть ім'я"
name="name" id="name" required>
</div>
</form>
- тег для визначення поля введення, куди користувач може вводити дані:
input;
Лист
ЧДТУ 242013.003 ПЗ
45
Зм Арк. № докум. Пiдпис. Дата
нт
`
<input type="text" placeholder="Введіть ім'я" name="name" id="name"
required>
Це основні теги, які були використані для вдалої верстки основних сторінок,
а для застосування стилів для них додано атрибути id та class.
Розробка меню.
Розробка меню навігації є важливим елементом оскільки він відповідає за
коректне переміщення користувача між сторінками. Правильним рішенням є
розробка єдиного меню для всіх сторінок, також для зручності меню є фіксованим,
що значно полегшує перебування на сторінці, адже користувачеві не потрібно
прокручувати сторінку з метою повернутися на гору.
<section class="header">
<a href="home.html" class="logo">travel.</a>
<nav class="navbar">
<a href="home.html">головна</a>
<a href="about.html">Про нас</a>
<a href="package.html">Тури</a>
<a href="book.html">Забронювати</a>
</nav>
<div id="menu-btn" class="fas fa-bars"></div>
</section>
Створено секцію, якій надали клас header для застосування стилів. Далі
завдяки тегу для гіперпосилань та присвоєння йому повернення на головну
сторінку – був розроблений логотип.
Рисунок 3.1 – Логотип сайту
Завдяки тегу <nav>, який визначає набір навігаційних посилань. В даному
тегу сформовано посилання на сторінки: Головна, Про Нас, Тури, Забронювати.
Через таблицю стилів CSS задіяно стилізацію до навігаційної секції.
.header{
position: sticky;
top: 0; left: 0; right: 0;
z-index: 1000;
background-color: var(--white);
Лист
ЧДТУ 242013.003 ПЗ
46
Зм Арк. № докум. Пiдпис. Дата
нт
`
display: flex;
padding-top: 2rem;
padding-bottom: 2rem;
box-shadow: var(--box-shadow);
align-items: center;
justify-content: space-between;
}
Рисунок 3.2 – Навігаційне меню платформи
Дане меню застосовано на всіх сторінках сайту. Оскільки це позначає
єдиний стиль та зручність в функціональності. Також меню є адаптивним, і при
ширині менше 768px перетворюється на меню «бургер».
Рисунок 3.3 – Вид меню при ширині сторінки 300рх
Головна сторінка.
Ця сторінка є презентаційний фактор при вході користувача на сторінку.
Тому при розробці сторінки перший елемент який потрапляє користувачеві на очі
– це слайдер.
Лист
ЧДТУ 242013.003 ПЗ
47
Зм Арк. № докум. Пiдпис. Дата
нт
`
Рисунок 3.4 – Головна сторінка
Головна сторінка складається з декількох секцій, які поділені за змістом.
Кожна секція відповідає певній сторінці сайту. Нижче представлені секції про нас,
пропозиції та знижки. Секція про нас містить коротку інформація для користувача,
а також кнопку для переходу до сторінки Про Нас, де є більш детальна інформація.
Рисунок 3.5 – Секція про нас на головній сторінці
Секція пропозиція розміщує декілька турів, що запропоновані на сайті, тури
представлені у вигляді, як на сторінці Тури. Тому під опис є кнопка забронювати,
при натисканні якої користувач потрапляє на сторінку Забронювати.
Лист
ЧДТУ 242013.003 ПЗ
48
Зм Арк. № докум. Пiдпис. Дата
нт
`
Секція знижки розміщує пропозицію та кнопку обрати зараз, що відбудеться
перехід на сторінку Туру для ознайомлення. При розробці сторінки були присвоєні
відповідні класи, що дало змогу надати стилізацію секціям.
.home-about{
display: flex;
align-items: center;
flex-wrap: wrap;
}
Про Нас сторінка.
На цій сторінці першим потрапляє до уваги користувача банер. Банери
присутні на всіх сторінках відповідно до тематики компанії. Нижче під банер йде
відповідна інформація. Розміщується коротка інформація про компанію, а також
три блоки, що показують переваги Travel..
Рисунок 3.6 – Банер на сторінці Про Нас
Коли користувач переміщується нижче, то бачить секцію з відгуками. В них
розміщено оцінку коментатори, відгук та його фотографію.
Лист
ЧДТУ 242013.003 ПЗ
49
Зм Арк. № докум. Пiдпис. Дата
нт
`
Рисунок 3.7 – Відгуки на сторінці Про Нас
Тури сторінка.
На даній сторінці розміщуються тури, які пропонує компанія. Користувач має
можливість побачити назву туру, його опис та оцінку. Загалом, на сторінці
розміщено дванадцять турів. Також над турами наявний фільтр, який містить
чотири позиції.
1. Показати все: показує всі дванадцять турів.
2. Відвідати країну: показує країни, які користувач може відвідати. Це
країни: Болгарія, Франція, Ірландія, Норвегія, Кіпр, Тайланд.
3. Туристичні маршрути: сюди входить Стародавній Рим, Міфи Єгипту,
Історична спадщина України.
4. Екскурсії: Вулицями Львову, Стежками Карпат, Пам’ятки Черкас.
Лист
ЧДТУ 242013.003 ПЗ
50
Зм Арк. № докум. Пiдпис. Дата
нт
`
Рисунок 3.8 – Відсортовані по позиції екскурсії
Під кожним туром наявна кнопка забронювати, що перенаправляє
користувача на сторінку Забронювати.
Забронювати сторінка.
Ключова сторінка сайту – це сторінка Забронювати, на якій користувачеві
необхідно заповнити форму. Форма містить вісім полів, кожне поле має ім’я, яке
використовується для передачі та запису інформації в базу даних.
Рисунок 3.9 – Поля на сторінці Забронювати
Коротка характеристика всіх полів:
Лист
ЧДТУ 242013.003 ПЗ
51
Зм Арк. № докум. Пiдпис. Дата
нт
`
1. Поле ім’я: воно є обов’язковим при відправці форми.
2. Поле прізвище – обов’язкове при відправці форми.
3. Поле email – обов’язкове при відправці форми.
4. Поле телефон – обов’язкове при відправці форми.
5. Поле промокод – в цьому полі генерується набір чисел та букв верхнього
та нижнього регістру при переході користувача на сторінку.
6. Поле тур – при переході зі сторінки тур, коли користувач натискає кнопку
забронювати під певним туром, то в цьому полі буде показаний цей тур.
При переході на сторінку Забронювати – випадаючий список..
7. Поле початок подорожі – зазначає дату.
8. Поле закінчення подорожі – зазначає дату.
Після натискання кнопки відправити дані записуються в базу даних.
Підвал сайту.
В підвалі сайту розміщується контактна інформація: телефони, електронні
пошти та соціальні мережі, також додаткові посилання на сторінки та інша
необхідна інформація.
Рисунок 3.10 – Підвал сайту
Лист
ЧДТУ 242013.003 ПЗ
52
Зм Арк. № докум. Пiдпис. Дата
нт
`
Загалом підвалу сайту, як і навігаційне меню повинно бути єдиним на всіх
сторінках, тому на платформі це реалізовано, що полегшує пошук інформації
користувачем. Також за допомого каскадної таблиці стилів була задіяна анімація.
.footer .box-container .box a i{
color:var(--main-color);
padding-right: .5rem;
transition: .2s linear;
}
.footer .box-container .box a:hover i{
color:var(--main-color);
padding-right: 2rem;
}
3.3 Реалізація елементів інтерфейсу та функцій за допомогою Javascript
Мова програмування Javascript використовуватиметься для реалізації певних
елементів. JavaScript — це високорівнева, динамічна мова програмування, яка
широко використовується для створення інтерактивних та динамічних web-
сторінок. З моменту свого виникнення JavaScript став невід'ємною частиною web-
розробки, дозволяючи розробникам додавати функціональні можливості до web-
сайтів, маніпулювати контентом, створювати анімації та покращувати взаємодію з
користувачем.
Основна мета цього підрозділу — розглянути, як за допомогою JavaScript
можна реалізовувати різноманітні елементи web-сторінок, такі як динамічні меню,
генерація промокодів, передача інформації та фільтри, що покращують
користувацький досвід. Вивчення цих методів допоможе зрозуміти, як
використовувати JavaScript для покращення функціональності та інтерактивності
web-ресурсів.
Спочатку реалізували адаптивне меню, яке при ширині менше 768px, меню
змінюється на динамічне.
let menu = document.querySelector('#menu-btn');
let navbar = document.querySelector('.header .navbar');
menu.onclick = () =>{
menu.classList.toggle('fa-times');
Лист
ЧДТУ 242013.003 ПЗ
53
Зм Арк. № докум. Пiдпис. Дата
нт
`
navbar.classList.toggle('active');
};
window.onscroll = () =>{
menu.classList.remove('fa-times');
navbar.classList.remove('active');
};
Рисунок 3.11 – Динамічне меню
Наступний елемент, який реалізовано за допомогою цієї мови був слайдер.
Слайдер на сайті, реалізований за допомогою JavaScript, має декілька переваг і
може бути корисним з кількох причин:
1. Покращення візуальної привабливості: Слайдери додають динамічний
візуальний елемент на сайт.
2. Ефективне використання простору: Слайдери дозволяють відображати
багато інформації в обмеженому просторі.
3. Покращення користувацького досвіду: Інтерактивні слайдери можуть
покращити користувацький досвід, дозволяючи відвідувачам взаємодіяти
з контентом.
4. Розповідь історій та відгуки: За допомогою слайдерів можна створювати
послідовні історії, презентації та відгуки, де кожен слайд є частиною
загальної історії або демонстрації.
Лист
ЧДТУ 242013.003 ПЗ
54
Зм Арк. № докум. Пiдпис. Дата
нт
`
Тому на даній платформі був реалізований слайдер на головній сторінці та
на сторінці про нас з секцією відгуки.
var swiper = new Swiper(".home-slider", {
loop:true,
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
var swiper = new Swiper(".reviews-slider", {
loop:true,
spaceBetween: 20,
autoHeight: true,
grabCursor: true,
breakpoints: {
640: {
slidesPerView: 1,
},
768: {
slidesPerView: 2,
},
1024: {
slidesPerView: 3,
},
},
});
Також через мову програмування JavaScript реалізовано фільтри. Вони
поділяються на чотири позиції для реалізації фільтрів створено функцію filterTours
і додано до кнопок, що відповідають за демонстрацію певних елементів.
<div class="filter">
<button class="btn" onclick="filterTours('all')">Показати все</button>
<button class="btn" onclick="filterTours('country')">Відвідати
країну</button>
<button class="btn" onclick="filterTours('tour')">Туристичні
маршрути</button>
<button class="btn" onclick="filterTours('excursion')">Екскурсії</button>
</div>
Тоді написано код на JavaScript.
function filterTours(category) {
var boxes = document.getElementsByClassName('box');
for (var i = 0; i < boxes.length; i++) {
if (category === 'all') {
boxes[i].classList.remove('hide');
Лист
ЧДТУ 242013.003 ПЗ
55
Зм Арк. № докум. Пiдпис. Дата
нт
`
} else {
if (boxes[i].classList.contains(category)) {
boxes[i].classList.remove('hide');
} else {
boxes[i].classList.add('hide');
}
}
}
}
window.onload = function() {
filterTours('all');
}
Нижче наведена функція передачі даних в поле. Коли користувач на сторінці
Тури обирає певний тур і натискає забронювати, його перенаправляє на сторінку
Забронювати і в полі Тур показує обраний тур. При потраплянні на сторінку з
навігаційного меню користувач бачить випадаючий список.
Передача назви туру:
function getParameterByName(name) {
name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
var results = regex.exec(location.search);
return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, '
'));
}
// Get the tour name from the URL and set it in the input field
window.onload = function() {
var tourName = getParameterByName('tour');
document.getElementById('tourName').value = tourName;
}
Далі для того, щоб на кожного користувача був записаний індивідуальний
код реалізовано генерація промокоду. Кожен раз при переході або оновлені
сторінки видаватиме новий промокод складений з чисел та букв верхнього та
нижнього регістру.
function generatePromoCode(length) {
var result = '';
var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
var charactersLength = characters.length;
for (var i = 0; i < length; i++) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
}
return result;
}
Лист
ЧДТУ 242013.003 ПЗ
56
Зм Арк. № докум. Пiдпис. Дата
нт
`
document.addEventListener('DOMContentLoaded', function() {
var promoInput = document.querySelector('input[name="promo"]');
promoInput.value = generatePromoCode(8);
});
3.4 Робота з phpMyAdmin
phpMyAdmin — це популярний інструмент для управління базами даних
MySQL через web-інтерфейс. Він надає зручний та інтуїтивний спосіб для
адміністрування баз даних, що дозволяє виконувати різні завдання без потреби
писати SQL-запити вручну.
За допомогою web-додатка XAMPP для створення web-сервера, який
включає Apache та MySQL. Використання XAMPP у даному проєкті спростить
процес розробки web-додатків.
Спочатку відбувся запуск необхідних серверів, в даному випадку Apache та
MySQL, через XAMPP Control Panel. Доля передачі демонстрації через локальний
сервер файли були розміщенні у папці htdocs.
Далі Налаштування бази даних через phpMyAdmin відповідно до атрибута
name.
Адреса сайту: http://localhost/project_local/
Рисунок 3.12 – Записані дані користувачів в базу даних
Потім налагодження web-платформи через http://localhost/.
Запускаючи Apache та MySQL, отримано доступ до локального серверу.
Також для запису був прописаний код на PHP.
$connection = mysqli_connect('localhost','root','','book_db');
if(isset($_POST['send'])){
$name = $_POST['name'];
$surname = $_POST['surname'];
$email = $_POST['email'];
$phone = $_POST['phone'];
Лист
ЧДТУ 242013.003 ПЗ
57
Зм Арк. № докум. Пiдпис. Дата
нт
`
$promo = $_POST['promo'];
$tourName = $_POST['tourName'];
$arrivals = $_POST['arrivals'];
$leaving = $_POST['leaving'];
$request = " insert into book_form(name, surname, email, phone, promo, tourName,
arrivals, leaving) values
('$name','$surname','$email','$phone','$promo','$tourName','$arrivals','$leaving'
)";
mysqli_query($connection, $request);
header('location:book.html');
}else{
echo 'something went wrong try again';
}
Висновок до розділу 3
В третьому розділі розглянули інструменти необхідні для розробки web-
платформи. Визначили, що через певний ряд причин середовищем розробки обрати
Visual Codeетапи розробки сайту Visual Studio Code. Це рішення прийнято на
основі ряду причин, включаючи зручність використання, підтримку широкого
спектра розширень, інтеграцію з системами контролю версій, а також його високу
продуктивність і гнучкість.
Потім верстка сторінки та реалізація елементів інтерфейсу та необхідних
функцій за допомогою Javascript.
Також використано локальний кросплатформний веб-сервер XAMPP для
роботи з web-додаток phpMyAdmin. Таким чином написано код для запису даних
на мові PHP. Web-платформа працює злагоджено та через сторінку Забронювати
записує дані в базу даних.
Лист
ЧДТУ 242013.003 ПЗ
58
Зм Арк. № докум. Пiдпис. Дата
нт
`
ВИСНОВКИ
В кваліфікаційній роботі бакалавра метою поставлена розробка web-
платформи з надання послуг у сфері туризму. Актуальність даної теми полягає в
тому, що сфера туризму дуже постраждала з початку COVID-19 та війни. Це має
значний вплив як на економіку та і культуру країни.
За останні роки туризм продовжив розвиватися, проте враховуючи всі
можливі ризики. Зараз оф лайн офіси з надання послуг у сфері туризму переходять
в онлайн режим, тим самим полегшуючи життя користувачу. Всю необхідну
інформацію можна дізнатися завдяки сайтам, на яких розміщенні пропозиції та
контактні дані.
В першому розділі оглянуто існуючі аналоги на ринку. Порівняльний аналіз
у вигляді таблиці дав можливість побачити переваги та недоліки кожної
платформи. В свою чергу аналіз показує, що варто враховувати і додавати на
власну платформу, а що потрібно уникнути.
В другому розділі на основі яких були сформовані вимоги до майбутнього
продукту. Важливим ж дотримання єдиного стилю та дизайну на всіх сторінках,
адаптивність платформи до всіх розмірів та наявність анімаційних елементів, що
впливає на перебування користувача на сторінці.
В третьому розділі реалізовано web-платформу. Для цього обрано необхідне
середовище та інструменти. Спочатку розроблено верстку сайту, яка відповідає за
семантичність, а за допомогою таблиці стилів реалізовано дизайн. Для
динамічності меню, передачі даних в поля та генерації промокодів використано
Javascript. За допомогою XAMPP в web-додатку phpMyAdmin створено таблицю в
яку записуються дані користувачів.
Отже, платформа працює коректно: адаптоване під всі пристрої, динамічне
меню, єдиний стиль та запис даних. Все це враховано, що в результаті дало якісний
продукт.
Лист
ЧДТУ 242013.003 ПЗ
59
Зм Арк. № докум. Пiдпис. Дата
нт
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ
1. Все про туризм. Туристична бібліотека URL:
https://tourlib.net/statti_ukr/volcheckyj.htm
2. Освіта.ua. Туризм як унікальна можливість мирного взаємозбагачення.
URL: https://ru.osvita.ua/vnz/reports/geograf/23989/
3. Експрес. Україна стала лідером у світі за рівнем депресії: у ВООЗ
назвали шокуючу кількість випадків URL: https://expres.online/podrobitsi/ukraina-
stala-liderom-u-sviti-za-rivnem-depresii-u-vooz-nazvali-shokuyuchu-kilkist-vipadkiv
4. Florida department of state. What is Cultural Tourism? - Basic Information
URL: https://dos.fl.gov/cultural/info-and-opportunities/resources-by-topic/cultural-
tourism-toolkit/what-is-cultural-tourism-basic-information/
5. SEO London. Як перевірити сайт конкурента? URL:
https://seo.london/uk/%D1%8F%D0%BA-
%D0%BF%D0%B5%D1%80%D0%B5%D0%B2%D1%96%D1%80%D0%B8%D1%8
2%D0%B8-%D1%81%D0%B0%D0%B9%D1%82-
%D0%BA%D0%BE%D0%BD%D0%BA%D1%83%D1%80%D0%B5%D0%BD%D1
%82%D0%B0/
6. OECD. Rebuilding tourism for the future: COVID-19 policy responses and
recovery URL: https://www.oecd.org/coronavirus/policy-responses/rebuilding-tourism-
for-the-future-covid-19-policyresponses-and-recovery-bced9859/
7. UA5.ORG. Популярні середовища розробки мов програмування URL:
https://ua5.org/osnprog/1600-populyarni-seredovyshha-rozrobky-mov-
programuvannya.html#
8. UN Tourism. Glossary of tourism terms URL:
https://www.unwto.org/glossary-tourism-
terms#:~:text=Tourism%20is%20a%20social%2C%20cultural,personal%20or%20busin
ess%2Fprofessional%20purposes.
9. Altexsoft. Online travel agency (OTA) URL:
https://www.altexsoft.com/glossary/online-travel-agency-ota/
10. Monday Blog. What is a technical specification? URL:
https://monday.com/blog/rnd/technical-
specification/#:~:text=A%20technical%20specification%20is%20a,the%20process%20
of%20product%20development.&text=The%20development%20team%20lead%20usua
lly%20writes%20a%20technical%20specification.
11. PROSO MARKETING. Технічна оптимізація сайту: параметри,
інструменти, алгоритм проведення URL: https://prosto-
pro.marketing/uk/blog/tekhnichna-optymizatsiya-saytu
12. SiteMinder. What Is a Global Distribution System (GDS)? URL:
https://www.siteminder.com/r/global-distribution-system/
13. Visual Studio Code. User and Workspace Settings URL:
https://code.visualstudio.com/docs/getstarted/settings
14. Planet. Maximising Occupancy: The Power of Global Distribution Systems
(GDS) URL: https://www.weareplanet.com/blog/maximising-occupancy-global-
distribution-systems-gds
15. Learn-html.org. URL: https://www.learn-html.org/
16. The Ultimate Guide to CSS URL: https://blog.hubspot.com/website/css-
tutorial
17. W3schoolsUA.українською. URL:
https://w3schoolsua.github.io/css/index.html#gsc.tab=0
18. Javascript.Info. Javascript.Info Сучасний підручник з JavaScript. URL:
https://uk.javascript.info
19. ZenRows. JavaScript Instructions URL:
https://docs.zenrows.com/kb/javascript-instructions
20. Mdn web docs. JavaScript URL: https://developer.mozilla.org/en-
US/docs/Web/JavaScript
21. CodeWithHarry URL: https://www.codewithharry.com/tutorial/js/
22. ArmedSoft. Відомості проPHP URL:
https://armedsoft.com/ua/blog/vidomosti-pro-php
23. Promoter. Об'єктно-орієнтоване програмування в PHP URL:
https://promoter.net.ua/articles/objektno-orijentovane-programuvannia-v-php.html
24. phpMyAdmin 5.1.4 documentation. User Guide URL:
https://docs.phpmyadmin.net/en/latest/user.html
25. АНАЛІЗ АНАЛОГІВ LANDING PAGE ДЛЯ КЛУБУ РОЗВИТКУ ТА
ВІДПОЧИНКУ KEEP CLUB. URL:
https://openarchive.nure.ua/server/api/core/bitstreams/2b2458be-f8fb-42f0-8d1a-
0fce80fe32e5/content