User Universal Navigation Language

User Universal Navigation Language Méthode de conception centrée utilisateur qualitative et industrielle GUIDE DE PRISE EN MAIN W16 Ce document résume les notions pratiques liées à l’application de la méthode 2UNL Ces éléments font office de légende pour la consultation des documents.Vous pouvez copier coller ces éléments graphiques dans les documents types du kit 2UNL sous Microsoft PowerPoint. User Universal Navigation Language | V03 | Modèle déposé – Gabarit sous License « Paternité - Pas de Modification » – Mention à conserver

SOMMAIRE DU GUIDE • LES PRINCIPES • UN MODE PROJET • LE KIT DE DOCUMENTS TYPES • UN VOCABULAIRE ET UNE SIGNALETIQUE • UN FONCTIONNEMENT • UNE BIBLIOTHÈQUE

1 • Optimiser et fluidifier la communication autour du projet • Qualifier les points de vue à l’oral et à l’écrit : • MACRO / MICRO / MARKETING / FONCTIONNEL / GRAPHIQUE / TECHNIQUE • 2UNL propose • un vocabulaire et une signalétique commun • un découpage projet compréhensible par l’ensemble des intervenants • des documents types permettant de recueillir les informations courantes UN LANGAGE VISUEL POUR COMMUNIQUER PLUS VITE

MARKETING CREATION TECHNIQUE LE CONCEPT BRIEF - EXPRESSION DE BESOIN - RECOMMANDATION - VALIDATION - RECETTE Fédérer des équipes qui ne parlent pas le même langage

2 • Anticiper et mesurer les efforts • Formaliser les inputs et Hiérarchiser les efforts pour favoriser le ROI : • La réussite et la performance du projet dépendent de la capacité à mesurer les enjeux et à placer les bons indicateurs • LE STRATÉGIQUE • LE CRITIQUE • LE CREATIF • LE GÉNÉRIQUE • LE LOCAL • LE SPÉCIFIQUE : ce qui est conçu et réalisé sur mesure PRÊT A RECEVOIR LES INPUTS DES DIFFERENTS METIERS

DES COMPETENCES COMPLEMENTAIRES Complémentarité CREATION MARKETING Compatibilité Optimisation TECHNIQUE Enrichir l’information brut

3 • Disposer des plans d’architecture pour optimiser et déployer la solution • Inventorier les éléments pour maitriser l’interface : • GABARITS / FONCTIONNALITÉS / PROCESSUS / MODULES • Le Front office devient très technique et les besoins de spécifications front sont grandissants. • Une mauvaise réalisation impacte fortement la qualité du projets, son ROI et l’image de marque de l’annonceur PRÊT A DIFFUSER LES CHARTES INTERACTIVES

MARKETINGclient MARKETINGPrestataire CREATIONClient CREATIONPrestataire Comité de pilotage TECHNIQUEclient TECHNIQUEPrestataire PLUG AND PLUG Interroger les spécialistes

4 • Standardiser les besognes et dégager du temps à VA • Les documents de conception évoluent et deviennent les spécifications : • Les documents du kit 2UNL sont conçus pour interagir entre eux et fédérer les différents points de vue. • Les modèles 2UNL permettent de reprendre un projet en toute simplicité grâce à la standardisation des symboles et du vocabulaire. PRÊT A DEPLOYER ET/OU EXTERNALISER LA PRODUCTION

UN SPECTRE PROJET VARIABLE MARKETING CREATION TECHNIQUE Répartir les efforts en fonction des objectifs

DECOUPAGE CLASSIQUE CONCEPTION CREATION PRODUCTION 1 2 3 ETAPES VOLUME

ETUDE CONSEIL PREPROD PROD D A B C C Connaître la marque et ses objectifs Nouvelle étape LE DECOUPAGE ANTICIPE CONCEPTION CREATION PRODUCTION 1 2 3 CULTURE DE MARQUE + TENDANCE= GAIN DE QUALITE PROTOTYPE DE TEST + CHARTE + SPECIFICATIONS= GAIN DE PRODUCTIVITE

ETUDE CONSEIL PREPROD PROD D A B C VOLUME DE NOUVEAUX BESOINS ETAPES AGENCE CONSEIL STUDIO SSII DE NOUVELLES COMPETENCES

DES ETAPES DE RELAIS ETUDE CONSEIL PREPROD PROD D A B C 1 2 Marketing > Dispositif 3 Utilisateurs > Interface Expérience > Spécification

