Як влаштовано графіку в сучасних комп'ютерних іграх?

Серія постів, розрахованих на середню людину з технічним мисленням, яка хоче дізнатися більше про те, як працює сучасна 3D графіка в іграх. Вони не навчать вас робити щось і не передбачають попередніх знань, але пояснять концепції.

Вступ

Багато чого входить у створення навіть простої 3D гри, не кажучи вже про таку, як Watch Dogs.

Привіт, мені звуть baldurk. Я хочу описати те, що відбувається у сучасних іграх, не втрачаючи нічого. Але не говоритиму про математику чи програмування. Якщо ви знаєте різницю між процесором та графічною картою, то ви знаєте, що графічна пам'ять не така сама, як на жорсткому диску. Цього достатньо, і я поясню щось ще.

У постах я спиратимуся на гру Watch Dogs. Вона добре відома завдяки своїй графіку (хорошій чи поганій, залежить від вашого смаку), і в ній є багато речей, які ми можемо розглянути як конкретні приклади. У якихось особливих випадках я можу говорити про інші ігри.

Почну з основ, які однакові від гри до гри, але також розгляну деякі характерні для Watch Dogs методи та візуальні ефекти.

Я використовую інструмент RenderDoc, який написав у вільний час. Він використовується для налагодження графічних завдань: допомагає розібрати графічний кадр та подивитися, як він зібраний.

Ця анімація показує, як графічна карта малює кадр протягом якогось проміжку часу.

Більшість людей знає, що комп'ютерна графіка (як і будь-яке інше відео) складається із серії нерухомих кадрів, кожен з яких показує частки секунди.У фільмах традиційно буває 24 кадри на секунду (FPS), у телевізійних передачах приблизно стільки ж, близько 24-30. В іграх FPS може бути різним, оскільки щоразу може відбуватися багато роботи. Опускатись нижче 30 небажано, хоча це часто трапляється. 60 FPS наближається до межі для консольних ігор, а до якої межі в проміжку від 30 до 60 прагне гра — залежить від її цілей. На комп'ютері з високоякісним монітором можна отримати 90, 120 або навіть більше FPS. Чому використовуються саме ці конкретні числа, я поясню пізніше, це пов'язано з vsync.

Але нам із вами треба перевернути це з ніг на голову. Замість того, щоб дивитися наскільки високий FPS, ми подивимося, наскільки малий проміжок часу виділяється на один кадр. При 30 FPS у нас є тільки 33 мілісекунди, щоб намалювати все, що потрібно всередині кадру. При 60 FPS – половина цього, близько 17 мілісекунд. Враховуючи скільки всього треба встигнути зробити, це невеликий час навіть для комп'ютера. Щоб уявити наочніше, наведу приблизний розрахунок, що куля за мілісекунду пролітає близько 1 метра.

Ми в основному говоритимемо про персональні комп'ютери, тому що це відкрита платформа, і певні специфічні речі про консолі не можна відкрити, не побоюючись порушити NDA. Але в основному я не збираюся говорити про щось таке, що дуже відрізняється в консолях. А якщо скажу, я зверну на це увагу. Більшість відмінностей між апаратним забезпеченням ПК/консолей та мобільних платформ виходять за рамки цієї серії.

А ця красива картинка тут стоїть для того, щоб оживити текст.

Ось яке завдання нам цікаве. Ми не переживатимемо, як AI зробить всі обчислення, і не будемо робити обчислювати фізику для переміщення частинок та предметів.Кордон того, що ви назвали б «графічним програмуванням», трохи нечітка. Але я хочу звернути увагу, що графічне програмування починається тоді, коли у вас є все необхідне малювання кадру. Ви знаєте, що відбувається, у вас у пам'яті (не на диску) є текстури та моделі, анімації анімовані, фізика прорахована і тепер нам час намалювати готовий кадр.

Зазначу, що багато основних принципів 3D гри зі звичайною візуалізацією, на кшталт Watch Dogs, можна застосувати до 2D ігор. Але їх трохи важче проілюструвати. Також відмова від відповідальності, він особливо відноситься до інших графічних програмістів: я хочу в усьому розібратися, тому можу навести сумнівні чи просто невірні пояснення, якщо вони допоможуть цілі.

Частини кадру

Основну частину часу ми розглядатимемо лише один кадр і говоритимемо про будівельні блоки, які використовує гра для створення кінцевого кадру.

Кадр можна зібрати з менших будівельних блоків кількома шляхами. Готовий малюнок, що ви бачите, малюється не миттєво. Це мало місце багато років тому, але сучасні графічні движки практично завжди виконують будь-які попередні обчислення. Двигун буде малювати багато проміжних зображень різних типів, щоб допомогти розрахувати остаточне зображення, перш ніж скласти його в кадр, який ви бачите на екрані.

Ці зображення відрізняються від движка до движка і залежить від задуму програміста графіки. Наприклад, якщо треба, щоб сонячне світло давало правильні тіні, для цього буде одне зображення. А якщо треба зробити правильні відображення на поверхні машини, яку веде гравець, то інше.

