Le mandat
La boutique est complète, connue et mesurée : il lui manque le vif. Cette dernière itération transforme les pages en expériences : un onboarding qui prend les nouveaux membres par la main, des composants Ajax qui réagissent sans recharger, un configurateur de produit et un panier en drag and drop. Puis, la démo finale couronne la session : la boutique complète, devant la classe, du premier clic au paiement.
Les chantiers de l'itération forment une banque de tâches : l'équipe se les répartit librement, mais tous les chantiers doivent être livrés. Chaque coéquipier porte au moins un projet interactif complet, de la fiche jusqu'à la démo.
Le déroulement en un dessin
Un seul écran, quatre expériences : l'onboarding guide, l'Ajax réagit, le configurateur compose et le panier attrape ce qu'on lui glisse. Tout mène au trophée de la démo finale.
Fiches et preuves de concept
Les trois volets en parallèle
Démo finale · 25 %
La remise intermédiaire · Fin de la semaine 12
Dernière itération, même discipline : ce que l'IA génère reste un livrable, versé dans GitHub, retravaillé et validé avant le code.
Contenu de la remise intermédiaire
- Le dossier fonctionnel dans GitHub → /doc, en formats visualisables (Markdown, PDF, PNG) avec la source éditable du même nom :
- la fiche de projet interactif, minimum une par coéquipier (composant Ajax, configurateur ou panier) : le titre de la fiche est le titre de la page dans le diagramme de navigation
- le storyboard de l'onboarding : les étapes que vivra un nouveau membre
- la répartition de la banque de tâches dans le Kanban
- Les preuves de concept Ajax dans GitHub → /poc/ajax/titre-du-projet/ : captures d'écran des étapes testées, nommées selon la nature et l'ordre de l'étape ; les POC vivent dans un répertoire à part et n'utilisent aucun composant du projet autre que le serveur et la base de données
- La validation de chaque fiche avec le prof avant de programmer
Les trois volets · Un par coéquipier
De la semaine 12 à la semaine 14, chaque coéquipier porte un volet. Les équipes de 2 doivent également couvrir les 3 volets. Les trois volets avancent en parallèle et convergent vers la démo finale de la semaine 15.
- Onboarding interactif des nouveaux membres dès la première visite : visite guidée, info-bulles et étapes de découverte
- L'onboarding se rejoue sur demande et ne bloque jamais l'utilisateur
- Les meilleurs sites sont ceux qu'on n'a pas besoin d'expliquer : l'onboarding montre, il ne fait pas de discours
- Mini-projet multi-ajax : plusieurs composants réactifs dialoguent avec le serveur sans recharger la page
- Au menu : recherche instantanée, listes auto-rafraîchissantes, notations étoilées, ou un composant proposé et validé avec le prof
- Programmé manuellement avec fetch et JSON : pas de composant Ajax tout fait ni de librairie qui fait le travail à votre place
- Le bon paradigme HTTP : GET est réservé aux lectures, POST est réservé aux modifications de données
- Chaque composant est actif dans les données dynamiques : il lit ou écrit des données réelles traitées côté serveur
- Application de produit configurable : le client compose son produit et voit le résultat et le prix se mettre à jour
- Panier en drag and drop, avec ses options : le client glisse, ajuste, la boutique répond
- Chaque configuration reste adressable : une URL peut recréer l'état composé
- Répétition générale de la démo finale
- Des données réalistes remplissent la boutique : au moins 3 membres inscrits avec des transactions, et au moins 5 données maîtres au catalogue
- La démonstration couvre les réalisations des quatre itérations : chaque page du site, l'inscription d'un membre, une transaction, la manipulation du catalogue, le multilingue et les expériences interactives
- Style promotionnel : le public cible est non technique, on ne montre ni code, ni base de données, ni commande, et on ne mentionne pas le travail scolaire
- Navigateur maximisé, URL visible : la boutique parle d'elle-même
- Release TAG = ITERATION_4_INTERACTIVE : l'évaluation se fait avec cette version du code en ligne
Les technologies
Exigences techniques de l'itération
ARCHITECTURE_MVC du dépôt projet-web-contrat, et sa version vivante est sur le hub des versions.- Les exigences des itérations précédentes demeurent : PDO et requêtes préparées, PHP Filters, HTML sémantique, HTTPS, sessions sécurisées, URLs réécrites
- Les points d'entrée Ajax côté serveur filtrent leurs entrées comme toutes les autres pages (PHP Filters, requêtes préparées)
- Les composants interactifs se dégradent proprement : une erreur réseau affiche un message, jamais une page morte
- Le staging demo.votre-domaine reçoit le travail à toutes les heures ; la production est promue après validation et porte la démo finale
Le processus AGILE
Semaine 12
- Sprint planning : identifier les user stories et les tâches, créer les tickets (issues) dans Git en utilisant les gabarits de tickets du Kickoff (Titre + DoD + liste des tâches + liens vers les sources + réflexions + métadonnées à droite)
- Assigner un seul étudiant par ticket ; les tickets trop gros sont fractionnés
- Alimenter le tableau Kanban de Git
- Valider le sprint planning et chaque fiche de projet interactif avec le prof avant de programmer
Semaines 13 et 14
- Mêlée quotidienne complète avant chaque cours
- Commits AGILE : commentaire de commit + numéro du ticket (#issue), toujours
- Tickets AGILE : commentaires et liens ajoutés dans le ticket en cours de route
- Répétition générale de la démo finale en semaine 14 : chacun sait quoi montrer, dans quel ordre, sans bug
Semaine 15
- Test de tout le site en ligne et préparation de la démo
- Sprint review avec le client, ticket par ticket : lecture du Titre + DoD, démo sur le serveur, fermeture du ticket
- Démo finale devant la classe, sur la production
Les critères d'évaluation · 25 %
Un point de la grille vaut un pourcent de la session. La démonstration finale a lieu en semaine 15, sur la production, avec la version Release TAG = ITERATION_4_INTERACTIVE.
| Points | Critère |
|---|---|
| Le processus · 12 points | |
| 4 / 4 | Spécifications en temps utile (maquette + devis fonctionnel) |
| 4 / 4 | Le Ticket (issue) : titre utilisateur, DoD, tâches, commits liés, commentaires de réflexion et liens |
| 4 / 4 | Agile en temps utile : Sprint planning (Kanban), Mêlée quotidienne et collaboration, Sprint review |
| Le produit · 13 points | |
| 4 / 4 | Expérience utilisateur : HTML sémantique (id + classes), ergonomie, contenus |
| 4 / 4 | Navigation : URLs adressables, liens, formulaires, flux |
| 4 / 4 | Traitement des données : modèles, php filters, requêtes préparées |
| 1 / 1 | Architecture : respect de l'architecture cible (exemple Contrat, tag ARCHITECTURE_MVC) |
| 25 | Total de l'itération 4 · 25 % de la session |
Les modalités
En reflet du monde du travail, les séances de laboratoire sont toutes à présence obligatoire et à participation obligatoire. Pour des raisons de motivation au travail, d'échange effectif de l'information et d'évaluation, les heures contact se réalisent en classe, en présentiel, en collaboration avec son équipe.
L'espace du laboratoire est réservé aux activités du projet. Les participants doivent contribuer à la hauteur de la pondération pour recevoir la pleine mesure des points. Le professeur se réserve le droit d'exclure un participant d'une équipe s'il ne participe pas et que cela complique la division des volets. Personne ne doit réaliser les tâches de ses camarades.
Bonne session finale !
En quinze semaines, vous serez passés d'une idée à une boutique en ligne complète, vivante et démontrée : gardez-la dans votre portfolio, elle parle pour vous.