Jak zmniejszyć skalę grafiki pikselowej?


14

Istnieje wiele algorytmów do skalować się pixel art. (Osobiście wolę hqx .) Ale czy istnieją jakieś znaczące algorytmy pozwalające go zmniejszyć ? Moja gra ma działać w rozdzielczości 1280x720, ale jeśli gra się w niższej rozdzielczości, nadal chcę, aby wyglądała dobrze.

Większość dyskusji na temat grafiki pikselowej koncentruje się wokół 320x200lub na 640x480skalowaniu do użytku w emulatorach konsoli, ale zastanawiam się, jak nowoczesne gry 2D, takie jak remake Monkey Island, mogłyby dobrze wyglądać w niższych rozdzielczościach?

Oczywiście ignorując opcję posiadania wielu wersji zasobów (np. Mipmapping ).


Mapowanie nie wymaga wielu wersji zasobów; można to zrobić automatycznie w czasie ładowania zawartości przez OpenGL lub DirectX. Czy to spełni twoje cele?
Seth Battin,

@SethBattin Nie jestem pewien. Myślę o uruchomieniu gry stworzonej dla 1280x720 np. 1024x576. Czego używają OpenGL i DirectX do przeskalowania, jeśli dam mu obraz, który ma wymiary 128 x 96 i ma być wyświetlany w formacie 102 x 76? (co jest nawet problemem zaokrąglania, ponieważ powinno mieć 102,4 x 76,8 pikseli)
Michael Stum

Mipmapping bardzo często rozmywa obraz. Nie chciałbyś tego dla pixelart.
Kromster

5
Po prostu FYI: Remake Monkey Island nie wymagał skalowania w dół. Gra działała na EGA i miała efektywny rozmiar 320 x 200 pikseli. Nie ma potrzeby tworzenia zmniejszonych wersji tego urządzenia na urządzenia mobilne, ponieważ jest ono już mniejsze niż rozdzielczość, jaką mają obecnie te urządzenia.
bummzack

2
Jak wygląda twoja grafika pikselowa? Prosisz nas o odpowiedź w ślepocie.
aaaaaaaaaaaa

Odpowiedzi:


14

Obecnie tworzę grę, która musi działać na wielu różnych rozmiarach i proporcjach ekranu i nie był to łatwy proces. Ponadto, jeśli tworzysz rzeczy w sztuce pikseli i chcesz zachować wrażenie sztuki pikseli przy jednoczesnym wspieraniu wielu rozdzielczości, wkraczasz w świat bólu, więc bądź przygotowany.

Moim zdaniem jest kilka rzeczy, które możesz zrobić (niektóre są ekskluzywne, a inne nie)

  1. Zdefiniuj minimalną rozdzielczość i zwiększaj skalę (wszystko) w liczbach całkowitych do najbliższego sąsiada. W ten sposób możesz zachować wrażenie sztuki pikseli. Nie sądzę, aby zmniejszanie skali było dobrym pomysłem, ponieważ stracisz szczegóły, a cały cel używania starannie spreparowanej grafiki pikselowej zostanie pokonany. Jeśli minimalna obsługiwana rozdzielczość jest zbyt mała dla duszków, zmień minimalną obsługiwaną rozdzielczość lub przerysuj wszystkie zasoby, aby obsługiwać tę minimalną rozdzielczość.

  2. Gdy pojawi się rozdzielczość lub proporcje obrazu, które nie wystarczą na cały ekran, rozszerz swoją grę (pokaż więcej kafelków), zachowując jednocześnie nienaruszone zasoby. Powinieneś stworzyć swoją grę, aby była ona nadal dostępna przy minimalnym współczynniku rozdzielczości / proporcji.

  3. Jeśli przedłużenie gry nie jest możliwe, wypełnij nie-gry sekcje ekranu kolorem czarnym; albo paski u góry i u dołu, z lewej i prawej strony lub czarna ramka. To właśnie robi iPad, gdy działają aplikacje iPhone'a w trybie powiększenia. Jest to również szeroko stosowane w emulatorach.

  4. Zrezygnuj z pozostawania wiernym siatce pikseli. Ale musisz przestać używać zasobów pikselowych z ostrymi narożnikami. Następnie przeskaluj w górę / w dół za pomocą filtrowania dwuliniowego (lub optymalnie bicubic, jeśli Twoja platforma to obsługuje). Jest to najlepszy wybór dla maksymalizacji wykorzystania ekranu, przy jednoczesnym utrzymaniu wygody użytkowania we wszystkich obsługiwanych rozdzielczościach.