Деякі з проміжних зображень, які необхідні для створення нашого кадру з Watch Dogs.

Швидше за все, я не розповідатиму про всі зображення для кадру в Watch Dogs, але обов'язково торкнуся найголовніших, які чогось нас навчать. Це та область, у якій технології постійно розвиваються. Коли маркетологи говорять про нову характеристику, зазвичай мають на увазі її, хоча інновації впроваджують і інших рівнях.

Кожне з цих проміжних зображень саме побудоване з дрібніших частин. Кожен об'єкт у сцені або, можливо, група зв'язаних об'єктів окремо будується як текстурована модель. Під час створення гри художники роблять ці моделі у 3D редакторі та створюють усі необхідні ресурси. Потім ці моделі помістять у ігровий світ за допомогою редактора рівнів, щоб поступово збудувати віртуальне місто.

Такі загальні знання, а якщо ви бачили, як за 20 років подорослішала 3D графіка в іграх у реальному часі, ви знаєте, що сучасні моделі стали набагато складнішими. У минулі дні текстури коштували дорого, і скрізь, де це тільки можна, їх замінювали простим зафарбовуванням об'єктів. Залишали лише там, де справді важливі деталі, наприклад, для очей та осіб персонажів.

3D модель цілком складається із взаємозалежних трикутників, які становлять форму об'єкта. Кожен трикутник має три точки, звані вершинами, оскільки трикутники взаємопов'язані, вершини будуть спільними для кількох трикутників. Ми повернемося до цього пізніше, оскільки вершини та трикутники дуже важливі. Також варто пам'ятати, що деякі об'єкти, такі як персонажі чи дерева будуть анімовані перед малюванням. Модель створюється в статичній формі за умовчанням, а анімації застосовуються до кожного кадру — знову ж таки ми повернемося до цього.

Це 3D модель голови Ейден Пірс до анімації.Трикутники видно тому, що намальовані плоскими, а не візуально пом'якшеними, як завжди, у грі.

Щоб зробити 3D модель більш детальною, застосовуються текстури. Вони є звичайними файлами з плоскими зображеннями, зазвичай квадратними або з простим співвідношенням сторін на кшталт 2:1. Як текстури накладаються на 3D модель, я опишу далі, але ви можете уявити це як дуже акуратне обертання подарунка. Замість простого малюнку, що повторюється, на обгортковому папері зображення для текстури в точності повторює те, що повинно бути обгорнуто. Якщо ви спостерігали в плоскому вигляді паперові моделі для об'ємного склеювання, то тут той самий принцип.

Аналогія набагато точніше, ніж ви могли б подумати, тому що при створенні 3D текстур модель зазвичай "розгортається" в плоску копію, як і для паперових моделей, а потім на ній малюється текстура. Розгортка зазвичай робиться автоматично, але особливо складних об'єктів може бути зроблено і вручну.

Ось текстура, яка відноситься до наведеної вище моделі голови Ейдена Пірса. Для зубів та язика використані окремі частини. Зверніть увагу, що область вище чола не має текстури, тому що вона завжди покрита відомою кепкою.

Примітка

При розгортанні частини, яким потрібно більше деталізації, часто робляться більшими — і навпаки.

Часто говорять про різні "скіни" моделі, особливо кастомного персонажа. У наші дні зміна скіна включає невеликі зміни самої моделі (інший ремінь чи кепку), але спочатку використовувалася точно така сама модель, на яку накладалася інша текстура (або скін), і виходив персонаж, який виглядає по-новому.Навіть зараз більшість змін для неігрових персонажів або об'єктів виконується за допомогою текстур, тому що економить час і працю від створення безлічі унікальних моделей.

Невелике обертання 3D моделі тільки з однією накладеною текстурою.

На розглядуваному нами кадрі є близько 1700 об'єктів, намальованих під час основної візуалізації. Деякі з них будуть ідентичними. загальна кількість унікальних моделей для заповнення кадру грубо оцінюється як 4700. Це дасть вам уявлення про те, скільки додаткової роботи треба виконати крім простого малювання всього цього.

Давайте подивимося інший приклад об'єкта – кепку Ейдена.

Текстура та модель кепки з накладеною текстурою.

Примітка

Козирок і денце кепки в текстурі не торкаються один з одним Так зроблено тому, що обертання може бути досить складним, при необхідності воно виконується на декількох різних частинах моделі. витонченості.

Все, що ми говорили про голову Ейдена, відноситься і до його кепки. Крім спеціальної текстури та чисел, які входять до обчислення розгортки, все працює так само.

Давайте тепер трохи забавимося.Більшість текстур мають стандартний квадратний розмір, процедура обертання однакова — то що трапиться, якщо ми переплутаємо текстури для різних об'єктів?

Невідома кепка Ейдена.

Там, де на кепці був логотип, текстура голови містить вухо та зуби. У районі козирка вийшло волосся. Меппінг залишився тим самим, а текстура змінилася. Ми отримали баг, але подумайте, що ви могли б робити, якщо вмієте анімувати або переміщати текстури. В іграх ця річ використовується для отримання декількох різних ефектів, які ви тепер зможете виявити. Наприклад, у Saint's Row 4 прийом реалізовано неодноразово.

