Une bonne nouvelle aujourd’hui, voici rien que pour vous la version Beta du projet Birdrace.

Je vais sans doute vous ennuyer un peu, car pour y jouer vous devrez installer un affreux plugin sur votre navigateur.

Pour jouer, rien de plus facile.

Les commandes sont les suivantes et sont configurables dans le menu :

• Touches directionnelles pour manier votre personnage
• A pour accélérer
• Z pour freiner (mais dans les jeux de course on ne freine pas)
• E pour balancer les items

Voici une petite liste des bugs connus :

• Les missiles ont un comportement douteux
• Le booster provoque un effet de motion blur qui ne s’annule pas un fois le temps du boost écoulé
• Des zones peuvent être ‘collantes’ et votre monture restera bloquée sur le sol sans raison

Si vous découvrez d’autres bugs vous pouvez les poster en commentaires. Certains objets ne sont pas texturés, c’est normal. Et enfin si vous avez des idées d’objets spéciaux que l’on pourrait trouver dans les caisses faites m’en part dans les com’s.

Ce jeu et les autres jeux des 2ème années peuvent être joués sur cette page.

Merci de me donner votre avis sur le jeu 

Bon jeu à tous.

Aujourd’hui un article spécial sur tout les éléments chronophages du web sur lesquels perdre efficacement votre temps. On commence tout de suite avec les blogs de dessinateurs sur lesquels je passe de temps en temps et qui valent vraiment le coup.

• Ze blog BD de Mariko : un blog qui traite de la vie quotidienne avec humour
• Lili aime le nougat : un théâtre de la vie quotidienne en BD
• BOULETCORP : toujours le même genre, mais un blog masculin pour changer
• Maliki : le webcomic d’une jeune fille aux oreilles pointues
• YODABLOG : Star Wars c’est rigolo

• Robot unicorn attack : essayez de réaliser le rêve d’une innocente licorne
• You have to burn the rope : tout est dans le titre
• This is the only level : un même niveau avec de multiples gameplays
• Orisinal : plein de jeux mimi et relaxant

Je vous épargne les vidéos sur le phénomène meuporg et à la place je laisse le lapin vous souhaiter :

Joyeuses Pâques

A la prochaine…

© Pour les images dans l’ordre : Mariko, Lili aime le nougat et Yodablog.

Me voici la victime furieuse d’un paradoxe temporel incroyable, la boucle des projets sans fin est bouclée, comme dans le roman du (presque) même nom.

J’incarne le Bastien des temps moderne amené chaque semaine dans de nouvelles histoires, de nouveaux projets, de nouveaux devoirs et de nouveaux passe-temps.

Comme cela doit vous paraitre flou, je commence avec un exemple concret, j’ai terminé la semaine dernière mon projet DirectX dont voici les captures :

Le projet était assez simple en sois à condition de bien comprendre DirectX.

En réalité rien n’est jamais difficile  le tout est de trouver comment y parvenir, par exemple je peux facilement mettre la tour Eiffel dans une boite, il suffit de découper un cube autour.

Le projet consiste donc en un chargeur de scène qui créée différents éléments à partir de données fournies dans un fichier. Voici une liste non exhaustive des fonctions que l’on devait intégrer :

• Lecture des données depuis un fichier
• Chargement d’objets et création de plusieurs instances
• Création d’une skybox
• Générer un terrain
• Une texture animée (mon cube Lucky?Star)
• Et d’autres choses… (PVS, Wireframe, Shader)

Une fois ce projet finis, la boucle infernale s’est remise en route… Pour le grand projet nos concepteurs ayant taffé toutes les vacances il y avait de nombreux changements et de nombreuses choses à ajouter dans notre course d’hirondelle, j’y reviendrai une prochaine fois.

Bref les projets et les devoirs s’enchainent mais malgré cela j’éprouve beaucoup de plaisir à travailler sur ces derniers, pour essayer de gagner du temps j’ai d’ailleurs déjà commencé à schématiser un moteur 3D qui je pense me serra utile pour mon prochain devoir de vacances.

Toujours est il que j’ai plein de choses à partager je pense donc que je vais modifier la manière dont je blogue afin d’écrire de petits billets fréquents mais pas du tout ponctuels.

Je vous dis déjà bonsoir et à très bientôt avec plein plein de trucs.

Cette semaine je ne sais plus trop par où commencer…

