×
En poursuivant votre navigation sur MangeToiÇa, vous acceptez l'utilisation des cookies assurant le bon fonctionnement du site. En savoir plus.
Afficher les articles:  TOUT   HORS HABBO   HABBO
[BLOG] La création de la brillance sur Habbo, par notMiceElf
commentaires 5
Posté par Chromosomes le mercredi 20 août

Traduction originale de l’article du blog des devs | http://blog.habbo.com/2014/08/20/summer-school-qa-feat-notmiceelf-part-4/

Salut à toi cher(è) lecteur(trice) pour ce nouvel épisode de « ce gars écrit vraiment trop » aussi connu pour être la séance des Q&R avec notMiceElf! Nous avons répondu à quelques réponses très intéressantes à ce jour, et cette semaine certains vont encore se ronger les ongles. Se ronger les ongles car vous êtes tous probablement fatigués de lire mais arrêtez de machouiller vos ongles (c’est une mauvaise habitude, vous devriez vraiment arrêter). On se concentre et… c’est parti! 

Capture d’écran 2014-07-30 à 17.02.33

COMMENT CONÇOIS-TU DES MOBIS QUI BRILLENT ?
(question posée par mohawkdude17)


Merci pour cette question, mohawkdude17! Ah, la brillance… Le seul élément sur Habbo les dégradés lisses sont toujours, toujours, autorisés à être utilisé… mais pas de pixel art. Je laisse ça de côté quelques instants de sorte que vos énormes regards horrifiés se dissipent. C’est bon, prenez une profonde respiration, ce n’est pas pixel art et vous allez en être d’accord. Prêt à passer à autre chose? GO. Cette explication va plus s’accentuer sur « comment la brillance est faite » plutôt que « comment réaliser la brillance? » donc cil va y avoir plus de technique que de gens qui vont trouver ce sujet intéressant. Mais cela va vous donner je l’espère un aperçu jamais vu auparavant de ce qu’Habbo a sous le capot.  il nous l’espérons vous donnera un look encore jamais vu sous le capot de Habbo! . 

 

Avez-vous déjà vu les illustrations et croquis de livres de médecine qui montrent les différents fonctionnements du corps humain sur différentes feuilles transparentes de plastique ? Eh bien, les mobis sur Habbo sont créés de la même façon. Non, les mobis n’ont pas de système sanguin, ne sois pas stupide… Les mobis réalisés ont, cependant, différentes couches (nous les appelons tranches) qui composent son ensemble et chaque couche est empilée au-dessus de l’autre dans notre système de rendu, un peu comme les pages d’un livre. La plupart du temps ces couches sont utilisées pour contrôler où les différentes parties d’un mobi résident dans l’espace de jeu par rapport à un avatar (ou un autre élément) dans la même case. Par exemple, l’accoudoir d’un fauteuil doit être en face d’un avatar assis doit être découpé de l’image de la chaise principale, et placé au-dessus de l’espace où l’avatar est assis.

 

Pour en revenir à l’analogie du livre, c’est comme dire que la page neuf est au-dessus de la page dix qui est sur ​​le dessus de la page onze. Obtenir cette couche est importante car elle signifie qu’une lueur peut être tirée de façon indépendante du pixel-art du mobi et être superposée plus tard. Pour obtenir cette couche comme s’il brillait,  nous changeons le mode de fusion. Un mode de fusion? C’est juste une façon élégante de dire comment deux couches graphiques sont mélangées. Vous pourriez ne pas savoir que vous êtes déjà familier avec le mode le plus commun de mélange (basique) où aucun mélange se produit. La couche supérieure recouvre simplement  la couche inférieure. C’est ce à quoi vous vous attendez lorsque vous empilez des mobis… 

 

Le mode de fusion qu’Habbo utilise pour la brillance est appelé Linear Dodge (ou parfois Add) dans lequel les couches doivent s’additionner ensemble (aaaaaaah, des maths!) pour augmenter ainsi la luminosité des couches sous-jacentes. Avec ce mode de mélange, le mélange avec du blanc produira du blanc, le mélange avec des motifs noirs ne produira aucun changement et le mélange avec les nuances entre le blanc et le noir va ajouter des degrés de luminance et une teinte de la couche de base. Je suis sûr que ça vous parait tellement simple que vous n’avez pas besoin d’un exemple… mais je vais vous donner un, quand même.

 

