Please use this identifier to cite or link to this item: https://er.chdtu.edu.ua/handle/ChSTU/7436
Title: Дизайн контенту відеогри: екологічна та моральна дилема
Authors: Гладун, Ольга Дмитрівна
Носенко, Ігор ВІталійович
Issue Date: Dec-2025
URI: https://er.chdtu.edu.ua/handle/ChSTU/7436
Appears in Collections:022 Дизайн (Дизайн і візуальна культура)



Items in DSpace are protected by copyright, with all rights reserved, unless otherwise indicated.

Extracted text
 
ЧЕРКАСЬКИЙ CHERCASSУ 
ДЕРЖАВНИЙ STATE 
ТЕХНОЛОГІЧНИЙ TECHNOLOGICAL 
УНІВЕРСИТЕТ  UNIVERSITУ 
 
 
 
Факультет 
гуманітарних технологій 
Кафедра дизайну 
 
Освітня програма   «Дизайн і візуальна культура» 
  
Спеціальність          022 Дизайн 
 
 
 
КВАЛІФІКАЦІЙНА РОБОТА МАГІСТРА 
 
на тему: «Дизайн контенту відеогри: екологічна та моральна дилема» 
 
 
Студент групи МДЗ-24                              І.В. Носенко 
             
К.мист., доцент                                                               О.Д. Гладун 
 
 
 
«Допуск до захисту» 
Завідувач кафедри дизайну 
 
 Інна ЯКОВЕЦЬ 
 
                        ____2025рік 
 
 
 
Черкаси 2025
 
Черкаський державний технологічний університет 
 
 
Кафедра дизайну 
Факультет гуманітарних технологій    
Спеціальність 022 Дизайн  
 
 
«ЗАТВЕРДЖУЮ» 
 
Завідувач кафедри дизайну 
  Інна ЯКОВЕЦЬ 
„  ”              2025р. 
 
 
ЗАВДАННЯ 
до кваліфікаційної випускної роботи магістра 
 
Носенко Ігор Віталійович 
1.Тема роботи: Дизайн контенту відеогри: екологічна та моральна дилема» 
затверджена наказом по університету від «_________»_____ р. №______ 
2.Термін здачі студентом магістратури закінченої роботи      
3.Вихідні дані: теоретичні відомості за проблемою дослідження, дизайну 
відеоігор екологічного спрямування та жанру метроїдванія. 
4.Зміст випускної роботи:  
ВСТУП. РОЗДІЛ 1. ТЕОРЕТИЧНІ ЗАСАДИ ДИЗАЙНУ ВІДЕОІГОР З 
ЕКОЛОГІЧНОЮ ПРОБЛЕМАТИКОЮ. 1.1. Відеоігри як засіб візуальної 
комунікації та соціального впливу: екологічний аспект. 1.2. Жанр «метроїдванія»: 
історія розвитку, візуальні коди та ігрові механіки. 1.3. Аналіз вітчизняних та 
зарубіжних аналогів: стилістика, наратив та атмосфера. РОЗДІЛ 2. 
МЕТОДОЛОГІЯ СТВОРЕННЯ ВІЗУАЛЬНОЇ МОВИ ТА ХУДОЖНЬОГО 
ОБРАЗУ ГРИ. 2.1. Особливості візуалізації індустріального та 
постапокаліптичного середовища в 2D-графіці. 2.2. Психологія сприйняття 
персонажа: методи дизайну антагоністів як жертв екологічних катастроф. 2.3. 
Кольорознавство та композиційні прийоми для створення атмосфери напруги та 
моральної дилеми. РОЗДІЛ 3. РОЗРОБКА ДИЗАЙН-КОНЦЕПЦІЇ ВІДЕОГРИ 
«UMBRION». 3.1. Формування загальної концепції гри: сюжет, світ та моральний 
конфлікт.  3.2.  Розробка   персонажів:   візуалізація   головного   героя   та   система  
дизайну ворогів-мутантів. 3.3. Дизайн ігрового середовища та локацій: 
стилістика забрудненого індустріального міста. 3.4. Розробка айдентики та 
інтерфейсу: візуальна ідентифікація ігрового світу. РОЗДІЛ 4. ТЕХНОЛОГІЧНІ 
ОСОБЛИВОСТІ РЕАЛІЗАЦІЇ ПРОЄКТУ ТА АНІМАЦІЯ. 4.1. Програмне  
забезпечення та інструментарій розробки. 4.2. Технологія створення анімаційних 
ефектів: метод редрава (Redraw). 4.3. Систематизація та підготовка 
презентаційних матеріалів. ВИСНОВКИ. СПИСОК ВИКОРИСТАНИХ 
ДЖЕРЕЛ. ДОДАТКИ. 
5. Перелік графічного матеріалу: загальна площа графічної частини 
1590×2300 мм. Додатки: 5 стор. формату А4. 
6.Консультанти кваліфікаційної роботи із зазначенням розділів, що їх 
стосуються 
 
  Підпис, дата 
Розділ Консультант завдання завдання 
видав прийняв 
Графічна частина    
Наукове дослідження    
Загальне керівництво    
Макет/відеопрезентація    
 
 
Дата видачі завдання_______________________________________________ 
 
 
КАЛЕНДАРНИЙ ПЛАН 
 
Термін 
№ Назва етапів дипломного проекту 
виконання етапів Примітка 
з/п (роботу) 
проекту (роботи) 
1. Затвердження теми роботи, керівника        12.06.2025  
2. Робота з аналогами, збір інформації        21.07.2025  
3. Заслуховування про виконання першого        25.07.2025  
етапу роботи 
4. Звіт про перші два розділи магістерської        26.09.2025  
роботи 
5. Затвердження ідеї дизайнерського        03.10.2025  
рішення проекту та кінцевого варіанту 
плану 
6. Попередній захист випускної роботи 18.11.2025  
магістра 
7. Робота над макетом/відео презентацією 25.11.2025  
кваліфікаційної роботи 
8. Захист випускної роботи магістра 02.12.2025  
 
 
 
Керівник                                                                                                 Ольга ГЛАДУН 
 
 
Завдання прийняв до виконання                                       Ігор НОСЕНКО
 
ЗМІСТ  
ВСТУП………………………………………………………………………………..6 
РОЗДІЛ 1. ТЕОРЕТИЧНІ ЗАСАДИ ДИЗАЙНУ ВІДЕОІГОР З ЕКОЛОГІЧНОЮ 
ПРОБЛЕМАТИКОЮ  
1.1. Відеоігри як засіб візуальної комунікації та соціального впливу: екологічний 
аспект……………………………………………………………………………...….9  
1.2. Жанр «метроїдванія»: історія розвитку, візуальні коди та ігрові механіки...11 
1.3. Аналіз вітчизняних та зарубіжних аналогів: стилістика, наратив та 
атмосфера……………………………………………………………………………14 
РОЗДІЛ  2.  МЕТОДОЛОГІЯ  СТВОРЕННЯ  ВІЗУАЛЬНОЇ  МОВИ 
 ТА ХУДОЖНЬОГО ОБРАЗУ ГРИ  
2.1.  Особливості  візуалізації  індустріального  та  постапокаліптичного 
середовища в 2D-графіці…………………………………………………………...17  
2.2. Психологія сприйняття персонажа: методи дизайну антагоністів як жертв 
екологічних катастроф……………………………………………………………...20 
2.3. Кольорознавство та композиційні прийоми для створення атмосфери напруги 
та моральної дилеми………………………………………………………………..23 
РОЗДІЛ 3. РОЗРОБКА ДИЗАЙН-КОНЦЕПЦІЇ ВІДЕОГРИ «UMBRION»  
3.1. Формування загальної концепції гри: сюжет, світ та моральний конфлікт…27 
3.2. Розробка персонажів: візуалізація головного героя та система дизайну 
ворогів-мутантів…………………………………………………………………….35 
3.3. Дизайн ігрового середовища та локацій: стилістика забрудненого 
індустріального міста……………………………………………………………….46 
3.4. Розробка айдентики та інтерфейсу: візуальна ідентифікація ігрового світу..53  
РОЗДІЛ 4. ТЕХНОЛОГІЧНІ ОСОБЛИВОСТІ РЕАЛІЗАЦІЇ ПРОЄКТУ ТА 
АНІМАЦІЯ  
4.1. Програмне забезпечення та інструментарій розробки……………………….63  
4.2. Технологія створення анімаційних ефектів: метод редрава (Redraw)………64 
4.3. Систематизація та підготовка презентаційних матеріалів…………………...65 
ВИСНОВКИ………………………………………………………………………...67 
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ…………………………………………..69  
ДОДАТКИ   
ВСТУП  
Актуальність теми дослідження. Сучасний дизайн вийшов за межі 
створення суто утилітарних або естетичних об’єктів, ставши потужним 
інструментом соціальної комунікації та формування суспільної свідомості. У 
цифрову епоху відеоігри є одним із найвпливовіших медіа, що поєднує 
інтерактивність, наратив та візуальне мистецтво. Вони здатні не лише розважати, 
а й піднімати гострі глобальні питання, зокрема екологічні проблеми та моральні 
виклики, що стоять перед людством. Актуальність теми зумовлена необхідністю 
пошуку нових візуальних та інтерактивних засобів для висвітлення проблем 
екологічного занепаду. Традиційні методи інформування часто втрачають 
ефективність, тоді як ігровий формат дозволяє користувачеві пережити наслідки 
людської діяльності через емоційне занурення. Розробка дизайн-концепції 
відеогри «Umbrion», в основу якої покладено конфлікт між індустріальним 
середовищем та мутованою природою, є відповіддю на запит суспільства щодо 
осмислення відповідальності за довкілля. Важливим аспектом є створення 
унікальної візуальної мови, яка транслює моральну дилему - перетворення ворога 
з агресора на жертву обставин, що вимагає від дизайнера глибокого розуміння 
психології сприйняття, стилістики та ергономіки візуального контенту.    
Об’єкт дослідження - дизайн-проєктування візуально-інформаційного 
середовища сучасних відеоігор.    
Предмет дослідження - художньо-образні засоби та методи візуалізації 
екологічної та моральної дилеми в концепції 2D-відеогри жанру метроїдванія.    
Мета роботи полягає у розробці комплексної дизайн-концепції відеогри 
«Umbrion», що включає створення світу, персонажів, ігрових механік та 
айдентики, спрямованих на візуальне розкриття теми екологічного занепаду та 
морального вибору гравця.    
Для досягнення поставленої мети необхідно вирішити такі завдання:    
• Проаналізувати сучасний стан та тенденції дизайну відеоігор з 
екологічною проблематикою, дослідити жанрові особливості метроїдванії.  
6 
 
• Виявити візуальні коди та стилістичні прийоми, що використовуються для 
зображення індустріально-постапокаліптичного середовища.  
• Сформувати авторську концепцію гри «Umbrion», обґрунтувати її сюжетну 
та моральну складову.  
• Розробити систему персонажів (головного героя, ворогів-мутантів), 
візуалізувавши їхній зв'язок із забрудненим середовищем.  
• Створити дизайн-проєкт ігрових локацій, інтерфейсу та логотипу гри.  
• Обґрунтувати технологічні особливості реалізації візуальних ефектів та 
анімації (механіка парасольки, рух персонажів).  
Методи дослідження. Для вирішення поставлених завдань використано 
комплекс загальнонаукових та спеціальних методів: аналіз та синтез - для 
вивчення аналогів та формування теоретичної бази; порівняльний аналіз - для 
дослідження стилістичних особливостей жанру; метод аналогії та моделювання - 
для розробки ігрового світу та механік; художньо-образне проєктування - для 
створення візуального ряду персонажів та середовища.    
Наукова новизна одержаних результатів полягає у:    
• уперше розроблено цілісну дизайн-концепцію гри «Umbrion», яка поєднує 
механіку жанру метроїдванія з наративом моральної еволюції героя від 
протистояння до співпраці з природою;  
• удосконалено підходи до дизайну антагоністів у відеоіграх шляхом 
візуалізації їх як «живих наслідків» екологічного забруднення (інтеграція 
сміття в анатомію, мутації), що змінює емоційне сприйняття гравця;  
• набули подальшого розвитку принципи стилізації 2D-графіки для 
створення атмосфери індустріального занепаду за допомогою обмеженої 
«брудної» палітри та специфічних контурних рішень.  
Практичне значення одержаних результатів. Розроблена дизайн-
концепція, включаючи персонажів, локації, логотип та анімаційні рішення, є 
готовим підґрунтям для подальшої технічної розробки та випуску відеогри. 
Результати дослідження можуть бути використані у практичній діяльності студій 
7 
 
ігрового дизайну, а також у навчальному процесі при підготовці фахівців за 
спеціальністю «Дизайн».    
Структура та обсяг роботи. Робота складається з теоретичної, графічної 
та презентаційної частини. Загальний обсяг теоретичної роботи - 60 сторінок, 
додатки - 5 сторінок. Список використаних джерел становить - 27 найменувань. 
Графічна частина складається з банера 1590х2300 мм. Презентаційна робота 
складається з відеопрезентації ігрових анімацій та особливостей.  
   
     
8 
 
РОЗДІЛ 1 
 
ТЕОРЕТИЧНІ ЗАСАДИ ДИЗАЙНУ ВІДЕОІГОР З  
ЕКОЛОГІЧНОЮ ПРОБЛЕМАТИКОЮ  
  
1.1. Відеоігри як засіб візуальної комунікації та соціального впливу:  
екологічний аспект. 
На сучасному етапі розвитку цифрової культури відеоігри 
трансформувалися з суто розважального медіа у складну синтетичну форму 
мистецтва, що володіє потужним потенціалом візуальної комунікації та 
соціального впливу. У контексті графічного дизайну та візуальної культури 
відеогра розглядається не просто як програмний продукт, а як полісеміотична 
система, де візуальні образи, інтерактивні механіки, звук та наратив 
об’єднуються для трансляції складних ідей, зокрема екологічного спрямування. 
Відеогра як комунікаційна система. Теоретик нових медіа Лев Манович визначає 
відеоігри як одну з форм «інтерактивного наративу», де користувач (гравець) 
перестає бути пасивним спостерігачем і стає співтворцем сенсів [1].  
На відміну від кінематографа чи літератури, комунікація у відеоіграх 
відбувається через активну дію. Візуальна мова гри - це система знаків та 
символів, яка зчитується гравцем у процесі взаємодії. Дизайн оточення, 
персонажів, інтерфейсу (UI) та навіть кольорова палітра виконують функцію 
невербальної комунікації, формуючи у свідомості гравця картину світу ще до 
того, як буде прочитано перший рядок тексту. Наприклад, домінування 
індустріальних форм, іржавих текстур та кислотних кольорів миттєво сигналізує 
про стан екологічного занепаду, створюючи атмосферу тривоги та небезпеки без 
прямих пояснень.  
Теорія процедурної риторики. Ключовим поняттям для розуміння того, як 
ігри впливають на свідомість, є термін «процедурна риторика» (procedural 
rhetoric), введений дослідником Яном Богостом.  
9 
 
