51
Gestion de projet Web Outils, méthodes & types de projets Olivier Dommange Olivier Dommange

Gestion de projet web

Embed Size (px)

Citation preview

Page 1: Gestion de projet web

Gestion de projet WebOutils, méthodes & types de projets

Olivier DommangeOlivier Dommange

Page 2: Gestion de projet web

Oliv

ier D

omm

ange

Gestion de projet Web

Qu'est-ce qu'un projet ?

Page 3: Gestion de projet web

Oliv

ier D

omm

ange

Définition

Concept

Vouloir matérialiser un concept

Page 4: Gestion de projet web

Oliv

ier D

omm

ange

À l'aide de compétences, méthodes et outils adéquats

Outils

Méthodes

Compétences

Concept

Définition

Vouloir matérialiser un concept

Page 5: Gestion de projet web

Oliv

ier D

omm

ange

Outils

Méthodes

Compétences

Ressources

Concept

En fonction de ressources financières

Vouloir matérialiser un concept

À l'aide de compétences, méthodes et outils adéquats

Définition

Page 6: Gestion de projet web

Oliv

ier D

omm

ange

Temps

Outils

Méthodes

Compétences

Ressources

Concept

Dans un temps défini et planifié

Vouloir matérialiser un concept

À l'aide de compétences, méthodes et outils adéquats

En fonction de ressources financières

Définition

Page 7: Gestion de projet web

Temps

Outils

Méthodes

Compétences

Ressources

Concept

Dans un temps défini et planifié

Vouloir matérialiser un concept

À l'aide de compétences, méthodes et outils adéquats

En fonction de ressources financières

Oliv

ier D

omm

ange

Est-ce vraiment un projet ?

Si l'un de ces aspects s'avère mal défini ou inexistant, le projet n'existe pas ou n'est pas viable.

Définition

Page 8: Gestion de projet web

Oliv

ier D

omm

ange

Délais

Qualité

Coûts

Un rapport incompressible !

3 aspects aux projets

En fonction des besoins du projet, il est question de trouver un équilibre entre les coûts de réalisation, les délais en fonction du niveau de qualité.

Qu'est-ce qu'un projet ?

Page 9: Gestion de projet web

Oliv

ier D

omm

ange

Le compte est-il bon ?

Réduire l'un des 3 aspects implique de revoir proportionnellement à la baisse les autres facteurs du projet.

Qu'est-ce qu'un projet ?

Image : http://monmacon.tumblr.com

Page 10: Gestion de projet web

Oliv

ier D

omm

ange

Délais

Qualité

Coûts

Quels sont les besoins du projet ?

La réduction des contraintes peut se résoudre par des solutions bon marché qui reste de qualité.

Cela dépendra des solutions proposés.

Qu'est-ce qu'un projet ?

Page 11: Gestion de projet web

Olivier DommangeOlivier Dommange

Évaluer les risques

Page 12: Gestion de projet web

Oliv

ier D

omm

ange

Les risques...

La collaboration et la traitance

Page 13: Gestion de projet web

Les risques...

Oliv

ier D

omm

ange

Source : Project cartoon http://www.projectcartoon.com

Compréhension du projet

Par leur métier, culture professionnelle et expérience, chaque membre d'une équipe, collaborateur, associé, sous-traintant ou client aura une conception propre du projet.

Page 14: Gestion de projet web

Les risques...

Collaborations

Autant elles peuvent dynamiser un projet, autant elles impliquent un suivi sans faille, les collaborations comportent des risques multiples :- Délais repoussés en chaîne.- Perte de contrôle de la qualité- Explosion des coûts- Communication sommaire- Duplication des tâches- Ingérence- ...

Image : http://monmacon.tumblr.com/ Oliv

ier D

omm

ange

Liaisons dangereuses

Le rôle, les responsabilités et le processus de validation sont à clarifier dès le début du projet.

Client

Vous Traitant

Fournisseurs

?

Page 15: Gestion de projet web

Oliv

ier D

omm

ange

Les risques...

Le client

Page 16: Gestion de projet web

Les risques...

Créer une entente claire avec le client

Entre ce que le client comprend de ce qu'implique de la réalisation d'un projet et ce qu'il en est véritablement peu lui laisser l'occasion de négocier à la baisse un projet.

Image : http://monmacon.tumblr.com Oliv

ier D

omm

ange

La qualité de votre travail en dépend