Також корисно подумати про все, що це ховає за собою. Моделі та текстури в іграх повинні правильно збігатися.

Звісно, ​​це не абсолютне правило. У деяких випадках текстура буде звичайним тайловим візерунком, який можна використовувати для багатьох об'єктів. Або можливо для серії пов'язаних об'єктів (наприклад, газетні стенди). Усі матимуть одну й ту саму текстуру для обкладинок газет, кожна буде використовувати лише невелику частину текстури.

Проте це означає, що якщо ви хочете малювати багато зображень для створення підсумкового кадру, вам потрібно зібрати всі будівельні блоки, і для цього знадобиться багато моделей та текстур.

Продовження серії статей

Перекладає для Вас найцікавіші статті щодо розробки ігор. За освітою фізик-програміст. Технічними перекладами почала підробляти ще на старших курсах і поступово переросла в основне заняття. Цікавиться гуманітарними технологіями, пробує себе у журналістиці.

Додати коментар Скасувати відповідь

• Календар: дати виходу ігор
• Календар: ігрові івенти
• Круті ігри на ПК
• Чи піде гра на ПК?
• Ігри для слабкого ноутбука
• Як стати кіберспортсменом?
• Коди The Sims 4
• Всі доповнення Sims 4
• Розробники інді-ігор
• Все про “чити” в іграх
• Чити для CS: GO
• Як створити гру самому?
• Як стати розробником ігор?
• Референси для художників
• Символи для ніків
• Час проходження ігор
• Схожі ігри
• Карта сайту

Як працює графіка у відеоіграх?

Відеоігри в 21 столітті мають вражаючу графіку, здатну перенести гравця в неймовірно деталізовані міста, що захоплюють дух місця битв, чарівні світи і захоплюючу дух природу. Як же ваш комп'ютер бере мільярди одиниць і нулів і перетворює їх на реалістичну 3D-графіку? Що ж, розбираймося.

Ось ця станція та локомотив у стилі дикого заходу з Red Dead Redemption 2, насправді складається з 2,1 мільйона вершин, зібраних у 3,5 мільйона трикутників з 976 кольорами та текстурами, призначених для різних поверхонь, і все це з віртуальним сонцем. , що висвітлює цю сцену.

Але, мабуть, найбільш вражаючим фактом є те, що ці вершини, текстури та освітлення повністю складаються з одиниць та нулів, які постійно обробляються всередині графічної карти вашого ПК чи ігрової консолі.

Ланцюжок рендерингу графіки у відеоіграх має три ключові етапи: вертекс шейдинг або ж шейдинг вершин (Vertex Shading), розтеризація (Rasterization) і фрагмент шейдинг (Fragment Shading). Хоча в сучасних відеоіграх використовуються додаткові етапи, ці три основні етапи використовуються протягом десятиліть у тисячах відеоігор для комп'ютерів та консолей і все ще є основою алгоритму графіки відеоігор практично для кожної гри, яку ви можете зараз зіграти.

Почнемо з першого кроку, званого шейдингом вершин. Основна ідея даного етапу полягає в тому, щоб взяти всю геометрію та сітки об'єктів у 3D просторі, використовуючи поле зору камери для розрахунку, де кожен об'єкт опиниться у 2D вікні, званому екраном перегляду, який є 2D зображенням, що відправляється на дисплей гравця. сцені зі станцією є 1100 різних моделей, і поле зору камери обмежує те, що бачить гравець, зменшуючи кількість об'єктів, які слід відрендерити, до 600.

Давайте розберемо локомотив як приклад. Хоча двигун поїзда має округлі поверхні та досить складні форми, він фактично зібраний з 762 тисяч плоских трикутників, використовуючи 382 000 вершин та 9 різних матеріалів/квітів, нанесених на поверхні трикутників.

Концептуально весь поїзд переміщається як одне на екран перегляду, але насправді кожна з сотень тисяч вершин поїзда переміщається по одній за раз. Отже, зосередимося на одній вершині. Процес переміщення вершини, а отже, трикутників та поїзда з 3D світу на 2D екран перегляду виконується за допомогою 3 трансформацій.

Спочатку переміщення вершини з модельного простору (model space) у світовий простір (world space), потім із світового простору до простору камери (camera space) і, нарешті, з перспективного поля зору екран перегляду (view screen).

Щоб виконати цю трансформацію, ми використовуємо координати X, Y і Z цієї вершини в модельному просторі, потім положення, масштаб і обертання моделі у світовому просторі та, нарешті, координати та обертання камери та її поле зору.Ми підставляємо всі ці числа в різні матриці трансформації і перемножуємо їх, отримуючи значення X та Y вершини на екрані перегляду, а також значення Z або глибину, яку ми будемо використовувати пізніше для визначення перекриття об'єктів.

