Memo Ball

Memo Ball permet aux collègiens en difficulté de pouvoir réviser les cours de leurs professeurs et développer leurs compétences à partir d’une application ( depuis Ordinateur ou Smartphone). Cela se passe sous forme de QCM, dans lequel se trouve plusieurs catégories de matières pédagogiques (Histoire, Mathé- matiques, Français…etc). Une fonctionnalité permet aux enseignants de suivre individuellement les élèves selon les points gagnés et les résultats obtenus.

À qui ça s’adresse ? 

Notre projet se place dans le domaine de la pédagogie et de l’enseignement. Notre commanditaire Pierre Capato est le directeur des SEGPA (Section d’Enseignement Général Professionnel et Adapté) au collège Simone Signoret à Belfort. Après avoir remarqué la difficulté à apprendre des élèves de cette section et même de l’établissement, il eut l’idée de proposer aux étudiants MMI de créer une application pour les collégiens en difficulté.

Notre projet concerne alors principalement les élèves, car leur réussite est le but principal de Memoball en leurs permettant de réviser facilement leurs leçons et de visualiser en quelques sortes leur niveau avec les résultats obtenues dans les quiz.

Ensuite, notre application s’adresse potentiellement aux enseignants, car ils sont le relais entre les élèves et l’application. Ils pourront notamment visualiser le niveau général de leurs classes grâce aux résultats obtenus.

Nous avons notamment pensé aux parents des élèves, mais ce sont plutôt des cibles indirectes à qui nous pourrions demander de guider leurs enfants vers notre application après l’avoir présentée.

Fonctionnement

Usage de l’administrateur

Notre commanditaire Pierre CAPATO sera l’administrateur de l’application, il lui sera possible d’inscrire les enseignants du collège afin qu’ils aient un profil chacun. Pourra consulter et modifier toutes les données créées ou ajoutées depuis l’application, ce qui lui permettra de réaliser des analyses, de gérer la situation, et le fonctionnement de l’application puis celles des classes.

Usage des enseignants :

Comme dit plutôt, les enseignants ont chacun leurs profils créés par l’administrateur. Ils auront la possibilité de créer et de publier les questions réponses (en indiquant une image, la matière et la leçon) mais aussi de voir les résultats de leurs élèves.

Usage des élèves :

Il est possible pour les élèves de répondre aux quiz publiés par les professeurs, voir leurs résultats et le top 3 dans le classement des résultats. Pour répondre aux quiz, un retardateur configuré par le professeur (ou l’administrateur) indiquera aux élèves le temps restant pour répondre.

Rôle dans le groupe

Mehmed Gerovic 

Web Designer et Chef de projet : 

Je dirige le groupe et m’assure que tout le monde fait son boulot. Je m’occupe de toute la partie graphique du projet, des dossiers au site

Antoine Braillard

Développeur Web : 

Il s’occupe de la partie technique du projet et met en place les fonctionnalités demandées par le commanditaire.

Yassine Zeroual

Communicant :

Il réalise la majeure partie des tâches qui concerne la communication dans notre projet. Il planifie les rendez-vous avec le commanditaire en accord avec le chef de projet.

Propositions

Le commanditaire a demandé à ses élèves de 4ème de réaliser un logo. Ils ont donc réalisé un logo en s’inspirant d’un ballon et chaque cercle représente une matière. 

Ils ont également pensé à des noms comme «le ballon des matières, la  balle des connaissances, ou le ballon intelligent». Il y a eu un vote et «School Ball» est le nom qu’on choisit les élèves. 

Le problème est que school ball veut dire bal d’école en anglais et non ballon d’école. Donc notre devoir est de bien conseiller le commanditaire. Pour le nom du projet nous avons choisi «memo ball». Memo pour la mémoire car le jeu aide les étudiants à retenir leurs leçons et ball car elle fait référence à la forme et l’idée générale d’une balle.

Symbolique

Le commanditaire a demandé à ses élèves de 4ème de réaliser un logo. Ils ont donc réalisé un logo en s’inspirant d’un ballon et chaque cercle représente une matière. 

Ils ont également pensé à des noms comme «le ballon des matières, la  balle des connaissances, ou le ballon intelligent». Il y a eu un vote et «School Ball» est le nom qu’on choisit les élèves. 

Le problème est que school ball veut dire bal d’école en anglais et non ballon d’école. Donc notre devoir est de bien conseiller le commanditaire. Pour le nom du projet nous avons choisi «memo ball». Memo pour la mémoire car le jeu aide les étudiants à retenir leurs leçons et ball car elle fait référence à la forme et l’idée générale d’une balle.

Justification

Pour qu’un logo soit de bonne qualité il doit respecter plusieurs critères. D’abord il doit être facilement reconnaissable pour que les usagers se souviennent de nous. Il doit également incarner les valeurs de l’entreprise.

Un logo doit pouvoir s’adapter et être lisible sur tous les supports. Autant sur le web qu’en impression, sur un fond blanc ou sur un fond sombre, en tout petit sur une carte professionnelle ou en très gros sur un panneau publicitaire, un logo doit être applicable partout et doit être simple.

Gamme Chromatique

Les couleurs ont été choisi pour donner un aspect ludique et moderne au site. Mais également pour se différencier des concurrents. Ces couleurs ont été choisit pour leurs significations. Le bleu représente le respect, le calme et la confiance, quant au Violet lui représente la spiritualité et l’intelligence. Les couleurs seront rarement utilisées seules et seront donc majoritairement en dégradé par exemple le bleu avec le violet, cela donnera plus de charme au site et donnera un aspect plus moderne que ses concurrents.

Animation  SVG

Le commanditaire a demandé qu’ils y aient des couleurs différentes pour chaque matière. Par exemple le rouge pour l’anglais, Jaune pour l’histoire ou Vert pour la matière SVT. 

Les vidéos que vous voyez ci-dessous proviennent du site web Memo ball. Avant chaque nouvelle question, débute une animation. Tout d’abord le logo Memo ball réalise un tour complet, puis l’icône de la matière fait son apparition à l’intérieur du logo ensuite nous avons le fond en dégradé qui change de fond en fonction de la matière, puis pour terminer une barre blanche s’agrandit à la manière d’une ouverture et contient une question. 

Ces animations SVG je les ai réalisés à l’aide de CSS et JS.

Il nous a également demandé de réaliser une animation lorsque l’élève à terminé de choisir une réponse. J’ai donc choisi de faire une animation simple qui est facilement compréhensible par n’importe quelle personne. 

Lorsque l’élève choisit la bonne réponse, les anneaux jaunes apparaissent et descendent jusqu’au nom de l’élève qui donne l’impression d’encaissement. En réalité les anneaux jaunes sont  des logos Memo ball en couleurs. 

Et inversement lorsqu’il choisit la mauvaise réponse les anneaux sont de couleur grise et ils donnent une impression de tomber ce qui fait comprendre à l’élève qu’il a perdu des points. 

Passez la souris sur les pièces
gagnant {{name.eleve}}
perdant {{name.eleve}}

Maquette et Prototypage