Contexte IntuiNote Fonctionnalités Projet Technologies Équipe Français

Portage d'IntuiNote en Flutter

Contexte

FlutterInk 2 est un projet sur l'année 2025-2026 continuant le projet du même nom de l'année 2024-2025. Il est réalisé par des étudiants de l'INSA Rennes dans le cadre de leur projet de 4ème année.

IntuiNote

IntuiNote est une solution numérique conçue pour l’enseignement supérieur, facilitant l’apprentissage en temps réel grâce à divers outils interactifs. Elle permet aux enseignants de diffuser des supports visuels, d’y ajouter des annotations manuscrites et d’intégrer des interactions dynamiques comme des quiz enrichis ou des espaces collaboratifs.

Développée à l’INSA Rennes en 2016, elle a évolué grâce à plusieurs projets de recherche menés en partenariat avec l'équipe SHADoc du laboratoire de l'IRISA. Son architecture flexible lui permet de s’adapter aux équipements actuels et futurs, tout en répondant aux besoins des environnements hybrides, combinant enseignement sur site et à distance.

Grâce à un système basé sur l’échange en réseau entre enseignants et étudiants, accessible depuis différents types d’appareils, IntuiNote constitue un écosystème pédagogique fluide et intégré, optimisant l’engagement et la participation des apprenants.

Fonctionnalités d'IntuiNote

IntuiNote permet aux enseignants et aux élèves d'interagir facilement pendant le cours. Ainsi, le professeur peut partager ses annotations sur les diapositives avec l’ensemble des élèves, mais également leur partager différents types de quiz et d’exercices afin de s’assurer qu’ils ont bien compris le cours.

Quiz à Choix Multiples ou Uniques

Les QCU et les QCM permettent au professeur de poser une question aux élèves à laquelle ils peuvent répondre avec une ou plusieurs propositions. Sur la diapositive du quiz, le professeur peut rédiger la question et a accès à des outils spécifiques, permettant de créer les cases à cocher ou de faire une correction.

Diapo QCM Corrigé

Quiz graphique

Lors d'un Quiz graphique, le professeur demande aux élèves de répondre par une réponse manuscrite. Une fois le quiz fini, le professeur reçoit toutes les réponses de ses élèves sous forme de PDF dans un onglet dédié. Il a la possibilité d'agrandir chaque réponse et de l'annoter. Il peut être utilisé dans de nombreuses situations : équations mathématiques, schéma, graphe…

Quiz graphique

Cartes de chaleur

Grâce aux quiz de type carte de chaleur, le professeur peut poser aux élèves une question qui nécessite une réponse dessinée. Une fois le quiz fini, il peut alors afficher la carte de chaleur des réponses données. Par exemple, s'il demande la localisation d'une ville sur la carte de France, il voit que là où la carte est la plus rouge, c'est l'endroit où les élèves ont le plus répondu.

Carte de Chaleur

Tableau blanc

Les tableaux blancs permettent aux élèves et au professeur d'interagir sur la même diapositive. Étant sur la même couche d'écriture, tout le monde peut voir en simultané ce qui est écrit et modifier les notes de chacun. Le professeur a également la possibilité de restreindre l'accès en écriture à qui il veut, et ce faisant, interroger un élève et permettre à tous de voir sa réponse en direct.

Réponses sur le tableau blanc

Projet 2026

Le projet FlutterInk a commencé l'année dernière avec pour objectif de porter IntuiNote en Flutter. Au final, seule la partie élève a pu être portée par manque de temps. Cette année, nous avons donc comme projet de finir de porter la partie professeur, ainsi que d'ajouter certaines fonctionnalités. Voici sur quoi nous travaillons :

Portage de la version professeur

Le portage de la version professeur constitue un enjeu central du projet FlutterInk 2026. Contrairement à la version élève, déjà partiellement réalisée l’année précédente, cette partie nécessite la reprise et l’adaptation de nombreuses fonctionnalités complexes propres à l’interface enseignant.

Un choix structurant du projet a été de développer une application unique regroupant à la fois les usages des élèves et des professeurs, plutôt que de maintenir deux applications distinctes. Cette approche permet de simplifier la maintenance, d’assurer une cohérence fonctionnelle entre les deux profils et de faciliter le déploiement sur les différentes plateformes supportées par Flutter.

Ce choix implique cependant la mise en place d’un système d’authentification et de gestion des rôles robuste. Ainsi, des mécanismes de contrôle d’accès ont été développés afin de garantir qu’un utilisateur authentifié en tant qu’élève ne puisse pas accéder aux fonctionnalités réservées aux enseignants, telles que la création de quiz, la diffusion des contenus ou la gestion des interactions en classe.

L’objectif du portage est de reproduire fidèlement les outils existants d’IntuiNote tout en tirant parti des avantages offerts par Flutter, notamment en termes de portabilité (mobile, tablette, web) et de fluidité d’interaction. Cela implique un travail important de refonte de l’interface utilisateur ainsi que de la gestion des états en temps réel.

