Будь ласка, використовуйте цей ідентифікатор, щоб цитувати або посилатися на цей матеріал: https://er.chdtu.edu.ua/handle/ChSTU/6921
Повний запис метаданих
Поле DCЗначенняМова
dc.contributor.advisorРудницький , Сергій Володимирович-
dc.contributor.authorЦибуля, Ярослав Володимирович-
dc.date.accessioned2026-01-26T15:08:23Z-
dc.date.available2026-01-26T15:08:23Z-
dc.date.issued2022-06-16-
dc.identifier.urihttps://er.chdtu.edu.ua/handle/ChSTU/6921-
dc.description.abstractПроект, що описується в цій роботі, на мою особисту думку, не має ніякої цінності окрім як комерційної, і вся вигода від проекту завершується на користуванні продукту користувачами. Даний проект по більшій частині є створенням СCG гри і другопланова ціль є створення сайту, що виступатиме в ролі брошури та головної реклами продукту з мінорними вкрапленнями соціальної мережі. СCG ігри є досить популярним жанром ігор в різних соціальних групах. Культура ігор цього жанру нараховує мільйони гравців з різних куточків країн по всій планеті. Щомісячно проходять аматорські локальні та офіційні світові дисципліні змагання, з призовими фондами(пулами), що можуть досягати 500 000$ [9], що вказує на те, що компанії можуть собі дозволити проводити такі витрати. А також, монетизація, що присутня в мережевих версіях ігор, у вигляді мікротранзакцій та реклами є основними та великими джерелами прибутку для компанії. Цих 2 фактори достатньо для того, щоб сказати, що проект вартий своєї уваги. Метою кваліфікаційної роботи бакалавра є створення гри та web-додаток до неї.uk_UA
dc.language.isoukuk_UA
dc.subjectUnityuk_UA
dc.subjectweb-сторінкаuk_UA
dc.subjectсайт-брошураuk_UA
dc.subjectграuk_UA
dc.subjectweb-додатокuk_UA
dc.titleРозробка CCG гри з web-додатком до неїuk_UA
dc.typeBachelor Thesisuk_UA
Розташовується у зібраннях:126 Інформаційні системи та технології (Web-технології, web-дизайн)

Файли цього матеріалу:
Файл Опис РозмірФормат 
РЕП_БАК_Цибуля_WEB-1811.pdf
  Restricted Access
2.54 MBAdobe PDFПереглянути/Відкрити    Запит копії


Усі матеріали в архіві електронних ресурсів захищено авторським правом, усі права збережено.

Extracted text
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ 
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ 
ФАКУЛЬТЕТ ІНФОРМАЦІЙНИХ ТЕХНОЛГІЙ І СИСТЕМ 
КАФЕДРА ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ ПРОЕКТУВАННЯ 
 
КВАЛІФІКАЦІЙНА РОБОТА БАКАЛАВРА 
 
на тему: «Розробка CCG гри з web-додатком до неї»  
за спеціальністю 126 «Інформаційні системи та технології» 
 
Виконавець роботи: студент групи WEB-1811 Цибуля Ярослав Володимирович 
 
 
Кваліфікаційну роботу 
захищено на засіданні ЕК 
з оцінкою           ___________   «___» червень 2022 р. 
 
Науковий керівник         ___________          к.т.н. Рудницький С.В. 
             (підпис)  (науковий ступінь, вчене звання, прізвище та ініціали) 
 
Голова комісії                   ___________          ____________________________ 
             (підпис)  (науковий ступінь, вчене звання, прізвище та ініціали) 
 
Засвідчую, що у цій дипломній роботі немає 
запозичень з праць інших авторів 
без відповідних посилань  
 
Студент _____________ 
     (підпис) 
 
 
Черкаси – 2022 року 
 
 
 
ЗМІСТ 
 
 
ВСТУП 3 
1. Постановка задачі. Огляд існуючих рішень, аналогів 5 
1.1 Постанова задачі 5 
1.2.1 Різноманітність контенту 6 
1.2.2 Ігрова механіка 8 
1.2.3 Сюжет ігор 11 
1.2.4 Офіційні сайти 13 
1.2.5 Критична оцінка 15 
1.3 Узагальнення результатів огляду аналогів 16 
Висновок до 1 розділу 16 
2. ПРОЕКТУВАННЯ ТА ВИБІР ЗАСОБІВ РОЗРОБКИ ГРИ 18 
2.1 Вибір програмного забезпечення для розробки гри. 18 
2.2 Сюжет гри 20 
2.3 Правила та Схематика гри 23 
Висновок до розділу 2 26 
3. РЕАЛІЗАЦІЯ ГРИ НА UNITY 27 
Висновок до розділу 3 30 
4. ПРОЕКТУВАННЯ ТА РЕАЛІЗАЦІЯ WEB-ДОДАТКУ 31 
4.1 Вибір середовища для розробок сайту гри 31 
4.2 Реалізація сайту гри 32 
4.3 Реалізація БД для сайту гри 35 
Висновок до розділу 4 37 
ВИСНОВОК 38 
 
 
 ЧДТУ 222010.001 ПЗ 
Зм. Лист № докумемента Підпис Дата 
 
Розроб.  Цибуля Я.В.  Літ. Лист Листів 
Перев. Р удницький С.В. Розробка CCG гри з WEB-додатком до неї Н 2  
     Лист 
Реценз. Красношлик Н.О   
     
Н контр. Рудницький С.В. ПояснюЧваДльТнаУ за п2и1ск2а 010.001 ПЗ ФІТІС, 
.  2 
Зм Арк. № докум. Пiдпис. Дата 
нтЗатв. ПрокопенкоТ.О.. кафедра ІТП, WEB-1811 
 
 
ДОДАТОК А 482 ЧДТУ 22010 – 01 Розробка CCG гри з web-додатком  
до неї 55 
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ ?? 
 
  
     Лист 
     ЧДТУ 212010.001 ПЗ 
3 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
СПИСОК СКОРОЧЕНЬ ТА УМОВНИХ ПОЗНАЧЕНЬ 
 
 
CCG- Card Collectable Game 
CSS – Cascading Styles Sheets 
HTML – HyperText Markup Language 
PHP – Hypertext Preprocesor 
SQL – Strutured Query Language 
YGO – “Yu-Gi-Oh!”    
URL -Uniform Resource Locator 
DB/БД – Data Base/База Даних 
ОС – Операційна Система 
 
 
 
  
     Лист 
     ЧДТУ 212010.001 ПЗ 
