SlideShare une entreprise Scribd logo
Introduction
à la gestion de projet
Planning semaine

   Lundi : outils gestion, édito
   Mardi : dev/design
   Mercredi : bilan par équipe
   Jeudi: analyse technique, point com
   Vendredi : projet client, point mémoire
« Méthodes agiles »

Penser « itératif / incrémental »

     Avoir une vision de la direction globale du projet
     Mais penser en terme de mini-projets (V0, V1, V2....)
      => fixer des priorités dans la réalisation
       => concevoir chaque version en fonction des adaptations
      futures
« Méthodes agiles »

Le principe du développement itératif consiste à
  découper le projet en plusieurs étapes d’une durée
  de quelques semaines ; ce sont les itérations. Au
  cours d’une itération, une version minimale du
  produit attendu est développée puis soumise, dans
  sa version intermédiaire, au client pour validation.




 Véronique Messager Rota « Gestion de projet – Vers les méthodes agiles »
« Méthodes agiles »


Chaque itération est un mini-projet en soi qui
  comporte toutes les activités de développement,
  menées en parallèle : analyse, conception, codage et
  test, sans oublier les activités de gestion de projet.




 Véronique Messager Rota « Gestion de projet – Vers les méthodes agiles »
Fixer la direction globale du projet

Définition DT de votre projet
                0




     Quel est votre objectif ?
     Quel type de site/DVD/etc. (« vitrine »,
      communautaire, ludique, institutionnel, etc...)
      En quoi votre projet est-il intéressant ? Original ?
      Public cible : profil général

                    Types de site, objectifs, caractéristiques
Fixer la direction globale du projet

Planning, répartition, centralisation

     Des tâches réparties entre différentes personnes
      ressources
     Mais un espace de travail commun
     Outils : serveur/FTP, FilXoom, Yahoo Briefcase, ...
Fixer la direction globale du projet

Réaliser un benchmark (puis veille continue...)

     Sites concurrents (même sujet, même domaine)
          Analyse détaillée des 3 ou 4 sites (organisation du
           contenu, fonctionnalités proposées / non-proposées)
          Liste de tous les sites visités (del.icio.us)
Fixer la direction globale du projet

Réaliser un benchmark (puis veille continue...)

     Sites de référence (graphisme, navigation),
      composants originaux/adaptables
          Alimenter votre boîte à idées
          Constituer une bibliothèque de composants
          Penser à la réutilisation de contenus (flux RSS, API...)
Fixer la direction globale du projet

Personae et scénario d'usage (« use case »)

   Qualifier des comportements utilisateurs
   Mieux cerner leurs attentes


  => pour proposer des interfaces adaptées



                                  Personas / personae
Fixer la direction globale du projet

(Re) Définir la ligne éditoriale (DT1)

      Les objectifs et l'intérêt du site
      Le ton et l'ambiance
      Le calibrage des pages
      Les thèmes traités et les rubriques proposées
      Les fonctionnalités proposées (dans quel but ?)
Fixer la direction globale du site

Définir les bases du dev /design

     dev/design : création graphique interactive,
      collaboration entre designer et développeur
     Concept board > pistes graphiques > charte
Fixer la direction globale du site

Définir les bases du dev /design

     Concept board > pistes graphiques > charte
       « mise en forme » du ton et de l'ambiance du site
       définis dans la ligne éditoriale (« collages »,
       « associations graphiques »)
       prise en compte de l'aspect dynamique, interactif


                           Example détaillé 1 (ligne édito > concept)
                           Example 2. quot;collagesquot;
Fixer la direction globale du site

Définir les bases du dev /design

     Concept board > pistes graphiques > charte
      propositions d'une home page, de templates de page
       avec un système de navigation, + définition de
       composants interactifs)



                                    example page d'accueil
Fixer la direction globale du site

Définir les bases du dev /design

     Concept board > pistes graphiques > charte
      templates définitifs, iconographie/logotype et
       définition du style pour chaque élément (titre, sous-
       titre, encarts, footer, etc...)



                  Exemples de templates
                  Exemple de charte graphique (sans la partie template)
                  Exemple de logotypes
Fixer la direction globale du site
Analyse fonctionnelle générale

     Définir l'arborescence générale du site
      (« blueprint »)
       - navigation top-down + liens transversaux entre les pages
       - utiliser une signalétique : renvoie vers une page ou simple noeud
          d'arborescence ? Page dynamique ou statique ?




                   Exemple d'arborescence (mais sans signalétique...)
                   Mindomo: un outil pour réflechir sur l'arbo avant finalisation