Після того, як три вершини поїзда перетворені з використанням аналогічної матричної математики, ми отримуємо один трикутник, переміщений на екран перегляду. Потім решта 382 тисяч вершин поїзда та 2,1 мільйона вершин усіх 600 об'єктів у поле зору камери проходять аналогічний набір трансформацій, таким чином переміщуючи всі 3,5 мільйона трикутників на 2D екран перегляду.

Це неймовірна кількість матричної математики, але графічні процесори спроектовані так, щоб бути монстрами в рендерингу трикутних сіток, і таким чином еволюціонували протягом десятиліть, щоб обробляти мільйони трикутників кожні кілька мілісекунд.

Тепер, коли всі вершини перенесені на 2D-площину, наступний крок – використовувати 3 вершини одного трикутника та визначити, які саме пікселі на вашому дисплеї вкриті цим трикутником. Цей процес називається розтеризацією. Монітор або телевізор з роздільною здатністю 4K має роздільну здатність 3840 на 2160, що дає близько 8,3 мільйона пікселів. Використовуючи координати X і Y вершин цього трикутника на екрані перегляду, ваш графічний процесор обчислює, де він знаходиться в цій величезній сітці і які пікселі покриті цим трикутником.

Потім ці пікселі затінюються з використанням текстури/кольору, призначеного для цього трикутника. Таким чином, за допомогою растеризації ми перетворюємо трикутники на фрагменти, які є групами пікселів, що походять з одного і того ж трикутника і мають однакову текстуру.

Потім ми переходимо до наступного трикутника і зафарбовуємо пікселі, які він покриває, і продовжуємо робити це для кожного з 3500000 трикутників, які раніше були перенесені на екран перегляду. Застосовуючи значення червоного, синього та зеленого кольорів кожного трикутника до відповідних пікселів, у кадровому буфері формується зображення з роздільною здатністю 4K, яке потім відправляється на дисплей.

Але як ми враховуємо трикутники, які перекривають чи затуляють інші трикутники? Наприклад, поїзд заступає більшу частину вокзалу. Крім того, поїзд має сотні тисяч трикутників на його задній стороні, які проходять через процес рендерингу, але, очевидно, не з'являються в кінцевому зображенні.

Визначення того, які трикутники спереду, називається проблемою видимості (Visibility problem) і вирішується за допомогою Z-буфера або буфер глибини (Depth buffer).
Z-буфер додає додаткове значення до кожного з 8,3 мільйонів пікселів, що відповідає відстані або глибині, на якій знаходиться кожен піксель від камери.

На попередньому кроці, коли ми виконували vertex transformation, ми отримали координати X та Y, а також значення Z, яке відповідає відстані від трансформованої вершини до камери. Коли трикутник розтеризується, він покриває набір пікселів, значення Z або глибина трикутника порівнюється зі значеннями, що зберігаються в Z-буфері. Якщо значення глибини трикутника менше тих, що знаходяться в Z-буфері, тобто трикутник ближче до камери, ми зафарбовуємо ці пікселі кольором трикутника і замінюємо значення Z-буфера значеннями Z цього трикутника.

Однак, припустимо, з'являється другий трикутник з Z-значеннями, які вищі, ніж ті, що знаходяться в Z-буфері, що означає, що трикутник знаходиться далі. Z-значеннями Використовуючи цей метод, на екрані відображатимуться лише ті трикутники, які найближче до камери та мають найменші. Z-значення.
До речі, зображення Z-буфера або буфера глибини, де чорний колір позначає ближні об'єкти, а білий — далекі.

Зверніть увагу, що оскільки ці трикутники знаходяться в 3D-просторі, вершини часто мають 3 різних Z-значення, і тому для кожного окремого пікселя трикутника необхідно обчислити його Z-значення, використовуючи координати вершин. піксель за пікселем.

Однією з проблем розтеризації і цих пікселів є те, що якщо трикутник перетинає піксель під кутом і проходить через його центр, весь піксель зафарбовується кольором цього трикутника, що призводить до появи зазубрених і пікселізованих країв.
Для зменшення ефекту зазубреності країв графічні процесори використовують техніку, яка називається суперсемплінгом з антиаліасингом (SSAA).

З SSAA 16 точок вибірки розподіляються по одному пікселю, і коли трикутник перетинає піксель, залежно від того, скільки з 16 точок вибірки покриває трикутник, піксель накладається відповідна дробова частина кольору, що створює розмиті краї на зображенні і значно зменшує помітність піксел.

Одна річ, про яку потрібно пам'ятати, коли ви граєте у відеогру, це те, що вид камери вашого персонажа, а також об'єкти в сцені постійно переміщаються. В результаті процес та обчислення в рамках шейдингу вершин, растеризації та шейдингу фрагментів перераховуються для кожного окремого кадру кожні 8,3 мілісекунди при грі з частотою 120 кадрів за секунду.

Давайте перейдемо до наступного кроку, який називається шейдинг фрагментів (Fragment Shading).Тепер, коли ми маємо набір пікселів, що відповідають кожному трикутнику, недостатньо просто зафарбовувати за номерами, щоб розфарбувати пікселі. Для того, щоб зробити сцену реалістичною, ми повинні враховувати напрямок і силу світла або освітлення, положення камери, відображення та тіні, що відкидаються іншими об'єктами.