4 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
ВСТУП 
 
 
Проект, що описується в цій роботі, на мою особисту думку, не має ніякої 
цінності окрім як комерційної, і вся вигода від проекту завершується на 
користуванні продукту користувачами. Даний проект по більшій частині є 
створенням СCG гри і другопланова ціль є створення сайту, що виступатиме в ролі 
брошури та головної реклами продукту з мінорними вкрапленнями соціальної 
мережі. 
СCG ігри є досить популярним жанром ігор в різних соціальних групах. 
Культура ігор цього жанру нараховує мільйони гравців з різних куточків країн по 
всій планеті. Щомісячно проходять аматорські локальні та офіційні світові 
дисципліні змагання, з призовими фондами(пулами), що можуть досягати 500 000$ 
[9], що вказує на те, що компанії можуть собі дозволити проводити такі витрати. А 
також, монетизація, що присутня в мережевих версіях ігор, у вигляді 
мікротранзакцій та реклами є основними та великими джерелами прибутку для 
компанії. Цих 2 фактори достатньо для того, щоб сказати, що проект вартий своєї 
уваги.   
Метою кваліфікаційної роботи бакалавра є створення гри та web-додаток 
до неї. 
Для досянення поставленої мети реба виконати наступні завдання: 
1. Написати сюжет гри 
2. Продумати механіки гри 
3. Розробити макет ігрового інтервейсу 
4. Описати взаємодію елементів гри 
5. Зробити прототип дизайну ігрових елементів 
6. Створити прототип гри. 
7. Розробити макет сайту 
8. Розробити елементи дизайну сайту 
9. Реалізувати сайт гри 
     Лист 
     ЧДТУ 212010.001 ПЗ 
5 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Об’єктом роботи є ОС Unity, Sublime Text 3 IDE, OpenServer а також мови 
програмування С#, PHP, CSS, SQL та HTML. 
Предметом роботи є проект – ССG гра, розроблена на ігровому двигуні 
Unity, а також web-сторінка, що виступає сайт-брошурою до гри.  
 
 
  
     Лист 
     ЧДТУ 212010.001 ПЗ 
6 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
1. ПОСТАНОВКА ЗАДАЧІ. ОГЛЯД ІСНУЮЧИХ РІШЕНЬ, АНАЛОГІВ 
 
 
1.1 Постанова задачі 
Порівняти наведенні нижче аналоги, зробити висновок, та обрати найбільш 
привабливу до виконання систему. 
Необхідно розробити Web-Додаток, який надасть користувачеві можливість 
знайти детальну інформацію по грі, та створити або приєднатися до форуму по 
тематиці, що його цікавить. 
Інформація повинна зберігатися в БД. 
 
1.2 Аналіз аналогічних рішень на ігровому ринку 
Hearthstone(Blizzard Entertainment, США)[1] 
Yu-Gi-Oh! Master Duel(Konami Digital Entertainment, Японія)[2] 
Inscryption(Devolver digital, США) 
 
Хоч усі аналоги є прикладами CСG, вони мають вразливу та не зовсім 
різницю. Починаючи з основної деталі геймплея – поля бою. 
 
Рисунок 1.1 - 1.Inscryption, 2. Hearthstone, 3. Yu-Gi-Oh! Master Duel (Зліва-
направо) 
     Лист 
     ЧДТУ 212010.001 ПЗ 
7 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
1.2.1 Різноманітність контенту.  
Оскільки це CCG проекти, то звичайно основним елементом дії є карта. Їх 
різноманітність насичує ігровий процес, тим самим створює більш цікаву та 
привабливу для гравців різного типажу пропозицію.  
 
Різноманітність контенту в грі Inscryption 
В цьому плані Inscryption водночас програє та частково перемагає своїх 
суперників з самою слабкою базовою різноманітністю. Що мається на увазі: 
повторюсь, базово карти 1 та 3 акту гри(ця гра є сюжетною та розділена на три 
акти) не мають великого різноманіття: є карти без ефектів, є з 
ефектами(здібностями).Всього видів карт 51 в першому, та 43 в другому та 
третьому. Кожна має свої характеристики здоров’я та сили – на цьому все. Але 
різноманіття створюється тим, що є можливість до унікальної та перманентної 
функції селекції(скрещення) цих карт, тим самим ми можемо віддати ефект однієї 
карти до іншої, створюючи жертву першої карти(як приклад) – дуже непоганий 
момент, що вводить в баланс початкову скупість на різності. 2 акт гри набагато 
більше різноманітний на карти, але втрачає селективну функцію ігрового процесу: 
Кістки: гравцю дається +1 кітка за кожного його пожертвованого або 
розбитого монстра. За ці кістки він може призивати певних монстрів, які 
потребують кістки для призиву. 
Батареї та заряди: з самого початку бою існує батарея на 6 зарядів. На 
початку, в ній лише 1 заряд, але с кожним раундом її заряд поповнюється на +1 
відносно попереднього значення. Роботи(монстри з зарядами) визиваються 
метедомо росходу заряду з батареї, та використовують зостатки батареї для своїх 
еффектів.  
Віспи та коштовності: існують монстри с віспами та коштовностями 3-х 
кольорів кожен. Уся суть цих монстрів, що монстр з віспом певного кольору не 
може призиватися, допоки на полі не присутній монстр з коштовностями того ж 
кольору. 
     Лист 
     ЧДТУ 212010.001 ПЗ 
8 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
Рисунок 1.2 – типи карт гри Inscryption 
 
Різноманітність контенту в грі Hearthstone 
На другому місті, в цій категорії, знаходиться Hearthstone. Маючи на 2021 
рік більше ніж 3000+ карт, вони діляться на 2 категорії: карти-підтримки та карти-
монстри, які в свою чергу розділяються на архетипи(прообрази), які базуються на 
тому, як зручніше грати гравцю. І звичайно, із-за такої кількості карт з’являються 
дуже багато карт з абсолютно схожими характеристиками. 
 
Рисунок 1.3- типи карт гри Hearthstone 
     Лист 
     ЧДТУ 212010.001 ПЗ 
9 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Різноманітність контенту в грі YGO. 
На першому місці у нас YGO зі своїми 6000+(!) картами станом на 2021 рік. 
Карти поділяються також на 2 типи: монстри та підтримка. Обидва типи 
поділяються ще на типи: підтримка ділиться на магію та пастки (кожна з груп ще 
ділиться на 5 та 3 групи відповідно), а монстри діляться на 8 типажів (перечислення 
яких я не вважаю за потрібне, краще буде залишити посилання в списку посилань). 
Другий тип розподілення карт також є архетипом, як і в Hearthstone, але додатково 
архетипи діляться на свої локальні групи(цю подільність можна зріднити з 
поділенням мінорних соціально-культурних груп таких як хіппі, растамани, панки 
і т.д.).  
 
Рисунок 1.4 – Типи карт гри YGO 
 
1.2.2 Ігрова механіка. 
Ігрова механіка представляє собою ігровий процес (геймплей), що описує 
гру в загальному випадку, а ігрові механіки дозволяють конкретно реалізувати те, 
як гра функціює. Річард Раус(ориг. Richard Rouse III) наводить такі приклади 
ігрових механік[1]: “у грі Crash Bandicoot ігрова механіка нападу в стрибку 
(англ. attack-jump) виконується натиском кнопки «вниз» або «повзти» тоді, коли 
герой перебуває в стрибку; механіка відсилання юніта на нове місце в 
грі Warcraft виконується клацанням лівою кнопкою миші на юніті(англ.unit), 
переміщенням вказівника на бажане місце призначення, і натисканням правої 
кнопки миші”. 
     Лист 
     ЧДТУ 212010.001 ПЗ 