ETUDE CONSEIL PREPROD ANIMATION E A B C STRATEGIE CONCEPTION ECRITURE CREATION MISE EN LIGNE SUIVI AUDIT ANALYSE PROD D ASSEMBLAGE PRODUCTION Tableau de bord et structure documentaire EN BREF ETAPES VIE DU PROJET PROTOTYPE LIVRABLES DE CONCEPTION, DE GESTION ET DE SPECIFICATIONS LA MEMOIREDU PROJET ET LA MESURE DE PERFORMANCE ?

1 2 3 4 AO BILANDES BESOINS - INTENTIONS RECOMMANDATION - CAHIER DESCHARGES CONCEPTIONDETAILLE - SPECIFICATIONS RECETTE - MISE EN LIGNE ENVELOPPE BUDGETAIRE ESTIMATIONBUDGETAIRE OPTIMISATION BUDGETAIRE NEGOCIATION BUDGETAIRE CADRAGE CYCLE PROJET VALABLE EN ANIMATION / AVANT VENTE / REFONTE RECO V02 LE MODE PROJET ETUDE CONSEIL PREPROD PROD ANIMATION D E A B C STRATEGIE CONCEPTION ECRITURE CREATION ASSEMBLAGE PRODUCTION MISE EN LIGNE SUIVI AUDIT ANALYSE

PROTOTYPE Recueilde données FOCUS GROUP TESTS TESTS TESTS OBJECTIFS AVENANT RECETTE CADRAGE V ALPHA V BETA V 01 Chaque test est défini par un protocole de l’équipe de conceptionmême si ils sont menés par un prestataire partenaire. Les résultats devront ensuite être traités en toute transparence pour définir les axes d’optimisations AXES D’OPTIMISATION STRAT + ERGO RECO V02 COMMENT FAIRE UNE ROLL’S ROYCE ? ETUDE CONSEIL PREPROD PROD ANIMATION STRATEGIE CONCEPTION ECRITURE CREATION ASSEMBLAGE PRODUCTION MISE EN LIGNE SUIVI AUDIT ANALYSE 1 2 3 3 DATAMINING

OBJECTIFS RECETTE BRIEF INTERNE Tableau de bord et structure documentaire LA STRUCTURE DOCUMENTAIRE ETUDE CONSEIL PREPROD PROD AUDIT ANALYSE STRATEGIE CONCEPTION ECRITURE CREATION ASSEMBLAGE PRODUCTION ETAPES 1 2 3 BRIEF CLIENT • SCÉNARII ET STORY-BOARD • ARBORESCENCE • CATALOGUE DE DÉCLINAISON • INVENTAIRE • CATALOGUE DE GABARITS • CAHIER FONCTIONNEL UTILISATEUR (CFU) • SPECS DÉTAILLÉES LIVRABLES

MODELES DOCUMENTS DE PRESENTATION DOCUMENTS DE SPECIFICATION DOCUMENTS DE SUIVI-GESTION Tableau de bord et structure documentaire V 02 LA MEMOIREDU PROJET LE PRINCIPE DE DOCUMENTATION ETUDE CONSEIL PREPROD PROD ANIMATION D E A B C DOCUMENTS DE CONCEPTION

Inventaires • (Éléments d’interface) • Arborescence • (contenus & diagramme) • Catalogue de gabarits • (spec + psd des gabarits) • Scénario & Story-board • (cf cibles et objectifs) • Cahier fonctionnel utilisateur (specs front) • Inventaires • (pages et contenus) • Catalogue de déclinaison • (un doc par espace) • Spécifications détaillées (fonc + tech) • Documents de gestion(Brief, compte rendu…) • En utilisant des extraits des documents types vous pouvez constituer rapidement vos documents de présentation et de validation. LE TABLEAU DE BORD LA STRUCTURE DOCUMENTAIRE DOCUMENTS DE CONCEPTION DOCUMENTS DE SPECIFICATION DOCUMENTS DE SUIVI/GESTION RECO DOCUMENTS DE PRESENTATION

GUIDE ET BIBLIOTHEQUE (vous consultez ce document) Les notions clés et la structure documentaire en mode projet La nomenclature, glossaire et légende, objets graphiques compatibles avec les modèles ARBORESCENCE Les espaces et les gabarits maitres (MACRO) Diagrammes fonctionnels des fonctions clé (MICRO = SPEC) SCENARIO ET STORY-BOARD Scénario de clic : SCN Zoning : ZNG Story-board détaillé ou maquette fonctionnelle : STB LE KIT NIVEAU 1 DOCUMENTS DE SUIVI/GESTION DOCUMENTS DE CONCEPTION DOCUMENTS DE SPECIFICATION CATALOGUE • De gabarits : CAT GAB • De déclinaison (en mode zoning) des espaces : CAT DECLI INVENTAIRE • De gabarits • De fonctionnalités, process et uses cases • Des pages et contenus (Arbo détaillée) CAHIER FONCTIONNEL UTILISATEUR(CFU : spécifications front) • Définition des fonctionnalités génériques • Définition des modules (navigation dans une même page) • Définition des process et use cases (transactionnel) > > > > > SPECIFICATIONS • Spécifications fonctionnelles détaillées • Spécifications techniques BRIEF, SUIVI ET REPORTING • Brief adapté au projet • Compte rendu de réunion • Flash report • Les documents 2UNL sont au format Microsoft Office, au format écran A4 ou A3.Il est bon de préciser que les fonctions avancées de Office (animations et transparence) posent des problèmes de compatibilité avec la suite Open Office

A PROPOS DU SCÉNARIO : Concept, déroulement Trois modes 1 2 3 Le scénario permet de recueillir une intention marketing : parcours clientComme des inputs techniques incontournablesEn début de projet il convient de décider de scénarii qui seront un prétexte pour mettre en évidence les points forts (stratégiques) et à risque (critiques) du projet. S1 S1 G01-2 Scénario de zoning Scénario de clic Scénario de clic Scénario 1 CHERCHERSUR LE WEB REDIRECTION AVEC PARTENAIRE Etape Etape Etape Etape MODE SCENARIOpose les incontournables et définir les entrées MODE ZONINGorganise les contenus en zones qui répondent aux besoins des scenarii MODE STORY-BOARDmaquette fonctionnelle la plus précise possible pour validation des gabarits et scénario de clic CONCEPTRecueil de besoins et proposition macro STRUCTURERidentifier les contenus les grands modèles de page SIMULERmaquette fonctionnelle la plus précise possible pour validation des gabarits et scénario de clic • Utiliser le bon mode en fonction du type de projetle mode scénario est obligatoire en début de projet et peut faire parti du brief. L’intervention d’un DA à cette étape est nécessaire

LOGO MENU 01 01 02 01 MENU GENERAL (MG1) MENU N1 CŒUR DE PAGE 06 03 Catalogue de gabarit G02 G02 G02 G02 G02 G02 G02 Scénario de clic Scénario de clic Scénario de clic Nom du gabarit Nom du gabarit Nom du gabarit Nom du gabarit 03 01 FOOTER US STB ou ZNG STB ou ZNG STB ou ZNG Scénario de clic Scénario 1 GABARIT : G04 MODELE : B STB ou ZNG Catalogue de gabarits G02 SPECFONC SCENARIO 1 SCENARIO 1 Nom du gabarit 01 01 01 01 01 Etape Etape 01 01 Etape Etape Maquettes 01 SPECGRAF 01 A PROPOS DES CATALOGUESLorsque les principaux scénarii sont validés, les gabarits sont extraits dans le catalogue pour y être spécifiés.Les pages non identifiées et les déclinaisons feront l’objet de catalogues de déclinaisons et alimenteront le catalogue de gabarit SCENARIOespace 1 [AUTEUR] ------------------------------------------------- Ce document devient la navette de validation des écrans graphiques [CLIENT] ------------------------------------------------- ok S1 CATALOGUE DE GABARITS espace 1Le story-board issu du scénario se colle parfaitement dans le catalogue pour y être spécifié Le scenario permet de définir l’interface d’ un parcours utilisateur et d’identifier les gabarits. Copier-coller Les gabarits sont stockés dans le catalogue pour avoir une fiche technique. La maquette master du gabarit sert de témoin. • Format : Ecran • KIT : SCENARIO / STORY BOARD : SCN • EXISTE AUSSI EN VERTICAL • Format : A3 • KIT : CATALOGUE : CAT • EXISTE AUSSI EN VERTICAL A3 ou A4