Un projet mal négocié ne donne pas satisfaction ni au mandataire, ni au client. Le risque est de revoir à la baisse la qualité au détriment du consentement du client.

Page 17: Gestion de projet web

Les risques...

Le client a-t-il conscience de ce qu'il demande...

Donnons-lui le bénéfice du doute. Le client n'est pas du métier. Il peut avoir tendance à sous-estimer la quantité de travail que représente sa demande. D'ailleurs, il s'adresse à un professionnel pour que celui-ci puisse l'aider dans le choix de solutions adaptées à ses besoins.

Image : http://monmacon.tumblr.com Oliv

ier D

omm

ange

« Éduquer » le client

Pour rendre conscient un client de ce que représente sa demande, il peut s'avérer utile de lui présenter un devis détaillé qui lui permettra éventuellement de miser sur d'autres options.

Page 18: Gestion de projet web

Les risques...

Le syndrome de la carte blanche

Par excès de confiance, par difficulté à définir son projet ou de mauvaise foi, le client peut avoir tendance à donner carte blanche...

Cela donne l'impression qu'il laisse le champ libre dans la création. Il n'en est rien.

Oliv

ier D

omm

ange

Le client se désengage du projet

Le client doit être responsabilisé et guidé. S'il prétend s'adresser à un professionnel, il aura à s'attendre à ce que celui-ci lui explique comment son projet pourra être mené avec succès et que son implication est déterminante.

Carte blanche = ?

Page 19: Gestion de projet web

Oliv

ier D

omm

ange

Les risques...

Les compétences

Page 20: Gestion de projet web

Oliv

ier D

omm

ange

Les risques...

Télécharger, installer et configurer

Installer et administrer des

thèmes et modules

Créer un thème graphique

Développer de nouvelles

fonctionnalités

Temps

Degrés d e compét ences

CMS et Framework

L’utilisation d’un CMS permet d’envisager un gain de temps qui peut s'avérer somme toute relative en fonction des besoins spécifiques d’un projet et de l'ampleur des compétences qu'implique leur réalisation.

Page 21: Gestion de projet web

Répondre aux besoins

Olivier DommangeOlivier Dommange

Page 22: Gestion de projet web

Identifier le besoin

Évaluer un projet

Bien que soit identifier une intention il est nécessaire de définir les outils et ressources nécessaires pour concrétiser ce projet.

Oliv

ier D

omm

ange

Le client sait-il ce qu'il veut ?

Par cette question on tente de sa savoir ce qu' a besoin le client et quels sont les moyens qu'il dispose pour concrétiser son projet.

Le (futur) prestataire est une ressource pour l'aider dans ce processus

Intentions(objectifs)

Utilisateurs(besoins)

Technologies(possibilités)

Page 23: Gestion de projet web

L'après-projet... à prévoir aussi avant le projet

Mise à jour et contenus

Planifier la mise à jour du contenu dans le workflow (cycle de travail). Il s'agit de travail supplémentaire qui assure la vie de l'outil et qui s'imbrique dans la stratégie de référencement.

Oliv

ier D

omm

ange

Maintenance et la formation

Il s'agit de besoins inhérent à un projet Web. Cette assistance peut prendre la forme d'un mandat qui ira au-delà du projet de la conception.

La mise en ligne d'un outil Web est le début d'un nouveau projet.

Formation

Mise à jour Maintenance

Page 24: Gestion de projet web

Oliv

ier D

omm

ange

Les solutions...

Le client n'a pas de budget et des besoins très limités. Il saura concevoir à l'aide de quelques conseils techniques.

Services en ligne offrant la mise en place d'un site en ligne tel que le propose wordpress.com.

Le choix de thèmes et extensions sont limités. Le client doit avoir conscience de ces limites.

Mise en fonction de l'outil (inscription). Frais pour services complé-mentaires proposés par l'outil. Éventuels frais de formation.

1Description Outils Risques Coûts

Do It Yourself (DIY)

Page 25: Gestion de projet web

Oliv

ier D

omm

ange

Les solutions...

Solutions CMS

Un outil comme, par exemple, Wordpress dispose différentes solutions qui peuvent correspondre aux besoins.

Ce qui peut sembler gratuit ne l'est peut-être pas autant qu'il n'y paraît.

Page 26: Gestion de projet web

Oliv

ier D

omm

ange

Les solutions...

Un outil adapté en fonction des besoins du projet. Utilise des extensions de l'outil. Peu consister à faire du développement.

Les thèmes et extensions de l'outil.

