Масштабування мого піксельного арт-платформа з 720p до 1080p


12

Я розробляю піксельний арт-2D платформер для ПК та смартфонів, але я застряг у технічному питанні.

Я вирішив мати роздільну здатність плитки 32x32 та спрайт 64x64 символів. Рівні розділені на розділи, які я називаю "екрани", і в кожному екрані у мене є плитки розміром 40x22,5, приблизно приблизно 40x23, тому мінімальна роздільна здатність - 1280x720.

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

Тут виникає питання: 1280x720 - не дуже висока роздільна здатність. На моніторах HD вікно було б не великим, і якщо я збільшить роздільну здатність на 2x, це буде в 2560x1440, і вікно буде набагато більше, ніж фактичний HD-монітор. Якщо я спробую розміри між 1280x720 і 2560x1440, графіка починає заїкатися або деформується.

Як я можу вирішити це питання? Чи є рішення, яке не вимагає від мене перемальовувати всі плитки та спрайти у форматі 16х16?


Чи зменшення роздільної здатності, але переміщення камери на екран прийнятним вибором дизайну? тобто роздільна здатність зараз 640 x 360, однак ваші екрани все ще 1280x720, але вам потрібно рухатись по кімнаті, на кшталт Metroid або Axiom Verge?
lozzajp

Ви не в тому місці, навіть якщо це 2d гра, вам потрібно визначити камеру. Таким чином, камера визначає роздільну здатність перегляду, фокус і кути, а ви представляєте дані просто на камеру. Таким чином ваша гра не реалізується
Yosh Synergi


Просто намагаюся бути впевненим, в чому саме полягає проблема. Ви говорите про це, оскільки ваш дисплей карти 1280X720 менший, ніж, наприклад, дисплей монітора 1920X1080, тоді ви хочете збільшити масштаб відображення карти на максимально повний екран? Я розгублений, оскільки малювання плиток 16X16 все одно не вирішить проблему (наскільки я це розумію).
RobM

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

Відповіді:


16

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

Приклад масштабування сцени мистецтва пікселів, що демонструє артефакти

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

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

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


На жаль, співвідношення 1,5x між 720p та 1080p - це найгірший сценарій, з яким ми можемо зіткнутися.

Як ви зазначаєте, масштабування 1x є занадто малим, а 2x - занадто великим, настільки ж широким відривом в обох напрямках, і між нами не може бути вибрано коефіцієнт масштабування з цілим числом .

Ваші параметри зводяться до:

  • Терпимо 1 шкала , показуючи свою гру у вікні на 1/3 менше екрана, додаючи декоративні рамки, якщо потрібно заповнити простір.

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

      (наприклад, це дає гравцям на деяких пристроях несправедливу перевагу чи дає їм помітити секрети, які вони не повинні бачити так легко?)

  • Збільште масштаб на 2 рази і обріжте свою сцену , щоб гравець бачив менше сцени за раз (приблизно 3/4, наскільки вони могли бачити раніше).

    Це теж може вплинути на гру гри, наприклад. через те, що гравцеві важко бачити місця, в які вони повинні двічі стрибати.

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

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

  • Створіть альтернативні активи з різною роздільною здатністю . (Так, це велика робота, але ви надаєте найбільш оптимальні можливості контролювати зовнішній вигляд гри)

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

    • Як зазначаєте, перемальовування всіх ваших активів у розмірі наполовину ( 16х16 плиток, 32х32 символів ) дозволить вам обробляти 720p у масштабі 2x та 1080p у 3-кратній шкалі з такою ж кількістю плиток, як показано зараз. Ви можете здати, що невелика роздільна здатність плитки візуально більш обмежує.

    • Ви також можете намалювати альтернативний набір ресурсів "великого формату", який на 150% більший ( 48x48 плиток, 96x96 символів ), який би обробляв 1080p в масштабі 1x. (Ви б використовували наявні активи для 720p або 1440 тощо). Більша роздільна здатність повинна допомогти вам зберегти вірність свого сучасного мистецтва, тому вам не доведеться жертвувати стилем та деталями, які ви маєте зараз.

      Приклад активу, переробленого в масштабі 150%

    • Третій варіант - намалювати лише трохи менший набір активів ( 24x24 плитки, 48x48 символів ), який може обробляти 1080p в масштабі 2x, і знову може означати менше жертви деталізації, ніж удвічі менший за всі розміри активів.

      Усі три варіанти дозволять вам зберегти обрамлення та геймплей абсолютно однаковими при 720 та 1080, але ціною приблизно вдвічі більше працювати.

Тож, на жаль, тут немає легкої виграші, просто різні компроміси.


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

3

Розробляємо спеціально на варіанті @ DMGregory створення альтернативних активів за різною роздільною здатністю:

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

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

В обох випадках ідея полягає у використанні інструменту, щоб зробити основну частину роботи за вас і зосередити зусилля людини на решті деталей. Як сказав @DMGregory, "тут немає простої виграші, просто різні компроміси".


Редагувати щодо дробового масштабування: Більшість алгоритмів масштабування піксельних зображень збільшуються лише на цілі числа. Окрім прокрутки власного алгоритму масштабування, вам, мабуть, знадобиться поєднувати масштаб і зменшення масштабу, щоб отримати 1,5-кратну зміну, яку ви шукаєте. В якості довідки, ось результат поєднання алгоритму scale3x до високого рівня та алгоритму fant для зниження шкали на 50%:

Оригінал:

введіть тут опис зображення

Масштаб:

введіть тут опис зображення


На жаль, більшість алгоритмів масштабування піксельних зображень, які я знайшов, як і раніше мають тенденцію обробляти лише масштабне збільшення (зазвичай 2x, 3x, 4x), тому вони не дуже допомагають у випадку 720-> 1080. (Можливо, можна було б скористатися 3-кратним пікселем, а потім зменшити вдвічі…? Не впевнений, чи виглядатиме це краще чи гірше, ніж пряме підвищення)
DMGregory

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

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