10 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Одним з елементів ігрової механики механіки є реалізація поля боя. Із усіх 
аналогів, тільки YGO має систему із 3 рівнів для кожного гравця: центральний та 
середній розрахований під різного роду персонажів(монстрів), крайні розраховані 
на карти-підтримки монстрів. В Hearthstone та Inscryption все виконується на 
одному рівні, що досить сильно скорочує можливість різноманітності стратегій, але 
про це пізніше. 
 
 
Рисунок 1.5 – поля бою в кожній із ігор 
 
Ігрова механіка в грі Inscryption. 
Гра починається с полем в 4 клітинки для кожного гравця та 2 колод – 
колода с «білками» та колода з усім іншим. З боку стоять ваги зі шкалою 5 одиниць 
по кожну сторону. У кожного із гравців по 5 карт в руці. Виставити просту карту 
можна лише з нульовим рангом (в системі Inscryption існує система ранжування 
карт від 0 до 4 рівнів), тому що, щоб виставити карту з першим рангом треба 
пожертвувати 1 карту, с рангом 2 – 2 карти, і так далі. Мета: першим нанести на 5 
одиниць ударів більше. Це самі базові правила бою.  
 
     Лист 
     ЧДТУ 212010.001 ПЗ 
11 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Ігрова механіка в грі Hearthstone: 
Гра починається з 30 одиницями здоров’я, 3 картами в руці (якщо ви ходите 
другим, то чотирма), і 5 місцями на полі для кожного гравця. Кожна карта має свою 
кількість «мани», яку вона тратить для випадання на поле. Щоб зуміти покласти 
карту на поле, потрібно мати при собі достатню кількість «мани» (починається з 1, 
і на кожен крок стає на 1 більше). У разі, якщо у вас ще залишилась «мана» після 
виставлення карти, вам можете виставити ще декілька на скільки вам вистачить 
того залишку. В момент атаки, коли монстр гравця атакує монстра опонента, що 
явно слабкіший, монстр опонента знищується, а монстр гравця втрачає кількість 
балів атаки в кількості різниці між його балами атаки та балами здоров’я опонента 
(майже як правилу 3-го закону Ньютона, якщо можна так сказати). Також, замість 
монстрів опонента можна ризикнути, та атакувати самого опонента напряму. Мета: 
зрівняти здоров’я суперника до 0. Це самі базові правила бою 
 
Ігрова механіка в грі YGO 
Гра починається з 8000 балів здоров’я у кожного гравця. 
Поле 1:5:5 кліток для кожного гравця. У обох гравців на початку 5 карт в 
руці. Перший гравець може виставити 1 карту монстра від 1 до 4 рівня (в системі 
YGO існує система ранжування карт від 1 до 12 базового рівнів) лицем верх або 
вниз, та будь-яку кількість карт підмоги лицем вниз. Далі все залежить від стратегії, 
що придумав гравець. Щоб виставити карту більше 4 рівня, потрібно жертвувати 
інші карти монстрів на полі(зазвичай): 5-6 рівень= 1 карта, 7-8 рівень = 2 карти, 9 і 
вище = 3 карти. Коли два карти монстра на полях борються одна з іншою, рахується 
їх бали характеристики відносно їх атака/захист положення. Вибуває той монстр 
чий бал менший, а якщо два монстра знаходяться в положенні атаки, то той хто 
втрачає монстра додатково отримує удар у розмірі різниці балів атаки 2 монстрів. 
На відміну від Hearthstone, в YGO атакувати опонента, поки в нього є карти на полі, 
не є спроможним. Мета: зрівняти здоров’я суперника до 0. Це самі базові правила 
бою.  
 
     Лист 
     ЧДТУ 212010.001 ПЗ 
12 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
1.2.3 Сюжет ігор. 
Сюжет є різновидом наративу, сукупність подій у художньому творі, 
пов'язаних причинно-наслідковими зв'язками, що розкриваються в певній 
послідовності. Сюжет є трансформацією фабули, котра містить події в логічній та 
часовій послідовності, тоді як в сюжеті ця послідовність може порушуватися. В 
повсякденному вжитку також вживається як синонім синопсису[]. Сюжет одним із 
важливих аспектів гри. Він стимулювати гравця продовжувати грати гру, допоки 
він не досягне своєї мети, а подальше залучення до гри вже є бажанням самого 
гравця.  
 
Сюжет гри YGO 
Із усіх представників, має найбільш скупу сюжетну частину. 
Ви – сам собі герой, зі своїм ім’ям, аватаром та навіть «Дуельним 
Компаньйоном» (Рисунок 1.1.3). Ваша задача – зібрати свою колоду/колоди, та 
дістатися до самої верхівки рейтингу 
(На момент 15.06.2022 рейтинг налічує 6 ліг по 5 рангів кожна), та 
втримувати лідерську позицію якомога довше. Щомісяця першого числа, рейтинг 
оновлюється, спускаючи вас на 1 лігу нижче). Сюжетом це назвати складно, суто 
технічно, даний опис повністю підходить під опис сюжету. 
 Окрім основного «сюжету» також існують режими спеціальних 
змагань(ориг.“Events”) та режим під назвою «Соло» (ориг.“Solo”). Суть першого є 
точно такою ж як і основного сюжету, за винятком оссобливих правил для 
використання колод, та більш різноманітним виглядом нагород.  
Але режим «Соло» є більш цікавою ідеєю: «Соло» - це альманах історій про 
архетипи колод карт, які існують в YGO. Кожен розділ альманаху розділений на 
певну кількість епізодів, що або розповідає історію, або навчає як грати колодою 
карт цього архетипу. Нагородою є різні розхідні матеріали, що використовуються 
для розвитку у грі, стартова колода цього ж архетипу, про який розповідалося у 
історії, а для самих заядлих гравців, що проходили усі вторинні завданя на 2 рівнях 
складності в нагороду додавалися додаткові матеріали та різного роду аксесурари 
     Лист 
     ЧДТУ 212010.001 ПЗ 
13 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
в тематку до архетипу – це були аватарки, рубашки до карток, тематичні поля бою 
та Дуельні Компаньйони (аксесуари виключно косметичні, нагадую). 
Сюжет гри Hearthstone. 
За своєю сутністю, у Hearthstone сюжет абсолютно такий же, як у YGO, за 
винятком факту, що його режим «Соло» (він, звичайно, не називається «Соло») 
об’єднує ідею режиму з спец. змагань. За прох одження кожного етапу змагань, 
відкривається частина історії івенту, та надаються нагороди.    
 
