presentation.tex (24259B)
1 \documentclass{beamer} 2 \usepackage[utf8]{inputenc} 3 \usepackage[frenchb]{babel} 4 \usepackage{tikz} 5 \usepackage{subfigure} 6 \usepackage[scriptsize]{caption} 7 \usepackage{multicol} 8 \renewcommand*{\figurename}{} 9 \usetikzlibrary{shapes,positioning,snakes,calc} 10 \usetheme{Darmstadt} 11 12 % \setbeamercolor{alerted text}{fg=blue} 13 14 \def\android{Android\texttrademark} 15 16 \title{FMIN200 \\ TER~: Reconception du jeu PtiClic sous \android{}} 17 \author{DUPÉRON Georges \and\\ CHARRON John \and\\ BRUN Bertrand \and\\ BONAVERO Yoann} 18 \institute{Université Montpellier II, Département informatique \\ Master 1 IFPRU \\ Sous la direction de Monsieur Mathieu LAFOURCADE} 19 \date{Jeudi, 26 mai 2011} 20 21 \defbeamertemplate*{footline}{shadow theme} 22 {% 23 \leavevmode% 24 \hbox{\begin{beamercolorbox}[wd=.5\paperwidth,ht=2.5ex,dp=1.125ex,leftskip=.3cm plus1fil,rightskip=.3cm]{author in head/foot}% 25 \usebeamerfont{author in head/foot}\insertframenumber\,/\,\inserttotalframenumber\hfill\url{http://www.pticlic.fr/} 26 \end{beamercolorbox}% 27 \begin{beamercolorbox}[wd=.5\paperwidth,ht=2.5ex,dp=1.125ex,leftskip=.3cm,rightskip=.3cm plus1fil]{title in head/foot}% 28 \usebeamerfont{title in head/foot}\insertshorttitle% 29 \end{beamercolorbox}}% 30 \vskip0pt% 31 } 32 33 \begin{document} 34 \renewcommand*{\figurename}{} 35 36 \begin{frame} 37 \titlepage 38 \end{frame} 39 40 % John 41 \section{Introduction} 42 43 \begin{frame} 44 \begin{figure}[h!] 45 \centering 46 \includegraphics[width=0.8\textwidth]{img/PtiClicJeu.png} 47 \caption{PtiClic de Mathieu LAFOURCADE et Virginie ZAMPA} 48 \end{figure} 49 \end{frame} 50 51 \begin{frame} 52 \begin{figure}[h!] 53 \centering 54 \only<1>{\includegraphics[width=0.4\textwidth]{img/preterit01.jpg}}% 55 \only<2>{\includegraphics[width=0.4\textwidth]{img/preterit02.jpg}}% 56 \only<3>{\includegraphics[width=0.4\textwidth]{img/preterit03.jpg}}% 57 \only<4>{\includegraphics[width=0.4\textwidth]{img/preterit04.jpg}}% 58 \only<5>{\includegraphics[width=0.4\textwidth]{img/preterit05.jpg}}% 59 \only<6>{\includegraphics[width=0.4\textwidth]{img/preterit06.jpg}}% 60 \only<7>{\includegraphics[width=0.4\textwidth]{img/preterit07.jpg}}% 61 \only<8>{\includegraphics[width=0.4\textwidth]{img/preterit08.jpg}}% 62 \caption{Reconception PtiClic Version HTML5} 63 \end{figure} 64 \end{frame} 65 66 67 68 \section{Paquetage TALN} 69 70 \begin{frame} 71 \begin{center} 72 \Huge Paquetage TALN 73 \end{center} 74 \end{frame} 75 76 \begin{frame} 77 Ferdinand de Saussure (1857-1913), Cours de linguistique générale 78 \begin{itemize} 79 \item Signe linguistique 80 81 \begin{figure} 82 \centering 83 \mbox{ 84 \subfigure{\includegraphics[scale=0.3]{img/signe-conceptimageacoustique.jpeg}}\quad 85 \subfigure{\includegraphics[scale=0.3]{img/signe-cheval.jpeg}}\quad 86 \subfigure{\includegraphics[scale=0.3]{img/trianglesemiotique.jpeg}} 87 } 88 \end{figure} 89 90 \item Arbitraire du signe 91 \item Synchronie et Diachronie 92 \item Langue et Parole 93 \end{itemize} 94 95 \end{frame} 96 97 \begin{frame} 98 \frametitle{Réseau lexical JeuxDeMots - 1/2} 99 100 \begin{block}{Types de noeuds} 101 \begin{itemize} 102 \item termes 103 \item catégories grammaticales 104 \item informations métalinguistiques supplémentaires 105 \end{itemize} 106 \end{block} 107 108 \textcolor{white}{text}\\ 109 \begin{block}{Types de relations} 110 \begin{itemize} 111 \item morphologique 112 \item sémantique 113 \item métalinguistique 114 \end{itemize} 115 \end{block} 116 \end{frame} 117 118 \begin{frame} 119 \frametitle{Réseau lexical JeuxDeMots - 2/2} 120 \begin{block}{Quelques statistiques} 121 \begin{itemize} 122 \item environ 45\% des noeuds n'ont pas de relation sémantique sortante 123 \item environ 70\% des noeuds n'ont pas de relation sémantique entrante 124 \end{itemize} 125 \end{block} 126 \end{frame} 127 128 \begin{frame} 129 \begin{block}{Bruits et silences} 130 \begin{itemize} 131 \item bruit = relations plus fortes que la réalité 132 \item silence = relations non existantes ou trop faibles par rapport à la réalité 133 \item bruits et/ou silences = couverture de relations sémantiques hétérogènes 134 \end{itemize} 135 \end{block} 136 \end{frame} 137 138 \begin{frame} 139 \begin{figure} 140 \pgfdeclarelayer{background} 141 \pgfdeclarelayer{foreground} 142 \pgfsetlayers{background,main,foreground} 143 \begin{tikzpicture}[ 144 txt/.style = {fill=white,font=\footnotesize,scale=0.75, inner sep=1pt}, 145 earlymidway/.style = {pos=0.4}, 146 latemidway/.style = {pos=0.6} 147 ] 148 \node (n4) {mot4}; 149 \node[above left = 2cm of n4] (n1) {mot1}; 150 \node[above right = 2cm of n4] (n3) {mot3}; 151 \node[below left = 2cm of n4] (n2) {mot2}; 152 \node[below right = 2cm of n4] (n5) {mot5}; 153 154 \foreach \direction/\nfrom/\nto/\angle/\pos/\anchor/\text in { 155 ->/n4/n3/15/near end/east/idée associée 450, 156 <-/n4/n3/0/midway/center/idée associée 250, 157 <-/n4/n3/-15/near start/west/hyperonyme 50, 158 % 159 ->/n4/n5/-20/midway/center/idée associée 25, 160 % 161 ->/n3/n5/-15/near end/east/hyponyme 50, 162 ->/n3/n5/0/latemidway/east/locution 70, 163 ->/n3/n5/15/latemidway/west/idée associée 25, 164 <-/n3/n5/30/near end/west/idée associée 25, 165 % 166 ->/n1/n2/-15/very near end/east/hyperonyme 70, 167 <-/n1/n2/0/latemidway/center/idée associée 50, 168 <-/n1/n2/15/very near end/west/hyperonyme 50, 169 % 170 ->/n1/n4/-15/near end/center/domaine 25, 171 ->/n1/n4/5/midway/center/idée associée 310, 172 % 173 ->/n1/n5/-30/very near end/east/domaine 25, 174 % 175 ->/n1/n3/40/midway/center/idée associée 200, 176 ->/n1/n3/25/midway/center/hyperonyme 80, 177 <-/n1/n3/12/midway/center/hyponyme 100, 178 <-/n1/n3/0/midway/center/idée associée 60 179 }{ 180 \draw[\direction] (\nfrom) to[bend left=\angle] (\nto); 181 \begin{pgfonlayer}{foreground} 182 \path[\direction] (\nfrom) to[bend left=\angle] node[\pos, anchor=\anchor, txt] {\text} (\nto); 183 \end{pgfonlayer} 184 } 185 \end{tikzpicture} 186 \end{figure} 187 \end{frame} 188 189 \begin{frame} 190 \begin{center} 191 \hskip -15.1em 192 \begin{minipage}{15em} 193 \begin{tabular}{ | l | l | l | l | p{5cm} |} 194 \hline 195 \footnotesize{Relation} & \footnotesize{Mot central} & \footnotesize{Mots nuage} & \footnotesize{Remarques} \\ \hline 196 \footnotesize{-1 'mn' n'est pas lié à 'mc'} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{} \\ \hline 197 \footnotesize{0 'mc' est en rapport avec 'mn'} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{} \\ \hline 198 \footnotesize{5 'mc' est un synonyme de 'mn'} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{\shortstack{même POS}} \\ \hline 199 \footnotesize{6 'mc' est une sorte de 'mn'} & \footnotesize{n} & \footnotesize{n} & \footnotesize{} \\ \hline 200 \footnotesize{7 Un contraire de 'mc' est 'mn'} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{\shortstack{adj adv n v}} & \footnotesize{\shortstack{même POS}} \\ \hline 201 \footnotesize{8 Un spécifique de 'mc' est 'mn'} & \footnotesize{n} & \footnotesize{n} & \footnotesize{} \\ \hline 202 \footnotesize{9 'mn' est une partie de 'mc'} & \footnotesize{n} & \footnotesize{n} & \footnotesize{} \\ \hline 203 \footnotesize{10 'mc' fait partie de 'mn'} & \footnotesize{n} & \footnotesize{n} & \footnotesize{} \\ \hline 204 \footnotesize{13 'mn' pourrait 'mc'} & \footnotesize{v} & \footnotesize{n} & \footnotesize{} \\ \hline 205 \footnotesize{15 Le lieu pour 'mc' est 'mn'} & \footnotesize{n v} & \footnotesize{\shortstack{n}} & \footnotesize{} \\ \hline 206 \footnotesize{16 Instrument pour 'mc' est 'mn'} & \footnotesize{v} & \footnotesize{n} & \footnotesize{} \\ \hline 207 \footnotesize{17 Un caractéristique de 'mc' est 'mn'} & \footnotesize{n} & \footnotesize{adj} & \footnotesize{} \\ \hline 208 \end{tabular} 209 \end{minipage} 210 \end{center} 211 \end{frame} 212 213 \begin{frame} 214 \begin{block}{} 215 Pas de conflit de relations + bonne catégorie grammaticale = conditions nécessaires mais pas suffisantes 216 \begin{itemize} 217 \item 'mn' est une partie de 'mc'~ : noms, mais objets physiques aussi 218 \item 'mn' pourrait 'mc' (Qui/Quoi pourrait 'mc')~: noms et verbe respectivement, mais verbe d'état ne fonctionne pas 219 \item le lieu de 'mc' est 'mn'~: nom ou verbe puis nom, etc. 220 \end{itemize} 221 \end{block} 222 \end{frame} 223 224 225 \begin{frame} 226 \frametitle{Introduction des mots sans aucune relation sémantique} 227 \begin{block}{Algorithme de base} 228 \begin{enumerate} 229 \item On génère le nuage à l'aide d'une méthode ou algorithme auxiliaire (LSA ou autre) à partir d'un mot central choisi au hasard 230 \item On choisit la seule relation sémantique "idée associée" afin de valider les mots générés par l'étape précédente 231 \item Algorithme suivant est utilisé pour affiner les informations concernant le mot central en question 232 \end{enumerate} 233 \end{block} 234 \end{frame} 235 236 237 \begin{frame} 238 \begin{figure} 239 \pgfdeclarelayer{background} 240 \pgfdeclarelayer{foreground} 241 \pgfsetlayers{background,main,foreground} 242 \begin{tikzpicture}[ 243 txt/.style = {fill=white,font=\footnotesize,scale=0.75, inner sep=1pt}, 244 earlymidway/.style = {pos=0.4}, 245 latemidway/.style = {pos=0.6} 246 ] 247 \node (n0) {mot4}; 248 \node[above left = 2cm of n0] (n1) {mot1}; 249 \node[above right = 2cm of n0] (n2) {mot3}; 250 \node[below left = 2cm of n0] (n3) {mot2}; 251 \node[below right = 2cm of n0] (n4) {mot5}; 252 253 \foreach \direction/\nfrom/\nto/\angle/\pos/\anchor/\text in { 254 -/n0/n1/15/near end/east/0.28, 255 % 256 -/n0/n2/-20/midway/center/0.48, 257 % 258 -/n0/n3/-15/near end/east/0.12, 259 % 260 -/n0/n4/-15/very near end/east/0.4, 261 % 262 -/n1/n2/-20/midway/center/0.94, 263 % 264 -/n1/n3/-15/near end/east/0.75, 265 % 266 -/n1/n4/-15/very near end/east/0.42, 267 % 268 -/n2/n3/-15/near end/east/0.04, 269 % 270 -/n2/n4/-15/very near end/east/0.39, 271 % 272 -/n3/n4/-20/midway/center/0.88 273 }{ 274 \draw[\direction] (\nfrom) to[bend left=\angle] (\nto); 275 \begin{pgfonlayer}{foreground} 276 \path[\direction] (\nfrom) to[bend left=\angle] node[\pos, anchor=\anchor, txt] {\text} (\nto); 277 \end{pgfonlayer} 278 } 279 \end{tikzpicture} 280 \end{figure} 281 \end{frame} 282 283 \begin{frame} 284 \frametitle{Affinage des relations de types "idée associée"} 285 \begin{block}{Algorithme} 286 \begin{enumerate} 287 \item On génère le nuage à partir de la relation sémantique le plus générale, "idée associée" 288 \item On choisit des relations sémantiques plus spécifiques sans conflits (tableau "relations" précédent) 289 \end{enumerate} 290 \end{block} 291 \end{frame} 292 293 \begin{frame} 294 \frametitle{Renforcement de relations} 295 \begin{block}{Algorithmes} 296 \begin{itemize} 297 \item Synonymie~: "synonyme de synonyme" ou "antonyme d'antonyme" du mot central 298 \item Antonymie~: "antonyme de synonyme" ou "synonyme d'antonyme" du mot central 299 \item Spécifique~: "spécifique d'un générique d'un spécifique" du mot central 300 \item etc. 301 \end{itemize} 302 \end{block} 303 \end{frame} 304 305 306 \begin{frame} 307 \frametitle{Expériences en TALN} 308 \begin{block}{Interactions homme-machine} 309 \begin{itemize} 310 \item On apprend de la machine 311 \item La machine "apprend" de nous~: modifications d'algorithmes, de stratégies et d'approches par rapport aux résultats 312 \end{itemize} 313 \end{block} 314 \end{frame} 315 316 317 318 \section{Génération de partie} 319 \begin{frame} 320 \begin{center} 321 \Huge Génération de partie\\ 322 \Large (Georges \textsc{Dupéron}) 323 \end{center} 324 \end{frame} 325 \begin{frame} 326 \begin{center} 327 \begin{tikzpicture}[ 328 mynode/.style = {circle, minimum size=1.5cm}, 329 mc/.style = {mynode,draw=red,text=red}, 330 mn/.style = {mynode,draw}, 331 mi/.style = {mynode,draw=gray,text=gray}, 332 rel/.style = {font=\footnotesize}, 333 guess/.style = {->,dashed}, 334 exist/.style = {->}, 335 auto,swap 336 ] 337 \node[mc] (mc) {Chat}; 338 \node[mn] (mn0) at (0,3) {Souris}; 339 \node[mi] (mi1) at (3,-2) {matou}; 340 \node[mn] (mn2) at (6,0) {animal}; 341 \path[exist] (mc) edge[bend right] node[rel]{idée associée} (mn0); 342 \path[exist] (mc) edge node[rel]{synonyme} (mi1); 343 \path[exist] (mi1) edge node[rel]{sorte de} (mn2); 344 \path[guess,swap] (mc) edge node[rel]{sorte de ?} (mn2); 345 \path[guess,swap] (mc) edge[bend left] node[rel]{\shortstack{sorte de ?\\synonyme ?\\\dots}} (mn0); 346 \end{tikzpicture} 347 \end{center} 348 \end{frame} 349 350 \begin{frame} 351 \begin{center} 352 \begin{tikzpicture}[ 353 mynode/.style = {circle, minimum size=1.5cm}, 354 mc/.style = {mynode,draw=red,text=red}, 355 mn/.style = {mynode,draw}, 356 mi/.style = {mynode,draw=gray,text=gray}, 357 rel/.style = {font=\footnotesize}, 358 guess/.style = {->,dashed}, 359 exist/.style = {->}, 360 auto 361 ] 362 \node[mc] (mc) {\shortstack{Mot central\\\action<3->{\footnotesize{POS 1}}}}; 363 \node[mi, above right=of mc] (mi) {\shortstack{\footnotesize{Intermédiaire}\\\action<3->{\footnotesize{POS 2}}}}; 364 \node[mn, below right=of mi] (mn) {\shortstack{Mot nuage\\\action<3->{\footnotesize{POS 3}}}}; 365 366 \path[draw,->] (mc) edge node {Relation 1} (mi); 367 \path[draw,->] (mi) edge node {Relation 2} (mn); 368 \path<2->[draw,->] (mc) edge node[swap] {Relation déduite} (mn); 369 \end{tikzpicture} 370 \end{center} 371 \end{frame} 372 373 %Yoann 374 \section{Création de partie} 375 376 \begin{frame} 377 \begin{center} 378 \Huge Cr\'eation de partie\\ 379 \Large (Yoann \textsc{Bonavero}) 380 \end{center} 381 \end{frame} 382 383 \begin{frame} 384 \frametitle{Création manuelle de parties} 385 \begin{block}{Un exemple de partie crée automatiquement} 386 \begin{center} 387 tsé tsé 388 \end{center} 389 \begin{multicols}{2} 390 \begin{itemize} 391 \item mouche 392 \item tsé-tsé 393 \item mouche tsé-tsé 394 \item mouche tsétsé 395 \item géohistoire 396 \item ensommeiller 397 \item fatigue 398 \item \dots{} 399 \end{itemize} 400 \end{multicols} 401 avec comme relations : 402 \begin{itemize} 403 \item \dots{} est une sorte de \dots{} 404 \item un instrument pour \dots{} est \dots{} 405 \end{itemize} 406 \end{block} 407 \end{frame} 408 409 \begin{frame} 410 \frametitle{Création manuelle de parties} 411 \begin{block}{Quel intérêt pour les joueurs ?} 412 413 \begin{itemize} 414 \item Valorise le joueur 415 \item Crée des relations entre joueurs 416 \item Donne un intérêt aux parties 417 \item Permet de jouer sur des parties contenant un message. 418 \end{itemize} 419 \end{block} 420 \end{frame} 421 422 \section{Site Internet} 423 \begin{frame} 424 \frametitle{Le site Internet} 425 \begin{block}{} 426 \large Un site internet, pour quoi faire ? 427 \newline \\ 428 \large Que peut-on y trouver ? 429 \newline \\ 430 \large Jouez directement sur le site ! 431 \end{block} 432 \end{frame} 433 434 % bertrand 435 \section{Le Jeu} 436 437 \begin{frame} 438 \begin{center} 439 \Huge Le Jeu\\ 440 \Large (Bertrand \textsc{Brun}) 441 \end{center} 442 \end{frame} 443 444 \begin{frame} 445 \frametitle{Le framework \android{}} 446 \begin{block}{Les outils mis à disposition} 447 \begin{itemize} 448 \item<+-> Langage de programmation Java ; 449 \item<+-> Patron de conception MVC (Modèle-Vue-Contrôleur); 450 \item<+-> Les vues sont réalisées en XML 451 \end{itemize} 452 \end{block} 453 \begin{alertblock}{Inconvenient}<+-> 454 L'édition des vues en XML nous a énorment ralenti lors du développement de l'alpha 1 455 \end{alertblock} 456 \end{frame} 457 458 \begin{frame} 459 \frametitle{Le modèle MVC proposé par Google} 460 \begin{block}{Modèle-Vue-Contrôleur} 461 \centering 462 \begin{tikzpicture}[bend angle=10, shorten >=0.1cm, shorten <=0.1cm] 463 \node[draw] (activite) {Contr\^olleur (Activité)}; 464 \node[draw,below right=of activite, anchor=east, xshift=1cm] (modele) {Modèle}; 465 \node[draw,below left=of activite, anchor=west, xshift=-1cm] (xml) {Vue (XML)}; 466 \draw[->] (activite.east) ++(0,+.1cm) to[out=0, in=90] ($(modele.north)+(+.1cm,0)$); 467 \draw[<-] (activite.east) ++(0,-.1cm) to[out=0, in=90] ($(modele.north)+(-.1cm,0)$); 468 \draw[->] (activite.west) ++(0,+.1cm) to[out=180, in=90] ($(xml.north)+(-.1cm,0)$); 469 \draw[<-] (activite.west) ++(0,-.1cm) to[out=180, in=90] ($(xml.north)+(+.1cm,0)$); 470 \end{tikzpicture} 471 \end{block} 472 \begin{block}{Détail} 473 \begin{description} 474 \item[Modèle] Classe metier permettant de stocker des informations 475 \item[Contrôleur] Classe héritant d'\verb!Activity! (Activité) 476 \item[Vue] XML affichant les informations 477 \end{description} 478 \end{block} 479 \end{frame} 480 481 \begin{frame} % Un peu vide peut etre ajouter les autre activite tel que prefs, info... 482 \frametitle{Prototype 1} 483 \begin{block}{Schéma général de l'enchainement des Activités~:} 484 \centering 485 \begin{tikzpicture}[ 486 state/.style={draw}, 487 transition/.style={->} 488 ] 489 \node[state] (frontpage) {Page de garde}; 490 \node[state, right=of frontpage] (game) {Jeu}; 491 \node[state, right=of game] (score) {Score}; 492 493 \draw[transition] (frontpage) -- (game); 494 \draw[transition] (game) -- (score); 495 \draw[transition] (score.south) -- ++(0,-0.3cm) -| (frontpage); 496 \draw[transition,<-] (game.north) -- ++(0,0.3cm) -| ($.5*(game) + .5*(score)$); 497 498 \node[state,text width=1.2cm, below=of frontpage] (activite) {Activité}; 499 \draw[transition] (activite.north east) ++(0.5cm,0) -- node[auto,swap,font=\footnotesize,scale=0.8] {\shortstack{\shortstack{Évènement\\(Intent)}}} ++(1.5cm,0); 500 \end{tikzpicture} 501 \end{block} 502 \end{frame} 503 504 \begin{frame} 505 \frametitle{Passage au HTML} 506 \begin{alertblock}{Défauts constatés} 507 \begin{itemize} 508 \item<2-> Perte de temps avec les ajustements des vues ; 509 \item<3-> Public visé trop faible ; 510 \end{itemize} 511 \end{alertblock} 512 \begin{block}{Solutions proposées}<4-> 513 \begin{itemize} 514 \item<5-> Développement de l'application en Javascript/HTML5 pour les vues ; 515 \item<6-> Utilisation du framework WebKit proposé par \android{} ; 516 \item<7-> Utilisation du web pour toucher plus de personnes ; 517 \end{itemize} 518 \end{block} 519 \end{frame} 520 521 \begin{frame} 522 \frametitle{Prototype 2} 523 \begin{block}{Schéma général de l'enchaînement des pages~:} 524 \footnotesize{ 525 \texttt{ 526 \textcolor{gray}{http://www.pticlic.fr/jeu.html}% 527 \only<1-1>{\#frontpage}% 528 \only<2-8>{\#\textcolor{red}{game}/1306104746953}% 529 \only<9>{\#game/\textcolor{blue}{1306104746953}/\textcolor{blue}{5}}% 530 \only<10>{\#game/1306104746953/5,\textcolor{blue}{0}}% 531 \only<11>{\#game/1306104746953/5,0,\textcolor{blue}{5}}% 532 \only<12>{\#game/1306104746953/5,0,5,\textcolor{blue}{-1}}% 533 \only<13>{\#game/1306104746953/5,0,5,-1}% 534 } 535 } 536 \begin{center} 537 \vskip 0.5em% 538 \begin{tikzpicture}[ 539 state/.style = {circle,draw,minimum size=1.3cm}, 540 sync/.style = {draw, ->}, 541 async/.style = {draw, ->, decorate, decoration={snake, post length=.5mm}, segment amplitude=.4mm, segment length=2mm}, 542 source/.style = {}, 543 auto, 544 secondary/.style={draw=gray} 545 ] 546 \path[use as bounding box] (-1,-4.8) rectangle (7.8,0.3); 547 548 \path<2-3> node[source] (hash) {\color{red}{hashchange}}; 549 \path<3> node[state, below=of hash, color=red] (goto) {\shortstack{aller\\vers}}; 550 \path<4-8> node[source] (hash) {hashchange}; 551 \path<4-> node[state, below=of hash] (goto) {\shortstack{aller\\vers}}; 552 \path<4-> node[state, below=of goto] (leave) {quitter}; 553 \path<5-> node[state, right=of goto] (pre-enter) {\shortstack{pré-\\entrée}}; 554 \path<6-> node[state, right=of pre-enter] (enter) {entrée}; 555 \path<7-> node[coordinate, below=of pre-enter] (c1) {}; 556 \path<7-> node[coordinate, below=of enter] (c2) {}; 557 \path<7-> node[state] (ajax) at ($0.5*(c1) + 0.5*(c2)$) {AJAX}; 558 \path<8> node[state, right=of enter] (update) {\shortstack{mise\\\`a\\jour}}; 559 \path<9-12> node[state, right=of enter, color=blue] (update) {\shortstack{mise\\à\\jour}}; 560 \path<9-12> node[source] (hash) {\color{blue}{hashchange}}; 561 \path<13> node[source] (hash) {hashchange}; 562 \path<13> node[state, right=of enter] (update) {\shortstack{mise\\à\\jour}}; 563 564 \path<3>[sync,draw=red] (hash) -- (goto); 565 \path<4->[sync] (hash) -- (goto); 566 \path<4-> [sync] (goto) edge node {1} (leave); 567 \path<5-> [sync] (goto) edge node {2} (pre-enter); 568 \path<6-> [sync,dashed] (pre-enter) -- (enter); 569 \path<8-> [sync] (enter) -- (update); 570 \path<7-> [async,secondary] (pre-enter) -- (ajax); 571 \path<7-> [async,secondary] (ajax) -- (enter); 572 \path<9-12> [sync,draw=blue] (hash.east) to[out=0, in=135] (update); 573 \path<13> [sync] (hash.east) to[out=0, in=135] (update); 574 \end{tikzpicture} 575 \end{center} 576 \end{block} 577 \end{frame} 578 579 \begin{frame} 580 \frametitle{\'Evolution de l'architecture} 581 \begin{block}{Architecture de la \only<-8>{première}\only<9->{deuxième} version} 582 \begin{center} 583 \begin{tikzpicture}[ 584 bend angle=10, shorten >=0.05cm, shorten <=0.05cm, text height=0.35cm, 585 communication/.style={draw,dashed,<->} 586 ] 587 588 \node[draw] (appli) {Application \android{}}; 589 % Pour que l'animation ne bouge pas. 590 \path[use as bounding box] (-5.2,0.4) rectangle (5.2,-5.1); 591 592 \path<2-8> node[draw,below=of appli] (frontpage) {Écran principal}; 593 \path[draw,->]<2-8> (appli) -- (frontpage); 594 595 \path<3-8> node[draw,below=of frontpage, anchor=north east, xshift=-0.3cm] (game) {Jeu}; 596 \path[draw,->]<3-8> (frontpage) -- (game); 597 598 \path<4-> node[draw,left=of appli] (prefs) {Préférences}; 599 600 \path<4-8> node[draw,below=of prefs,xshift=0.1cm] (reseau) {Réseau}; 601 \path[communication]<4-8> (game) -- (prefs); 602 \path[communication]<4-8> (game) -- (reseau.south east); 603 604 \path[draw,->]<5-8> (game.south west) ++ (0,0.35cm) arc (90:360:0.35cm); 605 606 \path<6-8> node[draw,below=of frontpage, anchor=north west, xshift=0.3cm] (score) {score}; 607 \path[draw,->]<6-8> (game) -- (score); 608 609 \path[draw,->]<7-8> (score) -- (frontpage); 610 611 \path<8-8> node[draw,below left=of frontpage] (prefs-screen) {Préférences}; 612 \path<8-8> node[draw,below right=of frontpage] (about) {À propos}; 613 \path[draw,->]<8-8> (frontpage) -- (prefs-screen); 614 \path[draw,->]<8-8> (frontpage) -- (about); 615 \path[communication]<8-8> (prefs-screen.north west) to[bend left] (prefs.south west); 616 \path[communication]<8-8> (prefs-screen) -- (reseau); 617 618 \node[below=of appli, text height=0.25cm, minimum width=2cm] (fake-webkit) {\phantom{Webkit}}; 619 \path<9-> node[draw,below=of fake-webkit, text height=1.5cm, minimum width=2cm, text centered] (html5) {\shortstack{Html5\\JavaScript\\jQuery\\CSS}}; 620 621 \path[draw,->]<10-> (html5.south east) ++ (0,0.35cm) arc (90:-180:0.35cm); 622 623 \path<11-> node[draw,below=of appli, text height=0.25cm, minimum width=2cm] (webkit) {Webkit}; 624 \path[draw,->]<11-> (appli) -- (webkit); 625 \path[draw,->]<11-> (webkit) -- (html5); 626 627 \path<12-> node[coordinate] (waypoint) at ($0.5*(webkit.center)+0.5*(webkit.west)$) {}; 628 \path[communication]<12-> (html5) to[controls=(waypoint) and (waypoint)] node[pos=0.16, anchor=east, xshift=-0.1cm, font=\small] {Interface JavaScript} (prefs.south east); 629 \end{tikzpicture} 630 \end{center} 631 \end{block} 632 \end{frame} 633 634 \section{Demonstration} 635 \begin{frame} 636 \begin{center} 637 \huge{Démonstration\dots{}} 638 \end{center} 639 \end{frame} 640 641 \section{Conclusion} 642 643 \begin{frame} 644 \begin{center} 645 \Huge Conclusion 646 \end{center} 647 \end{frame} 648 649 \begin{frame} 650 \begin{block}{Chiffres~:} 651 \begin{itemize} 652 \item<2-> Nombre de participants~: 27 ; 653 \item<3-> Nombre de parties jouées~: 145 ; 654 \end{itemize} 655 \end{block} 656 \begin{block}{Am\'eliorations~:}<4-> 657 \begin{itemize} 658 \item<5-> Implémentation de l'algorithme de prédiction d'arcs dans un graphe ; 659 \item<6-> Mettre l'application sur Android Market ; 660 \end{itemize} 661 \end{block} 662 \end{frame} 663 664 \begin{frame} 665 \begin{center} 666 \huge{Merci de votre attention\dots} 667 \vskip 1em 668 \huge{Avez-vous des questions~?} 669 \end{center} 670 \end{frame} 671 672 \end{document}