Étude de cas

Design web UX / UI Entreprise-école PHP MVC

TIM 312

Un site vitrine et plateforme de contact pour la Jeune Coop du programme Techniques d'intégration multimédia du Cégep de Sainte-Foy construit pour créer un pont réel entre les étudiants et de vrais clients.

Mon rôle

Direction visuelle & intégration

Durée

8 sem. · 2024

Client

Cégep de Sainte-Foy

Statut

En ligne depuis 2024

TIM 312

01 — Brief

UNE PORTE D'ENTRÉE POUR DE VRAIS CLIENTS.

Le programme TIM opérait sa Jeune Coop depuis quelques années, mais sans aucune vitrine numérique. Les clients potentiels n'avaient donc aucun endroit clair pour comprendre l'offre du programme, le fonctionnement du processus ou la manière d'entrer en contact avec les enseignants.

Le mandat était de concevoir un site qui explique clairement l'offre de services, guide les clients dans le processus de soumission de projet et intègre un formulaire de contact acheminé directement aux enseignants, le tout étant conçu pour être réutilisé chaque année avec un minimum de maintenance.

Contraintes de design

01

Un formulaire de contact intégré au site, relié directement aux enseignants du programme.

02

Une page Approche claire qui détaille le processus complet, du début à la fin et qui est facile à comprendre.

03

Architecture réutilisable d'une année à l'autre, sans refonte ni maintenance lourde.

02 — Rôle

DIVISIONS DU TRAVAIL

Géré de bout en bout
  • Direction visuelle
  • Système de design
  • UI/UX & prototypes
  • Contenu visuel & illustrations
Collaboré sur
  • Intégration PHP MVC
  • Validation avec les enseignants
  • Stratégie de contenu

avec Christopher Byatt & les enseignants du programme

N'a pas touché
  • Architecture backend
  • Configuration du serveur
  • Mises à jour post-lancement

03 — Design

UN SITE QUI RÉPOND AUX QUESTIONS

Page Approche

UN PROCESSUS CLAIR

Nous souhaitions avant tout répondre à une question centrale : comment ça fonctionne ? Comme on dénombre peu d'entreprises-écoles au Québec, faire affaire avec une organisation dotée d'une telle structure peut sembler intimidant. Nous souhaitons donc rassurer les clients en leur en expliquant le fonctionnement. La page Approche y répond grâce à un parcours en 5 étapes, de l'analyse de la demande à la présentation finale. Chaque étape précise les engagements du client et ceux des étudiants afin d'éliminer toute ambiguïté dès le départ.

TIM 312 screenshot
TIM 312 screenshot

Formulaire de contact

UNIQUEMENT L'ESSENTIEL

Le formulaire collecte les informations essentielles d'un projet (coordonnées, organisation, description du mandat) et les achemine directement aux enseignants. Il se veut simple à remplir : nous souhaitons uniquement connaître l'essentiel pour éviter d'alourdir le processus. Nous voulons que le client puisse soumettre facilement un projet en quelques minutes, sans avoir à chercher une adresse courriel ni à passer par plusieurs intermédiaires.

04 — Processus

DIRECTIONS EXPLORÉES & ABANDONNÉES

Le vrai travail de développement réside dans la réflexion et l'exploration des options. Une seule peut être retenue.

Rejeté

WordPress / CMS générique

L'option la plus rapide à déployer. Mais dans un contexte scolaire, les accès administrateurs changent chaque année et les mises à jour WordPress représentent un vrai risque de casse. Trop de maintenance pour des enseignants qui n'ont pas à gérer ça.

Rejeté

Site bilingue dès le lancement

On a envisagé le bilinguisme FR/EN dès le départ. La portée et les délais ne le permettaient pas — et le public principal du programme est francophone. On a arbitré en faveur d'un lancement solide en français plutôt qu'un lancement bâclé dans deux langues.

Retenu

PHP MVC sur mesure

Une architecture légère sans dépendance externe lourde. Les réalisations et certains contenus sont gérés via base de données. Les enseignants peuvent mettre à jour la liste des projets sans toucher au code — et la structure se réutilise d'une session à l'autre sans modification.

05 — Réflexion

UN MOMENT DE RÉFLEXION

01

Les réalisations ont été mises au second plan durant le développement, la priorité ayant été accordée à l'explication de notre approche et à la création d'un formulaire permettant aux clients de contacter les enseignants pour proposer une idée de projet. Avec le recul, je pense que la mise en valeur de ces projets aurait dû être au cœur du développement. Nous aurions également eu avantage à présenter une plus grande variété de réalisations, afin que les clients puissent mieux évaluer ce qu'il est possible de réaliser avec les étudiants.

02

Un de nos bon coup a été de faire tester le formulaire auprès d'un client potentiel afin d'obtenir des avis. Nous avons également fait validé l'UX avec des pairs et des enseignants.

Vous avez un projet en tête ?

CONSTRUISONS QUELQUE CHOSE.

Disponible pour du freelance et des collaborations. Écrivez-moi et je répondrai rapidement.