Faire évoluer mon jeu de plateforme pixel art de 720p à 1080p

Je développe un jeu de plateforme 2D pixel art pour PC et smartphone, mais je suis coincé sur un problème technique.

J'ai choisi d'avoir une résolution de tuiles 32x32 et une résolution de sprite 64x64 caractères. Les niveaux sont divisés en sections que j'appelle des "écrans", et dans chaque écran, j'ai des tuiles 40x22,5, approximativement à 40x23, donc la résolution minimale est de 1280x720.

Dans le jeu, j'ai un mécanicien à double saut, j'ai donc besoin d'avoir une bonne plage de vue verticale sur chaque "écran".

Voici le problème: 1280x720 n'est pas une très haute résolution. Sur les moniteurs HD, la fenêtre ne serait pas grande et si j'augmente la résolution de 2x, elle sera en 2560x1440 et la fenêtre serait beaucoup plus grande qu'un moniteur HD réel. Si j'essaie des tailles comprises entre 1280x720 et 2560x1440, les graphiques commencent à bégayer ou sont déformés.

Comment puis-je résoudre ce problème? Existe-t-il une solution qui ne nécessite pas que je redessine toutes les tuiles et les sprites au format 16x16?

Pour ceux qui se demandent pourquoi c'est un problème pour le pixel art, voici un exemple rapide utilisant une scène de Super Mario World:

Si nous dimensionnons simplement un jeu de pixel art de 720 à 1080 au moment de l'exécution (comme le pourrait une caméra de jeu typique), nous obtenons des artefacts en raison du rapport non entier de pixels de l'écran par texel source. Découvrez l'incohérence dans les chiffres de l'exemple à l'échelle à droite, et à quoi ressemble la feuille et l'oreille de Mario.

Il est jouable, mais il a perdu cette charmante netteté du pixel art. Et en mouvement, ces artefacts peuvent ramper à travers un sprite , lui donnant un aspect scintillant.

L'utilisation d'un mode de filtrage qui mélange les pixels adjacents évitera les ondulations, mais étalera et flouera le pixel art à la place, ce n'est donc pas très souhaitable.

Malheureusement, le rapport 1,5x entre 720p et 1080p est le pire scénario que nous pouvons rencontrer.

Comme vous le constatez, la mise à l'échelle 1x est trop petite et 2x est trop grande, avec une marge aussi large dans les deux sens, et il n'y a pas de rapport de mise à l'échelle entier entre nous pour que nous choisissions.

Vos options se résument à:

• Tolérez l'échelle 1x , montrant votre jeu dans une fenêtre 1/3 plus petite que l'écran, en ajoutant des bordures décoratives si vous avez besoin de remplir l'espace.

  • Vous pourrez peut-être étendre le recadrage, en montrant plus de votre scène à la fois sur des écrans haute résolution. Cela réduit le padding / letterboxing nécessaire, mais vous devrez évaluer si cela a un impact sur la façon dont le jeu se joue.

    (Par exemple, cela donne-t-il aux joueurs sur certains appareils un avantage injuste ou leur permet-il de repérer des secrets qu'ils ne devraient pas voir si facilement?)

• Augmentez l'échelle de 2x et recadrez votre scène , de sorte que le joueur voit moins de la scène à la fois (environ 3/4 autant qu'il le pouvait auparavant).

  Cela peut également affecter la façon dont le jeu se déroule, par exemple. en rendant difficile pour le joueur de voir les endroits où il doit faire un double saut.

  • Vous pouvez peut-être compenser cela avec la logique de la caméra, en ayant le panoramique pour suivre ou anticiper le lecteur, de sorte que le contenu important est toujours visible sur un écran au plus petit recadrage, mais il n'y a pas de meilleure caméra universelle à utiliser.

    Si vous décidez de suivre cette voie, essayez de partager certains détails de votre gameplay et de votre caméra actuelle, ainsi qu'un exemple de scène. Avec cela, nous pourrons peut-être aider à régler le comportement de la caméra pour compenser (ou votre jeu pourrait simplement demander plus de visibilité)

• Créez des ressources alternatives avec une résolution différente . (Oui, c'est beaucoup de travail, mais vous donne le plus d'options pour contrôler l'apparence du jeu)

  Cela ne signifie pas que vous devez jeter vos ressources existantes qui ont fière allure sur 720p. Cet article décrit l'échange contextuel entre différents ensembles d'actifs pour prendre en charge un plus large éventail de résolutions cibles (dans Unity, mais le principe peut également être appliqué dans les jeux non-Unity).

  • Comme vous le constatez, redessiner tous vos actifs à demi-taille ( tuiles 16x16, caractère 32x32 ) vous permettra de gérer 720p à l'échelle 2x et 1080p à l'échelle 3x, avec le même nombre de tuiles affichées que vous avez maintenant. Vous pouvez cependant trouver la résolution des petits carreaux plus restrictive visuellement.

  • Vous pouvez également dessiner un autre ensemble d'actifs "grand format" qui est 150% plus grand ( tuiles 48x48, caractère 96x96 ), qui gérerait 1080p à l'échelle 1x. (Vous utiliseriez vos actifs existants pour 720p ou 1440, etc.). La plus grande résolution devrait vous aider à conserver la fidélité de votre art actuel, vous n'avez donc pas à sacrifier le style et les détails que vous avez maintenant.

    

  • Une troisième option consiste à dessiner un ensemble d'actifs légèrement plus petit ( 24x24 tuiles, 48x48 caractères ), qui peut gérer 1080p à l'échelle 2x, et encore une fois, cela pourrait signifier moins de sacrifices de détails que de réduire de moitié toutes les tailles de vos actifs.

    Ces trois options vous permettront de conserver votre cadrage et votre gameplay exactement les mêmes à 720 et 1080, mais au prix d'environ le double du travail sur les actifs.

Donc, malheureusement, il n'y a pas de victoire facile ici, juste des compromis différents.

Élaborer spécifiquement sur l'option de @ DMGregory de créer des actifs alternatifs à différentes résolutions:

La meilleure solution que je connaisse est probablement la moins utile pour vous à ce stade: développez vos ressources artistiques dans un format vectoriel et pixellisez-les au besoin plus tard. Ce n'est pas une solution miracle; la plupart du temps, vous constaterez que vous devez effectuer de petites modifications artisanales après la pixellisation.

La deuxième meilleure option que je connaisse est d'essayer divers algorithmes de mise à l'échelle d'image, en particulier les algorithmes de mise à l'échelle pixel art . Comme auparavant, ce n'est pas un pancea; la sélection d'un algorithme de mise à l'échelle spécifique est hautement spécifique au contexte. Cela a autant à voir avec la `` sensation '' de votre jeu qu'avec l'art lui-même et même avec un bon algorithme + une correspondance artistique, vous devrez probablement modifier quelques sprites à la main.

Dans les deux cas, l'idée est d'utiliser un outil pour faire la majeure partie du travail pour vous et concentrer l'effort humain sur les détails restants. Comme l'a dit @DMGregory, "il n'y a pas de victoire facile ici, juste des compromis différents."

Original:

Escaladé: