Gestion de projet web, par où commencer ? IAFACTORY

3 typologies de méthodes projet à appliquer

Dans cet article, nous allons vous aider à savoir comment et par où commencer vos projets web, en présentant les étapes du projet web ainsi que les méthodes et les techniques associées.
Toutes les techniques de conduite de projet numérique présentées dans ce billet sont regroupées au sein de la section dédiée aux techniques de gestion de projet web. Chaque technique est détaillée avec des exemples d'application et des illustrations visuelles.

La méthode de gestion de projet que nous proposons est 100% opérationnelle. Elle s'appuie sur des bases empiriques et la conduite de plus de 200 projets de taille critique. Elle est adaptée aux projets les plus complexes et peut être dépouillée et factorisée au maximum pour les projets plus modestes. Il n'est pas forcément nécessaire d'utiliser toutes les techniques dans chaque projet. Notre but est de vous aider à y voir plus clair dans l'utilisation des différents outils de gestion de projet disponibles.
En suivant la démarche et les techniques présentées ci-après, vous mettrez toutes les chances de votre côté pour respecter les grands objectifs de chaque projet : la qualité, les délais, et les coûts.

Nous allons nous attacher à décrire les grandes étapes du projet web et les techniques à utiliser tout au long du cycle projet. Il y a 3 typologies de techniques projets à appliquer dans la mise en oeuvre d'un dispositif digital :

Les techniques d'avant-projet.
Les techniques de pilotage de projet.
Les techniques du suivi opérationnel de projet.

Avant de décrire les outils de la gestion de projet, il nous semble important de contextualiser les étapes classiques d'un projet web. Il sera également question d'évoquer les méthodologies de design d'expérience utilisateur qui constituent une méthode dans la méthode en quelque sorte...

1. Les étapes du projet web

Quelle que soit la nature du dispositif digital à produire (site internet, intranet, logiciel, application mobile, borne interactive, objet connecté), un cycle projet s'articule autour de 6 grandes phases indéboulonnables :

0. Genèse du projet.
Livrable : étude de faisabilité, étude de marché, budget.
1. Phase d'avant-projet
Livrable : analyse du besoin, planning, note de cadrage.
2. Conception
Livrable : analyse fonctionnelle (envergure éditoriale et arborescence + envergure fonctionnelle et inventaire fonctionnel).
Livrable éditorial : arborescence détaillée des contenus (tableau).
Livrable fonctionnel : zoning, wireframes.
Livrable graphique : ligne graphique (5 écrans environ).
Livrable intégration : squelette HTML & CSS (5 écrans environ).
3. Phase de production
Livrable : wireframes détaillés du scope projet. Maquettes graphiques. Pages HTML & CSS. Spécification fonctionnelles et techniques.
4. Développement
Livrable : version bêta.
5. Phase d'évaluation et de recette.
Livrable : procès-verbal de recette.
6. Mise en ligne et animation
Livrable : analyse et rapport des indicateurs de performances.

On parle de phasing du projet. Ces étapes peuvent être plus ou moins longues, et dans les projets numériques de grande envergure, chacune des étapes fait l'objet de sous-étapes (lotissements)... Les livrables peuvent être plus ou moins nombreux et leur production dépend du nombre d'experts métiers pouvant intervenir sur le projet. Le chef de projet est le garant du planning, du suivi budgétaire, il est notamment impliqué dans la rédaction de la note de cadrage et dans les spécifications.
Toujours est-il, un projet web et un projet informatique au sens plus général s'articulent généralement autour de ces 6 grandes étapes. La production et le développement sont parfois fusionnés car ces deux étapes fonctionnent en synergie (pas de développement informatique sans production graphico-fonctionnelle, et pas de débouché graphico-fonctionnelle sans développement informatique).