Fixer la direction globale du site
Analyse fonctionnelle générale

     workflow et wireframe (chemin de fer)
       - pour chaque page : quels répères (exple:breadcrumbs ) donne-t-
          on à l'utilisateur ? Quelles possibilités de directions ?
       - y-a-t-il des composants transversaux (footer, crédits, news, etc.) ?
          Quels modules doivent-être scénarisés (=> storyboard)
       - enrichissement progressifs des wireframes




                                    Schéma navigation utilisateur 1 et 2
                                    Exemple de wireframe
                                    Design patterns (schéma de conception)
Fixer la direction globale du site

Analyse technique

     Définir les contraintes techniques
       => tout public ? référencement ? écran tél portable ?
     Spécifier les formats de données, l'encodage, la
      portabilité, l'hébergement...
Fixer la direction globale du site

Analyse technique

     Définir l'arborescence pour les fichiers
       => quelle convention de nommage pour les dossiers, les images...?
     Définir la plateforme de développement et les
      « briques » utilisées
Fixer la direction globale du site

Penser com et conception

     Le bouche à oreille version web, comment ça
      marche ?
     Organiser la com « hors web »
Fixer les étapes de développement

Développement d'une V1

     Planifier le développement des premiers modules
      du site

Développement d'une V2


                               AceProject
                               Gantt project
                               Basecamp
En pensant au tâches transversales

Recherche documentaire / création contenu

     Rassembler les sources d'information
     Rédiger/structurer le contenu
     Créer une banque d'images / vidéos (Source ?
      Légende ? Copyright ? etc...)
En pensant au tâches transversales

Rédaction du mémoire

     Conserver tous les docs pour montrer l'évolution
      de votre projet
     Réfléchir à une adaption de la charte graphique
      version print
     etc...
Liens utiles

1. Gestion de projet

  Livre : Conduite de projet web - S. Bordage
  http://universite.online.fr/supports/projet/pdf.htm
  http://fr.selfhtml.org/projet/index.htm
Liens utiles

2. Design

  http://www.yesko.com/web-design-process.htm
  http://www.lukew.com/
  http://infosthetics.com/
Liens utiles

3. Ressources web

     http://mashable.com/2007/09/08/5000-resources-to-
     Flash: BIT-101 et levitated
     Javascript : script.aculo.us/ et GWT

Contenu connexe

Tendances

Project Management Introduction (4/5) for Gobelins students
Project Management Introduction (4/5) for Gobelins studentsProject Management Introduction (4/5) for Gobelins students
Project Management Introduction (4/5) for Gobelins students
Eric DI POL
 
Vers la gestion de projet 2.0
Vers la gestion de projet 2.0Vers la gestion de projet 2.0
Vers la gestion de projet 2.0
Hamid Nach
 
Gestion de projet sept 2016
Gestion de projet sept 2016Gestion de projet sept 2016
Gestion de projet sept 2016
Jean-Louis Gueroult
 
Conduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & OutilsConduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & Outils
stephanie vincent
 
Les clés pour conduire un projet en entreprise
Les clés pour conduire un projet en entrepriseLes clés pour conduire un projet en entreprise
Les clés pour conduire un projet en entreprise
Echecs & Stratégie
 
Project Management Introduction (3/5) for Gobelins students
Project Management Introduction (3/5) for Gobelins studentsProject Management Introduction (3/5) for Gobelins students
Project Management Introduction (3/5) for Gobelins students
Eric DI POL
 
Lexique du management de projet
Lexique du management de projetLexique du management de projet
Lexique du management de projet
Michel Estève
 
Formation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe DornbuschFormation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe Dornbusch
Echecs et Stratégie
 
Gestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatiqueGestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatique
Jihed Kaouech
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
Echecs et Stratégie
 
Projet outils basiques
Projet outils basiquesProjet outils basiques
Projet outils basiques
Rémi Bachelet
 
La gestion de projet internet en 10 slides (+bonus)
La gestion de projet internet en 10 slides (+bonus)La gestion de projet internet en 10 slides (+bonus)
La gestion de projet internet en 10 slides (+bonus)
Grégory Raby
 
Initiation à la gestion de projet
Initiation à la gestion de projetInitiation à la gestion de projet
Initiation à la gestion de projet
mahassine_med_amine
 
Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)
Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)
Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)
Clément OUDOT
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
Echecs et Stratégie
 
