Méthodologie de création de site web, étape 2 : Le story-board

Publié le 13 juin 2008 par Customize.fr
La réalisation d’un site web est comparable avec la réalisation d’un film. On élabore un scenario et on le découpe plan par plan. Ce découpage est un story-board.
Ce document technique vous sera très utile pour structurer votre site, définir les liens entre chaque page, planifier le déroulement des actions et leurs conséquences et surtout de ne rien oublier !
Prenons l’exemple de mon site web consacré à la customisation. Même si ma boutique n’est pas encore en ligne, tout a été déjà prévu dans le story-board, minutieusement détaillé avec la plus grande exactitude possible.
Dans le premier temps la structure du site peut être présentée comme cela :
1. Page d’accueil
2. Identification
3. Espace Perso
4. Boutique
5. Forum
6. Recherche
7. CGV
8. Contact
9. Fils RSS
10. Catalogues
Voici la structure plus détaillée (je ne vous donne pas la plus détaillée sinon cela sera trop long) :
  1. Page d’accueil

  2. Identification

    1. Création de compte
    2. Codes oubliés

  3. Espace Perso

    1. Mon profil
    2. Mes coordonnées
    3. Mes favoris
    4. Mes commandes

  4. Boutique

    1. Ecussons

      • Ecusson 2 roux pour toujours
      • Ecusson Pin-up
      • Ecusson Chat sauvage
      • ...

    2. Strass

      • Motif en strass Huit en flamme
      • Motif en strass Etoile de mer
      • Motif en strass Ying et Yang
      • ...

    3. Badges

      • Badge Robot cop
      • Badge Rose de vent
      • ...

  5. Forum « Monde des envies et des passions »

    1. Forum Envie de s’exprimer

      • Post-it Propositions de sujets de sondages
      • Sondage Articles de customisation
      • Sondage Comment avez-vous découvert customize.fr
      • ...

    2. Forum Passion de customiser

      • Discussion : La customisation bat le pavé
      • Discussion : Customisation de PC
      • Discussion : Sac customisé
      • ...

    3. Forum Passion de Beaux arts

      • Discussion : Quelques réalisations en perles de rocaille
      • Fleurs en bois en papier
      • Photo-portraits
      • ...

    4. Forum Envie de bien vivre

      • Post-it Place pour la Pub
      • Discussion : Imagination crée le monde
      • Discussion : Tests de Ouf
      • ...

  6. Recherche

  7. CGV

  8. Contact

  9. Fils RSS

    1. Fil RSS des Forums
    2. Fil RSS des nouveautés
    3. ...


Comme vous voyez j’ai vous ai détaillé tout ce qui est contenu dans les menus. Maintenant je prends mon stylo, plutôt ma souris en l’occurrence ;-) et je vous montre la suite.
Voici l’illustration de la mise en pratique d'un story-board celui réalisé pour mon site customize.fr (version légèrement simplifiée pour les besoins de ce billet). Cliquez sur cette image pour l'agrandir :

La suite au prochain message "Design : maquettage".