W mojej grze ostatecznie wybrałem opcję 4 i jestem zaskoczony, jak dobrze wygląda na urządzeniach od 320 pikseli w pionie (stary Android 2.3) do 1536 pikseli w pionie (iPad 2012 z wyświetlacz Retina). Oryginalne zasoby są przeznaczone dla 600 pikseli w pionie (pierwotnie dla wyświetlania 800 x 600 na komputerze z systemem Windows). Chociaż w kolejnych grach myślę, że lepsza logiczna rozdzielczość pionowa to 720 pikseli.

Gra korzysta z wirtualnej wysokiej rozdzielczości wirtualnej 600 pikseli, skalowanej do natywnej rozdzielczości urządzenia z dwuliniowym filtrowaniem. Oznacza to, że wszystkie współrzędne Y w kodzie idą od 0 (u góry ekranu) do 600 (u dołu ekranu).

W przypadku rozmiaru poziomego przypuszczam, że maksymalna szerokość wynosi 1080 pikseli, co jest więcej niż wystarczające, aby pokryć nawet najszersze proporcje 16: 9. Moje współrzędne x są wyśrodkowane, więc x = 0 jest środkiem ekranu, a współrzędne x idą od -540 po lewej do 540 po prawej. Upewniam się, że wszystko mieści się w zakresie od -400 do 400, aby obsługiwać najwęższe wyświetlacze (4: 3)

Gdybym jednak musiał zachować wrażenie sztuki pikselowej, z pewnością skorzystałbym z opcji 1 i 2. Oznacza to, że skalowałbym tylko liczby całkowite, aby zachować blokowe wrażenie sztuki pikseli i zaprojektować grę tak, aby ilość widocznego kafelki nie są stałe i można je dostosować do dowolnej rozdzielczości ekranu / współczynnika proporcji.

Tak więc, aby (nie) odpowiedzieć na twoje pytanie. Myślę, że zmniejszanie pikseli w pikselach to bardzo zły pomysł, więc nie powinieneś tego robić. Istnieją inne sposoby obsługi różnych rozdzielczości ekranu, które zapewnią lepsze wyniki niż zwykłe rzeźenie starannie zaprojektowanej sztuki.


Jestem w tej samej sytuacji i doprowadza mnie to do szału. Nasza gra to pixelart stworzony na ekran o wysokości 600 pikseli. Ale jeśli przeskaluję do ekranów 720p (PC), otrzymam naprawdę okropny, lekko zamazany wygląd. Naprawdę nie wiem, co tu robić. Pomyślałem też o stworzeniu większej mapy dla ekranów 720p i zachowaniu takiej samej pixelart, ale mam ten sam problem z ekranami 1080p. Myślę, że powinniśmy byli zrobić piksele 360p (lub mniejsze), więc mielibyśmy idealne skalowanie x2 i x3 dla ekranów 720 i 1080p. Teraz jest już na to za późno. Wszelkie dalsze pomysły lub porady?
Damian,

8

Rozważ faktyczne wygenerowanie pomniejszonych wersji w czasie programowania i włączenie ich bezpośrednio do gry jako zasobu. Zrób to za pomocą Photoshopa lub dowolnego narzędzia, które znajdziesz, tworząc to, co lubisz. Następnie pozwól grze dynamicznie wybrać odpowiedni zestaw artystyczny odpowiedni do bieżącej rozdzielczości.