La Conduite de projet
La Conduite de projetLa Conduite de projet
La Conduite de projet
Echecs & Stratégie
 
2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus
2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus
2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus
PMI Lévis-Québec
 
Gestion de projet web
Gestion de projet webGestion de projet web
Gestion de projet web
Olivier Dommange
 
Méthodologie de projet présentation 2
Méthodologie de projet présentation 2Méthodologie de projet présentation 2
Méthodologie de projet présentation 2
Gilles Ducloux
 
Management de Projet International
Management de Projet InternationalManagement de Projet International
Management de Projet International
Riana Andrieux
 

Tendances (20)

Project Management Introduction (4/5) for Gobelins students
Project Management Introduction (4/5) for Gobelins studentsProject Management Introduction (4/5) for Gobelins students
Project Management Introduction (4/5) for Gobelins students
 
Vers la gestion de projet 2.0
Vers la gestion de projet 2.0Vers la gestion de projet 2.0
Vers la gestion de projet 2.0
 
Gestion de projet sept 2016
Gestion de projet sept 2016Gestion de projet sept 2016
Gestion de projet sept 2016
 
Conduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & OutilsConduite de projets Web, pilotage & Outils
Conduite de projets Web, pilotage & Outils
 
Les clés pour conduire un projet en entreprise
Les clés pour conduire un projet en entrepriseLes clés pour conduire un projet en entreprise
Les clés pour conduire un projet en entreprise
 
Project Management Introduction (3/5) for Gobelins students
Project Management Introduction (3/5) for Gobelins studentsProject Management Introduction (3/5) for Gobelins students
Project Management Introduction (3/5) for Gobelins students
 
Lexique du management de projet
Lexique du management de projetLexique du management de projet
Lexique du management de projet
 
Formation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe DornbuschFormation conduite de projet - Philippe Dornbusch
Formation conduite de projet - Philippe Dornbusch
 
Gestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatiqueGestion et Suivi des Projets informatique
Gestion et Suivi des Projets informatique
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
Projet outils basiques
Projet outils basiquesProjet outils basiques
Projet outils basiques
 
La gestion de projet internet en 10 slides (+bonus)
La gestion de projet internet en 10 slides (+bonus)La gestion de projet internet en 10 slides (+bonus)
La gestion de projet internet en 10 slides (+bonus)
 
Initiation à la gestion de projet
Initiation à la gestion de projetInitiation à la gestion de projet
Initiation à la gestion de projet
 
Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)
Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)
Évaluer un projet informatique (Challenge Entreprendre Telecom 2010)
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
La Conduite de projet
La Conduite de projetLa Conduite de projet
La Conduite de projet
 
2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus
2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus
2015-04-29 Patrick Vallerand Succès en gestion de projet - Cas vécus
 
Gestion de projet web
Gestion de projet webGestion de projet web
Gestion de projet web
 
Méthodologie de projet présentation 2
Méthodologie de projet présentation 2Méthodologie de projet présentation 2
Méthodologie de projet présentation 2
 
Management de Projet International
Management de Projet InternationalManagement de Projet International
Management de Projet International
 

En vedette

Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
Aurelien Gaucherand
 
Manager par projets
Manager par projetsManager par projets
Manager par projets
Pascal Ponty
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
Olivier Dommange
 
Initiation à la gestion de projet
Initiation à la gestion de projetInitiation à la gestion de projet
Initiation à la gestion de projet
Samer EL SAWDA, Ph.D.
 
Fondamentaux de la gestion de projet (cours 2)
Fondamentaux de la gestion de projet (cours 2)Fondamentaux de la gestion de projet (cours 2)
Fondamentaux de la gestion de projet (cours 2)
Françoise Gouzi
 
Conduite et gestion de projet
Conduite et gestion de projetConduite et gestion de projet
Conduite et gestion de projet
JCI Ariana
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
Pascal Thery Formations
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
Rachid Lajouad
 

En vedette (8)

Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
Manager par projets
Manager par projetsManager par projets
Manager par projets
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
Initiation à la gestion de projet
Initiation à la gestion de projetInitiation à la gestion de projet
Initiation à la gestion de projet
 
Fondamentaux de la gestion de projet (cours 2)
Fondamentaux de la gestion de projet (cours 2)Fondamentaux de la gestion de projet (cours 2)
Fondamentaux de la gestion de projet (cours 2)
 
Conduite et gestion de projet
Conduite et gestion de projetConduite et gestion de projet
Conduite et gestion de projet
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 
Gestion de projet
Gestion de projetGestion de projet
Gestion de projet
 

