Paris à travers le temps

Paris à travers le temps Paris à travers le temps Page 1 sur 1

Sommaire Introduction I. Synopsis II. Cahier des charges III. Scénario IV. Story board Conclusion Paris à travers le temps Page 2 sur 2

Introduction Ce projet a été réalisé dans le cadre de l UV SI28, notre objectif était de manipuler les logiciels flash, Photoshop et Audacity. Etant toutes les deux dans la branche génie des systèmes urbains, nous avons décidé de réaliser un projet en rapport avec la ville, Paris riche en histoire et en émotion que nous connaissions assez bien c est tout de suite présentée à nous comme le meilleur sujet pour notre projet. Un de nos objectifs alors a été de faire ressentir l ambiance de quartier que nous connaissions assez bien. Dans ce rapport, nous avons rassemblé notre synopsis, cahier des charges, scénario et story-board qui nous ont permis de mener à bien notre projet. Paris à travers le temps Page 3 sur 3

I. Synopsis Concept Métaphore d introduction: Un personnage vivant à notre époque (2008) hérite d un hôtel particulier à Paris. Il découvre rapidement que celui-ci est hanté. Une nuit, en essayant d échapper aux blagues du fantôme, il se retrouve enfermé par celui-ci dans le grenier. En interagissant avec les différents souvenirs présents dans le grenier, il devra montrer ses connaissances sur trois quartiers représentant trois ambiances de Paris à des périodes différentes de l histoire. Cette introduction met en contexte l utilisateur du jeu et débouche sur une interface principale (accueil) : le grenier. Description de l application : L utilisateur devra cliquer sur les objets présents dans le grenier pour accéder à une époque et un lieu particulier de Paris (comme un retour vers le passé). Chaque objet renvoie à un thème particulier (un décor avec une ambiance), sa mission sera en rapport direct avec celui-ci. Il y a trois boutons interactifs envoyant à trois tableaux différents : - un tableau représentant Montmartre renvoie l utilisateur dans ce quartier - le livre de Mai68 renvoie l utilisateur dans le quartier latin à cette époque - la Tour Eiffel renvoie l utilisateur dans ce quartier à l époque de l exposition universelle L utilisateur aura pour chaque tableau le choix entre trois niveaux : facile, moyen, intermédiaire, ce qui lui permettra de recommencer le jeu plusieurs fois et de se tester. Les différentes missions seront sous forme de quiz (avec un mélange des styles : histoire, peinture, anecdote, film ). L utilisateur aura plusieurs possibilités : - répondre à la question directement s il répond juste il aura 2 points s il répond faux il aura 0 point - demander un indice s il répond juste il aura 1 point s il répond faux il aura 0 point La victoire étant accordée au joueur s il obtient un nombre de point supérieur à 10 pour les 10 questions. La réponse aux questions sera détaillée et pour certains sujets donnera de plus ample explication. Nous avons choisi de ne pas mettre FAUX ou JUSTE après chaque question pour pousser l utilisateur à lire la totalité de la réponse. Public ciblé Qui?: Trois modes de difficultés permettent à un public d adolescents ou d adultes de répondre aux différentes missions selon leur niveau de connaissance. Ses attentes : L utilisateur découvre de façon ludique Paris, son histoire, et peu tester ses connaissances sous forme d un jeu. Le principe de victoire ou de défaite suscitant un intérêt supplémentaire pour le joueur. Paris à travers le temps Page 4 sur 4

Mode de consultation : Le mode de consultation sera Internet. Objectifs Que veut-on apporter au sujet traité?: Le but du jeu est de reconstituer l ambiance de différentes époques de Paris dans les différents tableaux. Quelles connaissances?: Afin de jouer, l utilisateur doit avoir un certain nombre de connaissances sur le sujet, suivant son niveau il pourra choisir entre facile, moyen et difficile. En revanche, si celui-ci bloque longtemps sur une mission, il y aura la possibilité d avoir des indices ou enfin d obtenir la réponse. Quels émotions et questionnements?: L utilisateur se divertit en apprenant et en testant ses connaissances. Les différentes missions le feront s immerger dans une ambiance particulière caractéristique de l histoire de la vie parisienne. II. Cahier des charges Budget Ce projet est réalisé dans le cadre de l UV SI28 et n a donc pas de budget monétaire. Les ressources humaines sont le travail de deux étudiantes pendant 4 mois, conseillées par l enseignant de l UV et aidé par les autres étudiants. Ressources médias Texte Les questions, réponses et indices seront sous forme de texte. Nous avons rédigé les questions, les réponses et les indices du quiz en faisant des recherches préalables sur les trois sujets. Images Les phases d introduction et de conclusion seront sous forme de photo montage. L accueil sera réalisé avec des photos montages. Les trois fonds, des trois thèmes seront réalisés avec des photos montages. Pour chaque question, une photo renverra au thème, et peut même faire l objet d une question. Les différentes images utilisées pour les photos montages proviennent soit d une recherche sur Google image, de sites Internet fournissant des images libres de droit ou des photos prises par nous même. La taille des images a été réduite sous Photoshop, lorsque cela était nécessaire, afin d obtenir des fichiers peu volumineux. Sons Dans les tableaux l introduction et l accueil, une musique de fond rappellera le thème. Pour les explications et l introduction de jeu, il y aura des moments parlés. Les sons du jeu proviennent soit d enregistrement d Internet avec Audacity, soit de notre propre création ou de site proposant des musiques et bruitages libres de droit. Paris à travers le temps Page 5 sur 5

