Що робить масштабування піксельного мистецтва відмінним від інших зображень?


13

Нещодавно я тренував розробника, який новачок у створенні піксельних арт-ігор, і зрозумів, що існує якась «загальноприйнята мудрість» щодо масштабування піксельного мистецтва, що не очевидно для новачків, і може бути недостатньо задокументованим. Отже, ось спроба виправити це….


  1. Я чув, що слід масштабувати піксельне зображення лише на 200%, 300% тощо, а не на розмірах, таких як 120%

    • Чому так? Чи не слід масштабувати "просто працювати" так, як це робиться з іншими зображеннями?
    • Що робити, якщо мені дійсно потрібно зробити свого персонажа лише на частку більшим чи меншим, щоб отримати правильний геймплей чи вигляд? Як це виправити?
  2. Мені кажуть, що в одній грі "погано" використовувати піксельне зображення в різних масштабах - чому?

    • Наприклад, якщо я збільшив масштаб свого персонажа, тож кожен текстовий спрайт - це пікселі екрану 4х4, тоді як фонове мистецтво збільшується вгору, так що кожен текстовий спрайт - 6x6 пікселів екрана. Чи не піксель - це піксель наприкінці дня?

Відповіді:


31

Масштабування на цілі числа

Масштабування на 2x, 3x ... n x проста - кожен піксель просто стає n x n квадратом пікселів, а вигляд оригінального спрайту чудово зберігається (включаючи всі гострі лінії, кути та сходові зигзаги) .

Ми стикаємося з проблемою, хоча під час масштабування піксельної графіки дробовими сумами (наприклад, 1,5x), оскільки пікселі за своєю суттю дискретні. Насправді ми не можемо мати "півпікселя".

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

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

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

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

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

Приклад артефактів із використання нецілої шкали

Якщо нам справді потрібен спрайт на 150% більше (скажімо, для того, щоб геймплей почувався правильним або підтримував альтернативні роздільні можливості дисплея ), тоді ми можемо перефарбувати проблемні області, як, наприклад, справа. Тепер це більше схоже на те, що зробив би художник, і стилістично відповідає іншому мистецтву в грі. (Хоча я і сам не великий піксельний виконавець, тому все одно може бути краще 😉)

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


У бік: дробові ваги можуть також з’являтися під час виконання .

Уявіть, що ваша гра в роздільній здатності NES (256 x 240), і ви хочете відобразити її на екрані 1080p.

1080 ÷ 240 = 4,5, тож деякі вихідні пікселі або "текселі" у вашій сцені роздуваються до 5 пікселів на екрані, а інші - лише 4, створюючи спотворення, як ми бачили вище. У русі вони, як правило, роблять брижі і мерехтять відволікаючими, без очевидних причин:

Приклад рухомого масштабу гриба, що демонструє артефакти

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

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

Підтримуючи стійкість піксельної шкали

Це "правило" зводиться до стилістичної послідовності.

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

Приклад масштабування активів по-різному в одній грі

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

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

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

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

Але чи треба?

Ні, не дуже. Це ваша гра, і ви можете зробити так, як вам хочеться.

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

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

Останнє врахування полягає в тому, що багато піксельних арт-ігор мають дуже точний геймплей. Подумайте про перестрибування між одноблоковими платформами в ранніх іграх Mega Man. У таких ситуаціях послідовна піксельна сітка (і плитка сітки) може бути важливою підказкою для гравця при судженнях та виконанні їхніх рухів. Введення нерегулярності в мистецтві може насправді ускладнити гру в навчанні, що може бути неприємно.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.