У своїй фундаментальній праці «Persuasive Games» він стверджує, що 
відеоігри переконують не через слова чи зображення самі по собі, а через процеси 
та правила [2]. Це мистецтво переконання через дію. У контексті екологічної 
проблематики процедурна риторика дозволяє дизайнеру моделювати системи, де 
дії гравця мають видимі наслідки для віртуального довкілля. Замість того, щоб 
просто сказати «забруднення - це погано», гра змушує гравця відчути це на рівні 
механіки: коли забруднене середовище обмежує рух персонажа, зменшує його 
здоров’я або перетворює корисні ресурси на отруту, гравець засвоює екологічний 
урок через власний негативний досвід.  
Екологічний вимір та концепція «Playing Nature». Дослідниця Аленда Чанг 
у роботі «Playing Nature: Ecology in Video Games» наголошує, що відеоігри мають 
унікальний потенціал для розвитку екологічної свідомості. Вона критикує 
традиційне зображення природи у іграх як статичної декорації або нескінченного 
ресурсу для видобутку. Натомість сучасний еко-дизайн прагне до створення 
«мезокосмів» - замкнутих віртуальних екосистем, які функціонують за 
біологічними законами [3]. Візуалізація природи у таких проєктах часто 
відходить від ідеалізованих пасторальних пейзажів у бік «темної екології» (dark 
ecology), демонструючи наслідки антропоцену - мутації, деградацію ландшафтів, 
злиття біологічного та техногенного. Дизайн персонажів-антагоністів у такому 
контексті часто набуває рис трагізму: вони зображуються не як абсолютне зло, а 
як понівечені жертви техногенного впливу, що викликає у гравця складну 
моральну рефлексію.  
Соціально-психологічний вплив. Дослідження у сфері психології 
сприйняття медіа підтверджують, що відеоігри є ефективним інструментом 
формування проекологічної поведінки. Завдяки феномену «транспортування» 
(narrative transportation) та ідентифікації з аватаром, гравці здатні переживати 
сильні емпатичні емоції. Візуальний дизайн відіграє тут вирішальну роль: 
використання специфічних кольорових кодів (наприклад, брудно-оливковий як 
маркер хвороби середовища) та форм (ламані, агресивні силуети сміття) впливає 
10 
 
на афективний стан гравця, викликаючи відчуття відповідальності або провини 
за стан ігрового світу [4]. Це дозволяє говорити про відеоігри як про інструмент 
«м'якої сили» у просуванні екологічних цінностей, здатний досягати аудиторії, 
яка може ігнорувати традиційні форми екологічної агітації.  
Таким чином, дизайн відеоігор з екологічною проблематикою є складним 
багаторівневим процесом. Він вимагає від дизайнера не лише художньої 
майстерності, але й розуміння семіотики, психології сприйняття та системного 
мислення. Створення переконливого візуального образу екологічної катастрофи 
та моральної дилеми можливе лише через синтез виразної графічної мови та 
процедурної риторики, що перетворює гру на простір для соціального діалогу.  
  
1.2. Жанр «метроїдванія»: історія розвитку, візуальні коди та ігрові 
механіки. 
У сучасному геймдизайні термін «метроїдванія» (Metroidvania) вийшов за 
межі простого позначення жанрової приналежності і трансформувався у 
комплексну філософію проєктування віртуального простору. Це специфічний 
підвид пригодницьких екшн-ігор (action-adventure), який базується на 
нелінійному дослідженні цілісного світу, доступ до частин якого регулюється 
набором здібностей персонажа. Для дизайнера графічного контенту цей жанр 
становить особливий інтерес, оскільки він вимагає створення складної, але 
інтуїтивно зрозумілої візуальної навігації без використання прямих текстових 
вказівок. Історичний генезис та еволюція жанру. Етимологічно термін є 
портманто, утвореним від назв двох культових серій японських відеоігор: 
«Metroid» (компанія Nintendo) та «Castlevania» (компанія Konami) (Додаток А. 
Рис.А.1-2). Історія жанру бере початок у 1986 році з виходом першої частини 
«Metroid». На відміну від популярних тоді аркадних ігор, де рух персонажа 
відбувався лінійно зліва направо, а пройдений шлях зникав, «Metroid» 
запропонувала гравцеві лабіринт, яким можна було рухатися у будь-якому 
напрямку [5]. Остаточна кристалізація жанрових канонів відбулася у другій 
11 
 
половині 1990-х років. Вихід «Super Metroid» (1994) встановив стандарти 
візуальної розповіді через оточення, а «Castlevania: Symphony of the Night» (1997) 
збагатила формулу елементами рольових ігор (RPG) - системою інвентарю, 
характеристиками персонажа та різноманіттям зброї. Як зазначає в інтерв'ю 
порталу Game Developer творець «Symphony of the Night» Кодзі Іґарасі, його 
метою було змінити парадигму сприйняття гри: від короткострокової перевірки 
реакції до довготривалого занурення у світ через дослідження (exploration) [6]. З 
початком ери 3D-графіки жанр тимчасово втратив популярність у мейнстрімі, 
однак пережив потужне відродження (т.зв. «інді-ренесанс») у 2010-х роках 
завдяки незалежним розробникам. Проєкти на кшталт «Cave Story», «Hollow 
Knight» та «Ori and the Blind Forest» довели, що двовимірна графіка має 
унікальний художній потенціал для створення атмосферних, емоційно насичених 
світів, де візуальний стиль є головним інструментом наративу. Механіка «Замок і 
Ключ» (Ability Gating). Фундаментальною механікою, що відрізняє метроїдванію 
від інших платформ, є концепція «керованої нелінійності» або «шлюзування 
здібностями» (ability gating). Джош Байсер у своєму дослідженні дизайну 
платформерів визначає це як структуру «Замок і Ключ» (Lock-and-Key), де роль 
фізичного ключа виконує нова здатність персонажа [7]. Ця механіка працює на 
двох рівнях:  
1. Функціональний рівень: Гравець бачить перешкоду (високий уступ, крихку 
підлогу, токсичний туман), яку неможливо подолати з поточним набором 
рухів. Це формує «м'який бар'єр» (soft lock). Отримання апгрейду 
(подвійний стрибок, ривок, захисний костюм) дозволяє подолати бар'єр.  
2. Психологічний рівень: Це створює ефект відкладеної винагороди. Гравець 
запам'ятовує недоступне місце і, отримавши нову силу, відчуває 
задоволення від власної прогресії та «розумнішання». Для художника-
дизайнера це ставить задачу чіткої візуалізації: здатність персонажа 
повинна мати очевидний візуальний зв'язок із типом перешкоди, яку вона 
долає (наприклад, синій колір енергії героя відповідає синім бар'єрам).   
12 
 
Візуальна навігація та архітектура світу. Оскільки ігровий процес 
передбачає постійне повернення до вже відвіданих локацій (backtracking), 
критично важливим стає дизайн рівнів (level design) та візуальне кодування. 
Джессі Шелл у праці «The Art of Game Design» наголошує, що гравець будує у 
своїй голові ментальну карту простору [8]. Щоб ця карта була точною, дизайнер 
повинен використовувати систему візуальних якорів:   
1. Лендмарки (Landmarks): Унікальні, великі об'єкти (статуї, велетенські 
дерева, зруйновані механізми), які виділяються із загального фону і 
слугують орієнтирами.    
2. Кодування біомів: Ігровий світ ділиться на тематичні зони (біоми), 
кожна з яких має свою унікальну кольорову палітру (Color Coding), набір 
текстур та освітлення. Наприклад, перехід від «Індустріальної зони» 
(сірі, іржаві тони, жорсткі кути) до «Підводних садів» (бірюзові тони, 
плавні лінії) дозволяє гравцеві миттєво зрозуміти своє 
місцезнаходження без використання карти інтерфейсу.  
3. Навколишнє оповідання (Environmental Storytelling): Це метод подачі 
сюжету через деталі оточення. Стан архітектури (руїни, сліди бою, 
рослинність, що поглинає будівлі) розповідає історію світу краще за 
текстові діалоги. У контексті екологічної проблематики це дозволяє 
демонструвати причини та наслідки катастроф через зміни у фонових 
зображеннях (паралакс-ефект).  
Баланс ігрового потоку. Важливим аспектом є також поняття «потоку» 
(flow), описане психологом Міхаєм Чіксентміхаї та адаптоване до геймдизайну.  
У метроїдванії баланс між складністю навігації та бойовими зіткненнями має 
бути вивіреним, щоб гравець не відчував фрустрації від того, що заблукав. 
Візуальні підказки (освітлення, напрямок руху фонових елементів, дизайн 
ворогів) виступають тут як «хлібні крихти», що ненав'язливо скеровують гравця 
у потрібному напрямку [9].  
13 
 
Таким чином, жанр «метроїдванія» є ідеальним полем для реалізації 
дизайнерських рішень, де форма і функція нерозривно пов'язані. Візуальний 
образ персонажа, ворогів та оточення безпосередньо впливає на механіку гри, а 
дослідження світу перетворюється на акт розшифровки візуальних кодів, 
закладених автором.  
  
1.3 Аналіз вітчизняних та зарубіжних аналогів: стилістика, наратив та 
атмосфера. 
Важливим етапом дизайн-проєктування є компаративний аналіз існуючих 
на ринку продуктів-аналогів. Це дозволяє виявити актуальні візуальні тренди, 
визначити ефективні прийоми візуалізації екологічної проблематики та знайти 
вільну нішу для реалізації авторської концепції. Сучасна індустрія інді-ігор 
(незалежних розробників) демонструє відхід від гіперреалізму на користь 
унікальних авторських стилів, де атмосфера та ідея переважають над 
технологічною досконалістю картинки. Для аналізу було відібрано низку 
зарубіжних та вітчизняних проєктів, що мають спільні риси з розроблюваною 
грою «Umbrion» у жанровому (метроїдванія) або тематичному (екологія, занепад) 
аспектах.   
Зарубіжний досвід: візуалізація екосистем та занепаду. Еталонним 
прикладом сучасної 2D-метроїдванії є гра «Hollow Knight» (Team Cherry, 
Австралія, 2017) (Додаток А. Рис. А.3). Графіка у якій виконана у техніці 
традиційної покадрової анімації. Кольорова гама суворо обмежена холодними 
відтінками (синій, сірий, чорний), що створює відчуття меланхолії та підземної 
ізоляції. Важливим для нашого дослідження є використання кольору як маркера 
небезпеки: яскравий помаранчевий колір («Інфекція») різко контрастує із 
загальним синім тлом, сигналізуючи гравцеві про заражених ворогів. Світ 
Hallownest загинув не через війну, а через хворобу, що спотворила розум 
мешканців. Дизайн ворогів базується на візуальній метафорі «втрати себе»: 
знайомі форми комах деформуються пухирями інфекції. [10].  
14 
 
Іншим важливим аналогом є «Rain World» (Videocult, США, 2017), яка 
фокусується на темі виживання в зруйнованому індустріальному світі (Додаток 
А. Рис. А.4). Сеттинг гри - це монументальні залишки невідомої цивілізації, які 
поступово поглинаються флорою та іржею. Художники використовували велику 
кількість шуму та деталей у фонових шарах, щоб передати відчуття бруду та 
хаосу сміттєзвалища. Головна особливість дизайну - процедурна анімація. Рухи 
істот не заскриптовані, а розраховуються фізично в реальному часі. Це робить 
їхню поведінку схожою на поведінку реальних тварин. [11].  
Гра «Ori and the Will of the Wisps» (Moon Studios, Австрія, 2020) демонструє 
підхід «естетизованого занепаду». (Додаток А. Рис. А.5)Гра чітко розмежовує 
зони «життя» (світяться, плавні лінії, насичені кольори) та зони «розкладання» 
(сірі, колючі, позбавлені світла). Антагоністи тут часто мають трагічну 
передісторію, візуалізовану через каліцтва, що викликає емпатію гравця [12].  
Серед української індустрії розробки ігор останніми роками демонструє 
значне зростання якості художнього контенту, пропонуючи світові проєкти з 
унікальною візуальною ідентичністю.  
Яскравим прикладом є гра «Moonscars» (Black Mermaid, Київ, 2022)  
(Додаток А. Рис. А.6). Це похмура метроїдванія-слешер. Графіка імітує живопис 
олією з використанням темної, майже монохромної палітри з агресивними 
вкрапленнями червоного. Гра досліджує теми екзистенціалізму та страждання, 
використовуючи гротескні форми персонажів. Дизайн середовища підкреслює 
відчуття безвиході через масивні, тиснучі архітектурні форми.  
Ще одним важливим прикладом є «Erra: Exordium» (Fair Pixel, Київ, 2023) 
- пригодницька гра у сеттингу дизельпанку, заснованому на шумеро-аккадській 
міфології (Додаток А. Рис. А.7).  Художники детально пропрацювали світ 
занепалих технологій. Піксельна графіка тут використовується для зображення 
складних механізмів, труб, диму та підземних комплексів.  
На противагу похмурим проєктам, варто згадати гру «Tukoni» (Oksana Bula, 
Львів, 2020), створену за мотивами книжкових ілюстрацій (Додаток А. Рис. А.8).  
15 
 
Хоча це мирна гра-головоломка, вона є чудовим прикладом того, як дизайн 
персонажів (духів лісу) може бути нерозривно пов'язаним із середовищем. 
Персонажі візуально «складаються» з елементів природи.   
Порівняльна характеристика та обґрунтування новизни. Проведений аналіз 
дозволяє зробити висновок, що ніша «екологічної метроїдванії» має високий 
потенціал. Більшість існуючих аналогів або схиляються до чистого фентезі  
(«Hollow Knight», «Ori»), або до жорсткого sci-fi виживання («Rain World»).  
Українські проєкти («Moonscars», «Erra») демонструють високий рівень роботи з 
«темною» естетикою, але фокусуються на інших темах, таких як міфологія, 
філософія.  
  
Висновки до першого розділу 
У першому розділі магістерської роботи обґрунтовано, що відеоігри є 
ефективним засобом візуальної комунікації екологічних проблем. Через 
механізми процедурної риторики та емпатії дизайнер може формувати у гравця 
відчуття відповідальності за віртуальний, а згодом і реальний світ.  
Визначено жанр «метроїдванія» як оптимальну структуру для розкриття 
теми. Нелінійність та механіка «ability gating» дозволяють візуально 
демонструвати прогрес героя та зміни у навколишньому середовищі.  
Аналіз зарубіжних та вітчизняних аналогів підтвердив актуальність 
обраної стилістики та виявив потребу в проєктах, які б глибше інтегрували тему 
реального забруднення (пластик, сміття) у фентезійний ігровий процес. 
Додатково з’ясовано, що специфічна для жанру механіка «бектрекінгу» 
(повернення на старі локації) має потужний психологічний потенціал для 
реалізації сюжетного зламу: гравець повертається у знайомі місця, але дивиться 
на них крізь призму нового морального досвіду, що перетворює дослідження 
карти на акт переосмислення власних дій.    
16 
 
РОЗДІЛ 2 
 
МЕТОДОЛОГІЯ СТВОРЕННЯ ВІЗУАЛЬНОЇ МОВИ ТА  
ХУДОЖНЬОГО ОБРАЗУ ГРИ 
 