Similaire à Introduction à la gestion de projet

introduction à la gestion de projet
introduction à la gestion de projetintroduction à la gestion de projet
introduction à la gestion de projet
laureno
 
Comment évaluer la qualité d'un site web selon les techniques d'intégration w...
Comment évaluer la qualité d'un site web selon les techniques d'intégration w...Comment évaluer la qualité d'un site web selon les techniques d'intégration w...
Comment évaluer la qualité d'un site web selon les techniques d'intégration w...
Renoir Boulanger
 
conception de site web : introduction à l'analyse fonctionnelle
conception de site web : introduction à l'analyse fonctionnelleconception de site web : introduction à l'analyse fonctionnelle
conception de site web : introduction à l'analyse fonctionnelle
laureno
 
Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013
Julien LE THUAUT
 
Développement d'interfaces web
Développement d'interfaces webDéveloppement d'interfaces web
Développement d'interfaces web
David Desrousseaux
 
Plasticité2015 technovf
Plasticité2015 technovfPlasticité2015 technovf
Plasticité2015 technovf
Atelier IHM Polytech Nice Sophia
 
Desig formation-design-web-avec-photoshop-et-illustrator
Desig formation-design-web-avec-photoshop-et-illustratorDesig formation-design-web-avec-photoshop-et-illustrator
Desig formation-design-web-avec-photoshop-et-illustrator
CERTyou Formation
 
Webdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsWebdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outils
Olivier Dommange
 
WONC DOVA
WONC DOVAWONC DOVA
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
Khaled Djebloun
 
Les étapes de création d'un site web
Les étapes de création d'un site webLes étapes de création d'un site web
Les étapes de création d'un site web
Chris Gaillard
 
Développement Web
Développement WebDéveloppement Web
Développement Web
mastertic
 
La recette graphique
La recette graphiqueLa recette graphique
La recette graphique
Idean France
 
Web { Design Project } Management
Web { Design Project } ManagementWeb { Design Project } Management
Web { Design Project } Management
David Roessli
 
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Mohammed JAITI
 
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Idean France
 
Développement Web
Développement WebDéveloppement Web
Développement Web
mastertic
 
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Médiathèque de Roubaix - La Grand-Plage
 
Atelier initiation au html5
Atelier initiation au html5Atelier initiation au html5
Atelier initiation au html5
Les-Tilleuls.coop
 

Similaire à Introduction à la gestion de projet (20)

introduction à la gestion de projet
introduction à la gestion de projetintroduction à la gestion de projet
introduction à la gestion de projet
 
Comment évaluer la qualité d'un site web selon les techniques d'intégration w...
Comment évaluer la qualité d'un site web selon les techniques d'intégration w...Comment évaluer la qualité d'un site web selon les techniques d'intégration w...
Comment évaluer la qualité d'un site web selon les techniques d'intégration w...
 
conception de site web : introduction à l'analyse fonctionnelle
conception de site web : introduction à l'analyse fonctionnelleconception de site web : introduction à l'analyse fonctionnelle
conception de site web : introduction à l'analyse fonctionnelle
 
Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013Responsive Web Design - BreizhCamp 2013
Responsive Web Design - BreizhCamp 2013
 
Développement d'interfaces web
Développement d'interfaces webDéveloppement d'interfaces web
Développement d'interfaces web
 
Plasticité2015 technovf
Plasticité2015 technovfPlasticité2015 technovf
Plasticité2015 technovf
 
Desig formation-design-web-avec-photoshop-et-illustrator
Desig formation-design-web-avec-photoshop-et-illustratorDesig formation-design-web-avec-photoshop-et-illustrator
Desig formation-design-web-avec-photoshop-et-illustrator
 
Webdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsWebdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outils
 
WONC DOVA
WONC DOVAWONC DOVA
WONC DOVA
 
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
 
Les étapes de création d'un site web
Les étapes de création d'un site webLes étapes de création d'un site web
Les étapes de création d'un site web
 
Développement Web
Développement WebDéveloppement Web
Développement Web
 
La recette graphique
La recette graphiqueLa recette graphique
La recette graphique
 
Web { Design Project } Management
Web { Design Project } ManagementWeb { Design Project } Management
Web { Design Project } Management
 
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
 
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
Sketch pour les designers : pourquoi, quand et comment l'utiliser ?
 
Siteweb Mini
Siteweb MiniSiteweb Mini
Siteweb Mini
 
