La gestion de projet digitale

27 novembre 2014

2 Core-Techs

Slides de présentation Core-

Techs

3 Core-TechsPrésentation Core-Techs 2012

4 Core-TechsPrésentation Core-Techs 2012

5 Core-TechsPrésentation Core-Techs 2012

6 Core-TechsPrésentation Core-Techs 2012

7 Core-Techs

Ce que disent nos clients…

8 Core-Techs

« Le projet est simple, j’ai tout

dans la tête. Je vais vous

expliquer, ça va aller vite. »

9 Core-Techs

« Les maquettes graphiques

ont un effet whaouh ! C’est le

graphiste qui s’est occupé des

plaquettes qui les a faites. »

10 Core-Techs

« Et oui, les maquettes sont

déjà prêtes, le boss voulait

valider ça avant tout. »

11 Core-Techs

« J’ai pas de cahier des

charges, mais faut que ça soit

prêt dans 1 mois »

12 Core-Techs

« On verra ça plus tard,

pendant le développement. »

13 Core-Techs

« Oui, oui, oui, d’accord,

d’accord, bien sûr, pas de

souci, vous avez raison, on fera

comme ça, on va se

débrouiller, … »

14 Core-Techs

« oups, désolé, j’ai oublié de te

mettre en copie du mail… »

(3 semaines plus tard)

15 Core-Techs

« Les contenus ? On prendra un

stagiaire à la fin du projet pour

les reprendre»

16 Core-Techs

« Le référencement ? C’est une

agence qui s’en occupe

après…»

17 Core-Techs

« Le planning ? C’est un des

dév de l’équipe qui l’a fait. Ca

devrait aller vite. »

18 Core-Techs

« Pourtant, je le lui ait dit et

répété par téléphone !!! »

19 Core-Techs

« Zut, zut, zut, on est en retard,

va falloir qu’on rattrape, faut

pas que le client soit au

courant.»

20 Core-Techs

« Ouf, une fois le projet en

ligne, on va pouvoir se

reposer…»

21 Core-Techs

22 Core-Techs

Qui est chef

de projet ?

23 Core-Techs

Les profils du chef de projet

Le technicien Le communiquant

24 Core-Techs

Le chef de projet (A)MOA

Excellente connaissance du

Web

Excellente connaissance du

fonctionnement de l’organisation et de

l’organigramme

Il sait qui fait quoiIl connaît bien tous

ses prestataires

25 Core-Techs

Le chef de projet (A)MOE

Expertise fonctionnelle de la solution

retenue

Profil technique ?

Soutien technique en

interne fort

Capacité à se recentrer sur les

besoins utilisateurs

Capacité de planification et de négociation des ressources

Bonne connaissance

de l’équipe technique

26 Core-Techs

Les contre-exemples du chef

de projet

27 Core-Techs

Gère trop de projets

en parallèle

28 Core-Techs

Fait reposer toute la

responsabilité du projet sur la

MOA/MOE,

29 Core-Techs

Ne fait pas communiquer les différents

prestataires ou ne transmets pas les bonnes

informations

30 Core-Techs

Est en conflit avec d’autres équipes en

interne

31 Core-Techs

Ne donne pas le bon exemple

32 Core-Techs

Organisation des

équipes et choix

de la méthode

33 Core-Techs

Qui fait quoi ?

Directeur de projet

Directeur Artistique

Lead Technique

Développeur

Intégrateur

Testeur

…

Pôles métier

Rédacteurs

Testeurs

Décisionnaires

(A)MOA (A)MOE

34 Core-Techs

Cycle en V ou Agile ?

35 Core-Techs

Les grandes étapes d’un cycle en V

Avant-Projet

•Cadrage

•Cahier des charges

Réponse externe

•Appel d’offre

•Analyse des offres

Conception

•Spécifications fonctionnelles

•Spécifications techniques

•Prototypage

•Conception graphique

Développement

•Lotissement

•Réception & recette

Maintenance et suivi

•Tests utilisateurs

•TMA

36 Core-Techs

Avantages / Inconvénients

Une méthode efficace

•Anticipation des étapes

•Exhaustivité du besoin

Une méthode trop stricte ?

•Besoin figé au démarrage

37 Core-Techs

Les valeurs agiles

L’équipe

L’application

La collaboration

L’acceptation

du changement

38 Core-Techs

La méthode agile nécessite

Plus d’implication et de disponibilité du product owner

(AMOA)

Plus de souplesse de l’équipe de développement (MOE)

Une taille réduite des équipes

39 Core-Techs

Avantages / Inconvénients

Une méthode complète

• Itérations pour coller au plus près du besoin

Des risques de dérapage

• Planning

• Budget

40 Core-Techs

Choisir la meilleure méthode d’après :

Y a-t-il un budget/délai

fixe

Quelle est la taille du projet

Quelle est l’organisation et la personnalité des acteurs ?

41 Core-Techs

Mobile first or not ?

42 Core-Techs

Le cahier des charges

43 Core-Techs

Le formalisme du cahier des charges

ou

44 Core-Techs

A minima : QQOQCP

45 Core-Techs

QQOQCP

Qui : ciblage et profil des visiteurs.

Quoi : type de site, description du contenu du site, mots clés…

Où : vocation locale, nationale, internationale…

Quand : échéances pour la mise en ligne.

Comment : en propre ou hébergé, technologies privilégiées,

budget, ressources et parties prenantes, …

