{"id":3079,"date":"2023-01-18T15:39:59","date_gmt":"2023-01-18T14:39:59","guid":{"rendered":"https:\/\/cguillet.fr\/WordPress3\/?page_id=3079"},"modified":"2023-09-07T15:01:14","modified_gmt":"2023-09-07T13:01:14","slug":"cadrage-dun-projet-web","status":"publish","type":"page","link":"https:\/\/cguillet.fr\/WordPress3\/cadrage-dun-projet-web\/","title":{"rendered":"Cadrage d’un projet Web"},"content":{"rendered":"\n
\n

Pr\u00e9ambule<\/strong><\/h1>\n\n\n\n

Avant de commencer un projet il est toujours important de se rappeler quel sera notre r\u00f4le. Pour cela il faut se rappeler ce qu’est un Webdesigne<\/strong>r ?
To design = concevoir, penser, r\u00e9aliser\u2026 (mais pas dessiner)

Un webdesigner est un concepteur qui, comme son nom l\u2019indique, travaille sur le Web, tout comme le designer de mobilier est un concepteur de meubles.
Il les dessine, certes, mais il se pr\u00e9occupe avant tout du bon fonctionnement de l\u2019objet, s\u2019inqui\u00e9tant de son ergonomie, etc

L\u2019art : c’est l\u2019expression personnelle d\u2019un individu
Le design : c’est \u201cune discipline qui permet de r\u00e9soudre des probl\u00e9matiques donn\u00e9es\u201d (Paul Rand)<\/strong>

D\u00e9finition du Websdesign selon Wikipedia :<\/strong>
Le web design d\u00e9signe la conception de l\u2019interface web : l\u2019architecture interactionnelle, l\u2019organisation des pages, l\u2019arborescence et la navigation dans le site web<\/em>.<\/strong> Il s\u2019agit d\u2019une phase essentielle dans la conception d\u2019un tel site. La conception d\u2019un design web tient compte des contraintes sp\u00e9cifiques du support Internet<\/em><\/strong>,<\/em> notamment en termes d\u2019ergonomie, d\u2019utilisation et d\u2019accessibilit\u00e9<\/em><\/strong>. Le web design r\u00e9clame donc des comp\u00e9tences vari\u00e9es : en programmation, en ergonomie et en interactivit\u00e9, ainsi qu\u2019une bonne connaissance des contraintes techniques li\u00e9es \u00e0 ce domaine : diversit\u00e9 des terminaux web et de leurs affichages, accessibilit\u00e9, sp\u00e9cificit\u00e9s des diff\u00e9rents langages et processus, portabilit\u00e9, respect des recommandations du W3C.
On attend toujours d\u2019un webdesigner qu\u2019il allie sa culture Web une bonne ma\u00eetrise des concepts ergonomiques ainsi que des environnements de programmation et d\u2019int\u00e9grations.

Websdesign c’est r\u00e9pondre \u00e0 une probl\u00e9matique, c’est d\u00e9velopper un projet client dans un cadre contraint.<\/mark>
<\/strong>
Vous serez amen\u00e9 \u00e0 rencontrer des clients formulant des demandes de type :
\u00ab Bonjour, je veux lancer un nouveau site communautaire sur un cr\u00e9neau r\u00e9volutionnaire, c\u2019est combien ? \u00bb<\/strong>
\u00ab Pour la technique je veux pareil que Facebook et pour le Design je veux quelque chose \u00e0 la Apple\/Google \u00bb<\/strong>

Avec de telles demandes je suis l\u00e9gitime \u00e0 poser trois questions :
Avez-vous assez d\u2019\u00e9l\u00e9ments pour r\u00e9pondre ?<\/strong>
Avez-vous assez d\u2019\u00e9l\u00e9ments<\/strong><\/strong> pour \u00e9tablir un devis ?<\/strong>
Quelles sont les questions de base \u00e0 poser ?<\/strong>

Cadrer la demande s\u2019impose<\/strong>
Pour la premi\u00e8re rencontre avec le client il est souhaitable de s\u2019appuyer sur un questionnaire cibl\u00e9 le plus exhaustif possible pour obtenir les informations indispensable pour mener \u00e0 bien un tel projet.
Il est important de pr\u00e9venir le client que la r\u00e9alisation d\u2019un site internet lui demandera un investissement en temps et en r\u00e9flexion<\/em><\/strong>.
En effet, son r\u00f4le sera de vous transmettre avec pr\u00e9cision ses besoins, ses attentes, ses connaissances de l\u2019entreprise, ses connaissances de la cible et de ses concurrents mais aussi de vous fournir tout le contenu (texte, images, vid\u00e9o, audio \u2026) dont il dispose. Il devra \u00e9galement se rendre disponible pour vos questions et les r\u00e9unions de travail\/validation.<\/strong>

La demande client doit s’appuyer sur trois documents permettant de comprendre et mesurer les contours du projet :
Le questionnaire de projet : KICK OFF (Pr\u00e9paration au lancement du projet et dans l’id\u00e9al \u00e0 faire avant la rencontre du client)
Le brief de cr\u00e9ation (lors de la rencontre avec le client)
Le cahier des charges (Pendant et apr\u00e8s la rencontre du client)<\/p>\n\n\n\n

<\/div>\n<\/div><\/div>\n\n\n\n
\n

Kick off<\/strong><\/h1>\n\n\n\n

Ce questionnaire projet <\/strong>va vous permettre d\u2019estimer la quantit\u00e9 de travail \u00e0 fournir. C\u2019est ce questionnaire qui va vous aider \u00e0 prendre connaissance de l\u2019envergure du projet vous aidera \u00e0 \u00e9tablir votre devis. C\u2019est le premier document \u00e0 envoyer \u00e0 votre client juste apr\u00e8s le premier contact si celui-ci n\u2019a pas de cahier des charges \u00e0 vous remettre ou si ce dernier est incomplet. (Dans le cadre de notre projet c\u2019est le questionnaire auquel votre client r\u00e9pond lors de l\u2019appel \u00e0 projet pour parti et il viendra avec un support de pr\u00e9sentation pour vous pr\u00e9senter sa demande).

Voici une liste exhaustive des th\u00e8mes autour desquels il faut poser des questions :
\u2022 Identit\u00e9
\u2022 \u00c9tat des lieux de l’existant
\u2022 Objectifs du site (Objectifs fonctionnels du site pour le client)
\u2022 Actions (Objectifs fonctionnels du site pour la cible)
\u2022 Fonctionnalit\u00e9s (Objectifs fonctionnels du site pour la cible)
\u2022 Contenu
\u2022 Technique
\u2022 Planning
\u2022 \u00c9coconception
\u2022 Budget
\u2022 Besoins en cessions de droits d’exploitation
\u2022 Communication 360 pour cr\u00e9er du trafic vers le site
<\/p>\n\n\n\n

<\/div>\n<\/div><\/div>\n\n\n\n
\n

Le Brief cr\u00e9atif<\/strong><\/h1>\n\n\n\n

En ce qui concerne la conception graphique du site vous pourrez avoir des clients vous formulant leur demande de la mani\u00e8re suivante :

\u00ab Pour le design il me faut quelque chose de moderne, sexy, tendance avec un effet Whaou ! \u00bb<\/strong>
\u00ab Je sais pas trop, je sais ce que je veux mais c\u2019est vous l\u2019artiste !<\/strong> \u00bb<\/strong>

Avec de telles formulation de la demande client il me semble l\u00e9gitime de se poser un certains nombre de question :
Avez-vous assez d\u2019\u00e9l\u00e9ments pour comprendre les intentions du client ?<\/strong>
Avez vous des objectifs clairs \u00e0 atteindre ?<\/strong>
Pouvez vous commencer \u00e0 concevoir un site avec ces directives<\/strong> ?<\/strong>

Le r\u00f4le du graphiste n\u2019est pas de formuler le message et les besoins du client mais de les traduire visuellement<\/strong>, donc il sera indispensable de faire ce travail de communication lors d\u2019un brief cr\u00e9atif. Plusieurs objectifs sont vis\u00e9s lors de cet entretient.

Guider dans votre processus cr\u00e9atif<\/strong>
Pour transcrire visuellement le message d\u2019un client, encore faut-il que celui-ci soit clairement \u00e9nonc\u00e9. Le brief doit permettre au cr\u00e9atif de disposer de tous les \u00e9l\u00e9ments pour r\u00e9pondre le plus justement possible \u00e0 la demande. Le brief permet au graphiste d\u2019orienter sa d\u00e9marche cr\u00e9ative, de disposer d\u2019un fil d\u2019Ariane dans son processus de recherche et de rester sur les rails de la demande client<\/strong>.

R\u00e9pondre \u00e0 la demande<\/strong>
Plus le brief sera pr\u00e9cis, clair et exhaustif, plus la r\u00e9ponse cr\u00e9ative du graphiste sera juste et satisfaisante pour le client.

Constituer un document de r\u00e9f\u00e9rence<\/strong>
Lorsqu\u2019il s\u2019agit d\u2019appr\u00e9cier une proposition cr\u00e9ative, il est facile de se perdre dans des consid\u00e9rations qui prennent en compte des pr\u00e9f\u00e9rences, des go\u00fbts et des sentiments personnels<\/strong>. C\u2019est une erreur de rentrer dans l\u2019affect quand il s\u2019agit de valider ou invalider une proposition cr\u00e9ative.
N\u2019oublions pas qu\u2019un design doit traduire un message, s\u2019adresser \u00e0 une cible<\/em><\/strong>, <\/em>refl\u00e9ter des valeurs<\/em><\/strong>, orienter la lecture de l\u2019utilisateur et non satisfaire les go\u00fbts de chacun. Chaque individu \u00e9tant unique, ce qui plaira \u00e0 l\u2019un d\u00e9plaira \u00e0 l\u2019autre et chercher le consensus sur un crit\u00e8re esth\u00e9tique est utopique et incoh\u00e9rent.
Le brief doit donc servir de r\u00e9f\u00e9rence aussi bien au graphiste lorsqu\u2019il recherche des pistes de travail qu\u2019au client lorsqu\u2019il doit appr\u00e9cier la pertinence de la proposition cr\u00e9ative. C\u2019est un outil qui doit faciliter la prise de d\u00e9cision lorsqu\u2019il s\u2019agit de juger une cr\u00e9ation de fa\u00e7on objective (c\u2019est \u00e0 dire par rapport \u00e0 des crit\u00e8res d\u00e9finis en amont<\/em><\/strong> et non des crit\u00e8res affectifs).

Gagner du temps et de l\u2019argent <\/strong>
Plus le brief aura \u00e9t\u00e9 r\u00e9alis\u00e9 avec soins, plus il y a de chance que le graphiste r\u00e9ponde pr\u00e9cis\u00e9ment aux besoins du client, moins il sera n\u00e9cessaire de faire et de d\u00e9faire. Tout le monde y trouvera son compte. Le client ne paiera pas du temps de recherche et de r\u00e9alisation suppl\u00e9mentaire. Le graphiste appr\u00e9ciera de comprendre et de satisfaire le besoin du client

Voici une liste exhaustive des th\u00e8mes autour desquels il faut poser des questions :
\u2022 Pr\u00e9sentation Produit\/marque\/concept
\u2022 Le client et son march\u00e9 (son march\u00e9\/les valeurs)
\u2022 La Identit\u00e9 graphique & coh\u00e9rence graphique
\u2022 La concurrence
\u2022 La cible ou les cibles
\u2022 Les objectifs strat\u00e9giques \u00e0 traduire dans la r\u00e9ponse cr\u00e9ative (Institutionnel\/Relationnel\/Promotionnel)
\u2022 Le message \u00e0 faire passer sur le produit ou le service de l\u2019entreprise client (Promesse\/Preuve)
\u2022 Le ton cr\u00e9atif
\u2022 Les livrables <\/p>\n\n\n\n

<\/div>\n<\/div><\/div>\n\n\n\n
\n

Le cahier des charges<\/strong><\/h1>\n\n\n\n

Le Cahier des charge devient votre support de r\u00e9f\u00e9rence qui fera la synth\u00e8se des informations que vous aurez recueillies<\/em><\/strong> avec le Kick off ou lors du brief avec votre client.
Qui doit le r\u00e9diger ?<\/strong>
Le cahier des charges doit \u00eatre fournit par l\u2019\u00e9metteur du besoin c\u2019est \u00e0 dire le client. Qui d\u2019autre que le client peut expliquer la nature de ses besoins et connaitre le contexte de l\u2019entreprise ? Mais dans les faits c\u2019est le prestataire <\/em><\/strong>qui r\u00e9dige le cahier des charges \u00e0 partir des informations transmises par oral par le client.  Dans les entreprises d\u2019une certaine taille, c\u2019est g\u00e9n\u00e9ralement le chef de projet qui r\u00e9dige le cahier des charges en collaboration avec les diff\u00e9rents services concern\u00e9s par le projet (service marketing, communication, informatique \u2026). 
Le client est souvent mal \u00e0 l\u2019aise pour r\u00e9diger son cahier des charges, il ma\u00eetrise les aspects li\u00e9s \u00e0 son m\u00e9tier mais connait mal (ou pas du tout) ceux concernant le web. Il s\u2019appuie donc sur le prestataire pour produire ce document. Attention toutefois \u00e0 veiller \u00e0 ce que le prestataire ne devienne pas prescripteur de la solution qui l\u2019arrange<\/em><\/strong>. Le client souhaite la meilleure solution possible pour son projet m\u00eame si cette derni\u00e8re n\u2019est pas une solution ma\u00eetris\u00e9e par l\u2019agence ou le freelance.
Le cahier des charges n\u2019a pas besoin d\u2019\u00eatre une encyclop\u00e9die. Selon le projet, un document d\u2019une vingtaine de pages peu suffire. Il n\u2019a pas besoin d\u2019\u00eatre verbeux ou tr\u00e8s technique. Un vocabulaire simple est pr\u00e9f\u00e9rable. Le principal \u00e9tant que le besoin et les objectifs soient clairement d\u00e9finis pour permettre aux diff\u00e9rents intervenants une bonne compr\u00e9hension<\/em><\/strong>
Le cahier des charges est un document incontournable <\/strong>dans un projet. Un cahier des charges est un document \u00e9crit, structur\u00e9, qui d\u00e9crit de fa\u00e7on exhaustive les sp\u00e9cifications d\u2019un projet correspondant \u00e0 un besoin. Un cahier des charges, outre les sp\u00e9cifications, peut aborder les modalit\u00e9s d\u2019ex\u00e9cution du projet ainsi que les objectifs \u00e0 atteindre<\/em><\/strong>.

Le cahier des charges vises plusieurs objectifs
A formaliser et communiquer les besoins :<\/strong>Un document \u00e9crit force le r\u00e9dacteur \u00e0 exprimer l\u2019ensemble de ses id\u00e9es et \u00e0 les structurer (l\u2019\u00e9crit structure la pens\u00e9e). Ce document constitue une trace r\u00e9elle <\/strong>des besoins et une preuve tangible de leur existence.
Il est beaucoup plus difficile de contester une information qui a \u00e9t\u00e9 formalis\u00e9e par \u00e9crit qu\u2019une information transmise par oral.

A contractualiser un devoir d\u2019obligation d\u2019information g\u00e9n\u00e9rale :<\/strong> Le cahier des charges n\u2019est pas un document juridique cependant il constitue un document contractuel entre un client et un prestataire recensant les attentes et les besoins concrets du client. Il r\u00e9pond ainsi au devoir d\u2019obligation juridique d\u2019information g\u00e9n\u00e9ral d\u00e9finit par le code de la consommation.
En contre partie, le prestataire, si il dispose d\u2019un cahier des charges, pourra remplir ses devoirs de renseignements, de mise en garde et de conseils aupr\u00e8s du client.

A servir de r\u00e9f\u00e9rentiel tout au long du projet :<\/strong> Le cahier des charges est un outil de communication et un r\u00e9f\u00e9rentiel pour le chef de projet tout au long du processus de cr\u00e9ation d\u2019un site web. Il lui permet de v\u00e9rifier que le prestataire suit bien les recommandations et ne s\u2019\u00e9carte pas du cap. Pour le prestataire, ce document est un guide pr\u00e9cieux pour s\u2019assurer qu\u2019il remplit les objectifs d\u00e9finit avec le client. 

Voici une liste exhaustive des \u00e9l\u00e9ments devant faire l’objet d’un descriptif dans le cahier des charges :
I. Pr\u00e9sentation<\/strong>
\u2022 Pr\u00e9senter l\u2019entreprise
\u2022 Description & analyse de l\u2019existant

II. Description des besoins en terme de Branding<\/strong>
\u2022 Logo
\u2022 Charte Graphique
\u2022 Positionnement de la marque\/Produit\/concept
\u2022 Analyse concurrentielle
\u2022 Identification des Cibles
\u2022 Probl\u00e9matiques de la cible
\u2022 Promesse pour la cible
\u2022 Besoin Design Global

III. Description des besoins en terme fonctionnel<\/strong>
\u2022 Les objectifs du site
\u2022 L’architecture du site
\u2022 Besoins des cibles et user flows
\u2022 Les contenus
\u2022 Besoins fonctionnels Front
\u2022 Besoins fonctionnels Back
\u2022 Besoins Techniques
\u2022 Budget Fonctionnel
\u2022 Ecoconception (Accessibilit\u00e9\/qualit\u00e9Web\/SEO\/Performance)
\u2022 Besoin de suivi (Performance KPI)
\u2022 Besoins en cessions de droits

IV. Prestations attendues<\/strong>
\u2022 Description des \u00e9l\u00e9ments fournis & planning des \u00e9l\u00e9ments \u00e0 venir
\u2022 Le Planning de production
\u2022 Les livrables interm\u00e9diaires (Zoning, Wireframes, arborescence, moodboard, maquettes, user flow, style Guide, prototype, documentation technique)
\u2022 Dates de livraison (ici il sera impos\u00e9 par les d\u00e9lais Gobelins – mais il sera important de communiquer dessus)
\u2022 Sc\u00e9narios des livrables de fin de projet (mise en ligne ou pas, migration ou pas\u2026 Tests utilisateurs, r\u00e9sultats de mesures)

V. Communication autour du projet du site<\/strong>
\u2022 Plan Web Marketing
\u2022 Vid\u00e9o
\u2022 E-mailing
\u2022 Newsletter
\u2022 Affiches, Plaquette, PLV, Signal\u00e9tique<\/p>\n\n\n\n

<\/div>\n<\/div><\/div>\n\n\n\n
\n

Mapping Kick Off – Brief Cr\u00e9atif – Cahier des charges<\/strong><\/h1>\n\n\n\n
\"\"<\/a><\/figure>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"

Pr\u00e9ambule Avant de commencer un projet il est toujours important de se rappeler quel sera notre r\u00f4le. Pour cela il faut se rappeler ce qu’est un Webdesigner ?To design = concevoir, penser, r\u00e9aliser\u2026 (mais pas dessiner) Un webdesigner est un concepteur qui, comme son nom l\u2019indique, travaille sur le Web, tout comme le designer de […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":13,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-3079","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"admin","author_link":"https:\/\/cguillet.fr\/WordPress3\/author\/admin\/"},"uagb_comment_info":0,"uagb_excerpt":"Pr\u00e9ambule Avant de commencer un projet il est toujours important de se rappeler quel sera notre r\u00f4le. Pour cela il faut se rappeler ce qu’est un Webdesigner ?To design = concevoir, penser, r\u00e9aliser\u2026 (mais pas dessiner) Un webdesigner est un concepteur qui, comme son nom l\u2019indique, travaille sur le Web, tout comme le designer de\u2026","_links":{"self":[{"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/pages\/3079"}],"collection":[{"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/comments?post=3079"}],"version-history":[{"count":16,"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/pages\/3079\/revisions"}],"predecessor-version":[{"id":3144,"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/pages\/3079\/revisions\/3144"}],"wp:attachment":[{"href":"https:\/\/cguillet.fr\/WordPress3\/wp-json\/wp\/v2\/media?parent=3079"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}