Développement Web
Développement WebDéveloppement Web
Développement Web
 
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
Créer un site web ? Méthode illustrée par la médiathèque de Roubaix - PARTIE 1
 
Atelier initiation au html5
Atelier initiation au html5Atelier initiation au html5
Atelier initiation au html5
 

Plus de laureno

Vers une approche praxéologique du design
Vers une approche praxéologique du designVers une approche praxéologique du design
Vers une approche praxéologique du design
laureno
 
La recherche en design
La recherche en designLa recherche en design
La recherche en design
laureno
 
Dynamique des complexes médiatiques et design d'interfaces
Dynamique des complexes médiatiques et design d'interfacesDynamique des complexes médiatiques et design d'interfaces
Dynamique des complexes médiatiques et design d'interfaces
laureno
 
Cartographie de l'information
Cartographie de l'informationCartographie de l'information
Cartographie de l'information
laureno
 
Web et communication
Web et communicationWeb et communication
Web et communication
laureno
 
Du concept board aux pistes graphiques
Du concept board aux pistes graphiquesDu concept board aux pistes graphiques
Du concept board aux pistes graphiques
laureno
 
Ecrire un mémoire - master hypermédia
Ecrire un mémoire - master hypermédiaEcrire un mémoire - master hypermédia
Ecrire un mémoire - master hypermédia
laureno
 

Plus de laureno (7)

Vers une approche praxéologique du design
Vers une approche praxéologique du designVers une approche praxéologique du design
Vers une approche praxéologique du design
 
La recherche en design
La recherche en designLa recherche en design
La recherche en design
 
Dynamique des complexes médiatiques et design d'interfaces
Dynamique des complexes médiatiques et design d'interfacesDynamique des complexes médiatiques et design d'interfaces
Dynamique des complexes médiatiques et design d'interfaces
 
Cartographie de l'information
Cartographie de l'informationCartographie de l'information
Cartographie de l'information
 
Web et communication
Web et communicationWeb et communication
Web et communication
 
Du concept board aux pistes graphiques
Du concept board aux pistes graphiquesDu concept board aux pistes graphiques
Du concept board aux pistes graphiques
 
Ecrire un mémoire - master hypermédia
Ecrire un mémoire - master hypermédiaEcrire un mémoire - master hypermédia
Ecrire un mémoire - master hypermédia
 

