HERVIEU Valentin ODDON Agathe LU Jigang SI28 - Projet intéractif Initiation à la langue chinoise 1
Introduction En tant que groupe franco-chinois et étudiants en génie informatique, nous avons décidé d utiliser les connaissances de chacun en créant une application Flash permettant de découvrir la langue chinoise. De plus, après avoir vu les réalisations des groupes de SI28 précédents, nous avons choisi de destiner notre projet à des enfants, prenant donc pour objectif la dimension ludique et pédagogique. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 2
Table des matières Synopsis... 4 Concept... 4 Public cible... 4 Objectifs... 4 Cahier des charges... 5 Ressources medias... 5 Navigation et structure... 5 Choix techniques... 5 Interactivé... 5 Schéma de navigation... 6 Scénario... 7 Assistant-animateur... 7 Introduction... 7 Navigation :... 7 Story-board... 9 La salle de classe (Accueil)... 9 Le planisphère (Géographie)... 10 Le tableau noir (Chiffres)... 10 Le cabinet médical (Anatomie)... 11 La coloriage (Couleurs)... 12 Conversation avec Pandi... 13 interface d apprentissage... 14 Conclusion... 15 Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 3
Synopsis Concept Initiation à la langue chinoise. Idée de base : Apprentissage bidirectionnel franco-chinois, grâce à une page d accueil commune qui proposerait le choix Je suis français ou Je suis chinois puis des animations ciblées. Idée retenue : Seulement partie apprentissage du Chinois car la méthode d apprentissage des chinois est différente et cela rendrait difficile la conception de l application. De plus, la langue chinoise rendrait plus difficile la présentation. Public cible Le public principalement ciblé par notre application serait des enfants d environ 8/12 ans, en âge d apprendre une langue étrangère. Ensuite, si le temps le permet, nous aimerions proposer des exercices et des cours un peu plus évolués permettant à des étudiants débutants en Chinois, d utiliser l application. Objectifs Partie apprentissage : Contenu : Apprentissage des chiffres, des mots de la vie quotidienne et des mots de communication de base. Méthode : Aide à la prononciation avec des petites séquences audio et présentation des méthodes d écritures à l aide d animations. Partie jeux/exercices : Test des connaissances acquises : quizz mini-jeux (reste à trouver les idées) reconnaissance caractères écrits sur flash (si réalisable) Émotions attendues : Pour les enfants : amusement, plaisir. Pour les adultes : efficacité, rapidité. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 4
Cahier des charges Ressources medias Sons : voix de Jigang pour la prononciation des mots chinois et voix du panda. Images : dessin d une classe d école; dessins pour le tableau, le planisphère, la partie coloriage, animation du panda, animation de l écriture des mots chinois. Textes : traductions des mots et consignes écrits par nous-mêmes. Navigation et structure Introduction : L introduction est une animation composée en fond de l image de la classe, et du personnage-guide panda qui explique ce qu on peut faire, les différentes zones cliquables dans l acceuil ainsi que son rôle. Lieu principal : Salle de classe, contenant : Apprentissage chiffres (tableau) Planisphère pour apprendre les continents/pays Anatomie simple espace coloriage pour les couleurs (cartable, ajouter des crayons de couleur) Espace jeux pour tester les connaissances. Panda disponible pour la discussion Choix techniques Flash utilisé pour la programmation de l application. Photoshop pour le contenu graphique. Audacity pour le son Interactivé L interactivité de l application sera faite par le biais des boutons proposés à l utilisateur dans les différentes scènes, ainsi que par les interactions avec le panda. Aucune ligne de conduite étant imposée, il peut donc commencer son apprentissage de la langue chinoise par le thème qu il préfère : la géographie, les chiffres, l anatomie, les couleurs, la conversation. Du fait qu aucun de ces thème n est plus important que les autres, nous avons volontairement choisi de représenter les boutons de taille globalement égale. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 5
Schéma de navigation Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 6
Scénario Assistant-animateur Pandi le panda, représenté par dessin de panda simple réalisé par ordinateur, sera l animateur de l application. En plus de guider l utilisateur au démarrage par le biais de l introduction, ce personnage va amener une dimension à la fois vivante et amusante au programme, et ainsi tourner l apprentissage de la langue chinoise comme un jeu. Introduction Actions du panda : Arrivée progressive vers l utilisateur, arrêt au milieu de la pièce Se présente, ainsi que l application : Bonjour, et bienvenue chez moi. Je suis Pandi le Panda et je viens de Chine pour faire découvrir ma langue aux élèves français Continue sa présentation en énonçant les différentes zones interactives de la pièce pendant que celles-ci sont mises en valeur les unes après les autres (zone concernée en couleur, le reste de la classe en noir et blanc) : Ici tu pourras apprendre la géographie, ensuite sur ce tableau tu pourras apprendre à compter, et là, les parties du corps humain. puis Ensuite tu pourras apprendre les couleurs et enfin en cliquant sur moi nous pourrons discuter. Je t attends!!. Va se placer dans le coin bas droit de la classe et jongle. Navigation : L introduction passée, l utilisateur est immergé dans une salle de classe, contenant différentes zones interactives. La carte, le tableau, un poster représentant l anatomie humaine, un pot contenant des crayons et Pandi le panda sont ainsi des boutons cliquables et permettent d'accéder à d autres vues où on trouvera les traductions chinoises. Ces boutons sont mis en surbrillance au passage de la souris, amenant une nouvelle dimension interactive. Tant que l utilisateur ne clique pas sur une de ces zones, le panda jongle, ce qui permet d animer la scène et de crée une dimension plus vivante à ce personnage. Dans chaque scène, une nouvelle image est affichée contenant les mots proposés à l utilisateur en rapport avec l élément sur lequel l utilisateur a cliqué et le contexte francochinois. Par exemple nous avons choisi les mots français, France, Paris, chinois, Chine et Pekin pour la carte, tête, torse, bras, pour l anatomie. De même que pour la scène d accueil, chaque élément correspondant à un mot est un bouton cliquable et mis en surbrillance au passage de la souris. Après un clic sur un mot, une bulle est ajoutée à l écran, contenant le mot en français, la traduction en idéogramme chinois animé (c est à dire écriture progressive de celui-ci), un bouton représentant un haut-parleur permettant de joué la traduction ainsi qu un bouton de fermeture de la bulle. L utilisateur a la possibilité d ouvrir une autre bulle alors qu une bulle est déjà ouverte, améliorant la rapidité de navigation et gérant le cas où l utilisateur ne comprends pas que la croix rouge permet de fermer la bulle. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 7
Un bouton de retour vers la salle de classe est indispensable, on le représentera sous la forme de l image de la salle de classe en miniature. Nous avons choisi volontairement cette représentation car notre public cible étant des enfants, l utilisation d images est plus simple que celle du texte, d autant plus que l utilisateur se rappelle de la salle de classe car il vient de la quitter. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 8
Story-board La salle de classe (Accueil) Cet écran est le point central de l application. En effet, c est sur celui-ci que l utilisateur arrive après l introduction et il permet d'accéder aux autres écrans. Cet écran représente donc une salle de classe tirée d une bande dessinée (Titeuf), que nous avons modifié afin d y intégrer les différents éléments dont nous avions besoin. On retrouve donc une carte permettant d'accéder à l écran portant sur la géographie; un tableau qui permet d'accéder à l écran traitant des chiffres; un poster afin d aller sur la partie sur l anatomie, des crayons et un coloriage permettant d accéder à l écran des couleurs, et enfin le Panda qui nous permet d apprendre les mots de conversation. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 9
Le planisphère (Géographie) Sur cet écran, les mots à apprendre sont : France, Chine, Paris, Pékin, Français et Chinois Le tableau noir (Chiffres) Sur cet écran, on peut apprendre les chiffres de 0 à 10, écrits à la craie sur un tableau noir. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 10
Le cabinet médical (Anatomie) Cet écran met un scène un jeune personnage dans un cabinet médical. On peut donc apprendre les différentes parties du corps telles que tête, torse, ventre, bras, main, jambe et pied. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 11
La coloriage (Couleurs) On trouve sur cet écran un coloriage d un dragon traditionnel chinois avec des crayons de couleurs au premier plan. On peut donc apprendre les six couleurs vert, blanc, bleu, rouge, jaune et noir. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 12
Conversation avec Pandi Après un clic sur le panda dans l écran d accueil, on arrive sur un écran faisant un gros plan sur celui-ci. L utilisateur peut alors apprendre les phrases suivantes : - Bonjour, comment ça va? - D accord! - Merci! - De rien! - Au revoir! Enfin, nous avons intégré un bouton permettant d ajouter en tant qu ami Pandi le Panda sur le célèbre réseau social Facebook. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 13
interface d apprentissage Après un clic sur un des mots des différentes scènes (sur l image précédente la carte), l infobulle permettant l apprentissage de la traduction chinoise s affiche. Nous avons travaillé cette bulle dans un style bambou de façon à immerger l utilisateur dans un univers chinois et amusant à la fois. De plus, l animation de l idéogramme permet d apprendre aussi la technique d écriture, très importante dans la langue chinoise. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 14
Conclusion Notre groupe de projet était composé de deux étudiants de GI01 et d un étudiant en GI04 mais aucun d entre nous n avait jusqu à présent utilisé le logiciel Flash. Cependant, grâce aux exposés durant les TDs, nous avons rapidement eu le niveau pour nous permettre de réaliser notre projet. En effet, l aspect programmation n a pas été le plus complexe, nous avons passé beaucoup plus de temps sur la création du contenu graphique et sur les animations des idéogrammes. Nous avons été très ambitieux au départ en voulant créer une partie jeux aussi dense que la partie apprentissage. Cependant nous n avions pas prévu que la partie programmation et enregistrement des sons serait aussi longue, et au final nous n avons pas eu le temps de développer les jeux. De ce fait la dimension ludique de l application a été pénalisée, mais rattrapée par l insertion du personnage Pandi le panda qui n avait pas été prévu au départ. Ce projet nous a permis d apprendre à utiliser et mettre en commun les connaissances et les compétences de chacun, mettant en place un bon travail collaboratif. Du plus, nous avons découvert la mise en place d un projet interactif et multimédia. Projet SI28 - A11 - Hervieu Valentin, Oddon Agathe, Lu Jigang - 15