2.1. Особливості візуалізації індустріального та постапокаліптичного  
середовища в 2D-графіці. 
Процес візуалізації ігрового простору у двовимірній графіці (2D) вимагає 
від дизайнера застосування специфічного набору художніх та технічних методів, 
відмінних від тривимірного моделювання. У контексті створення індустріального 
та постапокаліптичного середовища ключовим завданням стає не натуралістична 
імітація реальності, а створення виразного художнього образу, який транслює 
наратив через деталі оточення, колористику та композицію. Методологія 
розробки такого середовища базується на синтезі принципів «навколишнього 
оповідання» (environmental storytelling), теорії кольору та технічних прийомів 
створення глибини сцени.  
Методологія «навколишнього оповідання». Фундаментом для візуалізації 
складних тематичних світів, таких як занедбані мегаполіси, є концепція 
«навколишнього оповідання». Дослідники геймдизайну визначають цей метод як 
практику організації об'єктів у ігровому просторі таким чином, щоб вони 
самостійно розповідали історію без використання тексту чи діалогів [13].  
Для 2D-середовища цей метод реалізується через три рівні деталізації:  
1. Макро-рівень (Силует та Архітектура): Формування загального образу 
локації через впізнавані силуети на задньому плані (труби заводів, 
зруйновані хмарочоси). У 2D-графіці силует є головним інструментом 
ідентифікації об'єкта, тому індустріальні форми мають бути геометрично 
жорсткими, ритмічними та масивними, щоб передати відчуття тиску 
техногенного середовища.  
17 
 
2. Мезо-рівень (Set Dressing / Декорування): Розміщення об'єктів середнього 
плану, з якими може взаємодіяти персонаж або які знаходяться на лінії його 
руху. Для постапокаліптичного жанру характерне використання 
«візуального шуму» - розкиданого сміття, уламків механізмів, кабелів. 
Важливо дотримуватися принципу «наративного шарування» (narrative 
layering), коли об'єкти розміщуються шарами, що відповідають різним 
часовим проміжкам (наприклад, шар довоєнної архітектури, шар 
руйнувань, шар природного заростання) [14].  
3. Мікро-рівень (Текстури та Деталі): Використання текстурних карт для 
передачі матеріальності. Методика створення текстур для індустріального 
стилю передбачає активне використання карт бруду (grunge maps), іржі та 
патьоків. Це додає зображенню тактильності та історичної достовірності.  
Естетика Індустріалізму: ритм та геометрія. Візуалізація індустріального 
середовища в 2D базується на принципах конструктивізму та функціоналізму.  
Основним композиційним прийомом тут є ритмічне повторення вертикальних та 
горизонтальних ліній (труби, балки, колони), що створює ефект впорядкованості 
та штучності, протиставляючись хаосу природи.  
Художники використовують такі прийоми стилізації:  
1. Модульність: Створення бібліотеки тайлів (tiles) - повторюваних елементів 
(стіни, підлога, платформи), які стикуються між собою. Для уникнення 
ефекту «сітки» дизайнери застосовують варіативність тайлів з різним 
ступенем пошкодження [15].  
2. Контраст матеріалів: Візуальне протиставлення холодних, гладких 
поверхонь (метал, скло) та грубих, фактурних матеріалів (бетон, цегла). У 
2D-графіці це досягається через роботу зі світлотінню  та бліками.  
Постапокаліптична трансформація: методика «Decay & Overgrowth». 
Перехід від чистого індустріального стилю до постапокаліптичного відбувається 
через візуалізацію процесів руйнування та поглинання природою. Методологічно 
18 
 
це вирішується через порушення геометричної правильності індустріальних 
форм.  
Основні прийоми візуалізації занепаду:  
• Руйнування силуету: Цілісні геометричні форми (квадрати будівель, прямі 
лінії труб) свідомо розриваються, деформуються або нахиляються. Це 
створює динаміку в статичній картинці та візуалізує нестабільність світу.  
• Органічна інтервенція: Накладання шарів органічних елементів (ліани, 
мох, пліснява) поверх техногенних об'єктів. У кольоровому рішенні це 
проявляється як вторгнення зелених та коричневих відтінків у сіро-
блакитну гаму міста.  
• Ерозія кольору: Використання ненасичених, «вицвілих» палітр. Ефект 
старіння матеріалів передається через десатурацію (зменшення 
насиченості) базових кольорів та додавання теплих відтінків іржі (оксид 
заліза) або холодних відтінків окисленої міді (патина) [16].  
Технічні засоби створення глибини: паралакс-скролінг. Однією з головних 
проблем 2D-графіки є відсутність фізичної глибини. Для вирішення цієї задачі та 
створення ілюзії об'ємного простору використовується технологія паралакс-
скролінгу (parallax scrolling). Суть методу полягає у розділенні ігрової сцени на 
декілька планів (layers), які рухаються з різною швидкістю відносно камери:  
• Передній план (Foreground): Рухається найшвидше, часто розмитий (blur), 
створює ефект присутності.  
• Ігровий план (Midground): Статичний відносно персонажа, місце основної 
дії.  
• Задній план (Background): Рухається повільніше, створює ефект 
віддаленого горизонту.  
Для індустріальних пейзажів паралакс дозволяє створити відчуття 
масштабу мегаполісу, розміщуючи на задніх планах масивні силуети заводів, які 
здаються велетенськими завдяки ефекту атмосферної перспективи (зменшення 
контрасту та зміщення кольору в бік кольору неба) [17].  
19 
 
Освітлення та колористика як інструмент навігації. У методології дизайну 
рівнів світло виконує не лише естетичну, але й навігаційну функцію. Для 
похмурих постапокаліптичних світів характерна техніка «кьяроскуро»  
(chiaroscuro) - різкий контраст світла і тіні.  
Колірне кодування (Color Psychology): Використання кольору для 
позначення зон. Наприклад, теплі помаранчеві джерела світла можуть позначати 
безпечні зони або інтерактивні об'єкти, тоді як холодне зелене або фіолетове 
світіння маркує токсичні зони та ворогів.  
Об'ємне світло (Volumetric Light): Імітація променів світла, що 
пробиваються крізь дірки в дахах або туман. У 2D це реалізується через 
напівпрозорі градієнтні спрайти, що додає сцені драматизму та підкреслює 
запиленість повітря, характерну для екологічно забруднених регіонів [18].  
Таким чином, візуалізація індустріального та постапокаліптичного 
середовища в 2D-графіці є складним синтетичним процесом, що поєднує художні 
прийоми композиції та колористики з технічними можливостями ігрового рушія 
(паралакс, шейдери). Головною метою дизайнера є створення цілісного 
візуального образу, де кожен елемент - від іржавої труби до променя світла - 
працює на розкриття наративу занепаду та екологічної катастрофи.  
  
2.2. Психологія сприйняття персонажа: методи дизайну антагоністів як 
жертв екологічних катастроф.   
У сучасному ігровому дизайні спостерігається зміна парадигми у створенні 
образу антагоніста (ворога). Якщо класичні ігрові канони передбачали 
візуалізацію ворога як абсолютного зла, що викликає у гравця лише страх або 
агресію, то сучасні наративні ігри, особливо екологічного спрямування, прагнуть 
викликати складніші емоції - жалість, співчуття та провину. Це явище дослідники 
називають «емпатичним дизайном». Для художника це ставить складне завдання: 
створити образ, який одночасно зчитується як загроза (геймплейна функція), але 
при цьому візуально транслює статус жертви обставин (наративна функція). 
20 
 
Теорія форм та візуальна семіотика. Фундаментом дизайну будь-якого персонажа 
є «мова форм».   
Кріс Соларскі у своєму дослідженні динаміки форм в іграх виділяє три 
базові архетипи: коло (безпека, м'якість, дружність), квадрат (стабільність, сила, 
впертість) та трикутник (агресія, небезпека, динаміка) [19]. Для створення образу 
мутанта-жертви дизайнери використовують метод «конфлікту форм»:  
Порушена цілісність: Базова форма персонажа може бути округлою 
(природною, безпечною), але вона насильницьки розривається гострими 
трикутними елементами (уламками техногенного сміття, шипами, кристалами). 
Це створює когнітивний дисонанс: гравець підсвідомо бачить істоту, яка мала б 
бути мирною, але стала небезпечною проти власної волі.  
Асиметрія як маркер болю: Симетрія в природі часто асоціюється зі 
здоров'ям та красою. Асиметрія, навпаки, сигналізує про травму, хворобу або 
генетичний збій. Дизайн, де одна кінцівка гіпертрофована, а інша атрофована, або 
де половина обличчя прихована наростами, викликає інстинктивне відчуття 
«неправильності», яке в контексті екологічного наративу зчитується як наслідок 
зовнішнього втручання.   
Концепція «Моторошної долини» та Body Horror. При створенні мутантів 
дизайнери часто балансують на межі ефекту «моторошної долини» (Uncanny 
Valley), описаного Масахіро Морі.  
Однак у еко-дизайні цей ефект використовується специфічно: мета - 
викликати не відразу, а «соматичну емпатію». Це досягається через естетику 
«боді-горору» - візуалізацію тілесних трансформацій [20].  
Методи візуалізації страждання:  
• Інтеграція сторонніх об'єктів: Це один із найпотужніших прийомів 
екологічного дизайну. Ворог зображується не просто як монстр, а як 
тварина, що зрослася зі сміттям. Пластикові кільця, що перетискають шию, 
іржаві труби, що стирчать із панцира, рибальські сіті, що вросли у шкіру - 
21 
 
ці елементи перетворюють ворога на живу ілюстрацію екологічної 
проблеми.  
• Обмеження руху (Restricted Movement): Дизайн силуету має демонструвати 
скутість. Якщо істота виглядає так, ніби кожен рух завдає їй болю 
(згорблена спина, неприродно вивернуті суглоби, волочіння кінцівок), 
гравець починає сприймати бій з нею як акт милосердя (евтаназію), а не як 
героїчну перемогу.  
Колористика хвороби та токсичності. Колір є найшвидшим каналом 
передачі інформації про стан персонажа. У природі яскраві кольори часто 
сигналізують про отруйність (апосематизм), але в дизайні «жертв екології» 
палітра має інші акценти.  
Брайан Тіллман у своїй праці з дизайну персонажів зазначає важливість 
контекстуальної палітри [21].   
Для теми забруднення ефективними є такі схеми:  
1. «Хвора» палітра: Використання ненасичених, брудних відтінків 
жовтозеленого, оливкового та бурого. Ці кольори асоціюються з гниттям, 
пліснявою та застійною водою.  
2. Неприродний контраст: Поєднання природних кольорів шкіри/луски 
тварини з неприродними, «хімічними» кольорами мутацій (неоновий 
фіолетовий, кислотний салатовий). Це візуально відокремлює «живе» від 
«чужорідного», підкреслюючи, що мутація є інфекцією, що захопила 
організм.  
Очі як дзеркало (де)гуманізації. Очі персонажа є фокусною точкою для 
встановлення емоційного контакту.   
Відсутність очей, або порожні очниці перетворюють істоту на безлику силу 
природи, діючу наосліп. Це знижує емпатію, але підвищує відчуття жаху.  
Надання монстру виразних, сумних або переляканих очей миттєво 
гуманізує його. Це найсильніший інструмент для створення моральної дилеми: 
22 
 
гравець вагається атакувати істоту, яка дивиться на нього з розумінням або 
благанням.  
Сліпі, або більмясті очі, як символ втрати орієнтації. Істота, яка атакує 
хаотично через те, що осліпла від хімікатів, сприймається трагічніше, ніж 
холоднокровний хижак.  
Поведінковий дизайн (Animation & Behavior). Хоча це стосується динаміки, 
статичний дизайн має передбачати характер руху. Концепт-арт повинен 
показувати «вагу» персонажа. Антагоніст-жертва часто зображується під дією 
гравітації: обвисла шкіра, важкі нарости, що тягнуть до землі. Його поза має бути 
оборонною, а не атакуючою. Агресія таких персонажів часто пояснюється як 
територіальний інстинкт або панічна реакція на вторгнення гравця, що має бути 
відображено у візуальній експресії (наприклад, оскал, який виглядає як гримаса 
болю, а не посмішка хижака). 
Таким чином, методологія створення антагоніста-жертви базується на 
деконструкції звичних тропів «монстра». Дизайнер свідомо порушує природну 
гармонію форм, використовує палітру хвороби та інтегрує елементи 
техногенного насилля в анатомію істоти, щоб викликати у гравця почуття 
екологічної провини.  
  
2.3. Кольорознавство та композиційні прийоми для створення 
атмосфери напруги та моральної дилеми.  
Створення візуального образу відеогри, що піднімає складні екологічні та 
моральні питання, вимагає від дизайнера глибокого розуміння психофізіології 
сприйняття кольору та законів композиційної побудови кадру. Колір і композиція 
у геймдизайні перестають бути суто естетичними категоріями і набувають 
функції навігації, емоційного тригера та інструменту невербального наративу. 
Для досягнення атмосфери напруги та візуалізації моральної амбівалентності 
(неоднозначності) застосовуються специфічні колористичні схеми та 
композиційні зсуви, які свідомо порушують відчуття комфорту та гармонії.   
23 
 
Колористика екологічного занепаду: від теорії до практики. Класична 
теорія кольору, заснована на колі Йоганнеса Іттена, розглядає гармонійні 
поєднання (тріади, комплементарні пари) як засіб досягнення візуальної 
рівноваги [22]. Однак, для передачі атмосфери екологічної катастрофи та 
індустріального тиску, методологія дизайну передбачає використання 
дизгармонійних поєднань та десатурації.  
«Хвора палітра» та «Палітра Забруднення»: Замість чистих спектральних 
кольорів використовуються складні змішані відтінки, які у природі асоціюються 
з розкладом, окисленням або хворобою. Наприклад, такі як брудно-оливковий та 
жовто-сірий психологічно сприймаються як кольори застою, гниття, токсичних 
випарів. Вони викликають підсвідоме відчуття фізичної відрази, що є необхідним 
для емоційного забарвлення забруднених локацій. Іржаво-бурий та окислена мідь 
використовуються для текстурування індустріальних об'єктів, символізуючи 
старість та небезпеку техногенного середовища.  
Кольоровий скриптинг (Color Scripting): Це методика планування зміни 
кольорової гами в залежності від емоційної напруги сюжету. Для створення 
моральної дилеми ефективним є прийом інверсії очікувань, тобто традиційно 
«небезпечні» зони можуть кодуватися привабливими, але неприродними 
«кислотними» кольорами (неоновий фіолетовий, фосфорний зелений), що 
символізують мутацію, яка може бути візуально заворожуючою, але 
смертельною. Зони «безпеки» в постапокаліптичному світі часто позбавлені 
кольору (монохромні, сірі), що підкреслює самотність героя та відсутність життя.   
Композиційні прийоми створення напруги. Композиція у 2D-іграх (зокрема 
у жанрі метроїдванія) відповідає за керування увагою гравця та формування 
відчуття масштабу загрози. Для створення атмосфери тривоги використовуються 
прийоми, що порушують статичну рівновагу.  
Порушення правила третин та «Голландський кут»: Хоча у 2D-платформері 
камера зазвичай фіксована горизонтально, відчуття дезорієнтації досягається 
через геометрію рівня. Використання похилих ліній архітектури, завалених 
24 
 