Oto kilka powodów, dla których możesz to zrobić ...

Oszczędza przetwarzanie pracy

Jeśli programowo przeprowadzasz przeskalowanie w czasie wykonywania, oprogramowanie prawdopodobnie utworzy i buforuje kompozycję. Dlaczego więc nie po prostu zawrzeć zmniejszonych wersji w pakiecie zasobów sztuki? Podejrzewam, że jeśli zwiększy to pobieranie, niż byś chciał, może to mieć znaczenie, ale zaoszczędzisz na obciążeniu procesora, zapisie na dysku itp.

Większa kontrola artystyczna

Jeśli przeskalujesz sztukę samodzielnie, będziesz mieć większą kontrolę nad ostatecznym wyglądem. To może nie mieć znaczenia, jeśli zmniejszysz niewielką ilość, ale gdy dojdziesz do znacznie niższych rozdzielczości, możesz chcieć mieć lepszą kontrolę artystyczną nad ostatecznym wyglądem. Na przykład, jeśli trzeba podkreślić oczy konkretnej postaci, możesz narysować wersje o niższej rozdzielczości z oczami nieskalowanymi tak mocno, aby zachować efekt - coś, czego nie może zrobić skalowanie programowe.

Dynamiczne skalowanie nie jest idealne

Możesz podejmować charakterystyczne decyzje artystyczne, które nie działają przy dynamicznym skalowaniu. Załóżmy na przykład, że chcesz umieścić obramowanie, kontur lub podświetlenie wokół obrazu. W przypadku wyższej rozdzielczości może to wyglądać dobrze, ale zmniejszona wersja może być mętna lub całkowicie utracić efekt. Ale jeśli zrobisz to ręcznie, możesz osobiście zastosować efekt do każdego rozmiaru i zagwarantować, że zachowasz wpływ.

inne przemyślenia

Można również zastosować podejście hybrydowe, z zestawem zasobów specyficznych dla rozdzielczości, które są używane tam, gdzie zostały znalezione, oraz z zestawem ogólnym, który jest dynamicznie skalowany, jeśli nie zostanie znaleziona wersja specyficzna dla rozdzielczości. To trochę tak, jak działa platforma Android. Kilka informacji na ten temat na stronie http://developer.android.com/guide/practices/screens_support.html


0

Zmiana rozmiaru jest łatwiejsza niż zmiana rozmiaru, ponieważ wybierasz informacje, które chcesz wyrzucić, zamiast wymyślać nowe (i być może niepoprawne) informacje, aby wypełnić luki. Mając to na uwadze, prawdopodobnie nie potrzebujesz tutaj niczego specjalnego, a większość standardowych algorytmów ponownego próbkowania z dziedziny przetwarzania obrazu powinna działać całkiem dobrze w celu skalowania obrazu: dwuliniowy, gaussowski, Lanczos itp.

Szczególnie Lanczos może być interesującym wyborem, ponieważ wyostrza obraz, zachowując możliwe szczegóły, które w przeciwnym razie zostałyby utracone podczas łączenia kilku pikseli w jeden. Oczywiście odbywa się to kosztem potencjalnie wprowadzenia niepożądanych artefaktów.

Kilka wizualnych porównań tutaj: /gis/10931/what-is-lanczos-resampling-useful-for-in-a-spatial-context


3
-1, ponieważ zmniejszanie grafiki pikselowej (na przykład ręcznie robionej piksel na piksel ) nigdy nie będzie wyglądać dobrze z żadnym z tych algorytmów. Dzięki podejściu najbliższego sąsiada stracisz ważne segmenty linii. Dzięki interpolacji uzyskasz rozmazane obrazy. Obawiam się, że nie ma satysfakcjonującej odpowiedzi na pytanie PO, z wyjątkiem robienia tego ręcznie.
bummzack
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.