Développement full-stack · Application web

Application de gestion des stages

Une application web de gestion de stages à plusieurs rôles, qui permet aux étudiants, superviseurs et employeurs de se connecter, soumettre et suivre des rapports de progression.

2026

Développement full-stack

3 semaines

Aperçu principal du projet

Aperçu

Client

Secteur

Services

Platform

Projet scolaire

Éducation · Stages

Développement full-stack

PHP · MySQL · JavaScript · HTML/CSS

Résumé

Les étudiants du programme avaient besoin d’un lieu unique pour consigner leurs rapports de progression, que les superviseurs et les employeurs pouvaient ensuite consulter, en remplacement d’un processus papier informel.

Le défi

L’application devait gérer trois rôles distincts — étudiants, superviseurs et employeurs — avec des données et des permissions différentes, le tout derrière un même système d’authentification. Le véritable défi consistait à combiner HTML, CSS, JavaScript et PHP dans une application cohérente à plusieurs pages : faire fonctionner ensemble la gestion des sessions, la validation côté serveur et la validation côté client, sans conflit, tout en gardant une base de code organisée à mesure qu’elle grandissait.

Objectifs du projet

Centraliser le suivi de progression des stages · Donner aux superviseurs une visibilité sur les rapports · Remplacer le processus papier

Objectifs utilisateurs

Se connecter rapidement selon son rôle · Soumettre un rapport dans un formulaire clair · Consulter les soumissions passées en un coup d’œil

Visuel du défi du projet

Découverte et recherche

Constat 01

Analyse de la manière dont les tableaux de bord à rôles distincts séparent les accès sans dupliquer les pages.

Constat 02

Les étudiants veulent le chemin le plus court possible entre la connexion et l’envoi d’un rapport.

Constat 03

Les rapports papier se perdaient entre étudiants et superviseurs, sans registre partagé.

Orientation du système de design

L’interface demeure volontairement administrative : un en-tête bleu marine, un seul accent bleu et des champs clairement étiquetés plutôt que des éléments décoratifs. Chaque écran a été pensé pour être compris en quelques secondes par des utilisateurs qui veulent simplement se connecter, soumettre ou consulter — pas naviguer.

Système de conception

Conçue directement dans le code, écran par écran, et maquettée avec Figma et Claude Design. Sans outil de design au cœur du flux, les composants de carte de connexion, de tableau et de formulaire ont été créés une seule fois en CSS puis réutilisés dans le tableau de bord de chaque rôle pour assurer la cohérence.

Maquettes exploratoires du projet
Écrans haute fidélité du projet

Écrans haute fidélité

Formulaire de connexion, tableau de bord et rapport de stage

Aperçu d’interface du projet
Écrans détaillés du projet
Écran complémentaire du projet

Un écran de connexion unique dirige l’utilisateur selon son type de compte; un tableau de bord liste les rapports antérieurs avec des liens directs vers les détails, et le formulaire de rapport sépare les données d’identité des champs de réflexion ouverts.

Aperçu final du projet

Développement

Authentification PHP par session pour trois rôles · Requêtes MySQL pour les étudiants, superviseurs et employeurs · Validation JavaScript avant l’envoi · Routage structuré à plusieurs pages par rôle · Déploiement sur un hébergement public

Réflexion

Ce projet portait moins sur le design visuel que sur l’architecture : éviter que trois rôles, un flux d’authentification et deux niveaux de validation s’emmêlent. Le plus difficile était de structurer le PHP pour que les requêtes de chaque rôle restent isolées et sécurisées. Il m’a aussi poussé à penser l’expérience utilisateur même sans outil de design, en étiquetant clairement les champs et en séparant les données d’identité des réponses ouvertes. La prochaine fois, j’ajouterais une sanitation des entrées plus robuste dès le départ plutôt que de l’intégrer après coup, une fois le flux principal fonctionnel.

Emplacement

Gatineau, QC, CA

Contact

avinetsky@outlook.com
+1 (873) 355-2141

Vinetsky

© 2026 Vinetsky. Tous droits réservés.

Emplacement

Gatineau, QC, CA

Contact

avinetsky@outlook.com
+1 (873) 355-2141

Vinetsky

© 2026 Vinetsky. Tous droits réservés.

Emplacement

Gatineau, QC, CA

Contact

avinetsky@outlook.com
+1 (873) 355-2141

Vinetsky

© 2026 Vinetsky. Tous droits réservés.