Regardez comment l’ensemble inférieur de l’exemple ci-dessus fait que Frank à gagner en luminosité avec une teinte bleue sur sa poitrine lorsque le « gradient » graphique est appliqué, plutôt cool non ? La couche avec le mode de fusion Dodge Linear est appliquée à tout ce qui est directement sous cette couche : que ce soit des sols, des murs, un autre mobi, ou un avatar. Depuis, tout ce qui est sous la bannière brillante sera plus lumineux et cela fait apparaître comme si le mobi brillait. Parfois, la lueur est faite en utilisant le pixel-art pour des choses comme des trophées où la lueur est très confinée, mais le plus souvent elle est utilisé comme une source de lumière et est à cet effet un pixel-art de gradient. Le but de ces types de lueurs est de faire de la luminosité subtile et pas abimer les graphiques sous-jacents. Vous remarquerez dans l’exemple suivant que si une lueur est trop claire, elle devient trop brillante. Plus une couleur va vers le blanc, plus la brillance qu’elle ajoute au graphique en dessous d’elle va devenir blance (ce qui est trop lumineux). Vous pensez que nous pourrions ajuster l’opacité d’une base brillante si elle était trop lumineuse, mais… non. En regardant l’exemple de nouveau, vous pouvez voir que, bien que nous pouvons atteindre le même niveau de luminosité que la version normale, toute la chaleur et la saturation ont été perdues. Nous nous retrouvons avec quelque chose qui est assez grossier à regarder.

Il y a un autre style de brillance (pas exactement une fausse lueur) qui n’est pas utilisée aussi souvent que le type de mode de mélange mais sert pour certains mobis.Qu’est-ce que la fausse lueur? Eh bien, une fausse lueur ne change pas directement la luminosité d’un patron qui est en dessous parce qu’il n’est simplement pas teinté par l’opacité. Pour faire une lueur dans ce style, nos artistes de production utilisent un gradient rapide et s’effondre directement sur ​​le pixel-art faisant une simple couche sur la base. Comme si elle brillait, mais c’est vraiment juste un trompe-l’oeil. Vous remarquerez dans l’exemple que ce style n’est pas aussi brillant que le style de mode de fusion et une partie de la chaleur est parti.

Ces types de brillances avec la décoloration par transparence n’étaient pas utilisables dans notre ancien client Shockwave et ainsi ne se rencontrent que dans les mobis récejts. L’avantage de cette brillance est que nous pouvons l’appliquer à des choses où le style de brillance d’origine n’est pas pris en charge. Les choses que vous tenez dans la main (boisson, etc…) par exemple. Les mobis comme les œufs ou les piñatas utilisent également cette méthode pour les explosions car la simplification de plusieurs couches en une seule aide à maintenir la santé mentale relative de nos artistes de production… :P

 

Et c’est tout pour aujourd’hui, vous savez tout ce que vous devez savoir sur la transparence. Pas mal de logiciels comme Gimp et Photoshop ont les modes de fusion qui ont été mentionnés donc vous pouvez tenter de créer vos propres lueurs en les utilisant. Bonne chance! 

Traduction réalisée par MTC.

CatégorieSulake
Avant de publier votre commentaire :
Les preums / first sont interdits
Les insultes, menaces entre visiteurs sont interdites.
Les propos racistes, homophobes et pornographiques sont interdits.
Les pubs & liens vers des sites d'arnaques ou rétroserveurs sont interdits.
Les commentaires inutiles et hors-sujet peuvent être supprimés

Merci de respecter les CGU de MTC (à lire ici). Le non-respect de ces règles pourra entraîner le bannissement des commentaires ou du site ; pour porter réclamation, utilisez l'uservoice
FORUM: DERNIERS SUJETS
xavier31x - Mtc <3

Bibliothèque d’articles

La bibliothèque d'articles de MangeToiCa est une mine d'Or ! Un coup de blues ou envie de te plonger dans la nostalgie des années MTC ? Retrouve l'intégralité des articles, enquêtes et dossiers ci-dessous classés par date de publication.
REMONTER