горизонтів на задньому плані створює ефект нестабільності світу. Це змушує 
гравця відчувати підсвідому тривогу, оскільки мозок намагається «вирівняти» 
картинку.  
Домінування негативного простору (Negative Space): Композиційний 
прийом, при якому значна частина екрану залишається порожньою або темною, 
а персонаж займає мізерну площу. Це візуалізує вразливість героя перед величчю 
та ворожістю індустріального світу. У поєднанні з ефектом віньєтування це 
створює відчуття клаустрофобії або, навпаки, агорафобії, фокусуючи увагу на 
ізольованості персонажа.  
Контраст масштабів та силуетів: Для візуалізації моральної дилеми при 
зустрічі з ворогом використовується композиційний контраст. Якщо ворог займає 
більшу частину екрану, але його поза є статичною, згорбленою або захисною, це 
створює конфлікт між розміром (загроза) та мовою тіла (жертва). Гравець зчитує 
цей дисонанс як сигнал до сумніву: «Чи варто атакувати?».   
Світлотіньове моделювання (Chiaroscuro) у 2D. Робота зі світлом є 
найпотужнішим інструментом драматизації. У 2D-графіці використовується 
техніка імітації об'ємного освітлення для створення глибини та акцентів.  
Силуетне освітлення (Rim Light): Використання контрового світла дозволяє 
виділити контур персонажа на темному фоні. Це важливо для читабельності 
геймплею, але також надає образу таємничості.  
Жорсткі тіні: Індустріальне освітлення характеризується різкими, 
глибокими тінями. Це допомагає приховати деталі ворогів, залишаючи простір 
для уяви гравця (принцип «страх невідомого»), а також візуально «дробить» 
простір, роблячи його більш агресивним.  
Застосування описаних методів колористики та композиції дозволяє 
дизайнеру вийти за межі простого декорування ігрового простору. «Брудна» та 
холодна палітра стає візуальним текстом про екологічну трагедію, а дисбаланс у 
композиції провокує відчуття тривоги.  
  
25 
 
Висновки до другого розділу 
Розроблено методологічну базу для створення візуальної мови відеогри з 
екологічною проблематикою.  
Визначено, що візуалізація індустріального та постапокаліптичного 
середовища в 2D-графіці базується на принципах «навколишнього оповідання». 
Ключовими інструментами є робота з силуетом на макро-рівні, деталізація 
руйнувань на мікро-рівні та використання паралакс-ефекту для створення 
глибини простору.  
Сформульовано принципи психології сприйняття персонажа-антагоніста. 
Доведено, що для трансформації образу ворога з «абсолютного зла» на «жертву» 
необхідно використовувати деконструкцію природних форм, асиметрію та 
інтеграцію елементів техногенного сміття в анатомію істоти. Це дозволяє 
викликати у гравця емпатію та актуалізувати моральну дилему.  
Обґрунтовано вибір колористичних та композиційних рішень. 
Встановлено, що використання дизгармонійних, десатурованих палітр та 
порушення композиційної рівноваги є ефективними методами створення 
атмосфери напруги та трансляції екологічного наративу без використання слів.  
     
26 
 
РОЗДІЛ 3 
 
 
РОЗРОБКА ДИЗАЙН-КОНЦЕПЦІЇ ВІДЕОГРИ «UMBRION» 
 
3.1. Формування загальної концепції гри: сюжет, світ та моральний 
конфлікт. 
Розробка дизайн-концепції відеогри «Umbrion» базується на синтезі 
актуальної екологічної проблематики та жанрових особливостей метроїдванії. 
Проєкт спрямований на створення цілісного візуально-наративного продукту, 
який через ігрову взаємодію піднімає питання відповідальності людства перед 
довкіллям. В основу концепції покладено принцип «екологічного дзеркала»: 
ігровий світ та його мешканці є відображенням деструктивної діяльності 
індустріального суспільства.  
Семантика назви та ідейна основа. Назва проєкту - «Umbrion» - є 
семантичним ядром концепції, що поєднує в собі кілька смислових шарів. 
Етимологічно вона походить від латинського кореня umbra («тінь», «привид») та 
суфікса -ion, що позначає процес або стан.  
Мотив Тіні: Головний герой - безхатченко, який існує в «тіні» соціальної 
структури мегаполісу. Саме місто занурене в екологічну тінь - смог, що закриває 
сонце.  
Мотив Зародження: Фонетична співзвучність зі словом «ембріон» (embryo) 
символізує потенціал переродження світу. Сюжет гри розглядається як процес 
«виношування» нового світогляду: перехід від паразитарного ставлення до 
природи до симбіозу.  
Візуальний якір: Назва перегукується з англійським umbrella (парасолька), 
що є ключовим предметом у грі, виконуючи функції зброї та щита.  
Сеттинг: Індустріальний постапокаліпсис. Дія гри розгортається у 
вигаданому місті-державі, візуальна стилістика якого натхненна естетикою малих 
27 
 
японських промислових міст, доведеною до гротеску. Середовище 
характеризується щільною забудовою, вертикальністю архітектури та 
домінуванням індустріальних елементів (труби, кабелі, вентиляційні системи) 
над житловим простором. На основі розроблених ескізів локацій світ гри 
поділяється на умовні зони, що відображають ступінь деградації:   
Локація «Звалище».  
Ця зона є візуальною метафорою наслідків безвідповідального 
споживання. Накопичення промислових і побутових відходів формує хаотичний 
ландшафт, що підкреслює системний характер забруднення.  
Семантика: Демонстрація фізичної вразливості героя, який змушений 
виживати на «кладовищі» цивілізації.  
Геймдизайн: Хаотична структура сміттєвих гір створює ідеальні умови для 
вертикального платформінгу та пошуку прихованих маршрутів.  
Екологічний аспект: Контраст між мертвим техногенним ґрунтом та 
мутованими біологічними елементами, що адаптувалися до життя у бруді, 
візуалізує деградацію біосфери.  
Локація «Завод». Відкрита індустріальна зона, що репрезентує джерело 
екологічного конфлікту. Архітектоніка локації (трубопроводи, димарі, 
резервуари) формує образ гіганта, що виснажує природні ресурси.  
Семантика: Завод візуалізує економічні причини забруднення та 
демонструє масштаб промислової машини.  
Геймдизайн: Ритмічні небезпечні зони (механізми, токсичні викиди) 
вимагають від гравця таймінгу та уважності.  
Наратив: Потужний техногенний фон дозволяє контекстуалізувати появу 
морських істот саме тут - як реакцію природи на агресивну виробничу діяльність.  
Локація «Цех».  
Внутрішній сегмент промислового комплексу, який слугує переходом від 
зовнішніх зон до ядра виробництва. Це простір концентрації технологічних 
ризиків.  
28 
 
Семантика: Локація підкреслює тему соціальної невидимості токсичного 
виробництва - процеси, приховані за стінами, завдають найбільшої шкоди. 
Геймдизайн: Зміна масштабу. На відміну від відкритого Заводу, Цех пропонує 
щільніший геймплей з акцентом на точність рухів серед конвеєрів, прес-машин 
та підвісних кранів.  
Екологічний аспект: Тут демонструється безпосередній процес переробки 
та утворення відходів, що дозволяє гравцеві прослідкувати причиннонаслідковий 
зв'язок між технологією та екологічною катастрофою.  
Локація «Темний ліс».  
Зона, що виконує роль просторової та емоційної паузи між індустріальними 
секторами. Це залишки природи, яка вижила, але зазнала незворотних змін.  
Семантика: Ліс не є ідеалізованою пасторальною альтернативою місту; це 
амбівалентний простір, деформований кризою. Темна палітра підкреслює, що 
навіть природа тут є «хворою».  
Функціональність: Локація містить Торговця - ключового NPC для 
економічної взаємодії та прокачки персонажа.  
Візуальний контраст: Зіставлення органічних форм лісу з геометрією 
заводу підсилює відчуття конфлікту між природним та штучним.  
Наративна структура та Система персонажів. Сюжет гри будується навколо 
подорожі головного героя - Безхатька. В нього немає імені. Його образ 
позбавлений героїчного пафосу: це маргіналізована особа в зношеному одязі, чиє 
обличчя приховане в тіні капюшона. Таке дизайнерське рішення дозволяє 
гравцеві легше асоціювати себе з персонажем. Його єдина зброя - парасолька, що 
концептуально підкреслює тему захисту, а не нападу.  
Система персонажів включає три ключові групи, що уособлюють сторони 
конфлікту:  
• Протагоніст (Безхатько): Медіатор між світом людей і світом природи.  
29 
 
• Антагоністи-жертви (Мутована фауна): Морські істоти, що вийшли на 
сушу. Їхня агресія є вимушеною реакцією на руйнування їхнього 
середовища існування.  
• Істинні антагоністи (Корпоративна система): Уособленням цієї сили 
виступає Агент - персонаж у строгому костюмі та капелюсі. Його дизайн 
(чисті лінії, стерильність, зброя вогнепального типу) контрастує з 
«органічним брудом» решти світу, символізуючи холодний, бездушний 
контроль.  
Моральна дилема як центральна механіка. Унікальність концепції 
«Umbrion» полягає в сюжетному зламі, який реалізується через механіку 
інтерактивного коміксу всередині гри.   
Інтерактивна драматургія: Комікс як точка біфуркації сюжету. Ключовим 
інструментом реалізації моральної проблематики у грі виступає механіка 
«інтерактивного коміксу», яка інтегрована у структуру геймплею як 
кульмінаційна точка наративу. Це не просто засіб подачі сюжету, а психологічний 
тригер, що змушує гравця переосмислити свої дії. (див. Рис 3.1) 
 
30 
 
Рис.3.1 Сценарна розкадровка механіки 
морального вибору (інтерактивний комікс) 
Сценарна структура цього епізоду побудована на принципі руйнування 
очікувань. Гравець, керуючи головним героєм, звично перемагає чергову морську 
істоту, діючи в парадигмі «захисту від монстрів». Наративна напруга зростає, 
коли герой помічає спостерігача, що ховається за рогом будинку. Спрацьовує 
інерція ігрового досвіду: протагоніст ідентифікує силует як чергову загрозу і 
рішуче прямує до цілі для її ліквідації. Проте при наближенні відбувається 
візуальна деконструкція образу ворога: герой бачить не агресора, а беззахисну 
дитину морського монстра, на обличчі якої читається страх і сльози.  
31 
 
У цей момент гра зупиняє динамічний екшн і пропонує гравцеві бінарний 
вибір, що визначає фінал історії та моральний посил твору:  
• Вибір «Атака» (Шлях Системи): Гравець піддається інерції насилля і 
знищує дитину. Сюжет продовжується лінійно: герой залишається 
інструментом в руках корпоративної машини, продовжуючи винищення 
морських істот. Це призводить до «Поганої кінцівки»: система перемагає, 
світ залишається екологічно деградованим, брудним та позбавленим надії 
на відновлення.  
• Вибір «Вислухати» (Шлях Емпатії): Гравець долає стереотип і вступає в 
діалог. Дитина розкриває істинні причини вторгнення: агресія морських 
істот є вимушеним кроком відчаю, оскільки люди знищили їхні підводні 
домівки токсичними відходами. Ця інформація стає каталізатором 
трансформації героя. Він змінює сторону конфлікту, об’єднується з 
морськими істотами проти корпоративної системи. Це веде до «Доброї 
кінцівки»: перемога над корпорацією, встановлення миру між видами та 
спільна робота над відновленням екології, що зрештою дозволить істотам 
повернутися у природне середовище.  
Сценарій розвитку подій має три фази:  
Фаза 1: Виживання. Гравець сприймає мутованих істот як монстрів. 
Завдання - захистити себе. Вороги, такі як «Альгає» (істота з водоростей та 
мазуту) або «Краброн» (краб, обплутаний сміттям), атакують героя, і гравець 
змушений відповідати насильством.  
Фаза 2: Усвідомлення. У певний момент гри, візуалізований у сцені коміксу, 
герой стає свідком того, як корпоративні війська знищують беззахисних істот або 
ж знаходить докази того, що агресія монстрів - це біль, а не злість. Наприклад, 
дизайн ворога «Риби-Кої», зв'язаних пластиковим тримачем, прямо вказує на 
страждання.  
Фаза 3: Вибір. Гравцеві надається вибір: продовжувати «зачистку» (шлях 
Корпорації) або спробувати зрозуміти істот. Обравши другий шлях, гравець 
32 
 
відкриває нові механіки взаємодії, наприклад, можливість звільнити ворога від 
сміття замість вбивства, а колишні вороги стають ситуативними союзниками у 
боротьбі проти Агента та системи.  
Інтеграція екології в ігровий процес. Екологічна проблематика у грі не є 
фоновою, вона інтегрована в геймплей через систему «Довідника монстрів» 
(Monster Manual). Це UI-елемент, який заповнюється по мірі дослідження світу.  
Спочатку записи описують ворогів як загрозу (статистика шкоди, вразливості). 
Однак, після сюжетного зламу, інформація оновлюється, розкриваючи трагічну 
історію мутації кожного виду, наприклад, що броня «Мурени-солдата» зроблена 
зі сміття через необхідність захисту від токсинів.  
Візуально-стилістична ідентифікація проєкту. Для цілісного втілення 
закладених смислів обрано специфічну візуальну мову, що базується на естетиці 
інтерактивного графічного роману. Стилістика гри «Umbrion» характеризується 
використанням 2D-графіки з акцентованим силуетним рішенням та товстим 
контуром фіксованої товщини. Таке художнє рішення виконує подвійну функцію:  
Ергономічна функція: У візуально насиченому, «шумному» середовищі 
індустріальних локацій, наповненому деталями сміття та механізмів, жирний 
контур дозволяє миттєво відокремити інтерактивні об'єкти (персонажа, ворогів, 
платформи) від статичного фону. Це забезпечує високу читабельність геймплею, 
що є критичним для жанру метроїдванія.  
Семантична функція: Стилізація під комікс підкреслює умовність ігрового 
світу, дозволяючи дизайнеру використовувати гротескні форми мутацій 
(гіпертрофовані органи, неприродні пропорції) без ризику викликати у глядача 
фізіологічну відразу, яка могла б виникнути при фотореалістичному зображенні. 
Це дозволяє зберегти фокус на емоційному співчутті до «монстрів», а не на огиді 
до них.  
Колористична концепція «Токсичної гармонії». Колірне рішення гри 
побудовано на принципі обмеженої палітри, що візуалізує стан екологічного 
лиха. Домінуючими є приглушені холодні та брудні відтінки. Ця гама створює 
33 
 
