Discussion :

[Neckara]

Bonjour,

Last Escape est un projet de jeu réalisé avec Last Engine pour l'éprouver.
Je vais utiliser ce sujet pour parler de Last Escape et de ses avancées en essayant d'être le moins technique possible. Donc ici on va parler exclusivement du jeu en lui-même pour le reste, je vous invite à aller sur le sujet du moteur.



Vivant depuis toujours, seule, dans un univers hostile, Pica a su s'adapter et fuir ses prédateurs grâce à sa vitesse. N'ayant jamais vécu en société, elle a une façon de penser qui lui est propre que certains pourraient qualifier de "simple". Pourtant elle a souvent des éclairs de génie pour ce qui est de s'échapper ou de voler quelques objets brillants, peut-être une forme d’instinct ou de chance ?

En grande rivalité avec les Pies, Pica est attiré par tout ce qui brille et adore traîner dans un très vieux campement abandonné au bord de l'océan où elle cache son butin.

Malheureusement, à force de jouer avec des artefacts brillants, elle les active parfois et ces derniers ne sont pas toujours sans dangers...

Comme si cela ne suffisait pas, elle préfère sortir de nuit, moment idéal pour partir à la chasse aux objets brillants, mais pas vraiment pour survivre… Gare à ne pas se retrouver nez à nez avec un loup ou toute autre créature nocturne. Heureusement, Pica est très douée pour se cacher dans les buissons, mais encore faut-il sauter, plonger et se baisser au bon moment pour ne pas tomber en fuyant.

Les nuits de pleine Lune, la visibilité est correcte mais il faut se méfier des nuages intermittents. Les autres nuits, Pica n'hésite pas à sortir avec sa lanterne mais la lumière de cette dernière faiblit progressivement jusqu'à s'éteindre. Pica est une grande fille, elle n'a pas peur de l'orage et des éclairs, au contraire, cela rend le ciel tout brillant, elle a-do-re. La pluie ne permet pas à Pica d'emporter sa lanterne et les nuages cachent la Lune. Elle ne peut donc se diriger que grâce aux flashs lumineux émis par les éclairs.

On dit que siffler donne du courage, n'y pensez pas une seule seconde. Les créatures nocturnes sont loin d'être sourdes…



Si vous êtes curieux, vous pourrez avoir une présentation complète de Last Escape ici.

[Neckara]

On commence doucement, on affiche juste une fenêtre pour le moment :



Il ne reste plus qu'à dessiner dessus.

Rq : Comme on ne dessine rien dessus pour le moment, l'image de fond de la fenêtre affiche ce qu'il y avait derrière la fenêtre, vous avez donc le code de Last Escape dans la fenêtre.

Rq2 : Vous pouvez même remarquer qu'un boulet s'est trompé pour le titre de la fenêtre et a mis "Last Engine" au lieu de "Last Escape".

[Neckara]

On commence à dessiner dans la fenêtre en y plaçant un petit fond vert.



Je sais, c'est très impressionnant .
Cela représente environ une 20ène de lignes de code pour Last Escape. Le plus gros du travail étant effectué sur le moteur (créer la fonctionnalité, tester/déboguer).

C'est donc un petit pas pour Last Escape mais un grand pas pour Last Engine.
Bon pour une fois que j'ai un peu de concret à montrer, j'en profite un peu, d'autant plus que je vais bientôt reprendre les cours.

Donc prochaine étape : l'éclairage.

Pleine Lune :
Une image monochrome noir avec une transparence alpha à dessiner par dessus.

Pleine Lune avec nuages :
Je ne pense pas que faire apparaître des petits nuages soit intéressant. Je pense plutôt faire varier la transparence alpha de la pleine Lune tout en gardant la couleur unis pour simuler le passage de nuages devant la Lune.

Lanterne :
Une image noire avec un dégradé "radial" pour l'alpha. En gros au centre c'est transparent, et plus on s'éloigne, plus l'image devient opaque et donc sombre.
Je pourrais mettre un peu de jaune/orange au centre et faire "vaciller" les bords du champ de vision pour donner une impression de réalisme, mais cela est un peu plus compliqué et n'influe pas directement sur le gameplay, donc pour le moment, je vais à l'essentiel.

Orage : Ô désespoir.
Je pense, assez régulièrement, afficher une image blanche et opaque puis une image noire comme la pleine Lune et réduire progressivement le canal alpha jusqu'à ce que l'image devienne opaque où qu'un autre éclair soit lancé.

Donc au final, pour l'éclairage, je pense me contenter d'afficher une image, une sorte de filtre, par dessus la carte.
Pour les couleurs unis, je pense qu'il n'y aura pas de problèmes, mais pour la Lanterne, je me demande si je ne vais pas devoir passer par OpenGL…

[LittleWhite]

Bonjour,

Avant d'utiliser OpenGL, qu'utilisiez vous ?

[Vetea]

Génial que tu diffuses et nous fasses partager ce projet de longue date !
As tu gardé le design de Pica que je t'avais fait ?

[Bousk]

Pour la lanterne : un simple shader sur l'écran p-e ?

[Neckara]

Tiens, j'ai trouvé le mot magique pour avoir des commentaires sur le sujet : OpenGL \o/.

Avant d'utiliser OpenGL, qu'utilisiez vous ?

La SFML, qui utilise OpenGL derrière. Mais je n'ai jamais utilisé directement.

As tu gardé le design de Pica que je t'avais fait ?

Malheureusement non. J'ai tout perdu quand ils ont remplacé le disque dur de mon ordinateur portable au SAV.
Bien évidement, je n'avais fait aucune sauvegarde.

Pour la lanterne : un simple shader sur l'écran p-e ?