Le zoning est une technique de représentation des espaces et de configuration de page : Des modules indépendants, des masters PSD, des masters html/CSS, des règles de gestion Header commun 03 01 04 01 05 02 GABARIT : G01 MODELE : A Nom usuel : SHP PRODUITS ZONE DE PUSH A PROPOS DU ZONING • De manière schématique : • le témoin, le référent dans les catalogues et les CFU • De manière appliquée : • dans les catalogues. Catalogue de gabarit G02 Scénario G02 Nom du gabarit Nom de la page Header commun MENU CATALOGUE 00 00 • Pour présenter les zones dans un scénario ou pour présenter les modèles dans un catalogue.

Le CFU résume le fonctionnement des éléments d’interface front que l’on retrouvent sous l’onglet « Fonctions » de l’inventaire. Permet de définir le fonctionnement des éléments avancés de l’interface. Cette description évolue en spécification fonctionnelle front. LOGO MENU 01 01 02 01 MENU GENERAL (MG1) MENU N1 CŒUR DE PAGE 06 03 03 01 FOOTER US GABARIT : G04 MODELE : B A PROPOS DU CAHIER FONCTIONNEL UTILISATEUR (CFU) G02 Cahier fonctionnel utilisateur Nom du gabarit SPECFONC • Les fonctionnalités : forment le sommaire des points à préciser dans les SPECIFICATIONS DETAILLES, elles peuvent provenir d’un cahier des charges (CDC) • Les modules : fonctionnalité transverse autonome, qui nécessite d’être conçue, inventoriée et spécifiée. • Les protocoles : process courant qui participe à la relation à la marque (identification, inscription, modifications espace perso…). Pour les protocoles, un CFU spécifique est envisageable incluant l’arborescence ainsi qu’un catalogue de décli. • Les Use Case • Interroger les spécialistes, graphistes, architectes, ergonome, flasheur, dev front pour concevoir et spécifier les modules et process. • Les catalogues font référence à des modules que l’on retrouve également dans les arborescences. • Les modules sont détaillés dans le CFU et non dans le catalogue. • Beaucoup de spécifications, il est envisageable de créer plusieurs CFU, un général et un pour les gros modules. 00 00 00 00

MENU FONCTIONNEL ( MF1) LOGO 01 01 02 01 MENU GENERAL (MG1) ESPACE 1 LHP 1 MENU N1 CŒUR DE PAGE 06 03 G03 Architecture 03 01 FOOTER US GABARIT : G04 MODELE : B Teck. Fig. 01 : Exemple d’annotation et de signalétique 2UNL Rubrique 1 G04-1 Concept A PROPOS DES ÉLÉMENTS D’INTERFACE… Un vocabulaire fonctionnel résultant de l’analyse des expériences vécues par l’internaute.Des symboles concepts qui représentent un cas de figure d’utilisation qu’il faut définir, du scénario, au simple artéfact d’interface (menu en flash), des processus (ou protocoles) de recueil de données (formulaire et autres éléments de relation client annonceur fonctionnels) jusqu’au module à déployer sur une galaxie de sites. FONCTIONNALITE GENERIQUE Qui répond à une fonction usuelle et/ou procédé de l’interface qui mérite d’être explicité (enjeux d’ergo et dev front ) MODULE AUTONOME Élément interactif autonome ou fonction transverse. Ensemble de fonctionnalités et de processus selon des scénarios spécifiques. PROTOCOLE TRANSACTIONNEL Tunnel de pages (processus, formulaires et configurateurs) dont la finalité est une fonctionnalité demandée par l’utilisateur (identification, inscription, téléchargement). C’est également une zone relationnel entre la marque, le système et l’utilisateur qui mérite un effort particulier en conception. PROCESSUS ou Fonction Invisible : décision et conditions Recueil de données ou fonctions invisibles pour l’utilisateur (conditions BDD, cas d’erreur… ) SCENARIO D’USAGE Concept ou cas d’utilisation comportemental, représentation d’une volonté : Les grandes étapes : synopsis graphique Détermine les grands axes de navigation et permet d’identifier les grandes entrées. USE CASE FONCTIONNEL Cas d’utilisation détaillé qui décrit une progression conditionnelle dans les contenus : Ce que subit l’utilisateur confronté aux bases de données et à la personnalisation des interfaces (redirection, cookies, droits d’accès, parcours spécifique, web 2). Schéma UML ou arborescence 2UNL focntionnelle 00 00 00 • MODELE :Grande famille de gabarits (Concept) défini par un Zoning • Se nomme A,B,C… ou en trigramme WOP • GABARIT :Configuration de page uniquese note :G04-1 B (modèle B) • TYPOLOGIE DE PAGE : • HP : Home page • LHP : Local Home Page : Home de grand espaces • SHP : Home de petits espaces • FPT : Fiche Produit Type • XXX : création de trigramme 00 01 02 SC 00 06 00