Сюжет гри Inscryption 
Настільки росписаного сюжету, серед наведенних прикладів, як у 
Inscrytpion, нема ні у кого. Геймплейна історія розділенна на 4 частини, і є ще 
додадкова паралельна історія, що виникає в нашій реальності. 
Сюжет приблизно такий (у хронолігчному порядку): є деякий YouTube-
блоггер, що знімає відеоролики по різним картковим грам. І в одному із своїх відео, 
де він робить розпаковку чергових фойлових пачок с картками, він натикається на 
пачку з ім’ям Inscryption. Посеред з’омки, під, час розкриття цієї пачки, він 
знаходить пошарпану картку з вибитими координатами та лопатою на ній. 
Рішившись пійти по цим кординатам, він знаходить місце де знаходиться клад, та 
викопує малий контейнер с диском на якому написане ім’я тієї самої гри. 
Завантаживши диск з грою, він починає грати в гру (в ту саму яку вже граємо 
ми). І проходячи кожен із етапів, ми потрапляємо на глюк, що відкриває нам 
каталог з відеокамери блогера. На цих відео ми бачимо, як він грає в гру, дізнається, 
що ця гра є експериментальною і паралельно намагається дізнатися від 
«Розробників», чому ця гра унікальна, і випала саме, на що отримує відповідь, що 
«гра, впринципі не повинна була дістатися нікому». І так, с проходженням всіх 4 
етапів, він дізнається, що грою керують 4 самостійно розвинуті штучні інтеллекти. 
Також, протягом 4 етапів, погрози в сторону блогера с приводу видалення гри 
становляться більш агрессивними. І на самий кінець, після 4-го етапу, ми 
отримуємо останн відео з камери в якому до хлопця у двері достукується незнайома 
жінка і ліквідує блоггера. Кінець.  
     Лист 
     ЧДТУ 212010.001 ПЗ 
14 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
1.2.4 Офіційні сайти.  
Так вийшло, що тематичні сайти э лише 2 із 3-х продуктів: Hearthstone та 
Yu-Gi-Oh!. Для Inscryption тематичного(офіціального) не існує, що я вважаю 
логічним – гра не є онлайн-продуктом, і не буде розвиватися в рамках одного 
додатку. Тому, Inscryption в даному пункті ми згадувати не будемо. 
 
Сайт гри Hearthstone 
 
Рисунок 1.6 – скріншоти до оффіційного сайту Hearthstone 
 
Відразу хочеться замітити, що дизайн сайту зроблений «на ура»: відеоряд 
гри на задньому плані, стиль шрифту та дизайн кнопок зроблені під тематику гри, 
або хоча б в її кольорах, щоб  майже кожний об’єкт сайту анімований за винятком 
деяких текстів. UX та UI дизайнери явно були зацікавлені цим проектом, і 
виклались на всі свої 100.  
У даного сайту є відразу 2 панелі задач: одна загальна компанії Blizzard – 
компанії-розробника гри, інша безпосередньо відноситься до гри. Також, сайт 
продукту, від середини та до другої половини сторінки, розміщує в собі відділення 
новин та новинок гри. Кінець сторінки розрахований на відділ допомоги та 
контактних джерел. Хоч сторінка вийшла досить обширною, та вона вмістила в собі 
саму необхідну інформацію як для новачків так і для просунутих користувачів.  
     Лист 
     ЧДТУ 212010.001 ПЗ 
15 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Сайт гри YGO  
Як тільки відкриваєш сайт Konami, що посвячений YGO, відчуваєш 
візуальний контраст: Яскраві кольори фентезі, змінюються на футуристичний 
темний стиль, зберігаючи дещо схожу структуру сайту, тим самим ставлячи себе в 
супроти як одна CCG гра до іншої. Замість відеоряду, нас зустрічає Білий 
Синьоокий Дракон – один із найвідоміших символів цієї гри 
 
Рисунок 1.7- Скріншоти до оффіційного сайту YGO 
 
Як і в попередньому прикладі, майже все що має якусь функціональну 
здібність є анімованим, але в даному випадку більш скромно, зберігаючи 
мінімалістичний стиль сайту. Приємним бонусом можна назвати відділ з описом 
продукту та списком технічних рекомендацій, якими повинен володіти той чи 
інший комп’ютер для приємної гри. Присутня кнопка, що відкриває довідник по 
грі, та відділена зона новин. Загальну скупість сайту на деталі можна також 
пояснити тим, що даний продукт вийшов відносно недавно - в середині січня 2022, 
але вже в такому вигляді, сайт виглядає досить непогано, налаштовуючи на свою 
     Лист 
     ЧДТУ 212010.001 ПЗ 
16 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
атмосферу. Але, моє суб’єктивне рішення – сайт для гри в Hearthstone мені 
подобається більше. 
 
1.2.5 Критична оцінка 
Під висловлюванням «Критична оцінка» мається на увазі мій суб’єктивний 
погляд на кожну із ігор,  
 
Inscryption 
Це єдина гра із трьох аналогів що має сюжет, і не аби який – це величезний 
плюс, але у грі відсутня онлайн складова – це величезний мінус. Оскільки сюжет 
розділений на 3 фази, і в кожній фазі свої правила зі своїми картами, це досить 
часто збиває с пантелику, і змушує гравця задуматись про подальше проходження. 
Також саме ця гра із 3-х аналогів має найбільшу проблему з штучним інтелектом – 
його потужність (штучного інтелекту) може скакати між абсолютною тупісттю та 
геніальністю. Можливо то і не штучний інтелект, взагалі, а просто «так карти 
випали», але міцних доказів тому нема. 
 
Hearthstone 
По при великій колекції карток та непогано опрацьованої бойової системи, 
розмір поля та розподільність карток занадто зменшують потенційну 
різноманітність ведення бою. Також є багато моментів, що можуть визвати 
дискомфорт гри: необізнаність каталогу, відсутність балансу розподілення сил 
гравця та суперника (новачок граючий проти професіонала), дизайн в цілому, що 
може дещо відторгнути не фанатів магічного фентезі.  
 
YGO 
Із всіх 3-х аналогів, по моїй суб’єктивній думці, бойова механіка в грі 
найкраща. Хоч вона потребує, як я вважаю, ще більшого часу на освоєння в 
порівняні з Hearthstone, але як тільки одна основна схема буде опрацьована, всі інші 
будуть йти на поліпшення та швидше освоєння.  
     Лист 
     ЧДТУ 212010.001 ПЗ 
17 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Але, також, є деякі проблеми, що споріднені з проблемами Hearthstone, а 
саме: відсутність балансу розподілення сил гравця та суперника, мінімалістичний 
дизайн меню, який зайде не усім людям та ще більший каталог карт в порівняні з 
іншими іграми  
 
1.3 Узагальнення результатів огляду аналогів. 
 Hearthstone YGO Inscryption Мій проект 
Поле бою 6 1:5:5 (+ 4 додаткових 4:4 4:4:4 
(кількість на поля) 
ряд) 
Різноманітність Понад 3000 карт Понад 6000 карт + Понад 200 На реліз гри 
ігрових карт аксесуари карт планується 
ввести 20 карт 
Можливість >1 1 1 До 4 
вивести на 
поле бою карт 
за 1 хід 
Пряма атака Присутня Відсутня Відсутня Відсутня 
суперника 
Можливість Відсутня Присутня Відсутня Присутня 
виставити 
більше 1 карти 
підтримки 
Сайт https://playhearthstone https://www.konami.com/ Відсутній Присутній 
.com/en-us yugioh/masterduel/oc/en/ 
Таблиця 1.1 Порівняння аналогів з розроблюваним проектом 
 