Нагадаємо, що фрагменти - Це групи пікселів, утворені з одного розтеризованого трикутника.

Давайте подивимося на роботу шейдера фрагментів у дії. Цей локомотив в основному складається з чорного металу, і якщо ми застосуємо той самий колір до всіх його піксельних фрагментів, ми отримаємо страшенно неточний поїзд.

Але як тільки ми застосовуємо правильний шейдинг, наприклад, роблячи нижню частину темнішою, а верхню світлішою, і додаючи дзеркальні відблиски чи блиск там, де світло відбивається від поверхні, ми отримуємо реалістичний поїзд із чорного металу.

Вже Super Mario 64, якій майже 30 років, є простий шейдинг, де кольори поверхонь змінюються в залежності від освітлення і тіней в сцені.

Отже, подивимося, як працює шейдинг фрагментів.Математика піксельного шейдингу (Pixel Shading Math) працює так: якщо поверхня спрямована прямо на джерело світла, вона затінюється яскравіше, тоді як поверхня спрямована перпендикулярно або від світла, вона затінюється темніше. Щоб розрахувати шейдинг трикутника, нам потрібно знати два ключові моменти. По-перше, напрям світла, і, по-друге, напрям, у якому дивиться поверхню трикутника.

Давайте продовжимо використовувати локомотив як приклад і зафарбувати його яскраво-червоним кольором замість чорного. Як ви вже знаєте, цей поїзд складається з 762 тисяч плоских трикутників, багато з яких спрямовані у різні боки.

Напрямок, у якому дивиться окремий трикутник, називається його нормаллю поверхні (surface normal), Що просто означає напрям, перпендикулярне площині трикутника, як флагшток, що стирчить із землі. Для розрахунку шейдингу трикутника ми беремо косинус кута між двома напрямками. Значення косинуса тета дорівнює 1 коли поверхня спрямована на світло, і 0 коли поверхня перпендикулярна світла. Потім ми множимо косинус тіта на інтенсивність світла і потім на колір матеріалу, щоб отримати правильно затінений колір цього трикутника.

Цей процес коригує значення RGB трикутників, і в результаті ми отримуємо діапазон від світлого до темного на поверхні залежно від того, як окремі трикутники її звернені (повернені) до світла.

Однак, якщо поверхня перпендикулярна світлу або повернена від нього, ми не хочемо, щоб значення косинуса тета було 0 або негативним, тому що це призведе до абсолютно чорної поверхні.Тому ми встановлюємо мінімум на 0 і додаємо інтенсивність навколишнього світла, помножену на колір поверхні, регулюючи це навколишнє світло так, щоб воно було вище в денних сценах і ближче до 0 вночі.

Коли в сцені є кілька джерел світла, ми виконуємо цей розрахунок кілька разів з різними напрямками і інтенсивністю світла, а потім складаємо. Наявність більше кількох джерел світла є обчислювально інтенсивним для вашого графічного процесора, і тому сцени обмежують кількість окремих джерел світла, інколи ж обмежують діапазон їх впливу, щоб трикутники ігнорували далекі джерела світла.

Однією з ключових проблем є те, що трикутники всередині об'єкта мають лише одну нормаль, і, отже, кожен трикутник матиме однаковий колір по всій своїй поверхні. Це називається плоским шейдінгом (Flat shading) і виглядає досить нереалістично під час перегляду на вигнутих поверхнях, таких як корпус цього паровоза. Таким чином, для створення гладкого шейдингу (Smooth shading) замість використання нормалей поверхонь ми використовуємо одну нормаль кожної вершини, обчислену як середнє значення нормалей сусідніх трикутників. Потім ми використовуємо метод, званий барицентричними координатами, щоб створити плавний градієнт нормалей поверхнею трикутника.

Візуально це схоже на змішування трьох різних кольорів трикутником, але замість цього ми використовуємо три напрямки нормалей вершин. Для даного фрагмента ми беремо центр кожного пікселя і використовуємо нормалі вершин і координати до растеризации трикутника, щоб обчислити нормальну норми цього конкретного пікселя.Як і при змішуванні трьох кольорів трикутником, нормаль цього пікселя буде пропорційною сумішшю трьох нормалей вершин трикутника.

В результаті, коли набір трикутників використовується для формування вигнутої поверхні, кожен піксель буде частиною градієнта нормалей, що призведе до градієнта кутів, звернених до світла, з фарбуванням піксель за пікселем і плавним затіненням по всій поверхні.

І так ми розглянули основні кроки ланцюжка графічного рендерингу, однак є багато інших кроків і більш просунутих тем.

Наприклад, вам може бути цікаво, де в цьому процесі знаходяться трасування променів та DLSS (глибоке навчання для суперсемплінгу).

