Как я могу вращать спрайты пиксельной графики, не разрушая эстетику?

12

Я сейчас нахожусь перед огромным вопросом "Game Design". Я создаю игру pixel-art-ish, и использование билинейной интерполяции может решить множество проблем с анимацией. С другой стороны, это уже не «пиксельная игра».

Если я использую билинейную интерполяцию, анимация работает, но она выглядит «гибридной», и художественный стиль теряется. Либо я испортил свои анимации, либо испортил стиль искусства. Я не могу иметь оба, кажется.

Есть ли другой способ решить эту проблему?

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

OC_RaizW
источник
4
Это ваша игра, вы решаете :)
Vaillancourt
Является ли «монолинейная» интерполяция (обычно просто называемая «линейной интерполяцией») опцией?
Филипп
1
Я перефразировал вопрос, чтобы он звучал менее основанным на мнении.
Филипп
чего ждать? мне не нужно это утверждать? : D
OC_RaizW
1
Существует также возможность поворота путем сдвига , который перемещает входные пиксели без дублирования / исключения / смешивания их.
DMGregory

Ответы:

14

Автоматическое вращение пиксельной графики на углы, отличные от 90 °, обычно работает неправильно. Если вы хотите сохранить эстетику пиксельного искусства, вы обычно не сможете перерисовать ваше искусство под каждым углом.

Если вы используете искусственный ретро-стиль, в котором ваши спрайты на самом деле имеют гораздо более высокое разрешение, чем они выглядят, вы иногда можете избежать масштабирования их целочисленным коэффициентом без интерполяции в графическом редакторе, а затем поворачивать их в линейной интерполяции во время выполнения. Чтобы спрайты не размывались в исходной ориентации, всегда проверяйте, чтобы позиция рисования была округлена до ближайшего целого числа (некоторые графические движки / фреймворки / библиотеки позволяют рисовать спрайты по координатам с плавающей точкой, что часто приводит к размытию). Но обычно это просто ленивый заменитель, который не достигает качества, которого вы можете достичь с помощью ручной работы.

Вот пример спрайта в исходном размере, масштабированный в 3 раза без интерполяции, а затем повернутый на 30 ° с линейной интерполяцией:

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

Philipp
источник
1
По сути каждый «пиксель» становится размером 10х10 пикселей или что-то в этом роде?
Джон
2
@ Джон, да, вот что я имею в виду под faux-retro. 10x10 может быть немного большим (конечно, в зависимости от разрешения аппаратной платформы, на которую вы нацелены), но это в основном идея. У вас есть спрайт, который выглядит как 16х32 пиксельная графика, но на самом деле это текстура 48х96 с каждым «видимым» пикселем, фактически 3х3 пикселя одного цвета.
Филипп
это было примерно то же, о чем я думал ....
OC_RaizW
такой же подход был в Starbound, когда «видимые» пиксели были фактически квадратами 3х3 реальных пикселей
троллингчар
16

Посмотрите на RotSprite .

RotSprite - это алгоритм масштабирования и вращения для спрайтов, разработанный Xenowhirl. Он производит гораздо меньше артефактов, чем алгоритмы ротации ближайших соседей, и, подобно EPX, он не вводит новые цвета в изображение (в отличие от большинства систем интерполяции).

Пример RotSprite

Алгоритм сначала масштабирует изображение в 8 раз по сравнению с его первоначальным размером с помощью модифицированного алгоритма Scale2 ×, который рассматривает похожие (а не идентичные) пиксели как совпадающие. Затем он вычисляет, какое смещение вращения использовать, выбирая точки выборки, которые не являются граничными пикселями. Затем, повернутое изображение создается с помощью алгоритма масштабирования и поворота ближайшего соседа, который одновременно сжимает большое изображение до его первоначального размера и поворачивает изображение. Наконец, пропущенные детали одного пикселя восстанавливаются, если соответствующий пиксель в исходном изображении отличается и целевой пиксель имеет трех идентичных соседей.

Вы можете реализовать этот алгоритм самостоятельно как часть кода рисования в вашей игре, или использовать его для предварительного создания повернутых ресурсов. Инструмент пиксельной графики Aseprite интегрировал RotSprite как часть своего редактора спрайтов.

GIF rotsprite в действии

Кроме того, посмотрите на это ознакомьтесь с этой веткой форумов Unity о том, как использовать RotSprite в Unity, а также с более общей информацией о RotSprite.

Rudey
источник
господи. Я скачал это для единства и проверил его - и результат намного хуже, чем обычный пиксельный рендеринг
Unity
@OC_RaizW Этого не должно быть. Возможно, вы захотите связаться с разработчиком ресурса Unity.
Рудей
-4

В верхнем левом углу страницы есть опция: автоматический выбор: группа и слой. выберите вариант слоя, затем поверните. так никто не говорит.

мессия
источник
4
О каком графическом редакторе вы говорите? Вопрос не упоминает какой-либо конкретный инструмент. Так что, если вы знаете редактор изображений, где вращение спрайта с низким разрешением с минимальной потерей качества на самом деле так просто, пожалуйста, сообщите нам, к какому из этих инструкций применимы.
Филипп