Якщо ми збираємося створювати гру для великої аудиторії в такому жанрі, 
треба намагатися взяти найкраще із вище представлених аналогів. 
 
Висновок до розділу 1. 
В розділі, проведений огляд ігор: Hearthstone, Iscryption та Yu-Gi-Oh! Master 
Duel. Порівнявши їх по критеріям різноманітності контенту, ігрової механіки, 
     Лист 
     ЧДТУ 212010.001 ПЗ 
18 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
сюжету та сайту до продукту, та зробивши суб’єктивну оцінку кожному із 
прикладів, я витянув із них усі потрібні мені деталі для створення своєї  
  
     Лист 
     ЧДТУ 212010.001 ПЗ 
19 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
2. ПРОЕКТУВАННЯ ТА ВИБІР ЗАСОБІВ РОЗРОБКИ ГРИ 
 
 
2.1 Вибір програмного забезпечення для розробки гри. 
Для розробки гри був використаний двигун Unity, так як це один із 
найпопулярніших двигунів для розробок, з цього слідує є багато методичних 
вказівок у вигляді сайтів, та відео з додатковою інформацією по софту. А також 
цей двигун використовувався для реалізації проектів згаданих у першій частині 
цієї роботи, що натякає, що виконання даного проекту є більше ніж можливим. 
Мовою розробки виступає С# (раніше, ще був JavaScript). А сам код до гри 
писався в MVS 2019(рис. 2.1) 
Рисунок 2.1 – приклад роботи зі Visual Studio 2019 
 
Unity — це кросплатформний ігровий двигун, розроблений Unity 
Technologies, вперше анонсований і випущений у червні 2005 року на Apple 
Worldwide Developers Conference як ігровий движок Mac OS X. З тих пір двигун 
поступово розширювався для підтримки різноманітних настільних, мобільних, 
     Лист 
     ЧДТУ 212010.001 ПЗ 
20 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
консольних і віртуальних платформ. Він особливо популярний для розробки 
мобільних ігор для iOS і Android і вважається простим у використанні для 
початківців розробників і популярним для розробки інді-ігор. 
Unity дає користувачам можливість створювати ігри та досвід як у 2D, так 
і в 3D, а двигун пропонує основний API сценаріїв на C# за допомогою Mono, як 
для редактора Unity у формі плагінів, так і для самих ігор, а також для 
перетягування. функціональність.  До того, як C# став основною мовою 
програмування, який використовувався для движка, він раніше підтримував 
Boo, який було видалено з випуском Unity 5, та реалізацію JavaScript на основі 
Boo під назвою UnityScript, яка була застаріла в серпні 2017 року після того, як 
випуск Unity 2017.1 на користь C#. 
У 2D-іграх Unity дозволяє імпортувати спрайти та розширений рендер 2D 
світу. Для 3D-ігор Unity дозволяє специфікувати стиснення текстур, mip-maps та 
налаштування роздільної здатності для кожної платформи, яку підтримує 
ігровий движок, і забезпечує підтримку відображення рельєфу, відображення 
відображення, відображення паралакса, екранного простору навколишнього 
середовища (SSAO), динамічного тіні за допомогою карт тіней, рендерингу до 
текстури та повноекранних ефектів постобробки. 
Доступні два окремих конвеєра візуалізації, конвеєр візуалізації високої 
чіткості (HDRP) і Universal Render Pipeline (URP), на додаток до застарілого 
вбудованого конвеєра. Усі три конвеєри візуалізації несумісні з кожним із них. 
інше. Unity пропонує інструмент для оновлення шейдерів за допомогою 
застарілих засобів візуалізації до URP або HDRP. 
Unity — це кросплатформний двигун. Редактор Unity підтримується на 
платформі Windows, macOS та Linux, тоді як сам двигун наразі підтримує 
створення ігор для більш ніж 19 різних платформ, включаючи мобільні, 
настільні, консолі та віртуальну реальність. Unity 2020 LTS офіційно підтримує 
такі платформи: 
 
     Лист 
     ЧДТУ 212010.001 ПЗ 
21 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
1. Мобільні платформи iOS, Android, tvOS; 
2. Настільні платформи Windows, Mac,[9] Linux; 
3. Веб-платформа WebGL; 
4. Консольні платформи PlayStation (PS4, PS5), Xbox (Xbox One, Xbox 
Series X/S), Nintendo Switch, Stadia; 
5. Платформи віртуальної/розширеної реальності Oculus, PlayStation VR, 
Google ARCore, Apple ARKit, Windows Mixed Reality (HoloLens), 
Magic Leap та через Unity XR SDK Steam VR, Google Cardboard. 
 
2.2 Сюжет гри 
(Пролог) 
 В паралельному всесвіті, існувала цивілізація Кзор-Кан (Xor-Kahn), що 
створила для себе гру. Суть гри була в перемозі над супротивником за 
допомогою карт з різними тваринами - гра отримувала величезну популярність, 
настільки велику, що її внесли у Глобальний Закон (список негласних правил 
працюючих у всіх точках планети)- «задля зменшення втрат, вирішення бойових 
конфліктів двох або більше протидіючих сторін вирішуться в дуелі. Порушення 
правила, як одного із внесенних до Глобального Закону є чинником внесення 
санцкійних мір та виключенням із планетарних організацій на певний срок 
проти сторони правопорушника». Технології цієї цивілізації були настільки 
прогресивні, що вони змогли створювати могутніх живих істот, та 
переформовувати їх у карткових компаньйонів. Проходили роки, змінювались 
покоління, настала війна. Був виконаний екстрений протокол, що перемістив 
найбільші технологічні досягнення цивілізації та групу немілітарного населення 
на нову, прогресивну для проживання, незаселену планету.   
«Новий Порядок» Кзор-Кану створив Новий Глобальний Закон. що 
забороняє використовувати технологію карткової гри у воєнних цілях і просто 
як зброю, та навпаки - поширювати виключно у культурних та спортивно-
розважальних цілях. Вченні, в свою чергу, вирішили створити свій таємний 
     Лист 
     ЧДТУ 212010.001 ПЗ 
22 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
експеримент – створювати колоди карт, та розсилати їх, як частку своєї 
культури, по іншим планетам с цивілізаціями. Мета дослідження: як інші 
розумні цивілізації будуть використовувати потенціально могучну зброю в своїх 
цілях? Як результат, одні планети і народи знищували самі себе, інші ні. І ось, 
настала черга планети Земля… 
 