Au niveau des études ça fait longtemps que je n’ai pas posté mes créations graphiques alors voici des tests de texturage :

Pour commencer une mod d’un colt avec une grosse texture, le seul problème c’est qu’on ne voit pas vraiment qu’il s’agit d’une mod en 3D mais je vous assure que c’est le cas 

Ensuite un texturage par poly d’un cube de voyage et un déplié d’une skybox :

Au niveau de la programmation on travaille toujours sur DirectX en continuant à développer nos connaissances de programmation 3D et plus particulièrement sur la gestion des caméras.

La semaine prochaine s’annonce particulièrement remplie, en effet tout nos cours de prog deviendront des cours de projet afin d’avoir une version bêta de notre jeu de course avant les prochaines vacances.

Ce sera tout pour aujourd’hui, je vous promet de revenir dans une semaine avec je l’espère la première bêta de notre jeu.

Bonne semaine et à bientôt.

Un tout petit billet mini cette semaine.

Au niveau des études on à enfin commencé la programmation 3D avec DirectX… Parfois je me demande si les gens qui travaillent chez Microsoft suivent vraiment une ligne directrice lors de la conception d’une librairie.

Pour vous faire patienter jusque la semaine prochaine, et en espérant qu’il y ait plus de contenu à vous faire partager, voici une web série avec un concept intéressant : à vous de choisir ce qu’il va se passer au prochain épisode.

Decide toi, CLEMENT! EP1 HD from Paul Paulsen on Vimeo.

Voici le premier épisode, et le site web pour aller visionner les autres et voter pour la suite de l’histoire.

Ce sera tout pour cette semaine.

Bonne soirée et à bientôt.

Aujourd’hui je vais vous montrer comment créer un effet de vague en C++ avec la librairie SFML.

Pour commencer on va se créer une application de test, comme vous êtes chanceux je vous donne le code source directement.

// SFML Library
#include <SFML/System.hpp>
#include <SFML/Graphics.hpp>
 
#include <conio.h>
 
int main()
{
	// Chargement d'une image de fond
	sf::Image Image;
	if (!Image.LoadFromFile("image.jpg"))
	{
		_getch();
		return EXIT_FAILURE;
	}
	sf::Sprite Sprite(Image);
 
	// Chargement de l'effet
	sf::PostFX Effect;
	if (!Effect.LoadFromFile("wave.sfx"))
	{
		_getch();
		return EXIT_FAILURE;
	}
 
	// Creation de la fenêtre de rendu
    sf::RenderWindow App(sf::VideoMode(1024, 768, 32), "SFML Post Effect");
 
	// Initialisation du temps
	float iTime = 0.0f;
 
	// Game loop
	while (App.IsOpened())
	{
		// On incrémente le temps écoulé depuis la dernière frame
		iTime += App.GetFrameTime();
 
		// Affiche l'image de fond
		App.Draw(Sprite);
 
		// Gestion des évènements
		sf::Event Event;
		while (App.GetEvent(Event))
		{
			 // Fermeture de la fenêtre
			 if (Event.Type == sf::Event::Closed)
			 {
				 App.Close();
			 }
 
			// Clique de souris
			 if (Event.Type == sf::Event::MouseButtonPressed)
			 {
				iTime = 0.0f;
 
				// - - - Passage des paramètres à notre postfx
			 }
		}
 
		// - - - Passage des paramètres à modifier à chaque frames
		Effect.SetTexture("tex", NULL);
 
		// Affiche notre postfx
		App.Draw(Effect);
 
		// Affiche la fenêtre
		App.Display();
	}
}

Il est assez simple et bien commenté, tout ce que l’on fait dans ce code c’est charger une image de fond ainsi qu’un fichier d’effet. Dans la boucle principale on affiche nos différents éléments et au cas ou l’on appuie sur un bouton de la souris on passe de nouveaux paramètres à notre PostFX. Les lignes de codes permettant de passer des paramètres devront être complétées par la suite.

Etape 1: Appliquer un effet sur le framebuffer

Pour l’instant un seul paramètre est passé depuis notre application C++ : « tex » avec comme valeur NULL, « tex » est le nom de la variable que l’on retrouvera dans notre fichier d’effet et NULL veut dire que l’on travaille sur la totalité du framebuffer.

Voici le contenu de notre fichier wave.sfx :

sampler2D tex
effect
{
	gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);
}

Pour l’instant j’obtiens donc une superbe fenêtre avec une image de fond.
Copyright Hélène Villeneuve pour la superbe photo de noix ^^