Le phasing précis du projet dépendra des méthodologies de l'entreprise de service numérique ou de l'annonceur et de la sensibilité disciplinaire des porteurs de projet (design, technique, gestion, éditorial...). De même, la typologie du projet à mettre en oeuvre peut également impacter la méthodologie projet (par exemple, concevoir un logiciel sera nécessairement un peu plus technique qu'un projet dédié à un créateur de mode).

Vous pourrez donc trouver de nombreuses méthodologie de projet web en fonction de l'entreprise, du type de projet, voire des préférences des gestionnaires de projet, mais dans l'absolu, le cycle de méthodologie projet reste assez stable : avant-projet, conception, production & développement, recette, mise en ligne... Et une étape de genèse du projet qui précède tout le reste. Voyons ces étapes un peu plus en détail.

0. Genèse du projet
La genèse du projet est l'étape qui précède la mise en place d'une méthodologie projet. C'est l'idée, la source, les individus créateurs du projet et tous les éléments qui vont déclencher le projet. A ce stade, les porteurs de projet s'appuient sur leur intuition et d'éventuelles études de marché, voire des études de faisabilité.

1. Phase d'avant-projet
La phase d'avant-projet est aussi appelée phase de cadrage ou phase d'analyse. C'est l'étape du projet dans laquelle on va rassembler toutes les informations nécessaires à la conception du dispositif numérique. Elle s'articule principalement autour de l'analyse des besoins et débouche sur la rédaction d'une note de cadrage présentant les enjeux du projet, ses objectifs, ainsi que les besoins auxquels il devra répondre.

2. Phase de conception
La phase de conception s'articule autour de la conception fonctionnelle, la conception éditoriale, ainsi que la conception graphique. La conception est une phase de recherche dans laquelle tous les concepteurs cherchent à trouver des solutions de conception.
Ces solutions de conception se matérialisent par des principes d'arborescence sur le plan éditorial (prenant en compte les enjeux SEO), le maquettage de quelques écrans clés au travers des wireframes pour la conception fonctionnelle, et l'esquisse d'une ligne graphique désignée par le directeur artistique. A ce stade, on fixe les éléments structurants du dispositif digital et il n'est pas encore question de produire l'intégralité du support interactif.

3. Phase de production
La production s'appuie sur la phase de conception et la validation des principes structurants du dispositif digital pour lancer la réalisation complète du projet. En matière éditorial, il s'agira de produire les contenus (phase d'écriture des contenus). La conception fonctionnelle aura pour objectif de concevoir de façon détaillée l'intégralité des gabarits types du dispositif digital.
La production graphique aura pour objectif de décliner tous les écrans de la ligne graphique. Le développement front-end et l'intégration sont réalisés sur la base des maquettes graphiques et en suivant le tracé régulateur fixé par les wireframes. L'intégration des écrans principaux est réalisée en amont, et la déclinaison HTML & CSS de tous les écrans relève de la production détaillée et du développement.

4. Phase de développement
Un projet numérique implique forcément une phase de programmation. Les développements informatiques peuvent faire l'objet d'une phase spécifique en fonction de la charge de travail. Les développements informatiques constituent une partie de la production, les spécificités techniques de la programmation sont suffisamment originales pour revendiquer une étape à part entière du projet.
Ce sont les spécifications fonctionnelles et techniques qui alimentent les développements. Or, les spécifications sont généralement réalisées à l'issue de la phase de production graphico-fonctionnelle et éditoriale...

5. Phase d'évaluation et de recette
La phase de recette consiste à tester le dispositif digital. On parle de débuggage. Corriger les problèmes techniques, ajuster les dysfonctionnements sur le plan du design, corriger les fautes d'orthographes et de grammaires. Par extension, la phase de test considère également un ensemble de tests techniques (test de charge).
Et dans le cadre de la méthodologie du design d'expérience utilisateur, un ensemble d'études spécifiques sont réalisées pour évaluer les qualités du dispositif sur les plans UX et ergonomiques. A noter que la démarche UX s'infiltre dans toutes les étapes du projet et pas juste en phase d'évaluation.

6. Mise en ligne et animation
Le projet est mis en ligne et on procède aux premières analyses (webanalytics). La communication, l'animation et les techniques webmarketing seront à l'oeuvre pour dynamiser le dispositif, au lancement, et tout au long de la durée de vie du projet.

A cela s'ajoute les expertises transversales, telles que le SEO (search engine optimization) ainsi que les méthodologies d'évaluation de l'expérience utilisateur. Ces expertises métier sont à l'oeuvre à chaque étape...

Gestion de projet web et méthodes UX design

Les méthodes UX présupposent un cadre dans lequel l'expérience utilisateur est prise en compte à chacune des étapes du projet. Elle s'articule autour d'un cycle continu en 3 étapes : analyse UX, conception UX, évaluation UX.

La méthode de design d'expérience utilisateur suppose un cycle de conception centrée sur les utilisateurs finaux. Elle implique un recueil des besoins utilisateurs (phase d'avant-projet) qui va nourrir le processus de conception (identification des scénarios d'utilisation critiques, création de fiches persona pour les profils d'utilisateurs les plus importants). Les solutions de conception sont testées et évaluées avec des usagers représentatifs de l'audience du dispositif digital (test de perception).

Lorsque le projet est plus avancé et qu'on dispose d'une version bêta, on procède à des tests utilisateurs pour évaluer les performances du dispositif digital. Les données issues de ces tests sont analysées pour entamer un nouveau cycle de conception et de correction. On parle de processus d'amélioration continue. Les méthodes UX ne doivent donc pas être considérées uniquement en phase d'évaluation mais tout au long de la chaine projet.

Gestion de projet et SEO

Les enjeux du référencement sont tels que l'expertise SEO est également transversale au cycle projet. En phase d'analyse, les études sémantiques permettront d'identifier les volumes de recherche à privilégier pour le choix des noeuds de l'arborescence (conception éditoriale). Le maillage interne sera soigneusement étudié au moment d'élaborer l'architecture de l'information du dispositif. Chacune des pages HTML fera l'objet d'une optimisation in page... Et le travail se poursuit en continu, après la mise en ligne, à travers les audits SEO dans une optique d'amélioration continue et de recherche de backlinks...

Gestion de projet continue

Voyons maintenant les outils à disposition du chef de projet pour piloter la mise en oeuvre du support numérique...
La gestion de projet est également une expertise transversale puisque c'est elle qui détermine le cadre, les étapes, le timing et les critères de qualité à respecter.
Nous n'allons pas lister les outils du chef de projet à chaque étape. Dans les faits, le chef de projet est impliqué dans le cadrage pour recueillir le besoin, puis en phase de conception production pour le suivi du projet. Et tout au long du déroulement, il utilisera des outils de pilotage transversaux.

2. Avant-projet

Les points que nous allons évoquer en premier concernent principalement les projets numériques de taille critique (plusieurs centaines de milliers d'euros de production, nombreuses équipes impliquées dans la mise en oeuvre, enjeux économiques très importants).
Les équipes projets, sous l'impulsion du porteur de projet principal, peuvent être amenées à travailler sur la faisabilité du projet à travers différents indicateurs : faisabilité économique, technique, fonctionnelle.
On parle d'étude de faisabilité. L'étude de faisabilité sous-tend le dimensionnement du projet, sa réalisation voire son abandon. C'est une des toutes premières étapes du projet digital. Si les indicateurs de l'étude de faisabilité sont au vert, le projet sera lancé.
Dans les projets informatiques importants, l'usage est de procéder à la rédaction d'un cahier des charges.

Le cahier des charges est réalisé en interne chez le commanditaire ou externalisé à un tiers (consultant, entreprise de service numérique) dans le cadre d'une assistance à maitrise d'ouvrage. Le cahier des charges fait le point sur les enjeux du projet et a pour objectif de centraliser tous les besoins nécessaires à sa mise en oeuvre. C'est un travail relativement important qui couvre de nombreuses thématiques (stratégie digitale, dimension économique, marketing, technique, fonctionnelle, graphique, méthodologique). Le cahier des charges évoque notamment les exigences en matière de coûts, de qualité et de délais. Il est généralement utilisé pour lancer un appel d'offres ou comme outil de pilotage en amont de la mise en oeuvre du projet.

Quel que soit la configuration du projet, l'essentiel de la phase d'avant-projet réside dans ce que l'on appelle l'analyse du besoin. L'analyse du besoin peut constituer une partie du cahier des charges, ou être menée spécifiquement pour recueillir les besoins en l'absence de cahier des charges.
L'analyse d'une besoin est une intervention qui rassemble le recueil des besoins métiers (côté émetteur) ainsi que le recueil des besoins utilisateurs (côté usagers).
Dans une démarche UX design, il est question de collecter les flux business et les flux utilisateurs pour équilibrer la proposition de valeur. L'ensemble des informations recueillies seront ventilées au sein d'un tableau listant les typologies de besoins en informations. C'est l'analyse fonctionnelle : elle a pour but d'affecter des contenus et des fonctionnalités en réponse aux besoins identifiés. Ces travaux constituent les prémisses du projet.

L'analyse fonctionnelle et ou le cahier des charges contribuent à affiner la vision du projet. Ce sont des bases solides pour établir le chiffrage du projet. Bien sûr, il n'est pas indispensable d'être équipé d'un arsenal de documentation pour évaluer les coûts d'un projet. Néanmoins, il est toujours plus simple d'établir le budget de quelque chose que l'on arrive à conceptualiser... Comme dit le Docteur Ergo : un objet conçu est un objet perçu... Ceci vaut même pour des petits projets.

De même, sans phase d'avant-projet, il ne sera pas possible de considérer le projet sous l'angle des objectifs de qualités, de coût et de délais. On ne pourra donc pas cadenasser les risques. Or la gestion des risques projet est un enjeu majeur de la gestion de projet, et elle suppose une bonne visualisation des coûts du projet, des délais de mise en oeuvre et de la qualité escomptée au regard des moyens à disposition...

3. Pilotage de projet web

La phase d'avant-projet vise à rassembler l'information nécessaire à la mise en oeuvre du projet. Une réunion dite de kick-off marque le lancement du projet.
La première étape revient à cadrer le projet : on parle de cadrage fonctionnel. Le cadrage fonctionnel vise à déterminer l'envergure éditoriale et fonctionnelle du projet. Ce travail est réalisé à travers un ensemble de réunions chez le commanditaire. Les réunions de cadrage permettent de recueillir le besoin et participent donc au travail d'analyse du besoin.
Pour les projets ecommerce, qui présentent un périmètre spécifique, on aura recours au cadrage de projet ecommerce. Il s'agira de travailler sur l'offre de produits et de services, les réseaux de distribution, la logistique... bref, tout un ensemble de paramètres qui dépassent les problématiques de façonnage au sens strict.

La phase de cadrage se conclut par la note de cadrage dans laquelle on prendra le soin de figurer :

Les enjeux du projet : problématique, objectifs, audiences.
La proposition de valeur et le positionnement.
Les moyens alloués au projet.
Les besoins identifiés via l'analyse du besoin.
L'envergure fonctionnelle du projet.
L'envergure éditoriale du projet.
Le planning et le budget.
L'organigramme et les invervenants.

En principe, le cadrage doit permettre de disposer d'une vision générale des grands enjeux fonctionnels du projet. Le chef de projet doit être capable d'identifier les principales zones fonctionnelles du projet. Ainsi, pour un site ecommerce, il pourra s'agir de :

Descente catalogue de l'accueil vers la fiche produit.
Structuration et architecture de l'information du catalogue.
Processus de commande.
Espace client.
Espaces transversaux.
[...]

Le lotissement fonctionnel du projet consiste à segmenter le dispositif en différentes sections suffisamment interdépendantes pour faire l'objet de traitements spécifiques. Il est question d'identifier les éléments complexes du projet pour y consacrer des chantiers de travaux spécifiques. Le lotissement fonctionnel peut prendre appui sur les grands espaces fonctionnels du dispositif digital à produire. On cherche à découper le projet en 5 à 8 grands chantiers de travail. Ces chantiers sont des lots et ils pourront faire l'objet d'une planification de conception production spécifique.
Attention, lotir un projet ne signifie pas qu'il faille travailler les chantiers de façon isolée. Par exemple, dans un site ecommerce, le processus de commande et l'espace client sont interdépendants (les informations requises dans le tunnel d'achat sont reliées à l'espace client, etc.).

Grâce au lotissement de projet, le chef de projet est en mesure de projeter la mise en oeuvre par étape. Le lotissement de projet sur des zones fonctionnelles permet de fixer la planification du projet sur l'avancement effectif de sa conception - production : ce sont des étapes concrètes qui matérialisent des parties du support à produire. On planifie sur des bases tangibles. C'est le diagramme de Gantt qui sera utilisé pour établir le planning du projet. Chaque lot est présenté sur un axe des temps. On peut paralléliser un certain nombre de lots pour accélérer les processus de conception - production.

Le rôle du chef de projet va être de piloter chaque étape pour assurer la mise en oeuvre dans le timing prévu. Il s'agit d'affecter les ressources nécessaires aux tâches de conception et de production dans la lignée des éléments prévus dans le diagramme de Gantt.
Ce travail de pilotage et d'accompagnement prend corps au sein de la mission d'assistance à maitrise d'ouvrage : accompagnement du commanditaire, accompagnement des équipes de conception production. La mission d'accompagnement est celle qui correspond au rôle de coordinateur du chef de projet.

Pour assurer l'avancement opérationnel du projet, le chef de projet (ou directeur de projet) établira des briefs pour orienter la production. Le brief projet est une autre technique absolument incontournable de la gestion de projet. Chaque jour, le chef de projet est amené à faire circuler les informations et à piloter les travaux de conception production. Le brief est l'outil pragmatique pour transmettre les informations dans un format synthétique.

4. Gestion de projet web opérationnelle, suivi projet

La gestion de projet générale suggère du pilotage stratégique, et sa mise en oeuvre opérationnelle, du suivi. Le suivi de projet constitue donc la partie opérationnelle de la gestion de projet. Il est question de suivi du planning (délais), de suivi de production (qualité) et de suivi des consommations (budget).

Le suivi opérationnel implique l'utilisation d'outils au quotidien. La qualité s'évalue à travers le respect du cahier des charges, des standards techniques (W3C, bonnes pratiques de développement front-end, code minifié), de la prise en compte de la dimension utilisateur tout au long du projet (organisation d'étude usager, test...).
Le suivi de production peut porter sur l'avancement de la conception production des gabarits (écrans types), des articles (production de contenu)...
Le chef de projet gagne à disposer d'un tableau excel permettant de suivre l'avancement du projet en pourcentage et par poste métier. Ceci implique un reporting de la part des équipes de conception production.

Le chef de projet est un maitre dans l'organisation des réunions qui peuvent être formelles et informelles. La méthodologie projet prévoit la mise en place de comités projets opérationnels (réunions projets) auxquels viennent s'ajouter les comités de pilotage (instance de décision). Les réunions de travail en équipe permettent de fluidifier la circulation des informations et de favoriser le travail collaboratif.

Le chef de projet est le garant de la communication tout au long de la chaine projet et les réunions constituent un outil fondamental.
Pour les parties plus créatives, on pourra mettre en place des ateliers de conception ou des ateliers de création : on parle de workshops. Ce sont des formats de réunion où l'animateur va créer des activités pour favoriser le travail en équipe et le processus d'idéation (création).

Une méthodologie de gestion de projet fiable

Une méthodologie projet bien orchestrée établit des objectifs clairs en matière de délais, de budget et de qualité. Ces 3 piliers sont les bases de la gestion de projet stratégique et opérationnelle.
Une bonne gestion de projet est focalisée sur le dispositif digital et non sur la production de livrables. Les livrables restent des traces de la prestation et participent à faire avancer le projet pas à pas. Il faut toutefois éviter les projets centrés sur les livrables qui tendent à privilégier la documentation projet à l'avancement réel de la fabrication du site internet !

Une bonne gestion de projet prévoit un temps d'avant-projet pour poser les fondations et clarifier les besoins. La réalisation d'un planning détaillé est la pierre angulaire du projet. Des outils de suivi de production doivent permettre de visualiser l'avancement jour après jour. Les outils de pilotage et les réunions sont les techniques quotidiennes de coordination et de suivi. Pas besoin de réinventer la roue !

Les nouveaux modèles de gestion de projet intègrent la prise en compte de l'expérience utilisateur à chaque étape. Pour vous aider à visualiser les techniques spécifiques propres à chacune des phases, vous pouvez consulter les sections dédiées à chaque étape du projet web :