Trois onglets : GABARITS : permet d’inventorier les gabarits FONCTIONS : liste les fonctions, les modules et les protocoles CONTENUS : liste l’ensemble des pages et les fiches contenus associées A PROPOS DE L’INVENTAIRE Les références sont toujours visibles • Règles • Toujours laisser les listes déroulantes sur « tous » • La version de fichier est gérée par le Chef de Projet au moment des livraisons • Précis • Vous pouvez gérer les gabarits et les déclinaisons • Pour les gros sites • Dupliquer l’inventaireet de le trier par espacesoit avec plusieurs documents soit en utilisant les onglets. • Pour la recette • Renommer le document : Inventaire de Recette_W01 • Offre un maximum de visibilité et permet de mettre en évidence l’état d’avancement du projet. • Tous les intervenants peuvent le mettre à jour dès qu’une tâche est effectuée, • La cohérence de la nomenclature (nom des modules, gabarits etc) • Permet d’identifier les fichiers sources (Masters) • Des listes déroulantes vous permettent d’extraire des vues par Gabarits, lots ou encore état d’avancement… • La liste des fonctions devient la liste référentes pour les spécifications • Les listings d’inventaires s’importent dans Microsoft Project

CANAL + VOD Modèles B A Cœur de page CANAL + VOD MENU FOOTER ZONE CONTEXTUELLE MENU CŒUR DE PAGE FOOTER MODELE A • Gabarits Gabarit Maître CANAL + VOD LOGO MENU MENU MENU CŒUR DE PAGE MENU CONTEXTUEL MENU CŒUR DE PAGE PUSH G01-1 PUSH PUSH Sous MENU Déclinaison Variantes FOOTER FOOTER Gabarits Voisins LOGO LOGO MENU MENU MENU CŒUR DE PAGE STYLE 1 MENU CONTEXTUEL MENU CŒUR DE PAGE STYLE 2 MENU CONTEXTUEL PUSH PUSH G01-2 G01-3 G01-4 FOOTER FOOTER = 4 gabarits à chiffrer et à produire A PROPOS DES GABARITS… • Modèles de page • Principe de configuration de page permettant de les regrouper en familles : zoning de définition de l’interface Fig. 01 : Zoning de modèles de pages • Page type définie par : • Un gabarit html • + CSS+ règles de publication + règles d’interaction • Les dérivés de ces gabarits maîtres sont appelés gabarits voisins et doivent être identifiés en tant que gabarits uniques pour un maximum de précision dans les chiffrages et planning • Les variantes de style (un seul gabarit maître pour des univers couleurs et des intitulés variables) • Les déclinaisons de contenus ou de configurations (navigations et modules contextuels) Fig. 02 : Zoning de gabarits de pages

LOCAL HP LHP 1 G00-0 Rubrique 1SHP G00 Page dynamiqueSHP Page statiqueSHP G00 G00 Page multiples FPT FAQ X 4 FAQ X 4 Espace • Page 1 • Page 2 • Page 3 • Page 4 G08 G01 Pop-up ou calqueXXX G00 01 BIBLIOTHÈQUE D’ÉLÉMENTS DE SIGNALÉTIQUEun langage graphique commun qui accélère la compréhension des documents ScénariosUse cases et étapes CommentairesGestion de projet et annotations [BULLE D’ECHANGE] ------------------------------------------------- Commentaires et annotations Une couleur Agence et une couleur client Entrée dans un use case Fonction spécifique Disponible UC 00 [BULLE D’ECHANGE] ------------------------------------------------- Commentaires et annotations Une couleur Agence et une couleur client SCENARIO 01 01 En cours Priorités et lots Etape Etape Entrée dans un scénario Urgent Ponctuel Etape Validé Etape Etape ! Page critique Direction ou étape d’un scénario A valider OK KO NOK Sécurisé En attente 1 Ordre de lecture / Etapes A débugger Note : Intouchable Non prévu A corriger Animation flash URGENT Profil Cartographie et arborescencesEspaces, Pages et Navigation FonctionnalitésCes éléments sont détaillés dans le CFU Fonctionnalités à spécificier COmmentaire 02 02 Processus utilisateur 01 01 • Planètes • Soho • Cavalier • Athos • Boxford • Veau Foulonné • etc.. Commander maintenant Module autonome composé d’un ensemble de fonctionnalités et de processus 01 01 00 Décision et condition Commentaires et précisions 01 01 01 01 Sortie Stockage Les couleurs et les formes ont du sens et sont compatibles avec l’ensemble des documents Deux couleurs importantes Le vert = Fonctionnel, Le Orange = Marketing