Notre code GLSL contient pour l’instant une ligne qui change la couleur de notre pixel.

Comme les paramètres sont tous à 0 il ne se passe rien, mais vous pouvez essayer de changer ceux-ci en sachant que les éléments de notre vecteur 4 définissent les paramètres suivants : composante de rouge, vert, bleu et alpha; Tous paramétrables de 0 à 1.

Etape 2 : Temporiser et paramétrer l’effet

On va passer de nouveaux paramètres à notre effet dans le code C++, on va donner une position qui sera celle de la souris lorsque l’on clique, le temps écoulé depuis le début de l’effet et la taille de la vague.
On va donc ajouter les valeurs suivantes : « time » qui sera la variable iTime de notre code cpp; « center » qui sera la position de la souris et wavesize qui sera la taille de la vague.

Voici donc les valeurs à ajouter dans notre code cpp :

// - - - Passage des paramètres à notre postfx
Effect.SetParameter("wavesize", 20.0f);
Effect.SetParameter("center", Event.MouseButton.X / 1024.0f, 1.0 - Event.MouseButton.Y / 768.0f);
 
// - - - Passage des paramètres à modifier à chaque frames
Effect.SetTexture("tex", NULL);
Effect.SetParameter("time", iTime);

Le fichier « .sfx » devra prendre en compte les nouveaux paramètres, et temporiser l’effet en calculant la distance entre le pixel courant et le centre de l’effet en fonction du temps écoulé :

sampler2D tex
vec2 center
float time
float wavesize		// 1 big -> 40 small
effect
{
	// On récupère les coordonnées du pixel courant
	vec2 uv = gl_TexCoord[0].st;
 
	// On calcul la distance entre le pixel courant et le centre de la vague
	float distance = distance(uv, center);
 
	// Le pixel doit il être modifié (se trouve il dans le cercle de la vague)
	if ((distance <= (time + 1.0 / wavesize)) && (distance >= (time - 1.0 / wavesize)))
	{
		gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); // pixel devient rouge
	}
	else
	{
		discard; // on ne fait rien
	}
}

On obtient maintenant de magnifiques cercles rouges lorsque l’on clique avec la souris.

Une petite subtilité : les coordonnées de la souris ont comme point de référence le coin supérieur gauche avec comme valeur maximum la taille maximale de la fenêtre alors que les coordonnées d’un pixel en GLSL sont comprises entre 0 et 1 avec comme point de référence le coin inférieur gauche de la fenêtre.

Pour s’adapter aux coordonnées GLSL on doit donc diviser par la taille de la fenêtre comme je l’ai fait dans le code cpp ci-dessus.

Etape 3 : Calculer l’effet de vague

La partie qui vous intéresse certainement le plus, l’effet de vague. Pour ça rien de plus simple il suffit de récupérer la texture d’un pixel avoisinant en fonction de l’intensité de la vague.

Pour ça pas de secrets, je vous donne une formule magique, maintenant c’est à vous de créer les vôtres. Cette formule incrémente notre vecteur de position d’une valeur comprise entre 0 et X en fonction de la position du pixel dans la zone d’effet et du taux de déformation voulu.

Voila le code final de notre .sfx :

sampler2D tex
vec2 center
float time
float intensity		// 1.0 big -> 0.0 small
float wavesize		// 1 big -> 40 small
effect
{
	// On récupère les coordonnées du pixel courant
	vec2 uv = gl_TexCoord[0].st;
 
	// On calcul la distance entre le pixel courant et le centre de la vague
	float distance = distance(uv, center);
 
	// Le pixel doit il être modifié (se trouve il dans le cercle de la vague)
	if ((distance <= (time + 1.0 / wavesize)) && (distance >= (time - 1.0 / wavesize)))
	{
		// Différence entre la distance et le temps
		float diff = (distance - time);
 
		// Calcul de l'effet de vague
		uv = uv + (normalize(uv - center) * (diff * (1.0 - pow(abs(diff*wavesize), intensity))));
 
		// Récupération de la texture du pixel
		gl_FragColor = texture2D(tex, uv);
	}
	else
	{
		discard;
	}
}

Voici un exemple de rendu :

Si vous avez des question n’hésitez pas à laisser un commentaire.
Pour les paresseux voici le code source.

Bonne journée et à une prochaine fois

Cette semaine c’est une spéciale cadeaux, avec des exclusivités rien que pour vous…