Глава 1: Падаючі Зірки 
Капсули с колодами розлетілися по всій планеті, по всім материкам(деякі 
навіть впали на плюси). Люди у всіх кутках планети бачили як “Град зірок 
покрив усе небо”. Капсули, наче самонавідні ракети, залітали в дома, через 
вікна, на задні двори, перед ногами людей. На наступний день, усі телеканали 
обговорювали той феномен. Деякі телезірки, блогери, спортсмени приходили на 
шоу, та хизувались на публіку своїми знахідками. Але ніхто цілком не 
здогадувався, що то були за капсули, та як їх можна було відкрити. Звичайно, 
військові також були усвідомлені про дані капсули. Одна з капсул впала на 
території близько до бази. Військові забарли артефакт, та почали його вивчати. 
Вони не мали ніякої здогадки, що це за капсула, та яке її призначення. І, 
оцінивши клас небезпеки, як «Невідомий», армія (ввести назву країни) почала 
операцію по конфіскації даних капсул с населених територій, за для безпеки 
простих громадян.  
Звісно знаходились люди, що приховували дані невідомі капсули від 
армії, і намагались розшифрувати, як можна капсули відчинити. І таким чином, 
на 3 день після початку операції, анонімний блогер, проводив прямий ефір, на 
якому відкрив одну таку капсулу. В середині капсули він знайшов колоду карт і 
згорток, в якому він отримав надсилання від Кановців. І почалась нова хвиля 
сенсацій: на різних шоу обговорювали ефір з сайту, різні ток-шоу намагаються 
запросити інтернет-зірку, вчені та конспірологи втрачають голови від тої 
кількості інформації, що вони отримують. Весь світ, буквально, втрачає глузд в 
спробах знову бути першим в цих інформаційних перегонах. 
     Лист 
     ЧДТУ 212010.001 ПЗ 
23 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
В цей період, ми знайомимся з одним із головних героїв історії – Коді 
Старксон (Cody Starxon). Син Джастіна Старксона(Justin Starxon) – 
мультимілліонера, засновника компанії StarXon - виробника електронної та 
побутової техніки. Коді з самого дитинства був світською дитиною і завжди був 
на слуху, як майбутній спадкоємець компанії. Батьки йому ні в чому не 
відмовляли, але, чи то такий передався характер, чи то особливості сімейного 
виховання, Коді в свої 16 вже був досить скромною людиною, щоб занадто не 
хизуватися своїм високим соціальним положенням. Як і у багатьох інших 
щасливців, у Коді була ця капсула, і відкривши її, він отримав свою колоду карт 
зі згортком. В той день йому прийшла в голову ідея, що в майбутньому він стане 
одним із тих, хто створить культурний феномен в напрямку спорту. 
А ось і наш другий головний герой цієї історії. Його звати Тоніо Далтон( 
Tonio Dalton). Хлопець 16 років, що народився в досить середніх умовах: сім’я 
в достатку, турботливі батьки та молодша сестра Джулай(July). Вчиться в 
старшій школі краще середнього, грає на фортепіано, та займається легкою 
атлетикою. В майбутньому він хоче працювати програмістом в компанії 
StarXon, і вже на початку історії намагається отримати шанс на стажування. 
Відносно Коді, Тоніо менше схожий на кар’єриста і його світоогляд має менш 
завойовничний характер.   
 
Персонажі (перелік деяких основних персонажів): 
Тоніо Далтон (Tonio Dalton): Хлопець 16 років, що народився в досить 
середніх умовах: сім’я в достатку, турботливі батьки та молодша сестра 
Джулай(July). Вчиться в старшій школі краще середнього, грає на фортепіано, 
та займається легкою атлетикою. В майбутньому він хоче працювати 
програмістом в компанії StarXon, і вже на початку історії намагається отримати 
шанс на стажування. Відносно Коді, Тоніо менше схожий на кар’єриста і його 
світоогляд має менш завойовничний характер. 
     Лист 
     ЧДТУ 212010.001 ПЗ 
24 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Томас «Сойєр» Раш (Thomas “Sawyer” Rush): Хлопець 17 років, друг 
дитинства Тоніо Далтона. Хлопець с дуже специфічним складом інтелекту: з 
однієї сторони він часто робить такі речі, логіка яких змушує засумніватись в 
його розумових здібностях, але паралельно с цим, хлопець може запам’ятати 
величезний об ‘єм інформації і часом може видати настільки геніальну ідею, 
до якої б не догадалася група вчених. Інколи навіть задумуєшся: він дійсно з 
розумом не на ренту, чи лише прикидається? Іншими словами, його логіка речей 
абсолютно непередбачувана. Саме він і є той самий анонімний блогер, що 
першим відкрив капсулу з колодою всередині, і ховає цю правду від усіх.  
Коді Старксон (Cody Starxon): Хлопець 18 років, син Джастіна Старксона 
(Justin Starxon) – мультимілліонера, одного із засновників компанії StarXon, 
виробника електронної та побутової техніки. Коді з самого дитинства був 
світською дитиною і завжди був на слуху, як майбутній володар компанії. 
Батьки йому ні в чому не відмовляли, але, чи то такий передався характер, чи то 
особливості сімейного виховання, Коді в свої 16 вже був досить скромною 
людиною, щоб занадто не хизуватися своїм високим соціальним положенням. 
Як і у багатьох інших щасливців, у Коді була ця капсула, і відкривши її, він 
отримав свою колоду карт зі згортком. В той день йому прийшла в голову ідея, 
що в майбутньому він стане одним із тих, хто створить культурний феномен в 
напрямку спорту. 
Верона Васкез (Verona Vasquez): Дівчина років 17, дочка військового 
вченого, що працював над вивченням інопланетної капсули. По своєму 
характеру, вона пацанка(шибеник), хоча так і не сказати, враховуючи, як вона 
одягається. Вона не боїться лізти в бій першою, навіть більше, вона любить 
провокувати на бій кого завгодно.  
 
2.3 Правила та Схематика гри 
Є 2 бойових поля формату 4х3 з додатковими полями для колод, відбою, 
штрафної зони та карти поля. У кожного гравця з початку гри є, умовно, 5000 
     Лист 
     ЧДТУ 212010.001 ПЗ 
25 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
балів здоров’я. Ціль – перемогти іншого дуелянта за допомогою карт: 
зниженням балів здоров’я супротивника до нуля, способом опустошення його 
колоди, банально зумовити його здатися, тощо. 
На малюнку нижче ви можете побачити схематику базової дуелі. Те, як 
виглядають тіла на схемі є лише абстракцією. В кінцевому продукті, вони 
матимуть більш продуманий дизайн. (Рисунок2.3) 
 
Рисунок 2.3 – макет ігрового інтервейсу 
 
Короткий перелік усіх зображених тіл: 
 Помаранчеві/Жовті – карти гравця/суперника 
 Зелені – аватарки гравців 
 Чорні – показник здоров’я кожного з гравців 
 Фіолетова/в полоску – основна/вторина колоди 
 Чорні рамки вертикальні – поля для карт-монстрів 
 Горизонтальні – поля для карт-чаклування 
Червоною стрілкою позначено перший крок який роблять обидва гравця 
– перетаскування карти з руки. Синьою стрілкою позначенно що може атакувати 
карта/карти гравців – або карту суперника, або, безпосередньо, суперника 
напряму. 
 
 
     Лист 
     ЧДТУ 212010.001 ПЗ 
26 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Опис карт та їх характеристики 
На момент створення проекту було створенно 5 видів карт(рисунок 2.4): 
Прості/Normal (помаранчевий); 
Магнітні/Magnetic (помаранчевий); 
Поєднувальні/Linked (помаранчевий); 
Рівень-вверх/LvlUp (помаранчевий); 
Чаклування/Spell(помаранчевий); 
   