атмосферу індустріальної ночі, смогу та занепаду. На цьому тлі 
використовуються активні сигнальні акценти:  
Яскраво-білий колір: Використовується виключно для очей персонажів (як 
протагоніста, так і мутантів). Це створює потужний візуальний зв'язок між героєм 
та його ворогами, натякаючи на їхню спільну природу - всі вони є живими 
істотами, що намагаються вижити у темряві. Білі очі на темних силуетах також 
символізують «сліпоту» системи та пошук істини.  
Відсутність градієнтів: Використання локальних заливок та жорстких тіней 
підсилює графічність зображення та драматизм освітлення, відповідаючи 
загальному настрою напруги та небезпеки.  
Символізм ігрових механік: Парасолька як інструмент адаптації. 
Центральним елементом геймдизайну є нестандартний вибір основного 
інструмента головного героя - парасольки. У контексті екологічної концепції цей 
побутовий предмет трансформується у багатозначний символ:  
• Парасолька як Щит: Первинна функція парасольки - захист від негоди. 
У світі гри, де дощ є токсичним, а середовище - агресивним, парасолька 
стає символом збереження особистого простору безпеки посеред 
всеохоплюючого бруду. Це підкреслює початкову мотивацію героя - 
виживання, а не завоювання.  
• Парасолька як Зброя: Трансформація захисного предмета у зброю 
(швидкий удар, важкий удар) ілюструє здатність героя адаптуватися до 
ворожих умов. Це візуальна метафора того, як мирна природа або 
людина під тиском обставин змушена ставати небезпечною.  
• Швидкий удар: Базова атака з мінімальною затримкою символізує 
рефлекторну реакцію на загрозу.  
• Важкий удар: Атака з довшою анімацією та підвищеним пошкодженням 
візуалізує накопичену силу опору та відчаю.  
Таким чином, сформована дизайн-концепція «Umbrion» є цілісною 
багаторівневою структурою, де наратив, візуальна стилістика та ігрові механіки  
34 
 
працюють синергічно. Кожен елемент дизайну не є випадковим, а слугує 
інструментом розкриття центральної теми - відповідальності за світ, у якому ми 
живемо.  
  
3.2. Розробка персонажів: візуалізація головного героя та система 
дизайну ворогів-мутантів.  
Візуалізація протагоніста: образ Безхатька. Розробка візуального образу 
Головного героя стала відправною точкою для формування всієї стилістики 
проєкту «Umbrion». Враховуючи жанрову специфіку (метроїдванія) та наративну 
проблематику (соціальна нерівність на тлі екологічної катастрофи), було 
відкинуто традиційні архетипи «героя-воїна» або «обраного». Натомість, в 
основу дизайн-концепції покладено архетип «вигнанця» - особи, яка витіснена на 
маргінеси соціуму, але завдяки цьому зберегла здатність бачити приховану 
сутність речей.  
Образ Безхатька розроблено як візуальну метафору вразливості людини 
перед техногенною машиною (рис. 3.2). 
Рис. 3.2 Концепт-арт Головного героя 
(Безхатька) 
35 
 
Дизайн-рішення базуються на таких ключових аспектах:  
Силует та формоутворення: Принцип «Закритого трикутника». У дизайні 
персонажів для 2D-ігор силует є первинним ідентифікатором, який має 
зчитуватися миттєво. Для Безхатька обрано компактний, стійкий силует, що 
вписується у форму трикутника з широкою основою.  
Статика: У спокійному стані фігура героя виглядає згорбленою, 
«закритою». Масивний капюшон та об’ємний шарф візуально збільшують 
верхню частину тіла, створюючи ефект «черепахи», що ховається у панцир. Це 
підкреслює захисний характер персонажа - він не шукає конфлікту, а намагається 
відгородитися від агресивного середовища. Динаміка: Під час руху силует стає 
стрімким. Розвіяні поли куртки та шарф додають лінії дії (line of action) 
необхідної експресії, візуалізуючи швидкість та спритність, необхідні для 
виживання у місті.  
Деперсоналізація та Лицьова зона. Свідомим дизайнерським рішенням 
стала повна відмова від деталізації обличчя. Голова персонажа прихована 
глибоким капюшоном, у тіні якого відсутні будь-які риси - ніс, рот чи мімічні 
зморшки.  
Акцент на очах: Єдиним елементом на чорному «полотні» обличчя є 
яскраво-білі, сяючі очі. З точки зору психології сприйняття, це створює ефект 
«дзеркала»: гравець може спроектувати власні емоції на персонажа. 
Семантичний зв’язок: Білі очі без зіниць візуально споріднюють Безхатька з 
мутованими істотами (ворогами), які мають аналогічне рішення очей. Це тонкий 
візуальний натяк на те, що і герой, і монстри є дітьми одного світу, жертвами 
однієї екологічної трагедії, що готує підґрунтя для сюжетного зламу та вибору 
«Емпатії».  
Костюм та Атрибутика: Утилітарність виживання. Одяг Безхатька 
спроєктовано за принципом функціонального колажу (kitbashing), характерного 
для жителів постапокаліптичних світів. Кожен елемент гардероба має практичне 
призначення, продиктоване умовами забрудненого мегаполіса:  
36 
 
Багатошаровість: Герой одягнений у кілька шарів одягу (футболка, светр, 
куртка-парка). Це вказує на нестабільність клімату та необхідність захисту шкіри 
від токсичних опадів. Текстура тканин передає зношеність - потертості, латки, 
нерівні краї, що свідчить про тривале використання та бідність.  
Шарф-маска: Об’ємний шарф, що закриває шию та нижню частину 
обличчя, виконує роль імпровізованого респіратора. Це прямий маркер 
забрудненого повітря.  
Взуття: Масивні черевики з товстою підошвою візуально «заземлюють» 
персонажа. У контексті геймплею платформеру це важливо для відчуття ваги 
персонажа при приземленні.  
Колористичне рішення. Палітра Безхатька розроблена так, щоб він 
гармонійно вписувався в середовище, але не губився в ньому.  
Основний колір: Темний графітовий та глибокий фіолетовий. Ці кольори 
символізують тінь, непомітність, мімікрію під нічне місто.  
Додатковий колір: Брудно-бордовий або приглушений пурпуровий (шарф, 
елементи куртки). Цей колір додає образу драматизму і благородства, 
відрізняючи героя від сіро-зеленого оточення та ворогів. Рожевий колір парасолі 
додає образу головного героя комічності.  
Контраст: Використання товстого чорного контуру забезпечує чітке 
відділення спрайта персонажа від деталізованих фонів локацій.  
Дизайн ключового інструмента: Парасолька. Парасолька є унікальним 
візуальним та геймплейним ідентифікатором Безхатька. Її дизайн поєднує 
побутову форму з бойовою функціональністю (рис 3.3). 
Форма: У складеному стані парасолька має видовжений, масивний силует, 
що нагадує моргенштерн (коротку булаву). У режимі важкої атаки парасоля 
видовжується, що робить удар сильнішим, але повільнішим, та в цей час парасоля 
нагадує вже велику булаву.  Це візуалізує потенційну загрозу. У розкритому стані 
вона набуває куполоподібної форми, перетворюючись на щит.  
37 
 
Матеріальність: Текстура купола парасольки зображується як зміцнена 
тканина, здатна витримати кислотний дощ та фізичні удари.  
Анімаційний потенціал: Дизайн парасольки передбачає широку 
варіативність анімацій. Вона може використовуватись  як парашут для 
планерного спуску та як бар’єр для блокування атак. Це робить предмет 
продовженням тіла героя, підкреслюючи його винахідливість. 
Рис. 3.3 Варіативність анімацій 
парасольки, як зброї та як щита 
Висновок до образу. Візуалізація Безхатька вирішує складне завдання: 
створити героя, який виглядає слабким і вразливим, але діє як сильний і спритний 
боєць. Цей дисонанс працює на посилення емпатії гравця, який відчуває, що 
керує не супергероєм, а живою людиною, яка бореться за право на існування у 
вмираючому світі.  
Для розширення наративного контексту та візуалізації соціальної 
структури ігрового світу розроблено образи ключових неігрових персонажів 
(NPC) - Купця та Агента. Їхній дизайн побудований на принципі контрасту: 
Купець репрезентує хаотичну адаптацію до умов звалища, тоді як Агент 
уособлює стерильний порядок корпоративної системи. 
Купець: Естетика гротескного виживання. Цей персонаж виконує функцію 
економічного хабу гри. Його візуальний образ вирішено як еклектичний набір 
елементів, що підкреслює його пристосуванство (рис 3.4) 
38 
 
Голова-шолом: Найвиразнішою деталлю є «шолом» Не зрозуміло, чи він 
зроблений з висушеної голови велетенської риби, чи це і є голова Купця. Це 
створює ефект «подвійного обличчя» і робить образ водночас комічним та 
моторошним. Круглі окуляри (goggles) додають інженерного, стімпанкового 
характеру. 
Атрибутика: Величезний рюкзак за спиною візуалізує тягар накопичення 
ресурсів. Яскраві сині гумові рукавички та чоботи контрастують із загальною 
брудною гамою одягу, вказуючи на те, що персонаж постійно контактує з 
токсичними речовинами або розбирає небезпечне сміття. 
Силует: Згорблений, перевантажений деталями силует Купця транслює 
ідею, що в цьому світі виживання можливе лише через постійний пошук та обмін 
залишками цивілізації. 
Рис 3.4 Візуалізація NPC «Купця» 
 
Агент: Уособлення Системи. Агент виступає головним ідеологічним та 
сюжетним антагоністом у другій половині гри. Його дизайн свідомо 
протиставлений всій решті візуальної екосистеми «Umbrion» (рис 3.5). 
39 
 
Геометрія та Чистота: Якщо світ гри та його мешканці складаються з 
ламаних ліній, бруду та текстур, то Агент - це ідеальна геометрія. Його одяг - 
строгий сірий костюм, краватка, плащ і капелюх-федора - має чисті, прямі лінії. 
Він виглядає неприродно стерильним серед бруду, що символізує чужорідність 
корпоративної логіки живим процесам природи. 
Безособовість (Facelessness): Обличчя Агента вирішене як абсолютна 
чорна пляма (void) без жодних рис, на якій світяться лише білі очі. Це дегуманізує 
персонажа, перетворюючи його з конкретної людини на функцію, бездушний 
інструмент контролю. 
Зброя: На відміну від імпровізованої зброї інших персонажів (парасолька, 
знаки), Агент озброєний стандартним вогнепальним пістолетом. Це підкреслює 
технологічну перевагу та холодну, розважливу агресію Системи. 
Рис 3.5 Концепт-арт NPC «Агент» 
 
Система дизайну антагоністів: Естетика мутації та екологічний наратив 
Розробка візуальних образів антагоністів (ворогів) для гри «Umbrion» виходить 
за межі традиційного створення перешкод для гравця. У контексті екологічної та 
40 
 
моральної проблематики проєкту кожен ворог розглядається як «живий доказ» 
злочину індустріальної цивілізації проти природи. Головним методологічним 
принципом дизайну стала концепція «Інтегрованої деформації»: елементи 
антропогенного забруднення (пластик, мазут, метал) не є зовнішніми 
аксесуарами, а стали невід’ємною частиною анатомії істот, змінивши їхню 
фізіологію та моторику.  
Такий підхід дозволяє реалізувати механіку морального вибору: гравець 
спочатку зчитує візуальний код «монстра» (потворність, агресія), але згодом, 
через деталі дизайну, розпізнає код «жертви» (біль, обмеження руху, каліцтво).  
Нижче наведено детальний аналіз дизайн-рішень для чотирьох ключових 
архетипів ворогів.  
Альгає: Втілення аморфної загрози. Цей тип ворога репрезентує стихію 
забрудненої води та органічного розкладу (рис 3.6). 
Формоутворення та Силует: Дизайн базується на відмові від чіткої 
скелетної структури. Силует персонажа - масивний, «стікаючий» донизу, що 
візуалізує важкість мокрого мулу та нафти. Волокниста текстура поверхні імітує 
скупчення мертвих водоростей та сміття, що злилися в єдину біомасу. 
Відсутність чітко окреслених кінцівок (пальців, ліктів) створює ефект 
непередбачуваності руху - істота виглядає як жива хвиля бруду.  
Колористика: Домінуюча гама - брудно-оливковий (колір цвітіння води) у 
поєднанні з глибоким чорним (колір мазуту). Таке поєднання викликає 
інстинктивну відразу, асоціюючись із токсичністю та задухою.  
Семіотика обличчя: Чорна «маска» на місці обличчя, з якої тече в’язка 
рідина, та яскраво-білі очі створюють візуальну риму з образом Головного героя. 
Це важливий наративний елемент: він натякає на те, що і герой, і монстр є 
продуктами одного середовища, хоча й знаходяться по різні боки барикад.  
 
41 
 
Рис 3.6 Візуалізація антагоніста «Альгає» 
 
Риби-Кої: Символ втраченої гармонії. Дизайн цього ворога є найбільш 
емоційно навантаженим образом у грі, що візуалізує проблему пластикового 
забруднення світового океану (рис 3.7) 
Композиційне рішення: Персонаж спроєктований як парна сутність. Дві 
риби-кої - чорна та біла - відсилають до східної філософії Інь і Ян, символізуючи 
природний баланс. Однак цей баланс порушено: фігури насильницьки з’єднані 
пластиковим тримачем для банок (six-pack ring), який врізався в їхні тіла.  
Анатомія мутації: Риби мають антропоморфні тіла (ноги, руки), що вказує 
на вимушену еволюцію - необхідність вийти на сушу, оскільки вода стала 
непридатною для життя. Обривки одягу (шорти) на персонажах підкреслюють 
їхню жалюгідну спробу адаптуватися до людського світу або ж є залишками 
сміття, яке вони намагалися використати як захист. Кінематика: Пластикове 
кільце диктує характер руху - риби змушені рухатися синхронно, смикаючи одна 
одну. Цей візуальний образ фізичного страждання є ключовим аргументом для 
зміни ставлення гравця з агресії на емпатію.  
42 
 
Рис 3.7 Дизайн ворогів «Риби-Кої» 
 
Краброн (Crabron): Біомеханічний танк. Представник класу «важких» 
ворогів, дизайн якого базується на поєднанні природної броні (хітин) та 
індустріальних відходів (рис 3.8). 
Силует та Пропорції: Персонаж має приземкуватий, широкий силует, що 
вписується у форму квадрата або овалу. Гіпертрофовані клешні займають близько 
40% візуальної маси, сигналізуючи гравцеві про високу небезпеку ближнього 
бою. Велетенський панцир нагадує каску або башту танка, що вказує на потужну 
захисну опцію.  
Інтеграція сміття: Тіло краба туго перетягнуте зеленими промисловими в 
поєднанні з мертвими водоростями. Візуально це виглядає не як прикраса, а як 
бандаж, що стримує панцир від розпаду або, навпаки, обмежує ріст істоти, 
завдаючи їй болю.  
Текстура та Колір: Використання іржаво-червоного кольору для хітину 
створює цікаву візуальну гру: він нагадує одночасно і природний колір 
ракоподібних, і колір корозії металу. Темні плями та нарости на панцирі 
підсилюють ефект «хворої» броні. 
 
43 
 