Je t'avouerais que je n'ai jamais fais de shader ou d'OpenGL.
Pour moi OpenGL = travailler sur la carte graphique.

Je vais essayer de me renseigner à ce sujet, vous ne connaîtriez pas un endroit où on pourrait trouver des articles sur le sujet ?
*S'enfuit très très loin avant que LittleWhite ne le rattrape*

[Vetea]

Heureusement que j'ai gardé le Design de Pica sur mes Backup !!



La zolie petite Pica !!

[Bousk]

Je t'avouerais que je n'ai jamais fais de shader ou d'OpenGL.
Pour moi OpenGL = travailler sur la carte graphique.

Vu que SFML utilise OpenGL les shaders sont aussi en GLSL, dans ton cas un simple shader sur tout l'écran, avec 1 paramètre de position de la lanterne, et en fonction de la distance au point tu appliques une transparence. Une fonction linéaire fera l'affaire dans un premier temps.

Cherche GLSG dans ton moteur de recherche préféré et tu auras le nécessaire pour commencer, avec le tuto SFML d'application de shader.

[Neckara]

@Vetea : merci.

@Bousk : J'essaye depuis quelques heures de trouver une bonne fonction pour le dégradé, mais j'ai toujours l'impression que le milieu m'arrache les yeux.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
uniform sampler2D texture;
uniform float x;
uniform float y;
 
void main()
{
        vec4 pixel = texture2D(texture, gl_TexCoord[0].xy);
 
        gl_FragColor = gl_Color * pixel;
        float dx = (x/2. - gl_FragCoord.x);
        float dy = (y/2. - gl_FragCoord.y);
        float distance = sqrt(dx*dx + dy*dy);
        float distance_norm = (distance/250.);
        float coeff = 0.6 + (distance_norm)*0.4;
        gl_FragColor.rgb -= coeff;
}

Je ne sais pas d'ailleurs si ma formule est correcte.
Si je dessine par dessus un "pixel1" un "pixel2" de transparence alpha X, comment calculer les composants RGB du pixel final ?

[Neckara]

Tsss…

Des heures à batailler pour finalement se rendre compte que c'était mon fond (rgb(0,255,0) ) qui était crève-œil.
Finalement, je prend une image sur google pour tester.



À gauche la nuit, à droite en bas, la lanterne et à droite en haut l'original.
Reste plus qu'à intégrer tout cela au moteur, finalement c'était rapide ^^.

Je remercie cet article au passage : http://gregouar.developpez.com/tutor...dynamiques-2d/

[Dabou Master]

Elle est pas un peu trop verte la nuit ? Enfin ça se justifie peut-être avec l'univers où la lune est verte ou une composante différente de l'atmosphère mais au final le décor semble normal à droite et ... vert la nuit. Effet de style recherché ?

[Bousk]

bienvenue dans le monde fantastique et puissant du shader

[Neckara]

Elle est pas un peu trop verte la nuit ? Effet de style recherché ?

Rhôoo

Jaune + lumière bleu rgb(21, 205, 255) = vert.
Le vert vient donc du jaune de l'image originale.

Ouais, c'est vrai que c'est mieux avec (100,100,255).

D'ailleurs
@Vetea : serait-il possible de me transmettre un petit fond (ex. map de papy commando) que je puisse utiliser pour mes tests ?
Là j'utilise une image qui n'est sûrement pas libre de droit

Sinon pour les graphismes finaux, je présume qu'il faudra que j'utilise des images avec des vertex si je veux m'amuser avec les shaders (ombres, etc.) ?

[Invité]

J'utilise le même style de shader pour calculer l'atténuation de la lumière en fonction de la distance par rapport au centre de la lumière.

A part que j'utilise aussi une normal map, de ce fait, je n'ai pas d'éclairage sur le bord des objets, ce qui donne une impression de 3D.

M'enfin bref la formule pour le dégradé me semble correcte et j'aime vraiment bien faire des dégradés pour l'éclairage car je trouve que ça rend mieux.

Pour le nuit tu peux toujours utiliser un FBO (Frame Buffer Object) sur lequel tu effaces en bleu, puis tu dessines ton dégradé dessus et tu rend le tout sur l'écran en blendMultiply, enfin, moi c'est comme ça que je fais.

[Vetea]

Oui pas de problème Neckara !



Amuse toi bien !

[Invité]

Je voudrais ajouté que avec SFML c'est encore plus simple car les FBO sont encapsulées dans une classe. (La classe RenderTexture)

Tu peux dessiner dessus comme si tu dessinais sur l'écran, en utilisant un shader au besoin, et ensuite récupérer la texture de la rendertexture pour ensuite la dessiner sur l'écran.

PS : Je trouve tout simplement cela génial!

Car je peux stocker des informations dans les textures et m'en resservir pour redessiner la scene avec un autre shader au besoin.

Bref, tu vas voir que coder un moteur graphique avec ça, tu vas t'amuser.

[Bousk]

Sinon pour les graphismes finaux, je présume qu'il faudra que j'utilise des images avec des vertex si je veux m'amuser avec les shaders (ombres, etc.) ?

Ton sprite a déjà ses 4 vertex, tu ne devrais pas avoir besoin de vertex buffer et n'utiliser que le fragment/pixel shader.

[Neckara]

Merci Vetéa.

Donc :

• En haut à gauche : un nuage qui passe par nuit de pleine Lune ;
• En haut à droite : l'original ;
• En bas à gauche : une nuit d'orage ;
• En bas à droite : la lanterne.

Mais c'est assez rageant car même en 1080p j'ai des espèces d'effets pixelisés.

[Bousk]

l'orage sans les éclairs, faut de l'imagination