Projet tuteuré 2ème Année - Octobre 2007

Les tâches du Site Projet tuteuré en collaboration avec l’école du Quai et le Département SRC de l’IUT de Mulhouse

Phase 0 : le thème

1. Constituer une équipe 2. Argumenter l’utilité du projet et choisir un thème à l’agence

Phase 1 : positionner le projet vis-à-vis de la concurrence

3. Fixer des objectifs au projet 4. Analyser les produits concurrents

Phase 2 : définir le projet et comprendre les attentes du public

5. L'étude du public visé et de ses attentes 6. Les réponses possibles aux besoins identifiés du public 7. Les tendances et philosophie du projet, ainsi que la description du contexte dans

lequel se monte le projet 8. La ligne éditoriale

Phase 3 : concevoir le projet et produire le contenu

9. L’ergonomie / L’arborescence 10. La préparation et l’adaptation des documents (textes, photographies, illustrations) 11. La structuration des contenus : indexation et classification 12. La rédaction du synopsis 13. Les recherches sur le graphisme 14. La rédaction du scénario 15. La réalisation de maquettes sous forme d'écran ou de story-board

Phase 4 : rédiger les cahiers des charges

16. Le cahier des charges fonctionnelles 17. Le cahier des charges techniques 18. Le cahier des charges graphiques (ou charte graphique)

Phase 5 : établir un budget

19. Établir un budget

Phase 6 : réaliser le produit

20. La réalisation d’une première maquette 21. Les corrections et déclinaisons de la maquette

Phase 7 : valider du produit

22. Formation du comité de relecture et de validation 23. Les dernières corrections et validation finale 24. Les formalités administratives de clôture de projet

Projet tuteuré 2ème Année - Octobre 2007

Définition des tâches du Site Projet tuteuré en collaboration avec l’école du Quai et le Département SRC de l’IUT de Mulhouse

La ligne éditoriale

-- Rédaction d’un guide de styles -- Quel est le niveau du public ? -- Définition des contenus adoptés -- Fréquence des mises à jour

La préparation et l’adaptation des documents

C'est une phase essentielle, dont dépend largement la qualité du contenu du site. Il va de soi que l'origine de toute information doit être connu, contrôlée est clairement indiquée dans le site lui-même. Si vous reproduisez un texte, celui-ci devra être passé entre guillemets et suivis du nom de l'auteur, du titre,... Si vous dépassez le volume d'une citation, vous devez obtenir des ayants droits une autorisation de reproduction. Idem pour l'utilisation de toute image.

La rédaction du synopsis À divers stades de la conception et de la réalisation du projet, le besoin peut en effet se faire sentir d'un texte à la fois synthétique et publicitaire, proposant une page maximum une description agréable convaincante du site. C'est le texte que vous fournirez dès que vous aurez besoin de présenter rapidement le site, et des occasions ne manqueront pas : recherche de financements, négociations de droits d'usage ou de reproduction, autorisations diverses, .... Le synopsis consistera donc entre un texte court et soigneusement rédigé, dont le style sera adapté aux produits (technique, culturelle, humoristique,...). Il devra donner une idée précise de l'ensemble du projet : titrés nature du projet, public visé, contenue et structure, point fort…

La rédaction du scénario Idéalement il s'agit de décrire l'application écran par écran, pixel par pixel. Tout devrait être nommé et décrit de telle façon qu'une équipe de puisse créer l'application sans autre explication aux informations. Heureusement, le nombre d'informations sont souvent valables pour plusieurs pages successives et n'ont donc pas à être répété systématiquement. Un scénario, c'est tout d'abord une structure. La première tâche consiste donc à établir une cartographie de ses structures, c'est-à-dire l'arborescence du site.

Le cahier des charges fonctionnelles Le cahier des charges fonctionnelles a pour base le cahier des charges.

-- le projet général du site et son message principal -- les objectifs généraux -- l’audience cible (un ou plusieurs publics, un ou des discours) -- les fonctions attendues du site et l’effet recherché sur l’utilisateur (fonction

promotionnelle, éducative, de valorisation d’un contenu...) -- les stratégies choisies pour véhiculer son discours -- la forme du site (statique ou dynamique) + description du type de site envisagé -- la description de la ligne éditoriale (discours de vulgarisation, d’expert, ludique,

interactif, personnalisé...)

Projet tuteuré 2ème Année - Octobre 2007

-- la forme et la présentation des documents remis (numérisés ou non adaptés au support Web ou non)

-- une langue ou plusieurs langues -- le planning de réalisation (différentes phases de réalisation ?) -- les critères de sélection + présentation du devis par ligne budgétaire -- l’accessibilité aux personnes malvoyantes

Le cahier des charges techniques

La forme du site : statique ou dynamique -- l’arborescence & le schéma de navigation (Visite guidée, libre ou assistée) -- Evolution possible de l’architecture -- une description littéraire des rubriques du site -- une description des scénarios envisagés -- une liste exhaustive des outils de dialogue : newsletter, formulaire de contact, zone

d’administration, forum de discussion

Les propositions techniques appropriées au projet et au budget (réalisation du site, hébergement...) et au public visé (taille des pages, plug-in accepté...) + suggestions de sites :

-- les options choisies (formulaire de contact, fonctionnalité d’impression avancée...) -- préparation des pages pour le référencement -- préparation des pages pour obtenir des statistiques plus précises -- la vie du projet : mise en ligne, hébergement, modes de fonctionnement, mises à

jour, gestion des statistiques (facultatif), référencement (facultatif). -- Faciliter les mises à jour grâce à une zone d’administration -- Sans logiciel particulier, de n’importe quelle plate-forme, plusieurs personnes