Рис 3.8 Концепт-арт «Краброна» 
Мурена-солдат: Естетика спротиву. Цей персонаж демонструє найвищий 
щабель еволюції мутантів - появу соціальної організації та інтелекту. Дизайн 
візуалізує перехід від хаотичного виживання до організованого опору (рис 3.9). 
Архетип: Візуальний образ базується на архетипі «партизана» або 
«ополченця». Гуманоїдна постава, наявність одягу та зброї вказують на наявність 
свідомості. Голова мурени з характерною витягнутою щелепою додає образу 
агресивної хижості.  
Спорядження: «Військова форма» персонажа повністю скомпільована зі 
сміття. Це демонструє здатність мутантів використовувати ресурси ворога проти 
нього самого.  
Зброя-символ: Мурена озброєна уламками дорожніх знаків («В’їзд 
заборонено», «Поступися дорогою»). Це приклад глибокої іронії в дизайні: знаки, 
створені людьми для регулювання порядку та встановлення правил, тепер 
використовуються природою як фізична зброя для встановлення власних 
кордонів. Знак «Стоп» (цеглина) функціонує як дробильна зброя, а трикутний 
знак - як сокира.  
 
44 
 
Рис 3.9 Візуалізація «Мурени-солдата» 
Висновки до системи персонажів. Розроблена система антагоністів формує 
чітку візуальну ієрархію загрози та сенсів. Використання спільної стилістики 
(товстий контур, брудна палітра, білі очі) об’єднує їх у єдину фракцію 
«Природи». Водночас, унікальні деталі кожного виду (пластик у риб, кабелі у 
краба, знаки у мурени) розповідають окремі мікро-історії про різні аспекти 
екологічної кризи (забруднення води, пластик, мілітаризація конфлікту), що 
дозволяє реалізувати наративний потенціал гри через візуальні засоби.  
  
  
45 
 
3.3. Дизайн ігрового середовища та локацій: стилістика забрудненого 
індустріального міста.  
Загальні принципи організації візуального простору Створення 
переконливого ігрового світу в проєкті «Umbrion» базується на відмові від 
фотореалістичної імітації дійсності на користь виразної художньої стилізації.  
Організація візуального простору підпорядкована головній меті - зануренню 
гравця у стан психологічного дискомфорту, викликаного спогляданням наслідків 
екологічного колапсу. Для реалізації цього завдання розроблено систему 
художньо-композиційних принципів, що визначають архітектоніку, пластику та 
глибину кожної локації.  
Стилістична домінанта: «Індустріальний гротеск». Візуальну мову гри 
можна визначити як «індустріальний гротеск» з елементами нуару. Цей стиль 
характеризується свідомим порушенням пропорцій архітектурних об'єктів задля 
посилення їхнього емоційного впливу.  
Гіперболізація техногенного: Труби, кабелі, вентиляційні шахти та несучі 
конструкції зображуються перебільшено масивними порівняно з фігурою 
головного героя. Це створює візуальну ієрархію, де людина (гравець) займає 
підлегле, вразливе становище відносно створеної нею ж Техносфери.  
Контурність та Графічність: Згідно з обраною арт-дирекшном, всі об'єкти 
середовища мають чіткий, товстий контур сталої товщини. Таке рішення, 
запозичене з естетики коміксів, дозволяє уніфікувати різнорідні елементи в єдину 
візуальну площину, забезпечуючи цілісність сприйняття кадру [23].  
Побудова глибини простору: Технологія багатошарового паралаксу. 
Оскільки гра «Umbrion» реалізується у двовимірному просторі (2D side-scroller), 
критично важливим завданням є створення ілюзії об'єму та глибини. Для цього 
застосовано методику розділення ігрової сцени на планові шари, які рухаються з 
різною швидкістю відносно камери. Структура сцени включає чотири основні 
плани:  
Передній план: Силуетні, затемнені об'єкти (звисаючі дроти, арматура, 
купи сміття), що знаходяться безпосередньо перед «камерою». Вони створюють 
46 
 
ефект «підглядання» та візуально обрамляють сцену, посилюючи відчуття 
тісноти та клаустрофобії.  
Ігровий план: Зона безпосередньої взаємодії, де знаходиться персонаж та 
платформи. Цей шар характеризується максимальною деталізацією текстур та 
чіткістю контурів для забезпечення читабельності геймплею.  
Другий план: Об'єкти інфраструктури (будівлі, паркани), що знаходяться 
безпосередньо за ігровою зоною. Вони мають меншу контрастність і слугують 
контекстним фоном.  
Дальній план: Панорама мегаполісу, вирішена через силуети заводських 
труб та хмарочосів. Тут застосовано прийом «повітряної перспективи»: об'єкти 
набувають відтінку кольору неба (димно-фіолетового або брудно-сірого) та 
втрачають деталізацію, що створює відчуття гігантського масштабу забрудненого 
міста [17].  
Ритмічна організація та Геометрія ліній. Композиційна побудова локацій 
базується на домінуванні вертикальних ритмів. Численні вертикальні лінії 
(димарі, опори мостів, звисаючі ланцюги, потоки дощу) візуально «розрізають» 
простір, створюючи ефект ґрат. Це підсвідомо формує у гравця відчуття 
ув'язнення, неможливості втечі з цього світу. Горизонтальні лінії, що зазвичай 
асоціюються зі спокоєм та стабільністю, у грі «Umbrion» зображуються 
ламаними, похилими або переривчастими (зруйновані мости, купи сміття). Ця 
деконструкція горизонту візуалізує нестабільність та занепад світу.  
Принцип «Візуального шуму» та Зони відпочинку. Для передачі атмосфери 
сміттєзвалища та занедбаності використовується висока щільність деталізації - 
текстури іржі, тріщини, дрібне сміття. Щоб уникнути візуального 
перевантаження гравця, застосовується принцип чергування зон:  
Зони шуму: Ділянки з високою концентрацією деталей, які наративно 
розповідають про хаос (наприклад, гора брухту).  
47 
 
Зони тиші: Ділянки з мінімальною деталізацією (гладкі стіни, темні 
провали, туман), що дають оку відпочити і дозволяють сфокусуватися на 
персонажі [24].  
Світлотіньова драматургія. Освітлення у грі не є натуралістичним; воно 
виконує навігаційну та емоційну функцію.  
Контраст: Використання різкого контрасту між глибокими тінями та 
плямами світла. Тіні приховують кути локацій, створюючи напругу («що там 
ховається?»), тоді як світло акцентує увагу на інтерактивних об'єктах.  
Джерела світла: Усі джерела світла у грі мають чітку семантику. Холодне, 
"мертве" світло асоціюється з техногенним світом та небезпекою. Тепле, "живе" 
світло  маркує рідкісні острівці безпеки [25].  
Таким чином, загальні принципи організації візуального простору гри 
«Umbrion» спрямовані на створення сугестивного середовища, яке не потребує 
текстових пояснень для трансляції ідеї екологічної катастрофи. Кожен елемент - 
від товщини лінії до глибини тіні - працює на створення цілісного образу 
вмираючого індустріального світу.  
Візуалізація індустріального простору: Локації «Завод» та «Звалище» 
Візуальне вирішення промислових зон базується на естетиці техногенного тиску.  
Ці локації демонструють різні стадії виробничого циклу: від активної 
експлуатації ресурсів до накопичення відходів.  
Локація «Завод»: Екстер'єр та Вертикальність. Локація візуалізує відкритий 
простір промислового комплексу, де гравець пересувається по зовнішніх 
конструкціях. (Рис. 3.10) 
Композиція та Архітектоніка: Сцена побудована на жорсткій геометрії 
металевих конструкцій. Домінуючим елементом середнього плану є масивна 
горизонтальна платформа-міст з фермовою конструкцією (truss structure), що 
задає лінійний вектор руху. Вертикальний ритм створюється масивними 
ланцюгами, що звисають зверху, та вертикальними лініями архітектури на 
48 
 
задньому плані. Це створює ефект «клітки», навіть попри те, що дія відбувається 
на відкритому повітрі.  
Колористика: Палітра локації стримана, «курна». Переважають приглушені 
відтінки сіро-фіолетового та брудно-коричневого кольорів, що імітує атмосферу 
густого промислового смогу, який забарвлює небо. Відсутність яскравого 
сонячного світла підкреслює похмурість світу «Umbrion».  
Деталізація: Фонові силуети цехів розмиті (ефект повітряної перспективи), 
що додає сцені масштабу, тоді як передній план (іржаві балки, каміння) має чіткий 
контур, забезпечуючи читабельність платформ.  
Рис.3.10 Локація «Завод» 
 
Локація «Звалище»: Індустріальний могильник. Всупереч традиційному 
зображенню звалища як відкритого поля, у даній концепції воно вирішене як 
величезний критий ангар або цех переробки, що підсилює відчуття 
клаустрофобії. (Рис 3.11) 
Освітлення та Контраст: Ключовим художнім засобом тут є холодне, 
«мертве» світло. Величезне решітчасте вікно на задньому плані випромінює 
49 
 
яскраве біло-блакитне світло, яке контражуром виділяє силуети сміття. Це 
створює ефект «холодильника» або моргу для техніки.  
Наповнення сцени: Нижню частину кадру займають нагромадження 
спресованих автомобілів, шин та металобрухту. Вони утворюють складний, 
хаотичний рельєф для пересування персонажа. Використання темних, майже 
чорних силуетів на передньому плані дозволяє уникнути візуального шуму, 
фокусуючи увагу на формі, а не на текстурі сміття.  
Вертикальні акценти: Зі стелі звисають масивні промислові гаки та 
ланцюги, що додає сцені агресивності та небезпеки.  
 
Рис.3.11 Локація «Звалище» 
 
Візуалізація інтер'єрних та буферних зон: «Цех» та «Темний ліс» Ці локації 
працюють на контрасті температур (тепле/холодне) та форм  
(геометричні/органічні).  
50 
 
Локація «Цех»: Внутрішній простір виробництва. Інтер'єр заводу візуально 
вирішений як «гаряча» зона, де відбувається активна робота механізмів. (Рис 
3.12) 
Колористика та Світло: На відміну від холодного Звалища, тут домінує 
тепле, насичене помаранчеве світло, що ллється з трьох велетенських аркових 
вікон на задньому плані. Цей колір асоціюється з розпеченим металом, іржею та 
напругою. Стіни мають виражену текстуру цегляної кладки, що додає локації 
історичної «ваги».  
Композиція: Сцена має чітку симетричну структуру завдяки ритму вікон та 
колон. Труби, що проходять вздовж стін, та стельові ферми «замикають» простір, 
створюючи ефект «коробки». Темні кути (віньєтування) фокусують погляд гравця 
на освітленому центрі, де відбувається екшн.  
 
Рис.3.12 Локація «Цех» 
 
51 
 
Локація «Темний ліс»: Постапокаліптична природа. Ця зона є буферною 
між індустріальними секторами. Вона демонструє, як природа виживає в тіні 
мегаполісу. (Рис. 3.13) 
Атмосфера та Палітра: Локація занурена у глибоку ніч. Основний колір - 
темно-синій та фіолетовий. На задньому плані чорніють силуети заводських труб, 
нагадуючи, що втекти від міста неможливо.  
Силуетна графіка: Дерева на передньому плані вирішені як чорні, 
деталізовані силуети. Їхні гілки виглядають колючими та сухими, що підкреслює 
хворобливий стан екосистеми.  
Фокусний центр: Єдиним джерелом теплого світла та безпеки є багаття, 
біля якого стоїть Купець. Яскраво-помаранчевий вогонь створює затишний 
острівець посеред холодної темряви, візуально запрошуючи гравця до 
перепочинку. Це класичний прийом контрасту температур для керування 
емоційним станом гравця.  
 
Рис.3.13 Локація «Темний ліс» 
 
52 
 
Аналіз графічних рішень демонструє, що кожна зона має свій унікальний 
колірний код (Завод - фіолетовий/сірий, Звалище - синій/чорний, Цех - 
помаранчевий/цегляний, Ліс - темно-синій). Це забезпечує чудову навігацію та 
різноманітність візуального досвіду, зберігаючи при цьому єдину стилістику 
похмурого, графічного світу гри «Umbrion».  
  
3.4. Розробка айдентики та інтерфейсу: візуальна ідентифікація 
ігрового світу.  
Семантика та композиційна побудова логотипу Розробка системи 
візуальної ідентифікації (айдентики) для відеогри є критично важливим етапом 
дизайн-проєктування, оскільки логотип виступає основним комунікатором 
бренду, формуючи перше враження у потенційної аудиторії. Для проєкту 
«Umbrion» було поставлено завдання створити знаковий образ, який би не лише 
відповідав жанровим канонам метроїдванії, але й на символічному рівні 
транслював ключову проблематику гри - екологічний занепад та моральну 
дилему героя.  
Вербальна ідентифікація: Етимологія та Фоносемантика. Назва проєкту - 
«Umbrion» - є результатом семантичного синтезу, спрямованого на створення 
унікального лексичного коду гри. Це штучно утворений неологізм, що базується 
на поєднанні латинського кореня umbra («тінь», «привид», «темрява») та суфікса 
-ion, що у європейських мовах позначає процес, стан або результат дії. 
Семантичне поле назви розкривається через три асоціативні рівні:  
Архетип Тіні: Назва прямо вказує на візуальну домінанту гри - темряву, ніч 
та смог, що закриває сонце. Герой (Безхатько) також є фігурою, що існує в «тіні» 
соціуму, на маргінесах індустріального міста.  
Фонетична алюзія на «Ембріон» (Embryo): Звукова подібність слів 
«Umbrion» та «ембріон» закладає глибокий філософський підтекст. Сюжет гри 
розглядається як метафора зародження (виношування) нової екологічної 
53 
 
свідомості у надрах мертвого, забрудненого світу. Це натяк на можливість 
переродження та появи нового життя навіть у найтяжчих умовах.  
Предметна прив'язка (Umbrella): Фонетичний перегук з англійським словом 
umbrella (парасолька) створює прямий зв'язок з ключовою ігровою механікою та 
головним атрибутом персонажа.  
Графічна архітектоніка знака. (Рис 3.14) 
Логотип розроблено як комбінований знак, де графічний символ (емблема) 
домінує над шрифтовою частиною, що є характерним для ігрової індустрії (App 
Icon style). Композиція знака базується на принципі замкненого кола. Коло є 
універсальним символом цілісності, циклічності та завершеності. У контексті 
даного проєкту коло символізує замкнену екосистему міста-держави, з якої немає 
виходу, а також глобальність екологічної проблеми (асоціація з планетою або 
забрудненим сонцем/місяцем). 
Семіотика візуальних елементів:  
Центральна фігура (Герой): У центрі композиції розміщено силует 
Безхатька. Його поза - динамічна, ноги широко розставлені, корпус нахилений 
вперед. Це візуалізує рішучість та готовність до протистояння. Використання 
силуетної графіки без деталізації рис обличчя підкреслює універсальність 
образу: це не конкретна особа, а символ опору.  
Парасолька: Стилізована парасолька, яку герой тримає в руці, 
композиційно врівноважує фігуру. Її гострі кути та розкритий купол створюють 
діагональний вектор, що додає знаку динаміки. Вона зчитується двояко: і як щит 
від небезпеки згори (кислотний дощ), і як зброя.  
Індустріальний фон (Background): Внутрішній простір кола заповнений 
силуетами заводських труб, з яких валять густі клуби диму. Дим візуально 
виходить за межі кола у верхній частині знака, що символізує неконтрольованість 
забруднення, яке неможливо втримати в межах однієї території. Цей елемент 
чітко маркує сеттинг гри - індустріальний постапокаліпсис.  
54 
 
