Rapport pour la premiere Soutenance Crazy Caddies

Crazy Caddies : 1er rapport de soutenance
The Happy Four Friends
15 janvier 2007
Table des matières
1 Introduction
2
2 Partie graphique
2.1 Jonathan Verrecchia . . . . . . . . . . . . .
2.1.1 Création d’un caddie sous 3DS MAX
2.1.2 Réalisation du logo . . . . . . . . . .
2.2 Jean-Charles Delay et Jonathan Verrecchia .
2.2.1 Les débuts avec OpenGL . . . . . . .
2.2.2 Primitive, mon amie ! . . . . . . . . .
2.2.3 À venir . . . . . . . . . . . . . . . .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
3
3
3
6
7
7
9
11
3 Partie Physique
13
3.1 Marc Chamberlin . . . . . . . . . . . . . . . . . . . . 13
3.1.1 L’accélération . . . . . . . . . . . . . . . . . . 13
3.1.2 À venir . . . . . . . . . . . . . . . . . . . . . 14
4 Intelligence Artificielle
4.1 Roman Pak . . . . . . . . . .
4.1.1 Le jeu . . . . . . . . .
4.1.2 Derrière le jeu . . . . .
4.1.3 Les bases de recherche
4.1.4 Les évolutions . . . . .
5 Site Web
5.1 Jean-Charles Delay
5.1.1 Introduction
5.1.2 Index . . . .
5.1.3 Présentation
5.1.4 Downloads .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
1
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
15
15
15
15
16
19
.
.
.
.
.
21
21
21
22
22
23
5.1.5
Le futur du site . . . . . . . . . . . . . . . . .
6 Conclusion
23
24
2
Chapitre 1
Introduction
La préparation de cette première soutenance sert également à
mettre en place le projet. Nous avons pu nous familiariser avec
presque tous les outils nécéssaire au projet et ainsi gagner du temps
pour les prochaines soutenances.
Le cahier des charges n’a subi aucune modification car il était
suffisament complet et raisonnable.
Quand à l’équipe, chaque membre a été rigoureux dans son travail
et le chef de projet n’a même pas eu besoin de donner des coups de
fouets.
3
Chapitre 2
Partie graphique
2.1
2.1.1
Jonathan Verrecchia
Création d’un caddie sous 3DS MAX
Que serait un jeu de course de caddies sans...caddies ? Nous nous
sommes fixés pour objectif de créer un modèle de caddie basique
pour la première soutenance. Pour cela nous avons choisi d’utiliser le
logiciel 3DS MAX qui semble être l’un des meilleurs dans le domaine.
Le premier contact avec ce logiciel est un peu déroutant, quatre
fenêtres, cinquante boutons autour, un keygen compliqué à utiliser...
Bref il m’a fallu un peu de temps avant de comprendre comment
placer un simple plan1 . Une fois la création des formes géométriques
comprise, il faut réussir à les placer correctement dans les quatre
fenêtres, ce qui n’est pas toujours simple. Voici le premier ”caddie”
que j’ai modélisé sous 3DS MAX, avec des formes basiques :
1 quelle
horreur ce groupe...
4
Ce premier modèle, à l’allure design et moderne a été une assez
grande satisfaction pour moi, n’ayant aucune expérience en matière
de 3D. Cependant, un besoin insatiable de perfectioner ce modèle
s’est emparé de moi. La difficulté principale a été de déformer les
formes du caddie. Ce logiciel étant relativement peu simple d’utilisation pour un débutant, j’ai passé un moment à chercher comment
changer un carré en trapèze par exemple.
5
Finalement, voici le rendu actuel de notre caddie :
On peut admirer l’apparition d’un bas de caisse en aluminium,
une forme profilée pour une meilleure pénétration dans l’air ainsi
qu’une confortable barre de navigation au look très tendance.
Nous utiliserons ce modèle par la suite, cependant il est possible
qu’il s’améliore ou que nous en utilisions un autre, qui ne soit pas
simplement une boı̂te sur roues mais un vrai caddie.
Nous aurons de nouveau recours à 3DS MAX pour modéliser les
éléments de décor par exemple.
6
2.1.2
Réalisation du logo
La réalisation du logo a été faite en tout début d’année, afin de
prendre de l’avance. En effet j’ai pensé qu’il serait plus judicieux
d’effectuer cette tâche alors que nous ne savions pas encore coder.
Le logo a été fait sur papier puis coloré à l’aide de Photoshop. Nous
avons décidé de faire un logo proche de celui de Crazy Taxi afin de
rester dans l’esprit du jeu qui nous a inspiré pour la réalisation de
notre projet. Voici le travail effectué sur papier.
7
2.2
2.2.1
Jean-Charles Delay et Jonathan Verrecchia
Les débuts avec OpenGL
Autant dire tout de suite que nous ne savions pas par quoi commencer. Marc ne pouvant réellement rien faire du moteur physique
tant que nous n’ayons eu les bases du graphique (mais aussi parce
qu’il lui fallait apprendre à maı̂triser OpenGL). Il nous a donc donné
un coup de main pour les débuts. Et fort heureusement ! C’est lui
le premier à avoir trouvé comment maintenir ouverte une fenêtre
OpenGL, chose qui nous paraı̂t à présent triviale.
Puis nous avons continué cette ”coopération”. Le but suivant
étant d’apprendre à afficher des formes géométriques à l’écran. Bien
évidemment, nous ne serions jamais venu à boût de cette nouvelle
épreuve (comme des autres) sans l’aide de divers — et plus ou moins
complets — tutoriaux du net. C’est alors que nous avons choisi de
travailler principalement avec la bibliothèque GLFW au détriment
de GLU(T) qui nous a paru plus compliquée.
Puis sont apparus nos premiers vertex, tout d’abord en 2D. En
2D tout simplement parce que nous avons cherché avant tout à bien
assimiler le principe d’affichage avant de complexifier la chose. Le
principe est de définir chaque point du polygone en x/y à l’aide de
glVertex2f(x,y). Puis OpenGL se charge se rejoindre les points. Ainsi
avec :
glBegin(GL_POLYGON);
glVertex2f(-0.5, -0.5);
glVertex2f(-0.5, 0.5);
glVertex2f(0.5, 0.5);
glVertex2f(0.5, -0.5);
glEnd();
on obtient :
8
Pour afficher le cube en trois dimensions, il suffit de rajouter 4
points sur un autre plan. Pour cela, on remplace les glVertex2f(x,y)
par des glVertex3f(x,y,z). Et ainsi nous avons placé 8 points en trois
dimensions :
9
2.2.2
Primitive, mon amie !
Ça y est ! A peine notre première forme plus ou moins géométrique
en poche que nous nous lançons dans ce qui nous semble le plus intrigant, faire bouger cette primitive. Après un cours rapide sur des
forums, et les commandes glTranslate et glRotate repérées en
tant que procédures principales du déplacement, nous nous lançons
à l’assaut des transformations. Et nous nous sommes pris le mur !
En effet, Marc était arrivé à faire mouvoir ce cube de manière
globalement normale, mais un détail nous a perturbé : le cube emmenait tout le repère, et par conséquent tout le décor avec lui. Nous
devions alors trouver un moyen d’isoler le cube. A ce problème ont
répondu deux procédures, que sont glPushMatrix et glPopMatrix.
Ces deux commandes permettent, à la manière des environnement
en LATEX, d’isoler certaines parties et par là, créer un repère ”temporaire” que l’on peut bouger (translater et tourner) avant d’afficher
les éléments voulus. glPushMatrix et glPopMatrix fonctionnent de
cette manière :
/*affichage de nos obstacles*/
glPushMatrix(); /*creation de l’environement*/
/*transformations effectuees*/
/*affichage du caddie*/
glPopMatrix(); /*fermeture del’environement*/
Mais voila, cela aurait été trop beau : le glTranslate marchait sans problème, mais nous ne pouvions pas en dire autant du
glRotate, ce qui entraı̂nait, au final, des mouvements étranges du
cube, non naturels.
Nous sommes restés bloqués sur ce point très longtemps, et pensions même ne pas parvenir à résoudre ce problème avant la soutenance. Mais il ne faut jamais sous-estimer une nuit de réflexion
nous répètent souvent les Spé, et ça s’est avéré vrai. J’ai finalement
trouvé d’où venait le ”problème”, ou plutôt où était notre erreur :
les fonctions sinus et cosinus prennent en paramêtres des valeurs
en radians, et non pas en degrés comme l’on mettait innocemment
depuis le début. Et aussi minime que semble cette erreur, elle était
10
la cause de tous nos soucis !
De cette manière, nous avons pu afficher un futur caddie se déplaçant
indépendament d’un obstacle :
Le reste fut plus facile, et trouver la gestion d’entrée de commande grâce à la librairie GLFW s’est révélé beaucoup plus simple
que le reste. Au final, le code ressemble à ceci :
If (glfwGetKey(GLFW_KEY_UP) = 1) Then
X := X + cos(angle)*speed;
Y := Y + sin(angle)*speed;
If (glfwGetKey(GLFW_KEY_RIGHT) = 1) Then
angle := angle + degrot;
Les commandes GLFW KEY UP et GLFW KEY RIGHT tout
comme leurs symétriques GLFW KEY DOWN et GLFW KEY LEFT
parlent d’elles-même : lorsque leur valeur prend 1 la touche est enfoncée, et l’on peut bouger le mobile – cube ici, caddie plus tard.
(X,Y) représente le couple de coordonnées du centre de rotation du
cube, et leur valeur est modifiée selon l’angle de déplacement angle.
Ce dernier est incrémenté ou décrémenté – de degrot – selon que l’on
11
Fig. 2.1 – Et voila ce qu’on obtient au final !
tourne d’un côté ou d’un autre.
Enfin, un détail, mais qui a son importance : le cube 3D est un
”vrai” cube. J’entends par là qu’aucune de ses faces n’est transparente, or c’est ce qui nous a posé problème au moment d’essayer la
modélisation d’un objet en 3 dimensions, certaines faces disparaissaient et semblaient – alors qu’originalement supérieures – sous les
autres.
2.2.3
À venir
Maintenant que nous avons notre cube (que l’on remplacera par
un modèle de Caddie) capable de bouger dans un environnement
indépendant, Marc sera capable de se plonger entièrement dans le
12
moteur physique, et Jonathan et moi-même pourrons nous préoccuper
des modèles mais aussi des textures.
En effet, la prochaine étape pour nous consistera à apprendre à
appliquer des textures sur les différents blocs, puis à bâtir le décor
pièce par pièce.
13
Chapitre 3
Partie Physique
3.1
Marc Chamberlin
Pour cette première soutenance, la partie physique devait être
commencée et l’accélération ou les collisions abordées.
3.1.1
L’accélération
Pour l’accélération, il s’agissait de rendre le plus réaliste possible
les mouvements du caddie. Pour cela, il fallait que la vitesse du caddie varie en fonction du temps pendant lequel le joueur appuie sur
les touches haut et bas. Pour cela, j’ai utilisé une variable (vit) qui
détermine le déplacement du caddie en translation.
Lorsque (vit) est positive, notre caddie avance et lorsqu’elle est
négative, il recule. En appuyant sur la touche ”haut” cela augmente
la valeur de (vit) et visuellement, le caddie se déplace de plus en
plus vite. De la même manière, en appuyant sur ”bas”, le caddie
décélère, voire recule lorsque la valeur est négative.
Cependant, il faut que le caddie puisse s’arrêter seul. Il faut donc
traı̂ter le cas où aucune touche n’est enfoncée. Lorsque (vit) est positive, sa valeur décroit tant qu’elle n’atteint pas 0. De la même
manière, lorsque (vit) est négative, elle augmente tant qu’elle n’atteint pas 0.
14
Enfin, il faut déterminer une valeur maximum et minimum à (vit)
pour que la vitesse du caddie soit plus réaliste. A l’aide d’une boucle
”tant que”, la vitesse du caddie est limitée aussi bien en avançant
qu’en reculant. Puis, pour plus de réalisme, l’augmentation de (vit)
est différente selon si l’on accélère, ralentit ou freine.
Voici un graphe symbolisant la valeur de (vit) (donc la vitesse du
caddie) en fonction du temps lorsque l’on appuie ou non sur ”haut”
ou ”bas”.
Le caddie peut donc avancer et reculer. Or il faut qu’il puisse tourner et non se décaler. C’est pourquoi je n’ai pas utilisé de translation
vers la gauche ou la droite, mais plutôt des rotations ayant pour
centre le milieu du caddie. En appuyant sur ”gauche” ou ”droite”,
le caddie tourne sur lui même lorsqu’il est à l’arrêt.
3.1.2
À venir
Les collisions n’ont pas encore été implantées, cependant, elles
devraient apparaı̂tre pour la prochaine soutenance.
De plus, il est prévu que le caddie, lors de rotation, puisse continuer sur sa trajectoire initiale pendant quelques instants (phénomène
se produisant pour un caddie où les quatres roues pivotent).
15
Chapitre 4
Intelligence Artificielle
4.1
4.1.1
Roman Pak
Le jeu
Dans le jeu que nous développons, l’intelligence artificielle servira
à donner mouvement à des personnages non joueurs. Le principe
est de recréer l’ambiance propre au supermarché. Il s’agit donc de
déplacer de manière aléatoire un ou plusieurs personnages dans le
niveau. Plusieurs problèmes se sont alors posés.
1. Collisions entre personnages non joueurs
2. Bouchons occasionnés par les personnages non joueurs
3. Mouvements à effectuer
4.1.2
Derrière le jeu
Pour faire face aux problèmes de collisions entre les personnages
non joueurs, la solution à adopter sera de répartir la surface du niveau aux différents personnages non joueurs. De ce fait, aucun des
personnages non joueurs ne pourra entrer en collision avec un autre.
La disposition d’un supermarché est faite de manière à ce que
plusieurs caddies puissent passer au même moment dans une allée.
Lors du dessin des différents niveaux entre chaque rayon, il n’y avait
qu’un seul carreau, nos personnages occupant un carreau bloquaient
donc une allée complète. Il fallut donc voir au delà de nos dessins,
chaque carreau devrait valoir 4 carreaux au lieu d’un seul. De ce fait
16
deux caddies peuvent se croiser dans une allée.
Le résultat de la recherche du plus court chemin est une liste
contenant les différents mouvements à effectuer.
4.1.3
Les bases de recherche
Pour trouver le chemin le plus direct entre deux point d’un quadrillage contenant des zones inaccessibles, j’ai tout d’abord pensé à
donner des valeurs aux cases. Le principe aurait été de se déplacer en
choisissant la case ayant la plus petite valeur. Sur mon premier tableau d’essai, chaque case contient le nombre de cases noires qui l’entourent. Mais ce principe ne permet pas de rejoindre un autre point.
Il me fallait donc un système de valeurs en fonction de l’éloignement
du point d’arrivée. La formule suivante permet de calculer une valeur fonction de la distance du point d’arrivée. x0 et y0 sont les
coordonn/’ees du point d’arrivée. x et y les coordonnées du point
où l’on se trouve. |x − x0| + |y − y0| :
17
procedure crtmap; var
i,j:Integer;
begin
infos := ask();
for i:=0 to infos[0] do
for j:=0 to infos[1] do
grid [i,j]:= abs (i-infos[4])+ abs (j-infos[5]);
Il s’agit d’une procédure de création du niveau : ”infos” est un
vecteur contenant les différentes informations du niveau, taille, position de départ ,position d’arrivée. Ici la fonction ajoute à chaque
case la valeur de sa distance avec le point d’arrivée. J’ai ensuite
ajouté à chaque case le nombre de cases noires qui l’entourent. Le
but étant d’écarter les impasses. Si le nombre ajouté à la case est
élevé, cela veut dire que le choix des directions en partant de cette
case est faible. Les murs sont ajoutés, de manière aléatoire, par une
fonction non décrite qui ajoute un nombre de murs défini par la taille
du niveau. Le nombre de murs est égal à : aire du niveau divisée par
2.
18
function nearwall(map : t_tab; x:Integer; y:Integer):Integer; var
s:Integer;
begin s:=0;
if map [x,y]<> 999 then
begin
if map[x,y-1] = 999 then
s:=s+1;
if map[x+1,y] = 999 then
s:=s+1;
if map[x,y+1] = 999 then
s:=s+1;
if map[x-1,y] = 999 then
s:=s+1;
end;
result:=s; end;
Il s’agit d’une fonction créant un entier représentatif du nombre
de murs entourant une case. Les case contenant 999 sont des murs.
Le chemin choisi ne doit pas traverser de murs. Il faut donc choisir
19
une valeur élevée de façon à ce que l’algorithme ne choisisse pas un
mur.
procedure addwall ;
var
i,j:Integer;
begin
for i:=0 to infos[0] do
for j:=0 to infos[1] do
if ((i=infos[2]) and (j=infos[3]))
or ((i=infos[4]) and(j=infos[5])) then
grid [i,j]:= 0
else
grid [i,j]:= grid [i,j]+ nearwall(grid,i,j);
end;
Il s’agit d’une procédure parcourant le niveau et ajoutant le
nombre de murs adjacents à la case traitée.
4.1.4
Les évolutions
L’algorithme de recherche du chemin le plus court est bien avancé
mais il n’est pas fini. En effet, il trouve bien un chemin menant à
un point mais pas forcément le chemin le plus court. Il faudra aussi
développer une interface graphique qui permettra de mieux visualiser le travail de l’algorithme.
20
En cliquant sur une case, elle se remplira de noir et sera considérée
comme un mur. Et inversement losrque l’on cliquera sur une cellule
noir. Les boutons start et finish permettront de définir les points
d’arrivée et de départ. Generate génèrera aléatoirement un niveau.
Launch lancera la recherche du chemin reliant les deux points choisis.
Il sera possible de sauvegarder les niveaux créés de façon à les jouer.
21
Chapitre 5
Site Web
5.1
5.1.1
Jean-Charles Delay
Introduction
Comme prévu initialement, je me suis occupé de la création du
site web de notre projet. A l’origine je ne connaissais rien au HTML,
CSS, PHP et autres. J’ai donc dû, dans un premier temps, rechercher un tutoriel qui pourrait m’apprendre la conception d’un site
web. Je me suis orienté vers Le Site du Zero (www.siteduzero.com)
où j’ai trouvé ce que je cherchais. En plus d’être bien fait, ce tutoriel
est très pédagogique ce qui a, me semble-t-il, beaucoup facilité mon
apprentissage.
J’ai donc avancé en tatonnant, apprennant le fonctionnement de
chaque balise dont j’avais besoin et faisant mes propres essais de
mon côté pour bien intégrer ce qui n’est autre qu’un autre langage
de programmation, mais celui-ci est réservé à la conception de sites
web.
22
J’ai donc fini par m’attaquer au gros du travail, c’est-à-dire la
mise en application de tout ce que j’avais appris pour créer le site
”officiel” du projet. Je suis finalement arrivé exactement à ce que
je voulais, c’est-à-dire à avoir fini le site qui ne nécessite plus que
de petites mises à jour rapides et périodiques. Seul hic dans tout
cela, le problème de mot de passe survenu sur notre compte Free
qui nous a obligé à recréer un compte, dont nous attendons toujours
les identifiants.
Je vais maintenant vous détailler le contenu de notre site.
5.1.2
Index
Tout d’abord vous entrez dans le site par la première page (logique me direz vous) où se trouve les news propres au projet. Ainsi
par cette seule page, le visiteur peut être informé des derniers événements
liés au projet.
Mais il a aussi à sa disposition l’ensemble des liens vers les autres
pages du site internet, ainsi que des liens vers les pages internet
importantes telles que www.epita.fr, le forum de notre promo (2011),
le site de Nathalie ”Junior” Bouquet, ou encore le site de nos ACD
préférés !
5.1.3
Présentation
Une section complète pour la présentation de la team et de chacun de ses membres a été érigée. Nous pouvons y retrouver un court
paragraphe de chacun sur lui-même et un autre sur la formation
du groupe. Viendront plus tard égailler ces pages, plusieurs photos des quatres membres. C’est aussi ici que l’on peut retrouver les
principales informations telless que les mails de chacun.
23
5.1.4
Downloads
Une des parties les plus importantes du site web. En effet c’est
ici que seront bientôt disponibles les premiers exécutables liés au
passage de la première soutenance.
Mais sont aussi présents d’autres utilitaires, sans rapport direct
au projet, mais utiles à tout Epitéen tels que DotNetSoul ou bien
puTTY.
5.1.5
Le futur du site
Dans le futur, je continuerai à maintenir à jour notre site, ce qui
sera sans aucun doute beaucoup plus simple maintenant qu’il ne
s’agit que de détails à modifier.
24
Chapitre 6
Conclusion
Les travaux exposés sont encore un peu brouillons, mais rien
de plus normal pour une première soutenance. En effet, tout les
éléments vont finir par se recouper et le jeu prendra forme.
Par rapport au planning, le projet est dans les temps. Les bases
des parties graphique et physique sont posées, l’intelligence artificielle est plus avancée que prévu et le site web est pratiquement
terminé.
Le bilan pour notre premier rapport de soutenance est donc
plutôt positif.
25