peuvent effectuer des mises à jour sur le site (sans formation). -- L’accès est sécurisé par un mot de passe.

Le cahier des charges graphiques (ou charte graphique) La création de la charte graphique dans son ensemble est prise en charge par le quai (étudiants et professeurs). C'est à vous de procéder à la définition de l'identité graphique du site. Notre réflexion intégrera bien sur les contraintes liées au message et au contenu, au public visé,... Dans l'achat de graphiques, on y retrouve les crayonnés, un nuancier le plus précis possible, le gabarit c'est-à-dire la structure qui définit les différentes zones de l'écran, la typographie employée et toutes ses caractéristiques (taille, inter lettrage, couleur, …),… Vous devez argumenter ses choix relativement à l'identité graphique et au contenu de l'application, ainsi qu'au contraint de lisibilité et de reproduction. Enfin vous devez aussi concevoir, d'écrire et créer les outils de navigation et de repérage.

À prendre en compte : -- des travaux réalisés doivent être conçus de manière à pouvoir évoluer et être

modifié aisément. -- en ce qui concerne un tracé vectoriel, une utilisation rationnelle des techniques

de réalisation de tracé doit être envisagée. -- être attentif aux caractéristiques des images utilisées (résolution, dimension). -- faire des différentes corrections coloris métriques. -- tous les fichiers de étudier la réalisation finale doivent être conservés dans leur

format natif.

Projet tuteuré 2ème Année - Octobre 2007

La réalisation d’une première maquette / intégration

L’intégration comprend plusieurs parties, comme la 3D, la vidéo ou encore la création de la bande son.

BDD / PHP : Des pages dynamiques (langage PHP) doivent être construites, ainsi qu'une base de données (S. G. B. D. MySQL). Il faut présenter : -- un modèle logique de données relationnelles de la base de données -- la construction de la base de données -- la construction des pages statiques et dynamiques : page index, former leur

interrogation de nos scripts PHP de traitement des formulaires, scripts d'affichage des requêtes SQL, utilisation de fonction pour générer automatiquement les en-têtes et pieds de page, intégration des éléments multimédias

Intégration-flash :

Il faut construire des pages Web dynamiques et intégrées des ressources sonores, vidéo, 3D et des animations multimédias. Il faut : -- évaluer la configuration et les contraintes matérielles et logicielles côté serveur et

côté client. -- fixer les technologies utilisées pour tous les éléments du site. -- concevoir et consorts là où les feuilles de style CSS. -- développer les scénarios de toutes les animations multimédias et les réaliser. -- développer les scripts. -- assurer l'intégration des éléments multimédias.

Référencement : Une stratégie de référencement efficace doit pouvoir être présentée.

Projet tuteuré 2ème Année - Octobre 2007

Affectation des tâches - site Projet tuteuré en collaboration avec l’école du Quai et le Département SRC de l’IUT de Mulhouse

N° tâche Secteurs concernés Tâche

1 VIGE Constituer une équipe 2 VIGE Argumenter l’utilité du projet et choisir un thème à l’agence 3 VIGE Fixer des objectifs au projet 4 VIGE Analyser les produits concurrents 5 VIGE L'étude du public visé et de ses attentes 6 VIGE Les réponses possibles aux besoins identifiés du public

7 VIGE Les tendances et philosophie du projet, ainsi que la description du contexte dans lequel se monte le projet

8 E La ligne éditoriale 9 IGE L’ergonomie / L’arborescence

10 E La préparation et l’adaptation des documents (textes, photographies, illustrations)

11 E La structuration des contenus : indexation et classification 12 G La rédaction du synopsis 13 V Les recherches sur le graphisme 14 IG La rédaction du scénario 15 V La réalisation de maquettes sous forme d'écran ou de story-board 16 GE Le cahier des charges fonctionnelles 17 I Le cahier des charges techniques 18 V Le cahier des charges graphiques (ou charte graphique) 19 G Établir un budget 20 I La réalisation d’une première maquette 21 IG Les corrections et déclinaisons de la maquette 22 VIGE Formation du comité de relecture et de validation 23 VIGE Les dernières corrections et validation finale 24 G Les formalités administratives de clôture de projet

Les codes secteurs

V Secteur Visuel I Secteur Interaction G Secteur Gestion E Secteur Editorial

Projet tuteuré 2ème Année - Octobre 2007

Echéances des tâches - site Projet tuteuré en collaboration avec l’école du Quai et le Département SRC de l’IUT de Mulhouse

Les codes secteurs

V Secteur Visuel I Secteur Interaction G Secteur Gestion E Secteur Editorial

Secteur Visuel

Temps nécessaires Tâche

Les recherches sur le graphisme La réalisation de maquettes sous forme d'écran ou de story-board Le cahier des charges graphiques (ou charte graphique)

Secteur Editorial

Temps nécessaires Tâche

La ligne éditoriale L’ergonomie (avec G et I)

La préparation et l’adaptation des documents (textes, photographies, illustrations)

La structuration des contenus : indexation et classification Le cahier des charges fonctionnelles (avec G)

Secteur Intégration

Temps nécessaires Tâche

L’ergonomie / L’arborescence (avec G et E) La rédaction du scénario (avec G) Le cahier des charges techniques La réalisation d’une première maquette Les corrections et déclinaisons de la maquette (avec G)

Secteur Gestion

Temps nécessaires Tâche

L’ergonomie (avec I et E) La rédaction du synopsis La rédaction du scénario (avec I) Le cahier des charges fonctionnelles Établir un budget Les corrections et déclinaisons de la maquette (avec I) Les formalités administratives de clôture de projet