Jak mogę obracać sprite'y sztuki pikseli bez zrujnowania estetyki?

12

Jestem teraz przed ogromnym pytaniem „Game Design”. Tworzę grę pikselowo-graficzną, a interpolacja dwuliniowa może rozwiązać wiele problemów z animacją. Z drugiej strony nie jest to już „gra pikselowa”.

Jeśli użyję interpolacji dwuliniowej, animacja działa, ale wygląda na „hybrydową”, a styl artystyczny gubi się. Albo popsuję moje animacje, albo psuję styl artystyczny. Nie mogę mieć obu.

Czy istnieje inny sposób na rozwiązanie tego problemu?

wprowadź opis zdjęcia tutaj

OC_RaizW
źródło
4
To jest twoja gra, decydujesz :)
Vaillancourt
Czy interpolacja „mono-liniowa” (zwykle nazywana po prostu „interpolacją liniową”) jest opcją?
Philipp
1
Przeredagowałem pytanie, aby brzmiało mniej oparte na opiniach.
Filipiny
czekaj, co? nie muszę tego zatwierdzać? : D
OC_RaizW,
1
Istnieje również możliwość obracania przez ścinanie , które przesuwa piksele wejściowe bez ich powielania / eluowania / mieszania.
DMGregory

Odpowiedzi:

14

Automatyczny obrót grafiki pikselowej o kąty inne niż 90 ° zwykle nie działa. Jeśli chcesz zachować estetykę pikselową, zwykle nie możesz przerysować rysowania swojej sztuki pod każdym kątem.

Jeśli używasz faux-retro, w którym twoje duszki są w rzeczywistości w znacznie wyższej rozdzielczości niż wyglądają, możesz czasem uciec od ich skalowania o współczynnik całkowity bez interpolacji w edytorze graficznym, a następnie obracania ich w interpolacji liniowej w czasie wykonywania. Aby uniknąć rozmycia duszków w oryginalnej orientacji, zawsze upewnij się, że pozycja rysowania jest zaokrąglona do najbliższej liczby całkowitej (niektóre silniki graficzne / ramy / biblioteki pozwalają rysować duszki na współrzędnych zmiennoprzecinkowych, co często powoduje rozmycie). Ale zwykle jest to po prostu leniwy zamiennik, który nie osiąga jakości, którą można osiągnąć przy pracy ręcznej.

Oto przykład duszka w oryginalnym rozmiarze, powiększonego o współczynnik 3 bez interpolacji, a następnie obróconego o 30 ° z interpolacją liniową:

wprowadź opis zdjęcia tutaj

Philipp
źródło
1
Zasadniczo każdy „piksel” staje się 10x10 pikseli czy coś takiego?
John
2
@John tak, to mam na myśli faux-retro. 10x10 może być nieco duże (oczywiście w zależności od rozdzielczości platformy sprzętowej, na którą celujesz), ale w zasadzie taki jest pomysł. Masz duszka, który wygląda jak dzieło sztuki pikseli 16 x 32, ale w rzeczywistości jest teksturą 48 x 96, a każdy „widoczny” piksel ma w rzeczywistości 3 x 3 piksele tego samego koloru.
Philipp
to było tak samo, jak myślałem ....
OC_RaizW
to samo podejście zastosowano w grze Starbound, kiedy „widoczne” piksele były w rzeczywistości kwadratami rzeczywistych pikseli 3 x 3
trollingchar
16

Spójrz na RotSprite .

RotSprite to algorytm skalowania i obrotu dla duszków opracowany przez Xenowhirl. Generuje o wiele mniej artefaktów niż algorytmy rotacji najbliższego sąsiada i podobnie jak EPX, nie wprowadza do obrazu nowych kolorów (w przeciwieństwie do większości systemów interpolacji).

Przykład RotSprite

Algorytm najpierw skaluje obraz do 8-krotności jego oryginalnego rozmiaru za pomocą zmodyfikowanego algorytmu Scale2 ×, który traktuje podobne (a nie identyczne) piksele jako dopasowania. Następnie oblicza, jakiego przesunięcia obrotu użyć, faworyzując próbkowane punkty, które nie są pikselami granicznymi. Następnie obrócony obraz jest tworzony za pomocą algorytmu skalowania i obrotu najbliższego sąsiada, który jednocześnie zmniejsza duży obraz z powrotem do pierwotnego rozmiaru i obraca obraz. Wreszcie przeoczone szczegóły pojedynczego piksela są przywracane, jeśli odpowiadający piksel na obrazie źródłowym jest inny, a piksel docelowy ma trzech identycznych sąsiadów.

Możesz albo zaimplementować ten algorytm samodzielnie jako część kodu rysunkowego gry, albo użyć go do wcześniejszego utworzenia obróconych zasobów. Narzędzie do tworzenia grafiki pikselowej Aseprite zintegrowało RotSprite jako część edytora ikonek.

GIF rotsprite w akcji

Zapoznaj się również z tym wątkiem na forum Unity dotyczącym korzystania z RotSprite w Unity, a także z bardziej ogólnymi informacjami na temat RotSprite.

Rudey
źródło
Jezu. pobrałem to dla jedności i przetestowałem - i wynik jest znacznie gorszy niż zwykłe renderowanie pikseli jedności .. Ale dzięki
OC_RaizW
@OC_RaizW To nie powinno się zdarzyć. Możesz skontaktować się z deweloperem zasobu Unity.
Rudey,
-4

w lewym górnym rogu strony znajduje się opcja: automatyczny wybór: grupa i warstwa. wybierz opcję warstwy, a następnie obróć. w taki sposób nikt ci nie mówi.

Mahdi
źródło
4
O którym edytorze zdjęć mówisz? Pytanie nie wymienia żadnego konkretnego narzędzia. Jeśli więc znasz edytor obrazów, w którym obracanie ikonki o niskiej rozdzielczości przy minimalnej utracie jakości jest tak łatwe, powiedz nam, do której z nich odnoszą się te instrukcje.
Filip