Vous avez-dit collaboratif ? Définir un code projet Échanger avec le client et les membres de l’équipe sur les mêmes documents. Le client, le chef de projet et les membres de l’équipe annotent les docs pour y placer des commentaires/précisions/questions. Le graphiste applique les corrections et place un « ok » sur les bulles d’annotation, puis place directement le dernier JPG dans le doc. Les scénarios, CFU et catalogues deviennent des navettes d’échange avec le client via le FTP Les catalogues et CFU évoluent tout au long du projet et deviennent spécifications. Le chef de projet est responsable de la mise à jour des docs. Un fonctionnement • A propos des versions de fichier. • Chaque document insère automatiquement la date d’enregistrement en première page, il n’est pas utile de placer la date dans le nom du fichier. • Les versions de travail sont nommées W00, W01… • Les versions de validation sont renommées. W03_V01 et peuvent évoluer W04, W05, jusqu’à W06_V02… • A chaque modification : corriger sur la Première page et sur le(s) masque(s) des diapositives ce qui simplifie la gestion des impressions. • Sur le réseau • Toujours renommer les versions de doc • de travail en W01, W02,y placer vos initiales si besoin W08_ccv.ppt • Les livrables en V01, V02 • Lorsque vous travaillez sur un doc, en local ou à la maison il convient de le renommer avec __NOM__ eu début du nom de fichier pour que les membres de l’équipe ne le modifient pas en même temps (risque de scratch). • Attention : il est interdit de travailler sur un doc de la structure sans respecter la règle de nommage en cours, vous risquez de scratcher des fichiers. • Sur le FTP • 2 options possibles : • 1 - Les versions sur le FTP sont considérées comme publiées, elle ne comportent donc pas de numéro de version, et sont systématiquement écrasées (attention au versionning dans le doc et aux archives dans le dossier client • 2- fonctionnement identique au dossier client + dossier archives

A propos des réunions 2 réunions collectives par semaine valent mieux que 15 incomplètes. Différencier les réunions courantes de celles de pilotage mais aussi des ateliers. Organiser les livraisons internes le jeudi, client le vendredi et les réunion de suivi le mardi. Éviter les réunions client l’après midi et faire le débriefe et le CR en équipe tout de suite après la réunion. Prévoir des livraisons intermédiaires sous formes d’extraits et procéder à des livraisons de validation (renommer en V01, V02 à cette occasion). Demander au client sans relâche toute documentation graphique (charte logo, vidéo de spot…) et statistiques issue d’études ou d’enquêtes pour mieux comprendre la cible et les défauts du site existant et pour lui vendre des audits comme des chartes. A propos du chiffrage et des postes Impliquer les producteurs et les experts dans la conception avant le chiffrage, il vous aideront à mieux estimer les postes. Chiffrer des jours d’étude, de conception, de création, de réunions, de spécification et de dèv. back + front (ajax, flash, javascript). Bonnes pratiques en gestion de projet A propos des documents • Sensibiliser le client au fonctionnement des documents, instaurer une réunion de lancement si nécessaire. • L’arborescence minima est une arborescence de gabarits qui est nécessaire pour les spécifications, les numéros de gabarits doivent y être maintenus à jours. • Utiliser les documents à l’écran (catalogues et scénario) pour placer les commentaires de modifications «en live », faire une relecture pour action en fin de réunion, ainsi les comptes rendus de réunions se font en parti lors de la réunion sur le document, le compte rendu final liste essentiellement les actions et fait référence aux documents de la structure documentaire. • A partir du scénario, répertorier les gabarits et les fonctionnalités dans l’inventaire ( onglets gabarit et fonctions). • Réaliser le scénario en maquettes graphiques. • Une fois le scénario validé, reporter les gabarits dans le catalogue de gabarits pour les spécifier et faire réaliser le master PSD référent du gabarit. • Les scénarii sont des prétextes pour aborder les grandes pages et fonctionnalités du site, le reste des pages sera déclinée espace par espace directement dans les catalogue de déclinaison qui sont prévus pour y contenir des spécifications.

02 01 01 03 02 04 05 03 05 04 06 06 03 02 04 05 GABARIT : G02 MODELE : B Nom usuel : HP PRODUITS GABARIT : G01-2 MODELE : A Nom usuel : SHP PRODUITS MAISON GABARIT : G01-3 MODELE : A Nom usuel : PAGE TIME LINE PTL DES GABARITS EN MODE ZONING définir les modèles de page et les gabarits Header commun Header commun Header commun

LOGO LOGO MENU TRANS-OFFRES MENU TRANS-OFFRES FOOTER FOOTER DES GABARITS EN MODE ZONING définir les modèles de page et les gabarits LOGO MENU TRANS-OFFRES LOGO MENU GENERAL CŒUR DE PAGE AIDE THEMATIQUES FOOTER FOOTER GABARIT : G01-1 MODELE : A GABARIT : G02-1 MODELE : B GABARIT : G03-1 MODELE : C LOGO MENU TRANS-OFFRES LOGO MENU GENERAL THEMATIQUES Module AIDE ETAPES 01 CŒUR DE PAGE THEMATIQUES FOOTER FOOTER GABARIT : G03-2 MODELE : C GABARIT : G01-2 MODELE : A GABARIT : G02-2 MODELE : B

Liens en mode texte • direction • Lien • Lien • Lien • Lien Bouton Boutons Bouton Rubrique 1 • direction Rubrique 2 Rubrique 3 Bouton < > ok Bouton Rubrique 4 • Rubrique 5 • Lien • Lien • Lien • Lien Bouton Bouton 10 Valider Zone active Bouton Rubrique 6 Ok ! Ok 10 10 10 10 10 10 Rubrique 1 Rubrique 2 … BIBLIOTHÈQUE D’ÉLÉMENTS D’INTERFACE GRAPHIQUE

L’espace perso Onglet 2 Onglet 3 xxxxxxxx xxxxxxxxx xxxxxxxxxx xxxxxxxxx xxxxxxxxx Fil d’Ariane xx xx xxxxxxxxxxxxx BIBLIOTHÈQUE D’ÉLÉMENTS D’INTERFACE GRAPHIQUE Toutes vos attestations à disposition Quisque eget magna eu libero vehicula feugiat.consulter Zone de contenu Pré chargement en cours ZONE ZONE ZONE ACTIVE : MENU Affiner votre recherche dans cette rubrique uniquement dans les nouveautés uniquement Ok Recherche + d’options France uniquement Ok localité Trier par :site interneten savoir plusnotoriétéordre alpha 12 pages : <> 10 6 7 8 9 10 11 12 Réponses par page Ok

Avancement du questionnaire 100% 0% xxxxxxxx xxxxxxxxx xxxxxxxxxx xxxxxxxxx xxxxxxxxx DES MODÈLES BOITE A OUTILS Plan du site | Annuaire | Aide Rechercher Plus d’options - Objet de la recherche - intr@ccor uniquement tous les sites du groupe >> Message d’introduction à l’étape News • Cras viverra risus non libero. • Sed vel est ut justo fermentum vestibulum. • Sed gravida est in lectus. Quick alertes dossier de souscription et/ou PAC Outils pratiques Liste et numéto de vos devis Mes outils Nom du devis Modifier Supprimer Cette rubrique • Devis assurance auto n° xxxxxxxxxxxxxxxxxxxx • Devis assurance auto n° xxxxxxxxxxxxxxxxxxxx • Devis assurance santé n° xxxxxxxxxxxxxxxxxxxx • Devis assurance habitat n° xxxxxxxxxxxxxxxxxxxx Renault clio Renault clio 2 Santé 1 Principale Modifier Modifier Modifier Modifier • Fusce in nulla sed arcu molestie ultrices.Sed sodales interdum urna. • Cras viverra risus non libero. • Fusce in nulla sed arcu molestie ultrices.Sed sodales interdum urna. • Sed vel est ut justo fermentum vestibulum. • Sed gravida est in lectus. Votre dossier n’apparaît pas dans la liste ? Cliquez ici ! Message de clôture de l’étape Bouton Bouton • Trier les outils • Cras viverra risus non libero. • Sed vel est ut justo fermentum vestibulum. • Sed gravida est in lectus.

User Universal Navigation Language