Structure et navigation Introduction sous forme de photo montage Possibilité pour l utilisateur de recommencer le jeu Objet 1 Retour dans le temps Accueil interactif Le grenier Objet 2 Mission réussie Ou abandon Objet 3 Tableau 1 Montmartre fin 19 ème Tableau 2 Tour Eiffel Expo Universelle Tableau 3 Quartier Latin Mai 68 Facile Moyen Difficile Facile Moyen Difficile Facile Moyen Difficile Conclusion selon la victoire ou la défaite sous forme De photo montage Déroulement : L application commence par une scène d introduction qui met en place l histoire. Ensuite arrive l accueil interactif qui permettra à l utilisateur de choisir un des trois tableaux et de répondre au quiz. L utilisateur, lors de sa session à le droit de faire un seul quiz par tableau. Dans ce cas, les points gagnés dans chaque tableau sont comptabilisés. A partir du moment où les trois tableaux ont été réalisé, l utilisateur est Paris à travers le temps Page 6 sur 6

emmener directement à la conclusion. la mission se terminera par une conclusion différente selon s il a gagné (score supérieur à 30 points) ou perdu. Qu il ai gagné ou perdu, l utilisateur aura toujours la possibilité de revenir à l écran d accueil pour refaire le jeu en essayant d autres niveaux ou d avoir plus de points. Structuration du contenu : Les entités élémentaires du projet sont les questions, elles sont autonomes. L utilisateur aura le choix entre trois séries de question pour chaque tableau suivant le niveau choisi, il pourra refaire le jeu plusieurs fois et tester sa progression. Navigation : Elle se fait par la souris (par des clics). Forme et degrés d interactivité Dans le grenier : l utilisateur devra cliquer sur un objet pour accéder à un tableau et choisir le niveau pour lequel il souhaite se tester. Dans les tableaux : choisir la réponse au quiz, demander un indice, revenir à l accueil, passer à la question suivante. Choix technique Photoshop: pour la réalisation des éléments graphiques Flash : pour réaliser le quiz et articuler tous les éléments graphiques, monter les animations. Audacity : pour les sons Pédagogie Apprendre sur l histoire et les anecdotes de célèbres quartiers de Paris. III. Scénario Le scénario principal est introduit dans une Bd-photo montage avec sons au début du jeu. Il explique le contexte du jeu par la suite. Scène 1 : Le jeune homme arrive au cimetière du Père Lachaise Scène 2 : Il pleure sur la tombe de sa grandmère qui vient de mourir Scène 3 : On lui donne la clé de l hôtel particulier familial dont il hérite Paris à travers le temps Page 7 sur 7

Scène 4-5 : Il prend possession des lieux Scène 6-7 : Et en retournant chercher une bière dans la cuisine Scène 8-9 : Il fait la rencontre du fantôme qui hante l hôtel Scène 10-11-12 : Le fantôme le poursuit dans tous l hôtel Scène 13 : Celui-ci arrive devant la porte du dernier étage Scène 14: Grincement de porte et la porte se ferme derrière lui. Après la scène 14, l utilisateur reste dans le noir et écoute les instructions du fantôme qui lui explique que celui-ci est condamné à rester enfermer dans cette pièce sauf s il prouve ses connaissances. Il lui donne les principes du jeu et le score final qu il doit faire pour sortir de la pièce. C est après cela que l utilisateur découvre le grenier. On voit alors le jeu maintenant sous le point de vue (réel) du jeune homme et non plus sous d un point de vue extérieur. Le style graphique change alors. Paris à travers le temps Page 8 sur 8

IV. Story Board Bouton envoyant au quartier Latin Mai 68 Bouton envoyant au quartier Montmartre Bouton envoyant au quartier de la Tour Eiffel pendant l exposition universelle L interface est la suivante : Le grenier met dans l ambiance de l histoire, peu d objets sont présents afin de ne pas troubler l utilisateur. Lorsque la souris passe sur les trois objets interactifs ils grossissent afin que l utilisateur comprenne qu il peut interagir avec ces derniers. Il n y a pas de bouton «quitter» dans notre interface car le jeu sera intégré dans une page Web et la nécessité de quitter la fenêtre n est pas présente dans ce contexte. Paris à travers le temps Page 9 sur 9

Les tableaux suivent tous le même modèle : - la question - les trois réponses possibles - le bouton pour accéder à l indice - le bouton pour valider ou passer à la question suivante selon les cas - le bouton pour revenir à l accueil Paris à travers le temps Page 10 sur 10

Nous avons choisi de mettre peu de bouton pour ne pas trop charger nos images, le bouton valider est donc le même que celui pour passer à la question suivante, mais notre explication des boutons au début de chaque quiz permet à l utilisateur de bien comprendre ce qu il doit faire. L interface graphique réalisée sous photoshop permet de récréer l ambiance du lieu et d y plonger l utilisateur. Paris à travers le temps Page 11 sur 11

Conclusion Ce projet nous a permis d atteindre notre objectif qui était d apprendre à utiliser les logiciels flash, Photoshop et Audacity tout en réalisant une interface graphique attrayante et en faisant des recherches sur un thème qui nous intéressait. La difficulté au départ pour deux GSU a été d appréhender la partie programmation, mais nous avons trouvé sur Internet un exemple de QCM qui nous a servit de base, et l aide des autres étudiants de l UV a permis de résoudre les difficultés qui sont apparues. Nous avions souhaité au départ une apparition aléatoire des questions, mais il n y en avait pas assez pour que cela soit intéressant. Réaliser les images une par une à été beaucoup plus long que ce que nous avions prévu (90 questions donc 260 images à mettre en page), mais nous a permis de mettre en page chaque image selon la taille des réponses et des indices et de rajouter des images différentes à chaque fois. Finalement le résultat correspond bien à ce que l ont avait imaginé, mais avec un peu plus de temps nous aurions rajouté des extraits de film pour dynamiser les questions ainsi que des animations. Paris à travers le temps Page 12 sur 12