Tout d’abord voici le lien de la version test de notre projet de course d’oiseaux.
Vous trouverez aussi sur le site de créajeux, les autres projets afin de les tester aussi. 

Et ensuite bonne nouvelle, j’ai terminé mon projet de noël. Voici quelques captures d’écran du jeu :

Ce jeu est une adaptation originale du gameplay de Geometry Wars, je l’ai développé en C++ à l’aide de la librairie SFML. Afin de pimenter le gameplay j’ai créé un shader spécial afin d’afficher un effet de vague lors du rendu à l’écran.

Le jeu n’est pas totalement finalisé, le gameplay doit encore être approfondis afin de proposer plusieurs niveaux de difficulté donc restez branché, la version disponible sera fréquemment mise à jour.

Pour y jouer, vous pouvez le télécharger ici, attention néanmoins si votre carte graphique n’est pas compatible il ne pourra fonctionner. Les commandes sont simples la souris pour viser et tirer (spécial = clique droit) et les touches directionnelles pour bouger.

Ce sera tout pour cette semaine, je vous laisse déjà et je vous prépare plein d’articles sympathiques…

Oups, j’ai encore pris du retard dans mon billet de la semaine.

Je vais faire court cette semaine, mais la semaine prochaine je vous promet une surprise pour me faire pardonner (ou pas…).

La semaine écoulée n’était pas très intéressante, mais on se rattrapera la semaine prochaine, au programme : design patterns et templates en C++.

Concept de la semaine : le Sprite

Je parle de billboard mais j’en oublie l’essentiel : le sprite.

Tout d’abord qu’est ce que c’est ? Un sprite est une image ou une animation intégrée à une grande scène.

La scène dispose généralement d’un décor et les sprites sont les personnages ou les objets qui se superposent et se déplacent sur ce fond.

Un sprite est un élément rectangulaire dont on fait varier la transparence (le canal alpha) afin de le fondre avec le fond.

Le sprite est couramment utilisé en programmation de jeux vidéos même dans les jeux modernes en 3 dimensions, notamment pour les billboards et les générateurs de particules.

Un petit site internet ou trouver des zoulis sprites.

Citation de la semaine

Sauvez la fôret, mangez un castor

Je vous dis à la semaine prochaine, avec (je vous le promet) plus de news, plus d’inédit et plus de K-do.

Être tout le temps sur son ordinateur ce n’est pas super, mais comme j’ai beaucoup de travail je ne peux pas vraiment faire autrement. Toujours est-il que ce travail aboutit à des résultats concrets qui font plaisir à voir.

Cette semaine je n’ai pas eu de cours de 3D, je n’ai donc aucune modélisation à vous présenter.

Néanmoins le projet Bird Race avance à grand pas, j’ai intégré de nombreuses fonctionnalités développées par notre équipe à la solution finale. Voici quelques captures du projet en l’état :

Le HUD ingame à aussi fait son apparition, on y retrouve la position du joueur (une simple image pour l’instant), la carte de la course, un altimètre et un chronomètre.

Au niveau du  contrôle de l’oiseau les touches sont désormais configurables (avec gestion du clavier et de manettes analogiques) .

Cette semaine j’intégrerai du gameplay à la scène : une caméra sur rail avant le début de la course, un décompte et une zone à atteindre afin de terminer la partie, beaucoup de travail en perspective.

Le concept de la semaine : le HUD

J’en parle juste au dessus, le HUD mais qu’est-ce que c’est ?

Le HUD (en français Affichage tête haute) est la méthode par laquelle l’information est relayée au joueur, il s’agit d’une composante à part entière de l’interface du jeu.

Le HUD sera donc utilisé comme indicateur de différents éléments du gameplay, pour un jeu de tir on retrouvera par exemple la jauge de vie, les munitions disponibles ou encore la carte du monde.

Celui-ci est donc très dépendant du type de jeu, néanmoins on peut trouver des jeux sans HUD, ou avec des HUD très discrets voir totalement intégrés au jeu.

Pour plus d’informations je vous propose de lire l’article de la wikipedia anglaise (l’article français n’est pas très complet).

Citation de la semaine

Lorsque mes enfants mettent leurs petits souliers devant la cheminée, Saint-Nicolas leur dépose toujours des semelles anti-odeur dedans.

Ce sera tout pour cette semaine, je vous dis bonne soirée et à bientôt.