Колористична концепція. Колірне рішення логотипу (див. Додаток В) 
суворо підпорядковане загальній арт-дирекції проєкту і базується на так званій 
«брудній тріаді»:  
Темний графітово-фіолетовий: Колір фону та тіней. Він створює відчуття 
глибини, таємниці та нічного часу доби.  
Брудно-оливковий/Хакі: Акцентний колір, використаний для зображення 
фонового міста та диму. Психологічно цей відтінок сприймається як неприємний, 
хворобливий, асоціюється з хімічними відходами, сіркою та застоєм. Його 
домінування у логотипі одразу повідомляє глядачеві про екологічну тематику гри.  
Чистий білий: Використано мінімально - лише для очей персонажа. Цей 
максимальний контраст (біле на чорному) виконує роль візуального гачка, що 
притягує погляд до центру композиції. Білі очі символізують життя, свідомість та 
надію, що жевріє посеред мороку.  
Таким чином, семантика та композиція логотипу «Umbrion» не є 
випадковим набором графічних прийомів. Це складна семіотична система, яка 
через форму (коло, силует), назву (неологізм) та колір (токсична гама) стисло 
переказує сутність гри: історію про маленьку людину, що бореться за життя у 
великому, отруєному світі.  
Типографічне рішення та варіативність використання знака. Для 
забезпечення ефективної комунікації бренду «Umbrion» у різноманітних 
медіасередовищах (від інтерфейсу гри до друкованої рекламної продукції) було 
розроблено систему типографічного оформлення та адаптивні версії графічного 
знака.  
Художня характеристика шрифтової гарнітури. Текстова частина логотипу 
(логотайп) виконує функцію емоційного якоря, що підкріплює візуальний образ 
гри. Для напису «UMBRION» обрано гротескну гарнітуру (sans-serif), яка була 
піддана авторській графічній модифікації.  
Естетика деградації: Літери мають навмисно нерівні, «живі» контури. 
Ефект тремтіння лінії та зміна товщини штрихів імітує напис, зроблений вручну 
55 
 
на грубій фактурі, або друк, що зазнав ерозії під впливом вологи та часу. Такий 
підхід, відомий як «гранж-типографіка», концептуально резонує з темою 
руйнування міської інфраструктури та занепаду цивілізації.  
Читабельність: Попри стилізацію під «зіпсованість», архітектоніка літер 
залишається чіткою. Використання великих літер (uppercase) та збільшеного 
міжлітерного інтервалу (трекінгу) додає напису стійкості та монументальності, 
дозволяючи легко зчитувати назву навіть у зменшеному масштабі.  
Унікальні графеми: Округлість літери «U» та динамічна ніжка літери «R» 
створюють візуальний ритм, що перегукується з пластикою графічного знака 
(округлим фоном та позою персонажа).  
 
Рис.3.14 Основний знак «UMBRION» 
Система адаптивних варіацій логотипу. Для збереження ідентичності 
бренду в різних умовах відтворення розроблено три нормативні версії знака (Рис. 
3.15): 
Основна (Повноколірнa) версія. Це пріоритетний варіант для використання 
на цифрових носіях (екрани завантаження, іконка додатка, веб-сайт) та у 
високоякісному друці.  
Колористика: Використовує фірмову «брудну тріаду»: темно-фіолетовий 
фон (ніч), оливково-жовтий елемент міста (смог) та білі акценти (очі).  
56 
 
Функція: Максимально повно передає атмосферу гри, транслюючи 
відчуття токсичності та небезпеки через колірний код.  
Монохромна (Чорно-біла) версія. Призначена для використання у діловій 
документації, на бланках, а також у ситуаціях технічних обмежень друку 
(наприклад, чорно-біла газета або факсиміле).  
Трансформація: Кольорові плашки конвертовано у градації сірого або 
чистий чорний колір. Фон стає білим, а силует героя та міста - контрастним 
чорним. Світле коло на задньому плані перетворюється на контурну лінію або 
світло-сіру заливку.  
Функція: Забезпечує розпізнаваність форми та силуету персонажа без 
спирання на колір.  
Інвертована (Біло-чорна) версія. Спеціалізована варіація для використання 
на темних або насичених кольорових фонах (Dark Mode, мерч, темні ділянки 
інтерфейсу).  
Трансформація: Графічний знак та шрифтовий блок виконуються у білому 
(або світло-сірому) кольорі.  
Візуальний ефект: У цій версії логотип працює як «світло у темряві». 
Силует героя стає "вирізаним" світлом, що метафорично підкреслює тему надії у 
похмурому світі гри. Цей варіант є найбільш контрастним і часто 
використовується як водяний знак на скріншотах геймплею.  
 
Рис.3.15 Варіації знаку «UMBRION» 
57 
 
Композиційна цілісність. У всіх трьох варіаціях зберігається стале взаємне 
розташування знака та логотайпу. Текст завжди розміщується під графічним 
елементом, вирівняний по центру вертикальної осі. Ширина текстового блоку 
візуально врівноважує масу графічного знака, створюючи стійку пірамідальну 
композицію, що гарантує цілісність сприйняття бренду «Umbrion» незалежно від 
контексту використання.  
Дизайн користувацького інтерфейсу (UI): «Довідник монстрів». У сучасній 
теорії геймдизайну інтерфейс користувача розглядається не лише як набір 
функціональних кнопок та меню, а як важливий інструмент занурення та 
трансляції наративу. Для проєкту «Umbrion» було обрано концепцію дієгетичного 
інтерфейсу. Це означає, що елементи меню стилізовані під реальні об'єкти, які 
існують всередині ігрового світу і з якими може фізично взаємодіяти персонаж.  
Ключовим елементом цієї системи є «Довідник монстрів», який візуально 
вирішений у формі старого рукописного фоліанта або щоденника дослідника. 
(Рис. 3.16) 
Концептуальна метафора та Матеріальність. Вибір форми паперової книги 
у світі високотехнологічного індустріального постапокаліпсису є глибоко 
символічним.  
Контраст епох: У середовищі, де домінують іржавий метал, бетон та 
цифрові панелі управління, паперова книга виступає артефактом «старого світу» 
або символом збереження знань. Це підкреслює роль героя як дослідника, що 
намагається систематизувати хаос навколо себе.  
Текстура та Фактура: Дизайн сторінок імітує зістарений, пожовклий папір 
з нерівними, обірваними краями. Наявність плям, потертостей та текстури 
«зерна» створює тактильний ефект. Обкладинка (візуалізована через краї екрану) 
має текстуру грубої шкіри з металевими кутками, що вказує на цінність та 
довговічність цього предмета. Така скевоморфна стилістика (skeuomorphism) 
працює на атмосферу виживання: це річ, яку герой носить із собою і береже.  
58 
 
Графічна подача та Стилізація контенту. Візуалізація інформації всередині 
Довідника підпорядкована естетиці польових нотаток.  
Ілюстрації: Зображення ворогів (наприклад, Альгає та Краброна) виконані 
не у вигляді точних 3D-рендерів або піксельних спрайтів, а стилізовані під 
кольоровий рисунок. Жирний, нерівний контур ілюстрацій підтримує загальну 
коміксну стилістику гри, але виглядає так, наче він намальований від руки. Це 
додає зображенням суб'єктивності: ми бачимо монстрів очима героя.  
Типографіка: Для заголовків та основного тексту використано рукописний 
шрифт. Літери мають легку недбалість, різний нахил та варіативну товщину 
штриха, імітуючи письмо пером або вугіллям. Це посилює відчуття інтимності та 
документальності записів.  
Інформаційна архітектура та Семіотика іконок. Структура розвороту книги 
є симетричною та інтуїтивно зрозумілою. Кожна сторінка присвячена окремому 
виду істот. Під ілюстрацією та назвою розміщено блок інфографіки - ряд круглих 
іконок, що кодують бойові характеристики ворога. Дизайн піктограм виконано у 
стилі примітивізму, нагадуючи печатки або штампи:  
• Іконка «Тип атаки»: Наприклад, три вертикальні стрілки вгору (у Альгає) 
символізують атаку шипами знизу.  
• Іконка «Захист»: Зображення цегляної кладки (у Краброна) чітко комунікує 
гравцеві, що цей ворог має високий показник броні і є «танком».  
• Іконка «Таємниця»: Знак питання символізує нерозкриту частину лору, 
спонукаючи гравця до подальшого дослідження. Використання червоного  
та коричневого кольорів для штрихів на іконках забезпечує необхідний 
контраст з жовтим фоном паперу.  
Механіка прогресивного розкриття. Згідно з концепцією проєкту, довідник 
не є статичною енциклопедією. Він інтегрує пізнавальну складову в ігровий 
процес через механіку «умовного доступу».  
59 
 
• Рівень 1 (Поверхневий): При першій зустрічі з ворогом сторінка може бути 
напівпорожньою або містити лише силует та базові попередження. Це 
відповідає стану страху перед невідомим.  
• Рівень 2 (Аналітичний): Після певної кількості перемог над видом 
(усунення 15 представників) відкриваються тактичні дані: вразливості, тип 
атаки, здоров'я. Гравець починає розуміти ворога як механізм.  
• Рівень 3 (Емпатичний): Цей рівень відкривається після сюжетного зламу 
(коміксу). Текст опису змінюється та доповнюється: сухі факти про 
небезпеку перекриваються нотатками про трагічне походження істоти, її 
біль та причини мутації.  
Рис.3.16 «Довідник монстрів» 
 
Розроблений UI-елемент «Довідник монстрів» виконує потрійну функцію: 
інформаційну (довідка про ворогів), естетичну (підтримка атмосфери ретро-
футуризму та занепаду) та наративну (документування зміни ставлення героя до 
60 
 
світу). Такий підхід перетворює інтерфейс з допоміжного шару на повноцінний 
художній засіб виразності.  
  
Висновки до третього розділу 
У третьому розділі магістерської роботи, що становить основну 
експериментальну частину дослідження, здійснено комплексну розробку дизайн-
концепції відеогри «Umbrion».  
Концептуально-наративна база: Сформовано цілісну ідею гри, що поєднує 
жанрову механіку метроїдванії з актуальною екологічною проблематикою. 
Розроблено оригінальний сценарій, який через механіку «інтерактивного 
коміксу» та сюжетний злам трансформує роль гравця зі знищувача природи на її 
захисника. Назва «Umbrion» обґрунтована як семантичний код, що поєднує 
мотиви тіні, зародження нового життя та захисту (парасолька).  
Система персонажів: Створено галерею унікальних візуальних образів. 
Дизайн протагоніста базується на архетипі вигнанця та деперсоналізації, що 
сприяє ідентифікації гравця з героєм. Система антагоністів розроблена за 
принципом «інтегрованої деформації», де елементи сміття та мутації 
візуалізують страждання живих істот, викликаючи емпатію.  
Дизайн середовища: Розроблено візуальну стилістику чотирьох ключових 
локацій (Звалище, Завод, Цех, Темний ліс). Для кожної зони підібрано специфічні 
колористичні гами та композиційні ритми, що забезпечує інтуїтивну навігацію та 
емоційне занурення. Використання принципів паралаксу та багатоплановості 
дозволило подолати обмеження 2D-простору.  
Айдентика та Інтерфейс: Спроєктовано логотип, що базується на модульній 
сітці та гранж-типографіці, відображаючи естетику занепаду. Розроблено дизайн 
дієгетичного інтерфейсу «Довідник монстрів», який інтегрує ігрову статистику 
та лор у єдиний візуальний об'єкт, книгу, підсилюючи атмосферність проєкту.  
61 
 
Результатом роботи є завершена авторська дизайн-пропозиція, яка 
демонструє новизну у підході до візуалізації екологічних конфліктів у відеоіграх 
та готова до етапу технічної реалізації.  
  
62 
 
РОЗДІЛ 4 
 
 
ТЕХНОЛОГІЧНІ ОСОБЛИВОСТІ РЕАЛІЗАЦІЇ ПРОЄКТУ ТА 
АНІМАЦІЯ 
 
4.1. Програмне забезпечення та гібридний інструментарій розробки. 
Для реалізації дизайн-концепції відеогри «Umbrion» було застосовано 
комбінований (гібридний) технологічний процес, що поєднує переваги векторної 
та растрової графіки. Такий підхід дозволив досягти високої точності у побудові 
статичних форм та художньої експресії у динаміці. Основними програмними 
продуктами було обрано Adobe Illustrator (для створення статичних асетів) та 
Procreate (для анімації).  
Векторне моделювання в Adobe Illustrator. Вибір векторного редактора як 
базового інструмента для створення персонажів, локацій та UI обумовлений 
стилістичними вимогами проєкту.  
Геометрична точність: Стиль гри базується на чітких силуетах та 
використанні примітивів (кіл, квадратів, трикутників) в основі конструкції 
персонажів (наприклад, ідеально круглий фон логотипу або чіткі лінії труб на 
заводі). Векторна графіка дозволяє будувати ці форми з математичною точністю, 
використовуючи інструменти кривих Безьє.  
Робота з контуром: Оскільки візуальною домінантою є товстий контур 
однакової товщини, функціонал Adobe Illustrator дозволяє глобально керувати 
параметрами обведення, забезпечуючи абсолютну однаковість товщини ліній на 
всіх об'єктах, незалежно від їх масштабу. Це гарантує візуальну цілісність 
ігрового світу.  
Масштабованість: Векторні зображення не втрачають якості при будь-
якому збільшенні. Це критично важливо для підготовки презентаційних 
матеріалів великого формату (банер 2300х1600 мм), де пікселізація була б 
неприпустимою [26].  
63 
 
Растрове середовище Procreate. Для етапу анімації було обрано растровий 
редактор Procreate на базі iPad. Цей вибір зумовлений необхідністю «оживити» 
сухі векторні форми, надавши їм пластичності та рукотворного характеру, 
притаманного естетиці коміксу.  
  
4.2. Технологія створення анімаційних ефектів: метод редрава 
(Redraw).  
Анімаційний пайплайн проєкту «Umbrion» базується на методиці 
покадрової перемальовки (frame-by-frame redraw) векторних референсів. Цей 
метод є трудомістким, але дозволяє досягти унікального візуального ефекту, 
недоступного при автоматичній інтерполяції.  
Алгоритм анімаційного процесу:  
1. Імпорт референсу: Статичне зображення персонажа (наприклад, Безхатька 
у базовій позі), створене в Adobe Illustrator, експортується у растровий 
формат (PNG/JPEG) та імпортується в Procreate як фоновий шар-референс.  
2. Ключова фазовка (Keyframing): На основі векторного контуру художник 
вручну відмальовує ключові фази руху (початок удару, точка контакту, 
завершення). На цьому етапі відбувається свідома деформація ідеальних 
векторних ліній: додається еластичність, інерція тканини, зміна форми 
парасольки під дією вітру.  
3. Проміжна фазовка (In-betweening): Заповнення кадрів між ключовими 
позами для забезпечення плавності руху. Використання функції «Onion 
Skin» (напівпрозорий перегляд сусідніх кадрів) дозволяє контролювати 
траєкторію руху.  
4. Ефект «живої лінії» (Boiling Line): Оскільки кожен кадр перемальовується 
вручну, навіть у статичних позах контур персонажа злегка тремтить 
(змінюється мікро-товщина та текстура штриха). Цей ефект, відомий в 
анімації як «boiling line», надає зображенню енергії та підкреслює 
64 
 