Pourquoi : Objectifs du site, rentabilité, valeur attendue…

46 Core-Techs

Les ateliers de

conception

47 Core-Techs

Quelques outils d’ateliers

Le benchmark

L’analyse statistique de l’existant

Les études quantitatives / qualitatives

Le tri des cartes

Shadowing / one day in a life, fly on the wall

Les personas

La cartographie de l’expérience utilisateur

Les diagrammes d’alignement

Lean prototyping

48 Core-Techs

Graphique

Ergonomique

Fonctionnel

Technique

Benchmark

49 Core-Techs

Les stats…

50 Core-Techs

Etude de vos cibles

51 Core-Techs

Le jeu des post-it (tri des cartes)

52 Core-Techs

Shadowing

53 Core-Techs

Personas

54 Core-Techs

Cartographie de l’expérience utilisateur

55 Core-Techs

Diagramme d’alignement

56 Core-Techs

Lean prototyping

57 Core-TechsLe prototypage

58 Core-Techs

Les différentes formes de prototypage

Sketch / croquis

Zonings

Wireframe / maquette filaire

Prototype

59 Core-Techs

Axure or not ?

60 Core-TechsLes spécifications

61 Core-Techs

Doivent s’adapter à l’outil sous-jacent

62 Core-Techs

Cas pratique avec Drupal – les structures de

contenu

Champ Type Obligatoire Multivalué Commentaire

Titre Ligne de texte Oui Non Date de début Date Oui Non

Date de fin Date Non Non

Corps de texte Texte riche Oui Non Type d’événement Taxonomie « Types

d’événement » Oui Non

Visuel Photo Oui Oui Au moins une valeur

Genre Ligne de texte Non Non Aide de remplissage à afficher : Ex. : Blues, One man show, Humour, Diner-concert, ...

Lieu Ligne de texte Oui Non

Adresse Bloc de texte Oui Non

Code postal Ligne de texte Oui Non Ville Taxonomie

« Communes » Oui Non

Horaires Ligne de texte Non Non Aide de remplissage à afficher : Ex. : 10h et 17h, du lundi au vendredi de 9h à 12h et de 14h à 18h, Le 27 octobre à 20h et le 18 novembre à 17h, …

Durée Ligne de texte Non Non Aide de remplissage à afficher : Ex. : 1h30, 2h avec entracte, ...

Indications Ligne de texte Non Non Aide de remplissage à afficher : Ex. :Entrée libre, Gartuit, Á partir de 12 ans, Tarif de 10 à 28 €, Réservation obligatoire, ...

Téléphone Ligne de texte Oui Non

Email Email Oui Non

Site web URL Non Non Partenariat CG Case à cocher Non Non

Localisation Coordonnées GPS Non Non Implémenté automatiquement à partir de l’adresse postale en utilisant le geocoding de Google Maps

63 Core-Techs

Cas pratique avec Drupal – le détail d’une page de

contenu

Actualités Cette zone affiche la liste des 12 dernières actualités publiées sur le portail. Cette liste est affichée sous la forme d’un carrousel. La liste est triée par ordre chronologique basée sur la date de publication (de la plus récente à la plus ancienne). Pour chaque actualité de la liste de la partie inférieur, les éléments suivants sont affichés :

La thématique associée

Titre de l’actualité

Date de publication

Nombre de vues

Liens de partage Facebook et Twitter (Affichage dans une zone rétractable masquée par défaut) Lors du survol ou de la prise de focus sur le titre d’une actualité dans la partie inférieure de la zone, l’actualité correspondante s’affiche dans la partie supérieure :

Titre

Visuel

Extrait de la description limité à 150 caractères

Lien « + » vers la vue pleine page de l’actualité Actions disponibles :

Action Description Commentaire Clic sur le titre ou l’image ou le lien « + » d’une actualité

L’utilisateur est redirigé vers la vue pleine page de l’actualité sélectionnée

Voir annexe technique accessibilité § 30.2 à propos des liens mixtes.

Clic sur le lien « Toutes les actualités »

L’utilisateur est redirigé vers la liste des actualités

Clic sur le lien de partage Facebook d’une actualité

L’internaute est redirigé vers la page Facebook de partage de l’actualité sélectionnée

Ouverture dans une nouvelle fenêtre Voir annexe technique accessibilité § 30.1 à propos des liens images.

Clic sur le lien de partage Twitter d’une actualité

L’internaute est redirigé vers la page Twitter de partage de l’actualité sélectionnée

Ouverture dans une nouvelle fenêtre Voir annexe technique accessibilité § 30.1 à propos des liens images.

Clic sur l’une des pastilles de navigation situées dans le coin supérieur droit de la zone

La série d’actualités correspondantes est affichées dans la zone (fonctionnement en slider avec effet de fondu)

Le focus clavier doit être remis sur le titre de la 1er actualités dans la partie inférieure

Sans JavaScript En l’absence de JavaScript toutes les actualités doivent être visibles,

Clic sur le titre d’une actualité dans la partie inférieure

Le focus est redirigé vers l’actualité correspondant dans la partie supérieur

Le titre de l’actualité dans la partie inférieure devra être un élément button ou un lien avec un rôle « button »

2

64 Core-Techs

Le prochain cycle

65 Core-Techs

Au programme du 27 janvier

Organiser et suivre les développements

Pratiquer les tests et faire une recette efficace

Gérer l’hébergement

Préparer le référencement

Préparer la reprise des contenus

Planifier la version 2