Comment réduire le pixel art?

Il existe de nombreux algorithmes pour étendre le pixel art. (Je préfère hqx , personnellement.) Mais existe-t-il des algorithmes notables pour le réduire ? Mon jeu est conçu pour fonctionner à une résolution de 1280x720, mais s'il est joué à une résolution inférieure, je veux toujours qu'il ait l'air bien.

La plupart des discussions sur le pixel art se concentrent sur 320x200ou 640x480et la mise à l'échelle pour une utilisation dans les émulateurs de console, mais je me demande comment les jeux 2D modernes comme le remake de Monkey Island pourraient bien paraître sur des résolutions inférieures?

Bien sûr, ignorer l'option d'avoir plusieurs versions d'actifs (c'est-à-dire le mipmapping ).

Je fais actuellement un jeu qui doit fonctionner sur une grande variété de tailles d'affichage et de proportions, et ce n'a pas été un processus très facile. De plus, si vous faites des choses en pixel art et que vous souhaitez conserver la sensation du pixel art tout en prenant en charge de nombreuses résolutions, vous entrez dans un monde de douleur, alors soyez prêt.

À mon avis, il y a plusieurs choses que vous pouvez faire (certaines sont exclusives, mais d'autres ne le sont pas)

1. Définissez une résolution minimale et uniquement une mise à l'échelle (tout) en termes entiers avec le plus proche voisin. De cette façon, vous pouvez conserver la sensation du pixel art. Je ne pense pas que la réduction d'échelle soit une bonne idée, car vous perdrez des détails et tout le but de l'utilisation d'un pixel art soigneusement conçu sera vaincu. Si votre résolution minimale prise en charge est trop petite pour vos images-objets, modifiez votre résolution minimale prise en charge ou redessinez tous les actifs pour prendre en charge cette résolution minimale.

2. Lorsque vous rencontrez une résolution ou un rapport d'aspect qui n'est pas suffisant pour couvrir tout l'écran, prolongez votre jeu (montrez plus de tuiles), tout en gardant les actifs intacts. Vous devriez faire votre jeu pour qu'il soit toujours jouable avec le rapport résolution / aspect minimum.

3. Si l'extension du jeu n'est pas possible, remplissez les sections non-jeu de l'écran de noir; soit des rayures en haut et en bas, à gauche et à droite, ou un cadre noir. C'est ce que fait l'iPad lors de l'exécution d'applications iPhone en mode agrandi. Ceci est également largement utilisé dans les émulateurs.

4. Renoncez à rester fidèle à la grille de pixels. Mais vous devez alors cesser d'utiliser des ressources pixel arty avec des angles vifs. Ensuite, augmentez / réduisez l'échelle en utilisant un filtrage bilinéaire (ou bicubique optimal, si votre plate-forme le prend en charge). Il s'agit du meilleur choix pour maximiser l'utilisation de l'écran, tout en conservant une expérience utilisateur similaire pour toutes les résolutions prises en charge.

Pour mon jeu, j'ai fini par faire l'option numéro 4, et je suis assez surpris de voir à quoi cela ressemble sur des appareils allant de 320 pixels à la verticale (un ancien Android 2.3) à 1536 pixels à la verticale (un iPad 2012 avec affichage de la rétine). Les actifs d'origine sont destinés à 600 pixels sur la verticale (à l'origine pour un affichage 800x600 sur un PC Windows). Bien que pour les jeux suivants, je pense qu'une meilleure résolution verticale logique est de 720 pixels.

Le jeu utilise une haute résolution virtuelle virtuelle de 600 pixels, mise à l'échelle de la résolution native de l'appareil avec un filtrage bilinéaire. Cela signifie que toutes les coordonnées Y dans le code vont de 0 (haut de l'écran) à 600 (bas de l'écran).

Pour la taille horizontale, je suppose que la largeur maximale est de 1080 pixels, ce qui est plus que suffisant pour couvrir même les rapports d'aspect 16: 9 les plus larges. Mes coordonnées x sont centrées, donc x = 0 est le centre de l'écran, et les coordonnées x vont de -540 à gauche à 540 à droite. Je m'assure que tout se situe entre -400 et 400 pour prendre en charge les écrans les plus étroits (4: 3)