Parmi les éléments portés, on retrouve la gestion des diapositives, les outils d’annotation manuscrite, la création et la gestion des quiz (QCM, QCU, graphiques), ainsi que les fonctionnalités de diffusion en direct vers les élèves. Une attention particulière est portée à la synchronisation des données via le réseau, afin de garantir une expérience fluide et cohérente pour tous les utilisateurs.

Interface de connection des élèves Interface de connection des profs

Ce portage est également l’occasion d’améliorer l’ergonomie globale de l’application, en proposant une interface plus moderne et intuitive, adaptée aux différents supports. Enfin, l’architecture du projet est repensée pour faciliter la maintenance et l’ajout de nouvelles fonctionnalités à long terme.

Caméra

Intuinote a pour but d'être utilisable sur n'importe quel appareil. Cependant, prendre des notes dessus quand on a seulement un téléphone portable peut s'avérer laborieux, contrairement à un ordinateur ou une tablette. Par conséquent, nous avons décidé de mettre en place une fonctionnalité permettant de prendre des photos et/ou d'en choisir dans sa galerie pour pouvoir ensuite les intégrer en tant que notes sur une diapositive. Cela permettra à tous de prendre des notes mais également de répondre aux quiz graphiques sans difficulté.

Cette fonctionnalité sera accessible dans la barre d'outils. Un aperçu de l'ergonomie est donné dans les images ci-dessous. Dans l'ordre :

  1. Menu de l'outil Caméra;
  2. Choix dans la galerie;
  3. Prise de photo;
  4. Menu de rognage;
  5. Menu avec photo sélectionnée.
Menu de l'outil Caméra Choix dans la galerie Prise de photo Menu de rognage Menu avec photo sélectionnée

Nuage de mots

Intuinote offrira la possibilité aux enseignants de visualiser les réponses des élèves sous plusieurs formats différents. Le choix d'un nuage de mot est particulièrement pertinent, pour visualiser quelles réponses apparaissent le plus.

Cette fonctionnalité sera également accessible dans la barre d'outils. Un aperçu du résultat est donné dans l'images suivante. Par exemple si la question est, "Quelle est la loi des gaz parfaits ?", les réponses pourront ressembler à ceci.

Démonstration du nuage de mot

Export des notes en PDF

L'exportation du cours en PDF permet aux étudiants et enseignants de consulter leurs supports, avec ou sans IntuiNote. Cette fonctionnalité n'a pas pour objectif de remplacer les outils d’annotation déjà utilisés, mais plutôt de permettre l’accès aux diapositives annotées dans un format standard, compatible avec la plupart des lecteurs PDF. De cette façon les notes peuvent être consultées à tout moment, sur n’importe quel appareil. L'utilisateur peut également choisir quelles "couches" exporter : ses notes, ou celles du professeur.

Bouton d'export Menu pour choisir la couche à exporter

Panneau d'administration du serveur

Le serveur contient une base de données MongoDB qui stocke les comptes des professeurs. Actuellement, les comptes sont créés au lancement du serveur à partir d'un jeu de données de test. Mais il n'existe pas de moyen d'en créer ou d'en supprimer facilement, sans se connecter à la base de données dans un terminal.

Nous avons donc ajouté un panneau d'administration du serveur, accessible via une interface web, qui permet de gérer simplement les comptes des professeurs.

Technologies utilisées

Le projet FlutterInk repose sur un ensemble de technologies modernes permettant de garantir à la fois performance, portabilité et maintenabilité.

L’application est développée en Flutter, un framework open-source de Google basé sur le langage Dart. Ce choix permet de cibler plusieurs plateformes (Android, iOS, Web) à partir d’une base de code unique, tout en offrant une interface fluide et réactive.

La communication entre le client et le serveur repose sur des échanges réseau en temps réel, permettant de synchroniser les actions du professeur et des élèves (annotations, quiz, interactions). Cela garantit une expérience collaborative instantanée en classe.

Côté serveur, une architecture basée sur Node.js est utilisée, avec une base de données MongoDB pour stocker les informations relatives aux utilisateurs, aux sessions et aux contenus pédagogiques. Ce choix permet une grande flexibilité dans la gestion des données et une bonne scalabilité.

Enfin, des mécanismes d’authentification et de gestion des rôles ont été mis en place afin de sécuriser l’accès aux différentes fonctionnalités selon le profil utilisateur (élève ou professeur).

Encadrants

Photo d'Éric

Éric Anquetil

Photo de Bruno

Bruno Hortollary

Équipe

Photo d'Emie

Emie Arlin

Photo de Jeanne

Jeanne Bisson

Photo d'Augustin

Augustin Bouyer

Photo de Maëlys

Maëlys Devaud

Photo de Samuel

Samuel Gontard

Photo de Justin

Justin Mercier

Photo de Hector

Hector Vernet