Identification fastidieuse de l'outil et des extensions répondant aux besoins. Planification et budget difficile à prévoir.

Estimation en fonction de la planification et volume de travail. Pourquoi pas envisager un tarif forfaitaire.

2Description Outils Risques Coûts

Tout inclus (CMS, thème et extensions)

Page 27: Gestion de projet web

Les solutions...

Les CMS ou pas

Wordpress représente 58.8% des CMS utilisés et 25.6% de tous les sites de la planète...

56.6% n'utilisent pas de CMS.

Sources : http://www.cmsmatrix.orghttp://w3techs.com/technologies/overview/content_management/all Oliv

ier D

omm

ange

AvantagesLa communauté et l'intensité de son activité.Outil testé et mis à jour fréquemment.Gratuité.Rapide à mettre en place.

InconvénientsLa sécurité (open source).Pas tout le temps gratuit.L'assistance technique personnalisée.Autant de développeurs que de modules.Le développement de nouvelles fonctionnalités peut impliquer une courbe d’apprentissage importante.

Répartition des CMS (jan.16)Wordpress (58.8%) Joomla (6.4%)Drupal (4.9%)Magento (2.9%)Blogger (2.7%)Typo3 (1.5%)

58.8%

6.4%4.9%

2.9%2.7%

1.5%

Page 28: Gestion de projet web

Oliv

ier D

omm

ange

Les solutions...

Repenser un aspect ou la totalité d'un outil. Il peut s'agir d'une adaptation graphique ou une révision technologique.

Déterminés en fonction des objectifs de la refonte.

Les coûts et compé-tences sont déterminés par les intentions à l'origine de la refonte. Analyse technique détaillée à prévoir.

Estimation en fonction de la planification et volume de travail.

4Description Outils Risques Coûts

Refonte (graphique et/ou technique)

Page 29: Gestion de projet web

Oliv

ier D

omm

ange

Les solutions...

Les extensions

Des outils complémentaires existent et permettent de trouver des solutions rapides dans l'exécution d'un projet ou pour s'en inspirer.

Le client peut les consulter en ligne et partager son avis.

Capture d'écran du site Wordpress.org

Page 30: Gestion de projet web

Oliv

ier D

omm

ange

Les solutions...

Un outil devant correspondre à un besoin et une évolution technique ou technologique spécifique.

En référence aux outils identifiés dans la description du projet.

Niveau de compétences élevé.Implique un dévelop-pement long, itératif. Nécessite des méthodes adéquats.

Estimation en fonction de la planification et volume de travail...Correspond à un risque élevé.

3Description Outils Risques Coûts

Développement sur mesure

Page 31: Gestion de projet web

Les solutions...

Éventail de solutions

Tout concevoir soi-même assure la maîtrise complète de l'outil et permet d'adapter un outil au plus prêt des besoins du projet.

Oliv

ier D

omm

ange

AvantagesDe nombreuses librairies (framework) permettent d’obtenir un résultat rapide et sécurisé.Maîtrise de l’outil par ses auteurs.Résultat sur mesure.Renforce l’enthousiasme des développeurs.

InconvénientsTemps d’investissement important pour la mise en place des bases de l’outil et des tests.La documentation à rédiger.Nouveaux collaborateurs à former.

Page 32: Gestion de projet web

Outils

Olivier DommangeOlivier Dommange

Page 33: Gestion de projet web

Le cahier des charges

Oliv

ier D

omm

ange

Ça sert à...

Rappeler le contexte et la stratégie dans lequel s'insère le projet.

Définir les objectifs.

Accorder le budget et les délais des livrables.

Signifier certains aspects juridiques (propriétés intellectuelles).