Introduction à la gestion de projet

  • 2. Planning semaine  Lundi : outils gestion, édito  Mardi : dev/design  Mercredi : bilan par équipe  Jeudi: analyse technique, point com  Vendredi : projet client, point mémoire
  • 3. « Méthodes agiles » Penser « itératif / incrémental »  Avoir une vision de la direction globale du projet  Mais penser en terme de mini-projets (V0, V1, V2....) => fixer des priorités dans la réalisation => concevoir chaque version en fonction des adaptations futures
  • 4. « Méthodes agiles » Le principe du développement itératif consiste à découper le projet en plusieurs étapes d’une durée de quelques semaines ; ce sont les itérations. Au cours d’une itération, une version minimale du produit attendu est développée puis soumise, dans sa version intermédiaire, au client pour validation. Véronique Messager Rota « Gestion de projet – Vers les méthodes agiles »
  • 5. « Méthodes agiles » Chaque itération est un mini-projet en soi qui comporte toutes les activités de développement, menées en parallèle : analyse, conception, codage et test, sans oublier les activités de gestion de projet. Véronique Messager Rota « Gestion de projet – Vers les méthodes agiles »
  • 6. Fixer la direction globale du projet Définition DT de votre projet 0  Quel est votre objectif ?  Quel type de site/DVD/etc. (« vitrine », communautaire, ludique, institutionnel, etc...)  En quoi votre projet est-il intéressant ? Original ?  Public cible : profil général Types de site, objectifs, caractéristiques
  • 7. Fixer la direction globale du projet Planning, répartition, centralisation  Des tâches réparties entre différentes personnes ressources  Mais un espace de travail commun  Outils : serveur/FTP, FilXoom, Yahoo Briefcase, ...
  • 8. Fixer la direction globale du projet Réaliser un benchmark (puis veille continue...)  Sites concurrents (même sujet, même domaine)  Analyse détaillée des 3 ou 4 sites (organisation du contenu, fonctionnalités proposées / non-proposées)  Liste de tous les sites visités (del.icio.us)
  • 9. Fixer la direction globale du projet Réaliser un benchmark (puis veille continue...)  Sites de référence (graphisme, navigation), composants originaux/adaptables  Alimenter votre boîte à idées  Constituer une bibliothèque de composants  Penser à la réutilisation de contenus (flux RSS, API...)
  • 10. Fixer la direction globale du projet Personae et scénario d'usage (« use case »)  Qualifier des comportements utilisateurs  Mieux cerner leurs attentes => pour proposer des interfaces adaptées Personas / personae
  • 11. Fixer la direction globale du projet (Re) Définir la ligne éditoriale (DT1)  Les objectifs et l'intérêt du site  Le ton et l'ambiance  Le calibrage des pages  Les thèmes traités et les rubriques proposées  Les fonctionnalités proposées (dans quel but ?)
  • 12. Fixer la direction globale du site Définir les bases du dev /design  dev/design : création graphique interactive, collaboration entre designer et développeur  Concept board > pistes graphiques > charte
  • 13. Fixer la direction globale du site Définir les bases du dev /design  Concept board > pistes graphiques > charte « mise en forme » du ton et de l'ambiance du site définis dans la ligne éditoriale (« collages », « associations graphiques ») prise en compte de l'aspect dynamique, interactif Example détaillé 1 (ligne édito > concept) Example 2. quot;collagesquot;
  • 14. Fixer la direction globale du site Définir les bases du dev /design  Concept board > pistes graphiques > charte propositions d'une home page, de templates de page avec un système de navigation, + définition de composants interactifs) example page d'accueil
  • 15. Fixer la direction globale du site Définir les bases du dev /design  Concept board > pistes graphiques > charte templates définitifs, iconographie/logotype et définition du style pour chaque élément (titre, sous- titre, encarts, footer, etc...) Exemples de templates Exemple de charte graphique (sans la partie template) Exemple de logotypes
  • 16. Fixer la direction globale du site Analyse fonctionnelle générale  Définir l'arborescence générale du site (« blueprint ») - navigation top-down + liens transversaux entre les pages - utiliser une signalétique : renvoie vers une page ou simple noeud d'arborescence ? Page dynamique ou statique ? Exemple d'arborescence (mais sans signalétique...) Mindomo: un outil pour réflechir sur l'arbo avant finalisation
  • 17. Fixer la direction globale du site Analyse fonctionnelle générale  workflow et wireframe (chemin de fer) - pour chaque page : quels répères (exple:breadcrumbs ) donne-t- on à l'utilisateur ? Quelles possibilités de directions ? - y-a-t-il des composants transversaux (footer, crédits, news, etc.) ? Quels modules doivent-être scénarisés (=> storyboard) - enrichissement progressifs des wireframes Schéma navigation utilisateur 1 et 2 Exemple de wireframe Design patterns (schéma de conception)
  • 18. Fixer la direction globale du site Analyse technique  Définir les contraintes techniques => tout public ? référencement ? écran tél portable ?  Spécifier les formats de données, l'encodage, la portabilité, l'hébergement...
  • 19. Fixer la direction globale du site Analyse technique  Définir l'arborescence pour les fichiers => quelle convention de nommage pour les dossiers, les images...?  Définir la plateforme de développement et les « briques » utilisées
  • 20. Fixer la direction globale du site Penser com et conception  Le bouche à oreille version web, comment ça marche ?  Organiser la com « hors web »
  • 21. Fixer les étapes de développement Développement d'une V1  Planifier le développement des premiers modules du site Développement d'une V2 AceProject Gantt project Basecamp
  • 22. En pensant au tâches transversales Recherche documentaire / création contenu  Rassembler les sources d'information  Rédiger/structurer le contenu  Créer une banque d'images / vidéos (Source ? Légende ? Copyright ? etc...)
  • 23. En pensant au tâches transversales Rédaction du mémoire  Conserver tous les docs pour montrer l'évolution de votre projet  Réfléchir à une adaption de la charte graphique version print  etc...
  • 24. Liens utiles 1. Gestion de projet Livre : Conduite de projet web - S. Bordage http://universite.online.fr/supports/projet/pdf.htm http://fr.selfhtml.org/projet/index.htm
  • 25. Liens utiles 2. Design http://www.yesko.com/web-design-process.htm http://www.lukew.com/ http://infosthetics.com/
  • 26. Liens utiles 3. Ressources web  http://mashable.com/2007/09/08/5000-resources-to-  Flash: BIT-101 et levitated  Javascript : script.aculo.us/ et GWT