Рисунок 2.4 – Види карт 
 
1)Прості карти є простими картами. Їх Вплив на гру залежить виключно 
від їх статисти та еффектів, що на них вказані.  
2)Магнітні карти такі самі як і прості за виключеннм однго фактору – 
збоку на картах є позначки N та S, як у магнітних полей, у кожного магнітного 
     Лист 
     ЧДТУ 212010.001 ПЗ 
27 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
поля є значення, число на кожній стороні означає рівень заряду якого може буди 
додатково викликання карта +1, або меншого рівня(тобто, якщо на картці 
зображений N рівень 5, то можна додатково  карту з зарядом S рівень 4, або 
нижче). 
3) Поєднувальні карти можуть також визиватися як і прості кари. Але їх 
еффекти залежать від того, як відносно ці карти знаходятся (орієтуватися по 
виділеним червоним міткам) 
4)Рівень-вверх карт и з’являються по принципу двох однакових карт на 
полі – поєднуючи ми отримуємо нову карту з новими можливостями 
5) Карти чаклування є одноразовими картами. Як тільки фони виконали 
свою функцію, вони покидають поле.  
 
Висновок до розділу 2: В данному розділі  ми вибрали та поверхнево 
ознайомилися з основним софтом, з яким ми будемо надалі працювати. Також, 
були сформовані основні деталі та механіки проекту і виконані дизайни 
майбутнього геймплею та контенту гри, як приклад – гральні карти. І на додаток, 
був написаний сюжет-синопсис до гри.  
 
  
     Лист 
     ЧДТУ 212010.001 ПЗ 
28 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
3. РЕАЛІЗАЦІЯ ГРИ НА UNITY 
 
 
Гра реалізована на ігровому двигуні Unity.  
Зліва від столу знаходиться список у вигляді ієрархії тіл використаних у 
грі, справа - детальне меню редакції вибраного тіла(в данному випадку – 
EventSystem(самий низ списку)). В цьому меню можна змнити параметри тіл за 
допомогою плагінів, цим самим замітно спростити загальний код гри. Внизу – 
список файлів проекту та відкритий файл з кодами до гри. Наразі цих кодів 10 
штук – до повноцінного захисту робіт їх кількість може змінитися.(рис. 3.1) 
 
Рисунок 3.1 – Інтерфейс Unity та реалізована гра на «Верстальному» столі 
 
За можливість включити гру відповідає частина інтерфейсу зображена у 
вигляді плеєра зверху(рис. 3.1) та частина коду із GameManagerScr(рис. 3.2) 
     Лист 
     ЧДТУ 212010.001 ПЗ 
29 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
Рисунок 3.2 – Стартер гри (StartGame) 
 
Щоб гра виглядала так, як вона зображена на рис.3.3, все можна було б 
помістити і в один код, але для більш зручної роботи, робота була розділена на 
мінімальні можливі 10 файлів. Наразі, ми маємо:  
1)3 кодів на контент інтерактивних об’єктів; 
2)3 кодів на функціонал гри в цілому; 
3)3 кодів на функціонал інтерактивних об’єктів; 
4) 1 код, що поєднує функції № 2 і 3 
 
Рисунок 3.3 – тестова версія гри в дії 
     Лист 
     ЧДТУ 212010.001 ПЗ 
30 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
Рисунок 3.4 – скріншот із середини дуелі 
 
Атаки карт на полі реалізуються за допомогою коду 
AttackedCard.cs(Рисунок 3.5) 
 
Рисунок 3.5 – Приклад фіналу гри (1 із 2) 
 
Як результат, гра закінчується одним із двох екранів: на Рисунку 3.5 
зображений екран перемоги. Екран поразки має абсолютно такий самий вид за 
виключенням змісту фраз на протилежний.   
 
     Лист 
     ЧДТУ 212010.001 ПЗ 
31 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Висновок до розділу 3: описані та продемонстровані принципи створення 
проекту на Unity та була створена повноціна демо-версія гри з працюючою 
механікою. Також , як приклад, були розглянуті функція початку гри та функція 
атаки карток і код, що виконує кожну із операцій.  
     Лист 
     ЧДТУ 212010.001 ПЗ 
32 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
4. ПРОЕКТУВАННЯ ТА РЕАЛІЗАЦІЯ WEB-ДОДАТКУ 
 
 
4.1 Вибір середовища для розробок сайту гри 
Для розробки Сайту я використовував Sublime Text 3 IDE, так як я 
вважаю, що завантаженої на нього бібліотеки було достатньо, щоб допомогти 
мені зі створенням сайту(рис. 2.2). Сам сайт я розробляв мовою php/CSS. Як 
приклад, на мові php були розроблені перші версії сайтів такі як: YouTube, 
WordPress, Facebook, BlaBlaCar. 
Рисунок 4.1 – приклад роботи зі Sublime text 3 
 
Sublime Text 3 — швидкий кросплатформенний текстовий редактор. 
Підтримує плагіни, розроблені за допомогою мови програмування Python. 
Sublime Text не є вільним чи відкритим програмним забезпеченням, але деякі 
його плагіни розповсюджуються з вільною ліцензією, розробляються і 
підтримуються спільнотою розробників. 
Особливостями Sublime Text 3 є:  
 Автодоповнення (Коли користувач набирає код, Sublime Text, в залежності 
від використовуваної мови, буде пропонувати різні варіанти для завершення 
     Лист 
     ЧДТУ 212010.001 ПЗ 
33 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
запису. Редактор також автоматично завершує створені користувачем 
змінні.) 
 Підсвічування синтаксису і висока контрастність (Темний фон Sublime Text 
призначений для збільшення контрастності тексту. Основні елементи 
синтаксису виділені різними кольорами, які краще поєднуються з темним 
тлом, ніж зі світлим.) 
 Підтримка систем збірки(Sublime Text дозволяє користувачеві збирати 
програми і запускати їх без необхідності перемикатися на командний рядок. 
Користувач також може налаштувати свою систему збирання та включити 
автоматичну збірку програми кожного разу при збереженні коду.) 
 
Будучи останією версією редактора, Sublime Text 3 також отрмала такі 
нововведення відносно минулої версії як: 
 збільшення швидкості запуску програми; 
 поліпшення в інтерфейсі, в пошуку, редагуванні HTML-файлів; 
 використання Python 3 для плагінів; 
 індексування файлів для пошуку оголошення змінної, функції або класу як в 
сучасних IDE; 
 поліпшення продуктивності функції «замінити все»; 
 переміщення плагінів в окремий процес для запобігання затримок 
завантаження і завершення роботи Sublime Text; 
 перехід до попередніх позицій курсора. 
 
4.2 Реалізація сайту гри 
Сайт написаний на PHP та CSS за використьання IDE Sublime Text 3. 
Вибір основного кольору пав на синій, так як на мою думку, даний колір чудово 
працює з усіма іншими кольороми у випадку додавання контенту(рисунок 3.5). 
 
     Лист 
     ЧДТУ 212010.001 ПЗ 