Synthèse de 10 à 20 pages rédigée par le client (avec l'aide du mandataire).

Les composants

GénéralitésExposer le mandat, le contexte et les objectifs du projet.

Matière du projetDéfinir le type de contenu et comment il sera obtenu. Présenter les fonctionnalités et technologies.

LogistiqueDélais, livrables, rôle et personnes de contact.

Page 34: Gestion de projet web

L'offre commercial (devis)

Oliv

ier D

omm

ange

Ça sert à...

Exposer les coûts de réalisation du projet.

Permettre au client de comprendre les aspects et phases du projet.

Offrir la possibilité au client de revoir ces intentions dans de bonnes conditions et en meilleure connaissance de cause.

Les composants

Description des phases et temps de réalisation.

Taux horaire réaliste (en fonction de toutes les charges) .

Inclure une marge (en fonction des risques).

Proposer un forfait ou réductions.

En réponse au cahier des charges, l'offre est rédigée par le mandataire.

Page 35: Gestion de projet web

Le contrat

Oliv

ier D

omm

ange

Ça sert à...

Formaliser l'entente commune de collaboration.

Établir un cadre juridique qui protège et engage les deux partis.

Les composants

Étendue de l'offreDécrit la mission, la prestation fournie et les résultats livrés.

Conditions généralesIndique les dispositions particulières relatives à la collaboration ou au déroulement. Fixe la durée du projet ainsi que les obligations du client et du mandataire.

Dispositions commercialesIndique le montant et le mode de règlement.

Le contrat est rédigé par le mandataire. Ce document est signé par les deux partis.

Page 36: Gestion de projet web

Les spécifications techniques

Oliv

ier D

omm

ange

Ça sert à...

Rappeler les choix techniques et technologiques du projet.

Détailler les fonctionnalités.

Fournir une analyse technique.

Permettre aux analystes et techniciens d'identifier les composants du projet.

Assurer une documentation au projet et un relais aux futurs projets.

Les composants

Choix techniquesListe les langages, frameworks, CMS et/ou extensions utilisés.

Composants fonctionnels et des interfacesDécrit les processus d'interaction, les formulaire. Présente les fonctionnalités et la structure de la base de données.

AutresGlossaire, lexique, sommaire.

Rédigé par un analyste technique. Ce document suivra le projet, pas le mandataire.

Page 37: Gestion de projet web

Le diagramme de Gantt

Oliv

ier D

omm

ange

Ça sert à...

Détailler les étapes de réalisation du projet pour chaque fonction.

Estimer la répartition des ressources humaines et financières prévues pour le projet.

Observer les avancées et/ou retards tout au long du projet.

Les composants

Étapes du projetsListe chaque tâches allouant une ressource à son exécution selon un délai défini.

SuiviMise à jour au fil des travaux effectués, avancées et retards.

RessourcesListe des ressources humaines allouée au projet. Définition du coût de chaque ressource et budget du projet.

Établit par le chef de projet. Ce document sera mis à jour tout au long du projet.

Page 38: Gestion de projet web

Le diagramme de Gantt

Gestion des délais

Découpage des tâches Avancement du projet

Niveau d'avancement des tâches. Gestion des livrables

Page 39: Gestion de projet web

Outils en ligne

Oliv

ier D

omm

ange

Ça sert à...

Faciliter la collaboration avec les intervenants externes et autres traitants.

Impliquer le client dans les différents processus du projet.

Initié par le chef de projet. Ces outils sont mis à jour par tous les collaborateurs.

Archivage de fichiersGitHub : syncronisation en ligne DropBox, Google Drive, iCloud

.Travail collaboratif

Trello.com : gestionnaire de tâchesMural.ly : mur collaboratifGoogle Docs : logiciel en ligne

.

Travail collaboratifTrello.com : gestionnaire de tâchesMural.ly : mur collaboratifGoogle Docs : logiciel en ligne

.Pilotage

Basecamp : gestionnaire de tâches

Page 40: Gestion de projet web

La charte graphique

Oliv

ier D

omm

ange

Ça sert à...

Formaliser les choix graphiques du projet.

Assurer une documentation utile à tout nouveau développement de l'outil.Rédigé par le webdesigner. Ce

document suivra le projet, pas le mandataire.

Les composants

Choix graphiquesListe les langages, frameworks, CMS et/ou extensions utilisés.

Composants fonctionnels et des interfacesDécrit les processus d'interaction, les formulaire. Présente les fonctionnalités et la structure de la base de données.

AutresGlossaire, lexique, sommaire.

Page 41: Gestion de projet web

Versions et validation

Olivier DommangeOlivier Dommange

Page 42: Gestion de projet web

Les versions

Maquettes

1ère

2e

Zones de contenus organisées. Organisation du contenu. La grille de composition.

Wireframe

Aspects graphiques des interfaces. Ergonomie, esthétique, lisibilité.

Graphique

-

Disposition Validation

Page 43: Gestion de projet web

Les versions

Prototypes

1ère

2e

Simulation d'une partie, d'un outil ou d'une séquence.

Utilisabilité, accessibilité, navigation, fonctionnalités.

Partiel

Simulation du produit fini dans les conditions définitives.

Utilisabilité, accessibilité, navigation, fonctionnalités.

Complet

Disposition Validation

Page 44: Gestion de projet web

Les versions

Validations et versions

1ère

2e

3e

Fonctionnalités partielles et interfaces graphiques complètes. Premiers essais en condition réelle.

Utilisabilité, aspects techniques et graphiques, environnement.

Version alpha

Fonctionnalités, interfaces graphiques et contenus complets.

Produit entier et sécurisé.

Version beta

Version 1.0. Stable et finale. Nouvelle version à chaque modification.

-Version en production

Disposition Validation

Interne.

Publique ou limitée.

Consultation

Publique.

Page 45: Gestion de projet web

Méthodes

Olivier DommangeOlivier Dommange

Page 46: Gestion de projet web

La méthode classique

Séquence d'étapes

Identification du besoins

Analyse

Conception

Développement

Tests

Livraison

Oliv

ier D

omm

ange

Découpage

Il faut valider la séquence précédente avant d'engager la suivante.

Engagement fort et décisif à chaque étape.

Le client découvre le produit qu'au terme de chaque étape.

Détection tardive des anomalies (souvent au moment des tests). Corrections difficiles et coûteuses.

1 2 3 4 5 6

Page 47: Gestion de projet web

Oliv

ier D

omm

ange

Les méthodes

Agiles

Page 48: Gestion de projet web

Les méthodes Agiles

Ce que c'est...Il s'agit d'un mode de développement itératif de projet.

L'objectif est de développer raidement de courtes séquences qui seront présentées au client afin que celui-ci puisse intervenir dès que possible dans l'acheminement du projet.

Oliv

ier D

omm

ange

Plusieurs méthodes Agiles

Scrum Probablement la plus utilisé actuellement. Basé sur des planifications courtes (Sprint).

D'autres déclinaisons :

Extreme programming

Rapid Application Development

Dynamic Software Developement Method

Analyse

Stratégie

Développement

Retour client

Cycles

Page 49: Gestion de projet web

Les méthodes Agiles

Oliv

ier D

omm

ange

Application d'Agile

Les méthodes Agiles correspondent davantage aux gros projets dont les échéances et budgets de développement sont extensibles.

Un projet dont les attentes sont et le budget sont définis peut se mener selon la méthode classique avec des risques limités.

Limites d'applicationIl est reconnu que la valeur ajoutée au termes d'un cycle est variable. Elle sera élevée au début et se réduira au fil du projet.

Dans le cas de projets dont le budget est limité les cycles de développement peuvent excéder la marge définie sans que le projet ne rencontre les objectifs de départ.

La planification budgétaire avec Agile peut s'avérer complexe car les objectifs des cycles dépendent des résultats du cycle précédent .

1 2 3 4 5 6 7 8 9 10 11Cycles (temps)

Budget

Valeur ajoutée

Valeur acquise

Coût de production

Page 50: Gestion de projet web

Les prototypes

Oliv

ier D

omm

ange

Confirmer l'UI par l'UXEn accédant rapidement à la mise en situation supposée par les wireframes et la maquette, on expérimente et constate que les choix de composition et d'interaction sont viables et satisfaisants.

Responsive WebdesignL'attribution de points de rupture passe par la mise à l'épreuve de l'interface sur les différents formats des supports. Des aménagements graphiques peuvent être envisagés.

S'inspirer de la méthode Agile pour le prototypeLes enjeux concernant l'expérience utilisateur impliquent de tester lors de la conception le fonctionnement des interfaces auprès d'utilisateurs.

La méthode Agile peut s'avérer utile. Effectuer un développement rapide sous forme de prototype.

Analyse

Wireframe

Développement

Test utilisateur

Cycles

Page 51: Gestion de projet web

Les tests

Oliv

ier D

omm

ange

4 types de tests

UtilisateurApprécier l'interaction entre l'interface et l'utilisateur. Constater si celui-ci accomplit les points de convergences prévus.

FonctionnelIdentifier les bugs se rapportant aux fonctionnalités

SécuritéIdentifier les failles et la vulnérabilité de l'outil

PerformanceAméliorer le temps de chargement sur les supports et navigateurs. Outil évolutif.

S'inspirer de la méthode Agile pour les testsLes tests d'un outil implique la définition adéquate des solutions face aux bugs signalés.

La correction d'un bug peut entraîner un problème jusqu'alors insoupçonné.

Analyse / audit

Déf. fonctions

Développement

Tests

Cycles