Трасування променів в основному використовується для створення високодеталізованих сцен з точним освітленням та відображеннями, які зазвичай зустрічаються в телевізійних та кінопроектах, і рендеринг одного кадру може займати десятки хвилин або більше. У відеоіграх основні етапи видимості і шейдингу об'єктів розраховуються з використанням графічного рендерингового ланцюжка, що обговорюється нами, але в деяких іграх трасування променів використовується для розрахунку тіней, відображень і покращеного освітлення.

А DLSS у свою чергу - це алгоритм, який використовується для масштабування кадрів з низькою роздільною здатністю до кадрів роздільною здатністю 4K за допомогою згорткової нейронної мережі.

Тому DLSS виконується після трасування променів, а ланцюг рендеру створює кадр з низькою роздільною здатністю.

Цікаво відзначити, що останнє покоління GPU має три повністю окремі архітектури обчислювальних ресурсів або ядра. Ядра CUDA або шейдінг виконують графічний рендеринговий конвеєр. Ядра трасування променів, як випливає з назви, призначені для роботи з трасуванням променів. А DLSS працює на ядрах Tensor.

Тому, коли ви граєте в AAA відеогра з трасуванням променів і DLSS, ваш GPU використовує всі свої обчислювальні ресурси одночасно, дозволяючи відтворювати ігри в роздільній здатності 4K і рендерувати кадри менш ніж за 10 мілісекунд кожен. Коли б ви покладалися тільки на ядра CUDA, то один кадр займав би близько 50 мілісекунд.

У цій статті ми розібрали, як працює графіка у відеоіграх, але ми не приділили уваги таким складним темам, як: тіні, відображення, UV, normal mapping.

Serverspace – провайдер хмарних сервісів, що надає в оренду віртуальні сервери з ОС Linux та Windows у 8 дата-центрах: Росія, Білорусь, Казахстан, Нідерланди, Туреччина, США, Канада та Бразилія. Для побудови ІТ-інфраструктури провайдер також пропонує створення мереж, шлюзів, бекапи, сервіси CDN, DNS, об'єктне сховище S3.

ІТ-інфраструктура | Кешбек 17% за кодом HABR

Комп'ютерна графіка

Комп'ютерна графіка – це візуальний контент для відображення на моніторах, проекторах та окулярах віртуальної реальності, створений за допомогою комп'ютера. В англійській є аналогічний термін computer graphics, що часто скорочується до абревіатури CG.

Комп'ютерна графіка використовується в таких сферах, як кіно, мультфільми, комп'ютерні ігри, програми, VFX, VR/AR, 3D-друк, реклама, дизайн, наука, бізнес, інженерна справа, будівництво та освіта.

Нижче розглянемо історію, галузі застосування та класифікацію комп'ютерної графіки.

Вперше необхідність відображення зображення на дисплеї виникла не в індустрії розваг, а в науці та авіації - для створення екрану радара літака.Незабаром після цього на екрані звичайного осцилографа була створена Tennis for Two для розваги відвідувачів, які прийшли на день відкритих дверей до Брукхейвенської національної лабораторії.

Важливою віхою у розвитку комп'ютерної графіки стала поява пристроїв уведення інформації. Американський учений Айвен Сазерленд створив програму Sketchpad, працюючи в якій користувач міг малювати на екрані фігури за допомогою стілусу на фотоелементах. Отримані малюнки можна було зберегти та завантажити у пам'ять повторно. В основі багатьох алгоритмів сучасних програм лежать процеси, вигадані Сазерлендом у 60-х роках XX ст.

Активного розвитку комп'ютерна графіка отримала, як у ній побачили потенціал багатомільйонні корпорації. Наприклад, компанія Boeing використала CG для дослідження вібрації фюзеляжу літака. А компанія Renault доручила своєму інженеру П'єру Безьє розробити технологію проектування корпусів машин. Математичні моделі, які створив інженер, отримали його ім'я – так з'явилися криві Безьє.

У сімдесяті роки графіка почала робити перші кроки до фотореалізму. З'явився алгоритм визначення видимої поверхні — тепер те, що бачив користувач на екрані, залежало від його кута огляду. Якщо об'єкт «будинок» знаходився за предметом «огорож», то глядач бачив об'єкт «огорожу» повністю, а об'єкт «будинок» лише частково. З'явилися технології шейдингу (за допомогою bump-тектур прості об'єкти стали здаватися рельєфнішими) і знаменита тестова модель «Чайник з Юти» (див. нижче). З'явилися аркадні ігри Pong, Space Invaders, Gun Fight. Джордж Лукас почав створювати оригінальну трилогію «Зоряних війн».

У 1980-ті, завдяки аркадним автоматам, ігри стали доступні широкій аудиторії.З'явилися персональні комп'ютери з графічним інтерфейсом користувача. Процесори ставали потужнішими, удосконалювалися технології рендерингу зображення, з'явилася технологія глобального освітлення, хромакей. У фільмі "Молодий Шерлок Холмс" з'явився перший персонаж, створений за допомогою комп'ютерної графіки у графічному редакторі студії Pixar. На створення 30 секунд інноваційної анімації пішло півроку.