Cependant, si je devais garder la sensation de pixel art, j'utiliserais certainement les options 1 et 2. Cela signifie que je ne ferais que l'échelle en termes entiers pour garder la sensation de blocs du pixel art et concevoir le jeu de manière à ce que la quantité de visible tuiles n'est pas fixe et peut s'adapter à n'importe quel rapport résolution / aspect de l'écran.

Donc, pour (pas) répondre à votre question. Je pense que la réduction d'échelle du pixel art est une très mauvaise idée, vous ne devriez donc pas le faire. Il existe d'autres façons de prendre en charge différentes résolutions d'écran qui fourniront de meilleurs résultats que de simplement massacrer votre art soigneusement créé.

Envisagez de générer les versions réduites au moment du développement et de les inclure directement dans le jeu en tant que ressource. Faites-le avec Photoshop ou tout autre outil que vous trouvez crée ce que vous aimez. Demandez ensuite au jeu de sélectionner dynamiquement le jeu d'art approprié à la résolution actuelle.

Voici quelques raisons pour lesquelles vous pourriez le faire ...

Économise le travail de traitement

Si vous avez redimensionné par programme au moment de l'exécution, votre logiciel créera et mettra probablement en cache l'illustration de toute façon. Alors pourquoi ne pas simplement inclure les versions réduites dans le bundle d'actifs artistiques? Je suppose que si le téléchargement était plus volumineux que vous le souhaitiez, cela pourrait avoir de l'importance, mais vous économiserez sur la charge du processeur, les écritures sur disque, etc.

Un plus grand contrôle artistique

Si vous redimensionnez l'art vous-même, vous aurez un plus grand contrôle sur l'apparence finale. Cela peut ne pas faire de différence si vous réduisez une petite quantité, mais lorsque vous atteignez des résolutions beaucoup plus basses, vous souhaiterez peut-être un meilleur contrôle artistique sur l'apparence finale. Par exemple, si les yeux d'un personnage spécifique devaient être soulignés, vous pourriez en fait dessiner les versions de résolution inférieure avec les yeux non réduits autant pour conserver l'effet - quelque chose que la mise à l'échelle programmatique ne peut pas faire.

La mise à l'échelle dynamique n'est pas parfaite

Vous pouvez prendre des décisions artistiques distinctes qui ne fonctionnent pas avec une mise à l'échelle dynamique. Par exemple, supposons que vous souhaitiez mettre une bordure, un contour ou une surbrillance autour d'une image. Lorsqu'elle est visualisée à une résolution plus élevée, cela peut sembler correct, mais la version réduite peut être boueuse ou perdre complètement l'effet. Mais si vous le faites à la main, vous pouvez appliquer spécifiquement l'effet à chaque taille vous-même et vous garantir de conserver l'impact.

d'autres pensées

Vous pouvez également faire une approche hybride, avec un ensemble de ressources spécifiques à la résolution qui sont utilisées là où elles sont trouvées, et un ensemble générique qui est mis à l'échelle dynamiquement si aucune version spécifique à la résolution n'est trouvée. C'est un peu comme le fonctionnement de la plateforme Android. Quelques informations à ce sujet sur http://developer.android.com/guide/practices/screens_support.html

Redimensionner est plus facile que redimensionner parce que vous choisissez des informations à jeter plutôt que d'avoir à inventer de nouvelles informations (et peut-être incorrectes) pour combler les lacunes. Dans cet esprit, vous n'avez probablement pas besoin de quelque chose de spécial ici et la plupart des algorithmes de rééchantillonnage standard du domaine du traitement d'image devraient fonctionner assez bien pour réduire une image: bilinéaire, gaussien, Lanczos, etc.

Les Lanczos en particulier pourraient être un choix intéressant car ils accentuent l'image, préservant éventuellement des détails qui seraient autrement perdus lors de la combinaison de plusieurs pixels en un seul. De toute évidence, cela se fait au prix de l'introduction potentielle d'artefacts indésirables.

Quelques comparaisons visuelles ici: /gis/10931/what-is-lanczos-resampling-useful-for-in-a-spatial-context