34 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 Кожна сторінка сайту обов’язково супроводжується кнопками, тому, щоб їх 
було їх відразу помітно, я зробів їх з градіентною підсвідчуванням(рисунок 3.6). 
  
Рисунок 4.2 – Дизайн фону та кнопок 
 
 
Рисунок 4.3 –частина коду CSS відповідадьна за стилізацію кнопки 
     Лист 
     ЧДТУ 212010.001 ПЗ 
35 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
.rainbow-button – клас, відповідний за еффекти кнопок в СSS файлі. 
Доповнення after відповідає за контент кнопки, а доповнення hover за цикл 
анімації кнопки  
 
Рисунок 4.4 – приклад коду CSS 
 
 
Рисунок 4.5 – приклади коду php 
     Лист 
     ЧДТУ 212010.001 ПЗ 
36 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
4.3 Реалізація БД для сайту гри 
БД сайту було реалізованно за допомогою InnoDB 
InnoDB — це механізм зберігання даних для системи керування базами 
даних MySQL і MariaDB. З моменту випуску MySQL 5.5.5 у 2010 році він замінив 
MyISAM як тип таблиці MySQL за замовчуванням. Він надає стандартні функції 
транзакцій, сумісні з ACID, разом із підтримкою зовнішнього ключа (Declarative 
Referential Integrity). Він включений як стандарт у більшість бінарних файлів, що 
розповсюджуються MySQL AB, за винятком деяких версій OEM. InnoDB став 
продуктом корпорації Oracle після її придбання фінської компанії Innobase у жовтні 
2005 року. Програмне забезпечення має подвійну ліцензію; він розповсюджується 
під Загальною публічною ліцензією GNU, але також може бути ліцензований 
сторонам, які бажають об'єднати InnoDB у власне програмне забезпечення.[] 
 Створюємо базу даних ‘card_db’, заповнюючи таблицю командою: 
INSERT INTO `archetypes`(`Id`, `name`, `first_upc`, `select_box`, `quantity`, 
`last_upd`) VALUES (‘value-1’,’value-2’,’value-3’,’value-4’,’value-5’,’value-6’), де 
value-(1-6) – значення кожного із пунктів вказаних в дужках до ‘archetypes’  
 
Рисунок 4.6 – скріншот роботи з таблицею SQL  
Коли БД створенна, залишається під’єднати її до відповідної сторінки 
сайту(Рисунок 4.7): 
     Лист 
     ЧДТУ 212010.001 ПЗ 
37 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
Рисунок 4.7 – код до сайту з під’єднанням таблиці до сайту 
 
На виході, після під’єднання БД до сайту, ми отримуємо сторінку такого 
вигляду(Рисунок 4.8). 
 
Рисунок 4.8 – скріншот сторінки сайту з таблицею 
     Лист 
     ЧДТУ 212010.001 ПЗ 
38 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
 
Дизайн таблиці, відповідно, вказаний нижче(Рисунок 4.9) 
 
Рисунок 4.9 – скріншот коду СSS до таблиці 
 
Висновок до розділу 4: описані та продемонстровані принципи створення 
сайту на PHP. БД InnoDB була також приєднана до сайту і були приведені приклади 
UX- дизайну з відповідними кодами PHP та CSS.  
     Лист 
     ЧДТУ 212010.001 ПЗ 
39 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
ВИСНОВОК 
 
Був проведений огляд ігор: Hearthstone, Iscryption та Yu-Gi-Oh! Master Duel. 
Порівнявши їх по критеріям різноманітності контенту, ігрової механіки, сюжету та 
сайту до продукту, та зробивши суб’єктивну оцінку кожному із прикладів, я 
витягнув із них усі потрібні мені деталі для створення власної гри.  
В наступних розділах були сформовані основні деталі та механіки проекту 
і виконані дизайни майбутнього геймплею та контенту гри, як приклад – гральні 
карти. І на додаток, був написаний сюжет-синопсис до гри. А також були 
розглнуті усі ПО та системи завдяки яким все реалізовувалося, а саме: ігровий 
двигун Unity, Sublime Text 3 IDE, та система MySQL InnoDB. В 3-му розділі були 
описані та продемонстровані принципи створення проекту на Unity та була 
створена повноціна демо-версія гри з працюючою механікою. Також , як приклад, 
були розглянуті функція початку гри та фунція атаки карток і код, що виконує 
кожну із операцій. 
В ході виконання кваліфікаційної роботи баказавра були вирішені наступні 
завдання: написано сюжет гри, продумати механіки гри; розроблений макет 
ігрового інтервейсу; описані взаємодії елементів гри: було створенно 5 різних 
елементів гри, що мають унікальні функції та взаємодіють між собою; зроблені 
прототипи дизайну ігрових елементів: елементи були реалізовавні за допомогою 
Adobe Photoshop та продемонстровані в роботі; створений прототип гри: прототип 
гри гри був реалізований на Unity; розробити макет сайту: макет сайту був надалі 
подетально реконструйований за допомгою таблиць стилів СSS; розробити 
елементи дизайну сайту: за допомогою таблиць стилів CSS та Adobe Photoshop, 
були створенні такі елементи як: кнопки, каталог(таблиця) та шрифти для 
заголовків; реалізувати сайт гри: сайт був розроблений мовою PHP на Sublime Text 
3 IDE 
Таким чином мета кваліфікаційної роботи бакалавра: «створення гри та 
web-додаток до неї» була досягнута.  
     Лист 
     ЧДТУ 212010.001 ПЗ 
40 
Зм Арк. № докум. Пiдпис. Дата 
нт
 
Джерела Інформації 
1) https://en.wikipedia.org/wiki/Inscryption  
2) https://gamefans.ru/guides/5385-vse-karty-1-akta-inscryption.html  
 
3) https://natpagle.ru/2019/01/23/spravochnik-arxetipov-kolod-
hearthstone/  
4) https://hrwiki.ru/wiki/Gameplay_of_Hearthstone#Gameplay  
5) https://eu.forums.blizzard.com/ru/hearthstone/t/  
6) https://www.cardplace.ru/blog/?p=4834  
7) https://yugioh.fandom.com/wiki/Trap_Card 
8) https://yugioh.fandom.com/wiki/Spell_Card 
9) https://playhearthstone.com/en-us/esports/tournament/world-
championship-2021/ 
10) https://uk.wikipedia.org/wiki/Sublime_Text 
11) https://en.wikipedia.org/wiki/Unity_(game_engine) 
12) https://en.wikipedia.org/wiki/InnoDB 
13) https://dev.mysql.com/doc/refman/8.0/en/innodb-introduction.html 
14) https://progameguides.com/inscryption/all-cards-in-act-2-of-
inscryption/ 
15)  
 
Програмні Засоби 
Unity v.2020.3.2f1 ©Unity Technologies 2005-2020 
Microsoft Visual Studio 2019 x64 Microsoft 1997-2020  
Sublime Text 3 
Adobe Photoshop CC 2019 x64 ©Adobe 1990-2020 
     Лист 
     ЧДТУ 212010.001 ПЗ 
41 
Зм Арк. № докум. Пiдпис. Дата 
нт