У наступному десятилітті графічні процесори еволюціонували настільки, що домашні комп'ютери стали здатні рендерувати картинку, для якої раніше були потрібні місяці роботи великих студій. З'явилися технології OpenGL та DirectX, ігрові приставки, 3D-перегони та 3D-файтинги. У 1995 році Pixar випустила "Історію іграшок" - першу повнометражну комп'ютерну анімацію.

У 2000-х реалістичність комп'ютерної графіки досягла такого рівня, що з'явився термін «ефект зловісної долини» — розробники зрозуміли, що якщо штучно створений персонаж схожий на людину, це починає відштовхувати глядача. Згадайте, наприклад, Соніка чи персонажів із мюзиклу «Кішки». З'явилася можливість перерозподілу математичних обчислень із центрального процесора на графічний процесор відеокарти, що збільшило точність та продуктивність рендеру.

У 2013 році Google випустила на масовий ринок перші очки доповненої реальності. Однак було б неправильно назвати цю технологію новинкою. Перший наголовний дисплей створив вже знайомий нам Айвен Сазерленд ще 1966 року. Головне, чому цим пристроям так довго довелося чекати свого часу, — це технологічні обмеження та ціна. Згодом окуляри віртуальної реальності стали компактнішими і дешевшими, що дозволило VR стати однією з найперспективніших ніш на IT-ринку.

Де застосовується комп'ютерна графіка

Багато галузей неможливо уявити без комп'ютерної графіки. Весь контент у сучасних додатках це комп'ютерна графіка, якщо це не програмний код або звук.

Індустрія розваг
CG потрібна для створення оточення (від реалістичного до стилізованого), персонажів, спецефектів та інтерфейсів. наприклад, у кіно все частіше використовують ігровий движок Unreal Engine.

Сфера мистецтва
Двовимірна графіка зробила революцію і в світі мистецтва, надавши художникам новий спосіб для вираження ідей. Художники використовують графічні пакети для створення картин, ілюстрацій та анімації. не тільки знання Photoshop, а й вільне володіння пакетами 3D-моделювання, уміння накладати текстури та генерувати частинки.

За кілька десятиліть використання комп'ютерної графіки стало настільки поширеним, що багато галерей світу оцифрували свої витвори мистецтва та пропонують відвідувачам віртуальні тури музейними залами.

Проектування та будівництво
Архітектори, інженери та дизайнери використовують графічні пакети для створення реалістичних цифрових макетів будівель та інтер'єрів.Цифрові плани будинків дозволяють спроектувати одразу кілька варіантів дизайну, проаналізувати безпеку для майбутніх мешканців та оцінити загальну естетику проекту.

Реклама
Комп'ютерна графіка використовується в рекламі для створення візуально привабливого контенту, який запам'ятається цільовій аудиторії. Чим вища впізнаваність бренду, тим легше його просувати. CG використовується в рекламі для створення логотипів, сайтів, програм, упаковки продуктів, буклетів та анімаційних відеороликів.

Медицина
Сфери використання комп'ютерної графіки не обмежуються розважальним контентом. Комп'ютерна графіка відіграє у таких методах медичної візуалізації, як комп'ютерна томографія (КТ), магнітно-резонансна томографія (МРТ) і ультразвук. Алгоритми CG використовуються для покращення якості зображення за рахунок зменшення шуму, покращення контрастності та виправлення артефактів. 3D-технологія стала особливо корисною в ортопедичній та черепно-лицьовій хірургії. Інша важлива для медицини CG-технологія – це симуляція. Хірургічні симулятори створюють віртуальне середовище, де студенти-медики можуть виконувати навчальні операції на віртуальних пацієнтах.

Наука
Тривимірна графіка та 2D використовуються у наукових дослідженнях для візуального представлення складних даних та явищ. За допомогою CG вчені створюють докладні візуалізації наукових концепцій, моделей, симуляцій та результатів експериментів. Це полегшує обмін інформацією між дослідниками у різних галузях, включаючи фізику, хімію, біологію, астрономію, геологію та медицину.

Освіта
Використовуючи інтерактивну графіку, викладачі можуть зробити заняття більш наочними та цікавими.Ілюстрації, презентації, анімація та 3D-моделі допомагають студентам краще зрозуміти абстрактні ідеї, природні явища та перебіг історичних подій.

Основні види комп'ютерної графіки

Комп'ютерну графіку можна розділити на два великі напрямки: двомірну та тривимірну 2D-зображення плоске, тоді як у 3D-об'єктів з'являється третій вимір — глибина 3D сьогодні набирає великої популярності, але двомірну графіку витіснити з ринку складно, без 2D не створити концепти. текстури та інший контент, необхідний виробництва тривимірної графіки.

Двовимірна графіка (2D)

Двовимірну графіку можна розділити на великі групи.

Цікавий приклад застосування растрової графіки - це піксель-арт, який сьогодні можна побачити в інди-іграх, анімації та графічному дизайні. Це форма цифрового мистецтва, де для створення зображень використовуються пікселі. утворюють кольорові мозаїки. Ця технологія з'явилася в ранніх комп'ютерних іграх 1980-х років через технічні обмеження того часу. — Екрани просто не були розраховані на більш досконалу графіку. Але широко використовується і в наші дні завдяки своїй естетичності та невибагливості до ресурсів.