напружену атмосферу гри, візуально відокремлюючи живого персонажа 
від статичного векторного фону [27].  
Анімація ключових механік.  
• Рух Парасольки: При анімації атаки парасолькою використовувався 
принцип «змазування». Векторна форма парасолі в момент швидкого удару 
деформується у витягнуту пляму, що імітує розмиття руху. Це додає удару 
відчуття різкості та сили.  
• Мутації ворогів: Для анімації монстрів (наприклад, Альгає) 
використовувався метод морфінгу, коли одна форма плавно перетікає в 
іншу. Це дозволило передати в'язку, нестабільну природу забрудненої 
матерії.  
  
4.3. Систематизація та підготовка презентаційних матеріалів. 
Фінальним етапом роботи стала інтеграція різнорідних графічних даних у 
єдину презентаційну систему.  
Враховуючи використання двох програмних середовищ, було розроблено 
чітку систему експорту та зберігання файлів:  
Статичні асети (Локації, UI, Лого): Зберігаються у форматі .AI (Adobe 
Illustrator) з розбиттям на монтажні області (Artboards). Це дозволяє легко 
редагувати окремі елементи (наприклад, змінювати текст у «Довіднику 
монстрів») без втрати якості.  
Динамічні асети (Спрайти персонажів): Анімаційні послідовності 
експортуються з Procreate у форматі .GIF (для швидкого перегляду) та .MP4 (для 
відеопрезентації). Також зберігаються вихідні файли .procreate зі збереженням 
усіх шарів для можливого корегування таймінгу.  
Композиція експозиційного банера. Дизайн презентаційного планшета 
(2300х1600 мм) виконано засобами Adobe Illustrator, що дозволило поєднати 
векторні тексти та логотип з растровими ілюстраціями та кадрами анімації.  
Композиція будується на ієрархії:  
65 
 
• Верх: Логотип та титульний екран  
• Центр: Сюжетно значущі персонажі, Довідник монстрів та Вороги  
• Лівий блок: Опис та значущість магістерської роботи  
• Правий блок: Комікс та Локації.  
Такий технологічний підхід забезпечив високу якість візуального продукту, 
поєднавши інженерну точність дизайну з художньою виразністю анімації.  
 
Висновки до четвертого розділу 
Обґрунтовано ефективність гібридного пайплайну розробки, що поєднує 
векторне та растрове середовища. Встановлено, що використання Adobe 
Illustrator на етапі створення статичних форм забезпечує геометричну точність та 
єдність товщини контуру, тоді як перехід у середовище Procreate (iPad) надає 
зображенню необхідної художньої пластичності та імітує естетику ручної 
графіки. 
Реалізовано технологію анімації методом «redraw» (перемальовки). 
Доведено, що покадрова анімація на основі векторних референсів дозволяє 
досягти унікального візуального ефекту «живого контуру» (boiling line), який 
неможливо відтворити засобами автоматичної інтерполяції. Застосування 
класичних принципів анімації (стиснення, розтягнення, таймінг) забезпечило 
переконливість рухів персонажів та функціональність ігрових механік 
(трансформація парасольки). 
Здійснено систематизацію та підготовку презентаційних матеріалів. 
Розроблено структуру зберігання графічних асетів, що забезпечує можливість їх 
подальшої інтеграції в ігровий рушій. Створено композицію експозиційного 
банера, яка логічно та ієрархічно презентує всі елементи дизайн-концепції — від 
логотипу до ігрових локацій, демонструючи цілісність візуального стилю проєкту 
«Umbrion». 
  
66 
 
ВИСНОВКИ  
 
1.У магістерській роботі вирішено актуальну науково-практичну задачу 
розробки дизайн-концепції відеогри «Umbrion», спрямованої на візуалізацію 
екологічної та моральної проблематики засобами інтерактивних медіа.  
Проаналізовано теоретичні засади дизайну відеоігор та встановлено, що вони є 
ефективним інструментом соціальної комунікації. Визначено, що через 
механізми процедурної риторики та емпатичного дизайну відеоігри здатні 
формувати у користувача відчуття відповідальності за стан довкілля. Доведено, 
що жанр «метроїдванія» з його нелінійною структурою та механікою 
поступового відкриття світу (ability gating) є оптимальною платформою для 
реалізації наративу про наслідки екологічної катастрофи.  
2.Виявлено та систематизовано візуальні коди індустріально-
постапокаліптичного середовища. Встановлено, що ключовими засобами 
художньої виразності для створення атмосфери занепаду є використання 
«брудної» колористичної гами (оливкові, бурі, фіолетові відтінки), гіперболізація 
індустріальних форм та композиційні прийоми, що підкреслюють масштабність 
техногенного тиску на людину (вертикальні ритми, паралакс).  
3.Сформовано цілісну авторську концепцію гри «Umbrion», в основу якої 
покладено ідею «екологічного дзеркала». Розроблено оригінальний сценарій, що 
базується на моральному виборі гравця: продовжувати знищення мутованої 
природи або зрозуміти її біль. Впроваджено унікальну механіку інтерактивного 
коміксу, яка виступає точкою біфуркації сюжету, трансформуючи роль героя з 
агресора на захисника. Назва проєкту обґрунтована як семантичний синтез 
понять «тінь» (umbra), «зародження» (embryo) та «захист» (umbrella).  
4.Розроблено унікальну систему персонажів, що візуалізує сторони 
конфлікту. Образ головного героя побудовано на архетипі вигнанця, що посилює 
ідентифікацію гравця з вразливим протагоністом. Дизайн антагоністів реалізує 
концепцію «інтегрованої деформації»: елементи антропогенного сміття стали 
67 
 
невід'ємною частиною їхньої анатомії. Таке рішення дозволило візуалізувати 
страждання істот і створити підґрунтя для виникнення емпатії у гравця.  
5.Створено дизайн-проєкт ігрового середовища, що включає чотири 
типологічні локації: «Звалище», «Завод», «Цех» та «Темний ліс». Для кожної зони 
розроблено індивідуальну колористичну схему та архітектоніку, що забезпечує 
інтуїтивну навігацію та розкриває різні аспекти екологічного занепаду - від 
накопичення відходів до джерела забруднення. Розроблено систему айдентики 
(логотип, шрифтова гарнітура) та дизайн дієгетичного інтерфейсу («Довідник 
монстрів»), що підсилює ефект занурення.  
6.Обґрунтовано технологічні особливості реалізації проєкту. Застосовано 
гібридний пайплайн розробки, що поєднує векторне моделювання форм у Adobe 
Illustrator для забезпечення геометричної точності та растрову покадрову 
анімацію в Procreate для надання пластичності рухам. Використання техніки 
редраву («redrawing») дозволило досягти ефекту «живого контуру», що 
відповідає обраній коміксній стилістиці.   
7.Практичне значення роботи полягає у створенні готового до реалізації 
дизайну та пакету графічних асетів відеогри, яка може бути використана як 
самостійний медіа-продукт для актуалізації екологічних проблем у молодіжному 
середовищі. 
  
68 
 
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ 
 
1. Manovich L. The Language of New Media / Lev Manovich. - Cambridge, MA : MIT 
Press, 2001. - 354 p. 
2. Bogost I. Persuasive Games: The Expressive Power of Videogames / Ian Bogost. - 
Cambridge, MA : MIT Press, 2007. - 198 p. 
3. Chang A. Y. Playing Nature: Ecology in Video Games / Alenda Y. Chang. - 
Minneapolis : University of Minnesota Press, 2019. - 328 p. 
4. Exploring the role and mechanisms of environmental serious games in promoting 
pro-environmental decision-making [Електронний ресурс] / Y. Zhang [et al.] // 
Frontiers in Psychology. - 2024. - Vol. 15. - Режим доступу: 
https://www.frontiersin.org/journals/psychology/articles/10.3389/fpsyg.2024.1455005
/full (дата звернення: 21.11.2025). 
5. Parish J. Anatomy of a Metroidvania [Електронний ресурс] / Jeremy Parish // 
GameSpite Journal 12. - 2009. 
6. Nutt C. The undying allure of the Metroidvania: Interview with Koji Igarashi 
[Електронний ресурс] / Christian Nutt // Game Developer. - 2015. - Режим доступу: 
https://www.gamedeveloper.com/design/the-undying-allure-of-the-metroidvania (дата 
звернення: 21.11.2025). 
7. Bycer J. Game Design Deep Dive: Platformers / Josh Bycer. - Boca Raton : CRC 
Press, 2019. - 166 p. 
8. Schell J. The Art of Game Design: A Book of Lenses / Jesse Schell. - 3rd edition. - 
Boca Raton : CRC Press, 2019. - 600 p. 
9. Chen J. Flow in Games (and Everything Else) [Електронний ресурс] / Jenova Chen 
// Communications of the ACM. - 2007. - Vol. 50, No. 4. - Режим доступу: 
https://dl.acm.org/doi/10.1145/1232743.1232769 (дата звернення: 21.11.2025). 
10. Team Cherry. Hollow Knight: Wanderer's Journal / Team Cherry. - Fangamer, 2019. 
- 160 p. 
69 
 
11. Webster A. Rain World is like a Survival Game created by nature itself / Andrew 
Webster // The Verge. - 2017.  
12. Moon Studios. The Art of Ori and the Will of the Wisps / Moon Studios. - Future 
Press, 2020. - 288 p. 
13. Smith H. Environmental Storytelling in Video Games [Електронний ресурс] / 
Harvey Smith // GameDesignSkills. - 2023. - Режим доступу: 
https://gamedesignskills.com/game-design/environmental-storytelling/ (дата 
звернення: 21.11.2025). 
14. Barredo K. 5 Environmental Storytelling Techniques Every Game Writer MUST 
Know [Електронний ресурс] / Kelsy Barredo // Keewano Game Design Blog. - 2025. 
- Режим доступу: https://keewano.com/blog/5-environmental-storytelling-
techniques-every-game-writer-must-know/ (дата звернення: 21.11.2025). 
15. Fairbairn M. Post-Apocalyptic Interior Environment Design [Електронний 
ресурс] / Marcus Fairbairn // ArtStation Magazine. - 2020. - Режим доступу: 
https://marcusfairbairndesigns.wordpress.com/post-apocalyptic-room/ (дата 
звернення: 21.11.2025). 
16. Ginko A. Secrets of Industrial Design in Games [Електронний ресурс] / Alex 
Ginko // 80 Level. - 2016. - Режим доступу: https://80.lv/articles/secrets-of-industrial-
design-in-games (дата звернення: 21.11.2025). 
17. Pavlovsky M. Parallax Scrolling in pixel-perfect 2D Unity games [Електронний 
ресурс] / Matej Pavlovsky // Pav Creations. - 2020. - Режим доступу: 
https://pavcreations.com/parallax-scrolling-in-pixel-perfect-2d-unity-games/ (дата 
звернення: 21.11.2025). 
18. Plunkett L. A Complete Guide to Visual Storytelling in Game Art [Електронний 
ресурс] / Luke Plunkett // Pixune Studios Blog. - 2024. - Режим доступу: 
https://pixune.com/blog/visual-storytelling-in-game-art/ (дата звернення: 
21.11.2025). 
19. Solarski C. Interactive Stories and Video Game Art: A Storytelling Framework for 
Game Design / Chris Solarski. - Boca Raton : CRC Press, 2017. - 190 p. 
70 
 
20. Perron B. The Video Game Theory Reader 2 / Bernard Perron, Mark J.P. Wolf. - 
New York : Routledge, 2009. - 456 p. (Section on Uncanny Valley and Horror). 
21. Tillman B. Creative Character Design 2e / Bryan Tillman. - New York : CRC Press, 
2019. - 360 p. 
22. Іттен Й. Мистецтво кольору. Суб’єктивний досвід і об’єктивне пізнання як 
шлях до мистецтва  / Йоганнес Іттен ; пер. з нім. - Київ : ArtHuss, 2019. - 96 с. 
23. Solarski C. The Aesthetics of Game Art [Електронний ресурс] / Chris Solarski // 
Scribd. - 2013. - Режим доступу: 
https://www.scribd.com/document/374021390/Chris-Solarski-The-Aesthetics-of-
Game-Art-and-Game-Design-2013 (дата звернення: 21.11.2025). 
24. Totten C. W. Architectural Approach to Level Design: Second edition / Christopher 
W. Totten. - New York : CRC Press, 2019. - 494 p. 
25. Visual Storytelling in Video Games: Color [Електронний ресурс] / C. Totten // 
Level Design. - 2018. - Режим доступу: https://level-design.org/?p=1234 (дата 
звернення: 21.11.2025). 
26. Adobe Illustrator User Guide [Електронний ресурс] // Adobe.com. – 2024. – 
Режим доступу: https://helpx.adobe.com/ua/illustrator/user-guide.html (дата 
звернення: 21.11.2025). 
27. Williams R. The Animator's Survival Kit / Richard Williams. – New York : Faber 
and Faber, 2001. – 342 p.  
  
71 
 
ДОДАТКИ 
Додаток А 
Рис. А.1 "Metroid" - це серія відеоігор у жанрі action-
adventure. Один із засновників жанру метроїдванія 
Рис. А.2 «Castlevania» - серія відеоігор заснована на 
протистоянні мисливців на вампірів. Один із засновників 
жанру метроїдванія 
72 
 
Рис. А.3 «Hollow Knight» - це двовимірна пригодницька 
відеогра у жанрі метроїдванія, розроблена інді-студією 
Team Cherry 
 
  
Рис. А.4 «Rain World» - це інді-відеогра в жанрах 
платформер та симулятор виживання, яка була випущена у 
2017 році. 
73 
 
Рис. А.5 «Ori and the Will of the Wisps» - це пригодницький 
платформер, розроблений студією Moon Studios  
у 2020 році. 
 
  
Рис. А.6 «Moonscars» - це екшен-платформер з елементами 
метроїдванії від україно-молдавської команди розробників, 
який розповідає історію про глиняний трансгуманізм та 
бунт творіння проти свого творця. 
74 
 
Рис. А.7 «Erra: Exordium» - пригодницький 2D екшн у 
сеттингу Дизельпанка. Розроблена українською студією 
Fair Pixel 
 
  
Рис. А.8 «Tukoni» - це назва серії українських дитячих книг 
та однойменної пригодницької point-and-click гри-
головоломки за їх мотивами. 
75 
 
Додаток Б 
76