Растрові графічні редактори: Adobe Photoshop, GIMP, Krita, PhotoFiltre, Paint.NET та Canva.

Векторна графіка
На відміну від растрової графіки, вектор використовує математичні рівняння, які визначають положення точок, ліній, кривих, форм і кольорів.Тому головною перевагою векторної графіки є створення плавних і масштабованих зображень. Розмір векторних зображень можна змінювати без втрати якості. Така графіка найчастіше використовується для створення ілюстрацій, інфографіки, логотипів та креслень. Проте, витіснити растрову графіку з ринку непросто — растрові зображення краще справляються з фотореалістичністю.

Векторна графіка знайшла широке застосування у друкарні - мистецтві створення шрифтів. Якщо растрові шрифти проектуються під заздалегідь відомий розмір, векторні можна збільшувати або зменшувати до будь-якого розміру. Ергономічні шрифти, розміри, стилі, інтервали та вирівнювання використовуються для створення візуально привабливого та читаного тексту у графічному дизайні, рекламі, веб-дизайні та друкованих ЗМІ.

Векторні графічні редактори: Adobe Illustrator, CorelDraw, Inkscape та Figma.

Тривимірна графіка (3D)

Існує кілька способів створити 3D-модель. Кожен із них має свої плюси і встиг зайняти свою нішу у сфері тривимірної графіки. Нижче розберемо кілька цікавих прикладів.

Створення примітивів
Примітив - це мінімалістична тривимірна фігура (куб, сфера, циліндр, піраміда), яку можна створити в будь-якому 3D-пакеті в два кліки. Примітиви часто використовуються для блокінгу – підготовчого етапу моделювання, на якому геймдизайнер, рухаючись від загального до приватного, створює силует персонажа або план локації для гри.

Полігональне моделювання
У будь-якій точці (їх у полігональному моделюванні ще називають вертекси) у просторі є три координати: x, y, z. Якщо взяти три вертекси і з'єднати їх між собою, вийде трикутник полігон. Часто полігонами називають два трикутники, які утворили квадрат, а окремий трикутник - трис.Сумарна кількість полігонів в об'єкті або сцені називають «полікаунт». Переміщуючи точки в просторі і створюючи нові полігони, художники створюють різні об'єкти — від персонажів до об'єктів архітектури.

NURBS-моделювання
Моделювання 3D-об'єктів з кривих часто порівнюють з векторною 2D-графікою. перерахує математичну формулу та оновить 3D-об'єкт. у інженерів-конструкторів під час створення технічних креслень.

Скульптинг
Цей спосіб схожий на полігональне моделювання у пакетах 3ds Max або Autodesk
Maya, але у вас в руках інші інструменти. Замість маніпуляторів переміщення, обертання та масштабування у ZBrush у вас набір кистей. людей, тварин та вигаданих істот.

Процедурне моделювання
Створення об'єктів у тривимірній графіці відбувається не тільки при редагуванні об'єкта безпосередньо (як, наприклад, у випадку зі скульптингом). , імітації природних явищ, симуляції руйнувань та інших цілей. пакетів, як Houdini, Blender, Cinema 4D, Modo, SpeedTree.

Фотограмметрія
Ще один спосіб створення 3D-моделі - відтворення об'єкта за фотографіями, зробленими з кількох ракурсів. Фотографії завантажуються в спеціальну програму (наприклад, RealityCapture або 3DF Zephyr) і на виході виходить реалістична високополігональна модель, що досить близько передає деталі оригіналу. Однак, автоматично згенерована сітка полігонів буде далекою від ідеальної: щоб використовувати такі моделі для ігор та фільмів, їх доведеться доопрацювати та почистити від артефактів.

Симуляція
Для спецефектів згідно законів фізики (політ стріли в Skyrim, відскок м'яча у FIFA, зіткнення машин у GTA) вам потрібно створити симуляцію. Для цього у сцені розробляється спеціальний об'єкт із відповідними налаштуваннями. Наприклад, для отримання реалістичного багаття знадобиться вказати кількість частинок, їх колір та напрямок руху. Комп'ютер розрахує, як частинки рухатимуться і що станеться у кожному кадрі, коли ми запустимо рендер. Анімація вогню, диму, вибухів, коливання води та поведінки об'єктів у 3D-сцені робиться за допомогою симуляцій, і це не повний перелік можливостей, які представляє комп'ютерна графіка.

Воксельне моделювання
Воксель - це піксель, який отримав третій вимір. Вперше вокселі з'явилися в медицині для відображення результатів комп'ютерної томографії. Після цього рендеринг на основі вокселів почали використовувати в іграх та кіно. Вище ми розповідали про піксель-арт — популярний напрямок 2D-арту. У 3D є щось схоже – воксель-арт. Приклади ігор, що використовують комбінацію воксель-арту та полігональних моделей: Monument Valley, Minecraft, Roblox.

Майбутнє комп'ютерної графіки