metiers design numerique 2009

les métiers du design numérique2009

13 métiers du design numérique | 3

sommaire

_ Les métiers du design en définition, avant-propos par Benoît Drouillat

_ Introduction, par Claude Reynié

_ Directeur de création interactif

_ Directeur artistique

_ Web designer

_ Architecte de l’information

_ Consultant ergonome

_ Designer d’interaction

_ Animateur et développeur Flash

_ Motion designer

_ Développeur front-office

_ Développeur web

_ Chef de projet interactif

_ Designer sonore

_ Webmaster

_ Contributeurs

5

9

13

19

25

31

37

43

49

55

61

67

73

79

85

91


les métiers du design en définition(s)avant-propos, par Benoît Drouillat, président de *designers interactifs*

epuis 2006, *designers interactifs* mène un minitieux travail de veille sur 10 métiers à partir d’une diversité de sources d’informations. L’association,

grâce à un réseau de contributeurs, synthétise cette veille dans un wiki. Pour ne pas se limiter à une vision idéale des métiers, elle la confronte régulièrement à la pratique professionnelle courante lors de cycles de workshops annuels qui réunissent une cinquantaine de professionnels. Son ambition est d’établir à terme, sous le prisme des métiers, des comparaisons à partir des spécificités culturelles de chaque continent où la culture des métiers du numérique se développe. L’association pense notamment à l’Europe versus l’Amérique du Nord et l’Asie.

Dès le début des années 90, les pratiques du design numérique ont suscité l’émergence

d’expertises, souvent liées aux nouveaux médias et en particulier au web. En voici les principales occurences :

Web Art Director • Web Creative Director • Interactive Designer • UI Designer • Usability Consultant• Web Information Architect • User Experience Consultant • Web Project Manager • HTML Coder • Webdesigner • WebMaster • Designer sonore • Flash Developer • Flash Animator • Motion designer • E-Marketing Consultant • Web developer • Motion Graphics Designer • Digital Video Producer • Marketing Coordinator • Web Graphics Production Artist • Web Page Production Artist • Web Producer • Interactive Producer • Online Marketing Coordinator • Web Programmer • Content Specialist • Front-end Web Developer • Flash Designer • CSS Programmer • Headline Writer • Interaction Designer • Web Content Manager • Expert CSS/HTML Developer • Copywriter • Web Application Developer

D

• Visual Designer • Banner Designer • Web Content Editor • Content Support Specialist • Widget Designer • Action Script Consultant • Systems Architect • Digital Producer • Flash Actionscript Programmer • Taxonomy Analyst • Web Encoder • User Experience Director • Multimedia Designer • Email Marketing Engineer • 3-D Graphics Artist

Dans l’apparition progressive de ces métiers, nous avons mis en lumière 2 paramètres importants, le métissage et l’évolution, rencontré des creative hydras (« Inspiring the creative hydra » : www.imediaconnection.com/content/14243.asp et «New creative hydra» : chromainc.typepad.com/chroma_inc/2007/07/new-creative-hy.html) et assisté à la naissance de quantité de métiers inédits, souvent éphémères (le Second Life Builder ou Second Life Developer, www.lemondeinformatique.fr/actualites/lire-profession-developpeur-second-life-23297.html), parfois ancrés plus durablement (Silverlighter, Flexer, qui se rapprochent avec le développeur Flash du développeur d’applications riches, expertises ultra-rares en 2008).

La créativité lexicale des métiers du design numérique semble sans limites, avec des mots-valise - le Flajax Developer - soumis à l’hybridation permanente des techniques. Ils muteront vers d’autres formes, se confondront dans l’évolution incessante, car leur caducité nous ramène à l’essence véritable du design, à envisager davantage comme un processus que comme un mode d’expression à travers une technologie particulière.

Etienne Mineur rappelle dans sa conférence (Une) histoire du design interactif que le champ du design s’est déplacé de la création à l’écran pour l’impression à la création à l’écran pour l’écran lui-même. Cette translation a dès lors

ouvertes les possibles diversifications des métiers, et leurs spécialisations déterminées par les outils. Cela a aussi ouvert la voie à de nouvelles mutations, à des échanges de matériel génétique entre les espèces de designers, cela dès les débuts des ordinateurs destinés au public professionnel. Bill Mogridge le souligne dans Designing Interactions, le design de l’interface logicielle et de l’objet-interface sont indissociables. Cette articulation conjugue le designer industriel au designer d’interface pour donner naissance à une nouvelle espèce, le designer d’interaction.

Plus subrepticement dans l’histoire du design interactif, les recombinaisons d’ADN s’opèrent, dans la circulation des principes d’interfaces logicielles vers les interfaces Web. La navigation quotidienne en offre maints exemples ; les références culturelles ne manquent pas : sur le site du constructeur Volskwagen, la barre de navigation propose un singulier mimétisme du design d’un tableau de bord de véhicule. Les Head-Up Displays (HUD) des jeux vidéos font leur entrée dans les appareils mobiles.

Que le cadre bien délimité des fiches métiers ne méprenne pas leurs lecteurs : leur segmentation délibérée ou leur architecture interne n’a de raison d’être que pour l’inventaire théorique des activités de chacun des métiers. Une majorité de designers revendique sa multi-disciplinarité.

C’est bien la question de la représentation des métiers que Jean-Louis Frechin (www.nodesign.net) soulève (tout comme Anuhi Lou à travers sa signalétique créative), selon qui « le Web passe d’une culture de la communication visuelle à une culture de l’information, des fonctions et des applications ». Il propose une représentation schématique des « Nouveaux design pour une

nouvelle industrie » (www.nodesign.net/blog/index.php/post/2007/10/17/52-les-metiers-du-web-20) sur son blog, articulée autour de trois axes : la communication (les médias, la publicité) VS l’art (culture), le langage VS l’information, le narratif VS l’applicatif.

Cette deuxième édition du livre blanc ne fait que marquer une étape dans la représentation très mouvante des métiers. D’autres lui succéderont année après année, et chacun est invité à y réagir et à l’enrichir. Nous avons entièrement refondu ce référenciel pour qu’il offre une photographie actualisée des métiers et des références. Il est par ailleurs augmenté de 3 nouvelles définitions : web designer, développeur web et motion designer. Il nous paraissait important d’intégrer ces 3 métiers en raison de leur contribution essentielle au processus de création dans son ensemble.

Pour 2009, l’association a eu la chance de pouvoir s’associer au groupe de travail mené par la Délégation aux Usages de l’Internet sur les métiers du web et d’obtenir la reconnaissance de ses recherches. Cette collaboration ne fait pas que légitimer notre approche, elle la nourrit et lui permet de se matérialiser dans une publication imprimée. Nous souhaitons par là qu’elle puisse toucher tous ceux qui cherchent de l’information sur les métiers, qu’ils soient étudiants, experts, dirigeants d’entreprise, ou clients.

Benoît DrouillatPrésident fondateur de *designers interactifs*Janvier 2009


introductionpar Claude Reynié, chargée de mission à la Délégation aux Usages de l'Internet pour le portail des Métiers de l'Internet www.metiers.internet.gouv.fr

vec la montée en puissance des échanges économiques via Internet, les métiers de l’information, de la communication et du commerce

évoluent et se reconfigurent à un rythme soutenu. On voit apparaître et disparaître des activités, avec pour conséquence, une demande forte de clarification du champ des nouvelles compétences professionnelles et une reconnaissance des « nouveaux métiers ». Or, les activités professionnelles étant traditionnellement classées en branches, parfois solidement réglementées, et souvent jalousement défendues, la dynamique des nouveaux métiers induite par Internet perturbe nos habitudes et notre vision d’un monde professionnel ordonné et stable, avec ses classifications, ses conventions, ses acquis.

Loin de suggérer que dans le monde de liberté qu’est l’Internet il faille renoncer à l’ordre et à la rigueur, affirmons au contraire

que chacun de nous peut mettre son expérience en partage afin de permettre une compréhension des mutations qui affectent les organisations et les métiers et de trouver les moyens de s’y adapter.

L’émergence du métier de « designer d’interaction » est un exemple de l’évolution des pratiques et des usages de la communication multimédia. La spécificité du « designer d’interaction » est sa capacité non seulement à faire preuve de créativité mais aussi à porter une attention particulière à l’usager et au client, à appréhender son expérience, à prendre en compte ses besoins et à s’assurer de la bonne prise en main des outils numériques qui lui sont destinés. Le « designer d’interaction » met en oeuvre des compétences qui se situent au carrefour de la création artistique visuelle ou sonore, de l’analyse psychologique, de l’étude ergonomique, de l’architecture de l’information. Il fait jouer tous les ressorts

A

de sa polyvalence pour construire l’univers d’interactivité adapté au profil de son audience.

Aujourd’hui, l’essor du commerce en ligne offre un débouché considérable aux spécialistes des médias interactifs. Ce secteur économique sollicite les compétences spécifiques des designers d’interfaces web, mais force est de constater qu’elles sont encore trop peu valorisées et donc relativement peu déployées pour répondre à la demande des entreprises ou pour susciter l’intérêt de celles qui restent encore en retrait.

Ceci démontre qu’il y a de nouveaux champs d’activités à explorer, notamment dans ce type de filière prometteuse, et un travail de pédagogie à conduire auprès de tous ceux qui trouveraient l’opportunité de s’y orienter. C’est le mérite que nous devons reconnaître aux membres de l’association *designers interactifs* qui ont entrepris l’élaboration de ce Livre blanc afin d’apporter un éclairage sur la spécificité de leur métier.

Cette initiative permettra dans le même temps d’enrichir la prochaine version du portail des Métiers de l’Internet dont l’objectif est d’informer, orienter et favoriser la visibilité des nouveaux métiers liés au développement de l’Internet. L’association *designers interactifs* et le Portail des Métiers de l’Internet mettent en commun leurs énergies afin de promouvoir les métiers innovants et les talents de tous ceux qui les exercent.

Claude ReyniéChargée de mission à la Délégation aux Usages de l'Internet pour le portail des Métiers de l'Internetwww.metiers.internet.gouv.fr


e directeur de création interactif a une connaissance approfondie et une expérience pratique des interfaces et des outils pour la conception de projets web,

mobiles ou tout autre support mettant en jeu une relation interactive entre une entreprise et ses différents publics. Il est responsable de la qualité et de l’innovation des dispositifs proposés par son agence. Il porte la vision créatrice des projets. Le directeur de création interactif intègre les objectifs du client dans les stratégies de conception, les principes interactifs de l’interface et le design visuel.

Une compréhension globale du processus créatif, de la stratégie, de l’identité de la marque, de l’architecture de l’information, de l’utilisabilité, de l’interactivité et de la conception graphique est nécessaire. Le directeur de création interactif est ainsi l’un des éléments clés de l’équipe. Il développe des relations durables avec le client, planifie des stratégies interactives avant-gardistes, communique, argumente les concepts et les choix du design. Il dirige les efforts de l’équipe de création (directeurs artistiques, architectes de l’information, webdesigners, designers et développeurs Flash, , etc.).

directeur de création interactif« L’interactivité devient une discipline majeure pour de nombreux annonceurs. L’ère du marketing de masse conduit par les medias touche à sa fin, les consommateurs migrent des chaînes “émettrices” comme les programmes de télévision et vont vers des chaînes “réceptrices“ telles internet, les jeux videos, iPods… » — Bob Greenberg

L

14 | Les métiers du design numérique Donnez-nous votre avis sur www.designersinteractifs.org

ACtIVItéS

Au niveAu Du Design. Le directeur de création interactif traduit les objectifs marketing de ses clients en stratégies créatives et dirige la réalisation de projets de design de la définition de la conception à la validation des livrables.

Il intervient sur une diversité de problématiques : sites de marques, commerce électronique, portails d’information, communication institutionnelle et financière, intranets, campagnes de publicités en ligne, etc. Pour chacune de ces problématiques, il élabore des solutions créatives en accord avec l’identité de la marque, tout en gardant à l’esprit la satisfaction de l’utilisateur final. Il établit la vision créative de tous les projets et affine les concepts à travers des maquettes détaillées, en collaboration avec les directeurs artistiques interactifs. Il formalise ainsi les briefs

créatifs, conduit des brainstormings, mène la conception de sites web et de campagnes en ligne et dirige la production graphique. Il s’assure que le calendrier et le budget sont conformes au champ d’intervention défini avec le client. Il valide tous les briefs créatifs entrants et les livrables envoyés au client.

Il saisit parfaitement les enjeux de plusieurs disciplines allant de l’architecture de l’information au développement front-office, voire en pratique certaines. Il occupe un rôle de conseil sur les problématiques design soulevées lors de la mise en oeuvre du projet. Il maîtrise et apprécie la différence entre l’expression créatrice et les réalités commerciales.

Au niveAu Du Client. Le directeur de création interactif établit et nourrit de bonnes relations de travail avec les clients de

DIReCteUR De CRéAtIon InteRACtIF

ACtIVItéS LIéES

directeur de création web ; directeur de l’expérience utilisateur ; directeur artistique interactif ; designer interactif ; designer d’interface

Creating the Perfect Design Brief ,Peter L. Philipps, Allworth Press, 2004

Design management,Brigitte Borja de Mozota, éditions d’organisation, 2002

Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 15

l’agence. Il développe une véritable capacité à comprendre leur métier pour mieux les aider à atteindre leurs objectifs de marketing et de communication.

Il communique aux clients et aux prospects les créations de l’agence, sa philosophie, sa méthodologie et ses expertises. Il développe et valide des devis pour la création, s’assure de la qualité, et de la rentabilité de la production des livrables. Il est en relation directe avec le client, en tant que principal représentant de la création et contribue à clarifier l’orientation du projet. Il facilite et organise les contacts entre l’équipe créative et le client, recueille les retours du client.

Il communique à toutes les personnes prenant part au projet les concepts créatifs, la stratégie et les livrables.

Il orchestre les réponses à des compétitions et des prospections, prépare et assiste à des présentations de recommandations créatives en collaboration avec l’équipe marketing et commerciale de l’agence.

Au niveAu De l’équipe. Le directeur de création est l’un des managers de l’agence. En cela, il guide, dirige et motive une équipe créative ainsi que des ressources de

production : designers internes, architectes de l’information, agences partenaires et designers indépendants. Il est au courant de l’état d’avancement des livrables à réaliser par toutes les équipes participant au projet.

Il travaille avec les différents responsables du projet pour s’assurer qu’ils ont lu, interprété et agi en adéquation avec la stratégie, la logistique, et les besoins créatifs du client.

Le directeur de création recrute, fidélise les meilleurs talents, développe un réseau professionnel et maintient des liens avec des prestataires clés. Il gère au quotidien l’organisation de l’équipe, notamment la gestion des priorités, l’attribution des ressources et s’assure que les objectifs du projet sont atteints.

Il élabore des méthodologies et un environnement de travail qui facilitent la collaboration et l’innovation dans l’équipe. Il donne des conférences, participe à des jurys et représente le département design de l’agence.


About Face 3: The Essentials of Interaction Design,Alan Copper, Robert Reinmann, David Cronin, Wiley, 2007

Information Architecture for the World Wide Web: Designing Large-Scale Web SitesLouis Rosenfeld, Peter Morville, o’Reilly, 2006


PErSONNALItéS _ Bob Greenberg

_ David Armano

_ Khoi Vinh

_ Jennifer Louis

_ Jeff Benjamin

_ Aurélie de Villeneuve

_ Christophe Martin

_ Kevin Flatt

_ Marc Garbarini

_ John Jakubowski

_ Ben Clapp

_ Gui Borchert

_ Jason Delichte

FOrMAtION _ Gobelins, l’école de l’image

_ écoles d’arts appliqués (ENSAAMA, Olivier de Serres, école Nationale Supérieure des Arts Appliqués et des Métiers d’Art, ESAG Penninghen, Estienne, école Supérieure des Arts et Industries Graphiques)

_ Vocation Graphique

_ Université de Paris 8, dpt Hypermédias

_ ENJMIN – école Nationale du Jeu et des

Medias Interactifs Numériques

_ L’école de design Nantes Atlantique

_ école Nationale Supérieure des Arts Décoratifs

_ ENSBA , école Nationale Supérieure des Beaux-Arts

_ LISAA, L’Institut Supérieur des Arts Appliqués

_ Hyper Island

_ USC Interactive Media

_ Parsons Communication Design & technology

ASSOCIAtIONSPrOFESSIONNELLES Et COMMUNAUtéS

_ Interaction Design Association (IxDA)www.ixda.org

_ Design Council www.designcouncil.org.uk

_ APCIwww.apci.asso.fr

_ Alliance Française des Designers (AFD) www.alliance-francaise-des-designers.org


Designing Interfaces,Jenifer tidwell, o’Reilly, 2006

Designing Web Interfaces: Principles and Patterns for Rich Interactions,Bill Scott & theresa neil, o’Reilly, 2009


_ Institut Français du Design www.institutfrancaisdudesign.com

_ AIGA www.aiga.org

_ D&AD www.dandad.org

_ ADC Global www.adcglobal.org

_ *designers interactifs* www.designersinteractifs.org

MAGAzINES Et BLOGS

_ www.internetactu.net

_ www.atelier.fr

_ www.strategies.fr

_ www.adage.com

_ www.creativereview.co.uk

_ www.etapes.com

_ blog.ipglab.com

_ threeminds.organic.com

_ adverlab.blogspot.com

_ www.cpluv.com

_ www.nma.co.uk

éVéNEMENtS

_ Web Directions South & Northwww.webdirections.org

_ Dconstructwww..dconstruct.org

_ South by Southwest, www.sxsw.com

_ Future of Webdesign, www.futureofwebdesign.com

_ @media, www.vivabit.com/atmedia

_ OFFFwww.offf.ws

_ ArS Electronicawww.aec.at

_ PICNIC, www.picnicnetwork.org

_ transmedialewww.transmediale.de


Designing Brand Identity,Alina Wheeler, Wiley, 2006

Le Web design : sociale expérience des interfaces web,nicole Pignier et Benoît Drouillat, Hermès-Lavoisier, 2008


e directeur artistique interactif s’approprie le métier du client et ses objectifs de communication pour les traduire en recomman-dations créatives multi-canal et

en design d’interfaces interactives.

Il imagine, produit et décline des concepts créatifs à travers toutes les étapes d’un projet interactif, qu’il s’agisse d’un site web, une application pour les mobiles, une campagne de publicité interactive , etc.

Le directeur artistique interactif définit les choix conceptuels, fonctionnels et stylistiques pour préparer le travail de l’équipe design qu’il dirige. Il est en relation avec le client, et col-labore avec le directeur de création, éventuel-lement d’autres directeurs artistiques et les intervenants du projet à travers différents livrables design.

Le directeur artistique interactif est égale-ment amené à contribuer à des propositions commerciales et des soutenances pour des prospects de l’agence.

L

directeur artistique interactif« Complexifier la simplicité est courant, simplifier la complexité, la rendre extraordinaire simple, voilà la créativité » — Charles Mingus


ACtIVItéS

Au niveAu Du Design. Le directeur artistique interactif participe à l’élaboration du brief créatif, aux brainstorms pour positionner la stratégie design du projet, à la création de dispositifs de communication, de services et de vente en ligne. Il contribue également, avec l’appui de son équipe, à la production graphique des projets.

Il traduit les objectifs du projet et les besoins du client en des interfaces de sites web, de terminaux mobiles, des campagnes interac-tives et des e-mails marketing. Il arbitre, avec l’aide de l’architecte de l’information, les choix graphiques et fonctionnels, en veillant à l’ergonomie de l’interface, ses contraintes et les opportunités qu’offrent les langages de pro-grammation et les outils. Il contribue à super-

viser des stratégies créatives, crée le design vi-suel, en définissant des choix typographiques, des concepts graphiques, l’identité visuelle et la signalétique pour l’interface du site.

En explorant les possibilités du design, il conçoit les pistes graphiques, imagine des concepts, soumet des idées de fonctionnalités, élabore l’organisation spatiale des pages, des maquettes d’interfaces et les livrables finaux. Il s’assure que les choix du design sont en phase avec la vision du projet telle que définie dans la stratégie de l’expérience utilisateur.

Au niveAu Du Client. Le directeur artistique interactif est en relation directe avec le client et participe aux présentations design pendant la durée du projet. Il prend part aux compétitions à travers l’élaboration de maquettes, en participant aux soutenances

DIReCteUR ARtIStIqUe InteRACtIF

ACtIVItéS LIéES

designer interactif ; designer d’interaction ; designer d’interface ; designer numérique ; directeur artistique web ; web designer ; designer multimédia ; graphiste web

Ergonomie web, Amélie Boucher, eyrolles, 2007

Designing Interfaces: Patterns for Effective Interaction Design,Jenifer tidwell, o’Reilly, 2005


permettant d’argumenter la stratégie et les concepts, ainsi qu’au lancement du projet. Il justifie ses choix design et élabore des recom-mandations écrites et/ou orales. En adoptant le point de vue du client, il raisonne en termes d’objectifs à atteindre.

Il prend en compte les remarques du client et y donne suite de manière appropriée, notam-ment les demandes de modifications et la mise à jour des livrables.

Il conduit des réunions de travail avec le cli-ent, avec le soutien d’un consultant ou d’un chef de projet. Il travaille généralement sur plusieurs projets simultanés.

Il assure la qualité de tous les livrables créatifs et veille au respect du concept originel pen-dant la phase de production.

Au niveAu De l’équipe. Le directeur artistique interactif dirige une équipe de (web) designers ; il collabore avec une variété d’intervenants : des concepteurs-rédacteurs, des architectes de l’information, des chefs de projet éditoriaux, des designers sonores, des designers Flash et des développeurs front-office. Il définit les orientations graphiques structurantes et la direction artistique pour les autres designers, les collaborateurs juniors, indépendants et stagiaires sur tous les projets.

Il s’assure que l’équipe projet utilise les méthodes de travail pertinentes et les meil-leurs outils afin d’être compétitive. Il aide le directeur de création à planifier la production des équipes et à améliorer le processus de cré-ation. Il répartit dans l’équipe les différentes tâches de production. Il s’appuie sur l’équipe pour décliner le design visuel, le contenu, l’interface graphique et la structure des sites, les campagnes interactives et les autres types de projets interactifs.

Il fait la promotion du design auprès des au-tres collaborateurs de la société, leur montre les bénéfices de la discipline.


Designing Web Navigation: Optimizing the User Experience,James Kalbach, Aaron Gustafson, o’Reilly, 2007

Penser le webdesign, nicole Pignier et Benoît Drouillat, L’Harmattan, 2004


PErSONNALItéS _ Joshua Davis

_ Marcus Ericsson

_ robert Lindström

_ Masayuki Kido

_ Etienne Mineur

_ Adhemas Batista

_ Florian Schmitt

_ Andreas Pihlström

_ Arnaud Mercier

_ Johan Bakken


_ écoles d’arts appliqués (ENSAAMA, Olivier de Serres, école Nationale Supérieure des Arts Appliqués et des Métiers d’Art, ESAG Penninghen, Estienne, école Supérieure des Arts et Industries Graphiques)

_ Université de Paris 8, département Hypermédias

_ ENJMIN – école Nationale du Jeu et des Medias Interactifs Numériques

_ L’école de design Nantes Atlantique

_ école Nationale Supérieure des Arts Décoratifs

_ ENSBA – école Nationale Supérieure des Beaux-Arts

_ LISAA, l’Institut Supérieur des Arts Appliqués

_ IESA

_ Hyper Island




_ Interaction Design Association (IxDA)www.ixda.org

_ Design Council www.designcouncil.org.uk

_ APCIwww.apci.asso.fr

_ Alliance Française des Designers (AFD) www.alliance-francaise-des-designers.org

_ Institut Français du Design www.institutfrancaisdudesign.com

_ AIGA www.aiga.org

About Face 3: The Essentials of Interaction Design,Alan Copper, Robert Reinmann, David Cronin, Wiley, 2007

Designing Web Interfaces: Principles and Patterns for Rich Interactions,Bill Scott & theresa neil, o’Reilly, 2009



_ D&AD www.dandad.org

_ ADC Global www.adcglobal.org


MAGAzINES Et BLOGS _ www.my-os.net/blog

_ www.cpluv.com

_ www.etapes.com

_ www.thefwa.com

_ www.webdesignfromscratch.com

_ www.konigi.com

_ www.designmeltdown.com

_ www.adverblog.com

_ www.commarts.com

_ www.creativereview.co.uk

éVéNEMENtS

_ Web Directions South & Northwww.webdirections.org

_ Dconstructwww..dconstruct.org

_ South by Southwestwww.sxsw.com

_ Future of Webdesign www.futureofwebdesign.com

_ @mediawww.vivabit.com/atmedia

_ OFFFwww.offf.ws

_ ArS Electronicawww.aec.at

_ PICNIC www.picnicnetwork.org

_ transmedialewww.transmediale.de

_ the rich web experiencewww.therichwebexperience.com

_ Web Directions www.webdirections.org

Advertising Now. Online, Julius Wiedemann, taschen, 2008

The Web Designer’s Idea Book, Patrick Mcneil, How 2008



e web designer est un membre multidisciplinaire de l’équipe, responsable du design, de la production, et de la mainte-nance de contenus interactifs,

de l’initiation du projet à sa mise en ligne. Il conçoit et crée des solutions d’interface pour des sites web, intranet, extranet, des portails, des applications et des dispositifs marketing (campagnes de publicité interactives, news-letters, campagnes d’e-mailing).

Le web designer occupe une position charnière entre la création et le développe-ment. Par-là même, la tension permanente entre création et production est centrale dans le métier de web designer. Il doit faire appel à une large culture du design visuel, de la typographie à la mise en page, coordonnée à une culture « interactive ». Généraliste du design, ses activités sont souvent en recoupe-ment avec celles du webmaster, voire celles du

développeur front-office et du designer Flash dont il peut avoir les expertises. Comme lui, il peut avoir une spécialisation plus technique, éditoriale, ou en animation.

Dans le contexte anglo-saxon, le web de-signer a une connotation plus technique, même si, en France, il est considéré davan-tage comme un designer que comme un tech-nicien. La conception (livrables : story-boards) est un aspect de plus en plus souvent cité dans les attributions du web designer car il se posi-tionne dans la formalisation de l’interaction. En fonction du contexte dans lequel il exerce son activité (freelance, agence, entreprise utilisatrice), ses spécialités varient et peuvent, par exemple, offrir une place plus centrale à la gestion de projet (notamment en entreprise). Souvent, le type d’outils maîtrisés par le web designer oriente ses activités. Mais en aucun cas être web designer ne se réduit à la maîtrise technique d’une suite logicielle.

L

web designer« Le design est toujours une question de synthèse – conjonction des besoins du marché, des tendances technologiques, et des objectifs du business. » — Jim Wicks


ACtIVItéS

Au niveAu Du Design. Le web designer traduit les objectifs business, les concepts et les enjeux techniques en des propositions design soucieuses de créer une expérience utilisateur pertinente. Il crée les premières explorations design du projet. Il définit, raffine et implémente le design de l’interface du site en répondant aux problématiques business, d’identité de marque et aux besoins des utilisateurs. Il est amené à formaliser des story-boards, des maquettes et des prototypes pour représenter les principes du design et le comportement de l’interface. Notamment, il créé des gabarits de page à travers une mise en scène de l’information pertinente au regard des principes universels et de la charte graphique liée à la marque. A ce titre, il recherche en permanence de l’information et les meilleures pratiques qui lui permettent d’améliorer la pertinence du design. Les prototypes qu’il

élabore sont souvent développés à l’aide de Flash ou en HtML, offrant un aperçu plus réaliste des fonctionnalités de l’interface.

Pour chacun des projets sur lesquels il intervient, il veille à maintenir une cohérence dans les choix design et graphiques, guidé par les principes d’identité de la marque. Pour cela il dispose de documents de références, comme la charte graphique print et/ou web. Il s’appuie également sur les standards établis et les bonnes pratiques. Pour chaque contrainte ou opportunité technique liée à la partie visible de l’interface, il arbitre des choix et implémente les solutions design les plus efficientes.

Le web designer accomplit également des tâches de maintenance sur le contenu et le graphisme des sites. Il peut être amené à produire des éléments graphiques périphériques au site web : bannières promotionnelles, landing pages , etc.

WeB DeSIGneR

ACtIVItéS LIéES

graphiste multimédia/web ; designer multimédia/web ; designer d’interface ; développeur front-office.

Designing Interfaces, Jenifer tidwell, o’Reilly, 2005

Designing Web Navigation, James Kalbach, o’Reilly, 2007


Au niveAu teChnique. Le web designer, prenant alors le rôle de l’intégrateur HtML, transpose les maquettes, quelque soit leur format graphique, en pages HtML compatibles avec les standards. Il s’assure de leur compatibilité et de leur fonctionnement adéquat sur les principaux systèmes d’exploitation et navigateurs du marché. Il intègre les gabarits structurants du site en utilisant des technologies conformes aux standards internationaux et s’assure qu’ils demeurent accessibles. Il se tient informé en permanence des évolutions techniques pertinentes pour son activité.

Au niveAu Du Client. Le web designer échange avec les clients pour comprendre leur modèle économique et leurs objectifs, afin de leur proposer des solutions design qui répondront à leurs problématiques. Le web designer participe aux réunions design avec le soutien du directeur de création ou d’un directeur artistique. Il prend en compte les retours du client et y donne suite par des ajustements sur les maquettes.

Au niveAu De l’équipe. Le web designer participe aux brainstorming internes avec l’équipe pour imaginer de nouveaux concepts design. Il suit les directions indiquées

par le directeur artistique interactif pour produire les livrables du projet. Il travaille en étroite collaboration avec les équipes de conception (équipe responsable de l’expérience utilisateur) pour améliorer l’expérience globale du projet pour les utilisateurs et faciliter leur compréhension du contenu, et son accessibilité. En se fondant sur la synthèse des besoins utilisateurs et de tests éventuels, il effectue des itérations avec les équipes d’ergonomie et de développement. Il interprète les recommandations ergonomiques pour en retirer des améliorations dans les choix du design. Il travaille en étroite collaboration avec l’équipe de développement pour déterminer la faisabilité et aboutir à un design facilement évolutif. Il spécifie fonctionnellement les maquettes avec les concepteurs, et formalise les règles graphiques de l’interface pour guider le travail de développement.


The Design of Sites: Patterns for Creating Winning Web Sites,Douglas K. van Duyne, James A. Landay, Jason I. Hong, 2006, Prentice Hall

WeB DeSIGneR


PErSONNALItéS _ raphaël Goetter _ Molly Holzschlag _ Joshua Porter _ Jeffrey zeldman _ Eric Meyer _ Dave Shea _ Luke Wroblewski _ Veerle Pieters _ Jeff Croft _ Andy Clarke _ Jason Santa Maria

FOrMAtION _ Gobelins, l’école de l’image _ Vocation Graphique _ L’Ecole Multimédia _ IESA _ SupInfoCom _ Institut international du multimédia Léonard de Vinci _ HEtIC _ Hyper Island (Sweden)


_ Designer’s talkwww.designerstalk.com/forums _ Coroflotwww.coroflot.com _ Alsacréations css.alsacreations.com _ Interaction Design Associationwww.ixda.org _ Kob One www.kob-one.com _ AIGA www.aiga.org _ Web Standards, www.webstandards.org _ Media Boxwww.mediabox.fr _ *designers interactifs* www.designersinteractifs.org

WeB DeSIGneR

Thinking with Type: A Critical Guide for Designers, Writers, Editors, & Students, ellen Lupton, Princeton Architectural Press, 2004

Visual Design for the Modern Web, Penny McIntire, new Riders, 2008


WeB DeSIGneR

MAGAzINES Et BLOGS

_ www.computerarts.co.uk _ www.alistapart.com _ www.smashingmagazine.com _ www.designmeltdown.com _ www.readwriteweb.com _ www.computerarts.co.uk _ www.webmonkey.com _ www.digital-web.com _ www.webdesignfromscratch.com _ www.konigi.com _ www.webtypography.net

éVéNEMENtS

_ Web directions southsouth08.webdirections.org _ An Event Apart www.aneventapart.com _ South by Southwest www.sxsw.com _ Future of Webdesign www.futureofwebdesign.com _ @mediawww.vivabit.com/atmedia _ Paris web www.paris-web.fr _ Web design World www.webdesignworld.com _ PICNICwww.picnicnetwork.org _ Web Flash Festival www.Flashfestival.net

Designing Web Interfaces,theresa neil, Bill Scott, o’Reilly, 2009

The Principles of Beautiful Web Design,Jason Beaird, SitePoint, 2007


R

architecte de l’information« Bien que l’information soit une abstraction indépendante de la forme et par conséquent impossible à designer, la façon dont nous représentons l’information aux autres est d’une importance cruciale, dans la communication du sens même de cette information. » — Jef Raskin

esponsable de la structure et de la terminologie du contenu d’un site web ou d’une application, l’architecte de l’information oriente l’expérience utilisateur.

Son activité est fondée sur la dimension in-teractive du projet pour permettre aux utilisa-teurs de combler leur besoin en information et faciliter l’accomplissement d’activités que le service propose. De part la transversalité que son intervention implique, l’architecte de l’information collabore avec l’ensemble des

intervenants : équipe projet client et équipe design interne.

L’architecte de l’information prend ainsi en compte les aspects, marketing, l’identité de marque, la communication, la séman-tique, le design visuel, les profils utilisateurs, l’ergonomie et la technologie. Il traduit ainsi le comportement des utilisateurs en solutions de conception et formalise de manière con-ceptuelle et schématique des livrables tels que l’arborescence, le story-board ou encore les scénarios d’usage.


ACtIVItéS

Au niveAu Du Design. L’architecte de l’information définit des structures, des taxinomies et des systèmes de navigation pour des sites internet, extranet et intranet ainsi que pour d’autres types d’applications en ligne. Il imagine des solutions qui comblent les besoins marketing et les objectifs des utilisateurs. Il mène des analyses concurentielles (comprenant : utilisabilité, interaction et design d’interface…). Il planifie, conduit ou participe à la recherche et aux tests utilisateurs (sauf s’il y a un spécialiste de l’utilisabilité au sein même de l’équipe design).

Il définit ou supervise le comportement de l’interface et son organisation spatiale. Il crée et met à jour les documents de spécifications fonctionnelles. Il facilite les études

ethnographiques, l’analyse des tâches, le design participatif, les ateliers de co-création.

Il élabore ou valide des story-boards (ou wireframe en anglais = représentation schématique d’une interface) avec le chef de projet.

Au niveAu Du Client. L’architecte de l’information comprend le métier du client, ses besoins/objectifs internes et externes. Il contribue à l’élaboration du cahier des charges en menant des séances de travail avec le client, à l’aide d’un benchmark concurrentiel. Il dresse l’inventaire du contenu disponible.

Il présente toutes les étapes de l’architecture de l’information et du design d’interface aux membres de l’équipe et au client. Il conduit des entretiens clients pour assurer la validation

ARCHIteCte De L’InFoRMAtIon

ACtIVItéS LIéES

designer d’interaction ; designer d’information ; consultant en expérience utilisateur ; consultant ergonome ; designer d’interface ; chef de projet (éditorial)

Information Architecture for the World Wide Web: Designing Large-Scale Web Sites,Louis Rosenfeld, Peter Morville, o’Reilly, 2006



du périmètre fonctionnel, de l’architecture de l’information, des objectifs marketing et du design de l’interface. Il participe de manière informelle et formelle aux remarques sur le design. Il fournit un point d’avancement régulier aux équipes du projet sur les livrables de conception, afin d’assurer que leurs demandes sont bien prises en compte.

Au niveAu De l’équipe. L’architecte de l’information s’assure que le design (visuel et sous d’autres formes de représentation) sert le sens (la perception et la compréhension d’une information). Il briefe les équipes de designers et de développeurs, s’assure que la documentation concernant l’architecture de l’information est constamment mise à jour et transmise à l’équipe de production.

Il prend part à des sessions de brainstorming créatif. Il travaille avec les designers sur des maquettes d’interfaces et s’assure que le design visuel s’accorde avec les interactions réalisables par l’utilisateur.

Il informe le chef de projet du moindre élément qui pourrait affecter le calendrier ou le déroulement du projet. Il vérifie la qualité des livrables pendant leur production.

Il promeut et explique l’architecture

de l’information en tant que discipline, notamment sa méthodologie et ses bénéfices dans le cadre du projet.


Communicating Design: Developing Web Site Documentation for Design and Planning, Dan Brown, new Riders Press, 2006

Information Architecture: Blueprints for the Web, Christina Wodtke, Austin Govellanew Riders Press, 2009 (2nd edition)


PErSONNALItéS _ Peter Morville

_ Jesse James Garrett

_ Louis rosenfeld

_ Christina Wodtke

_ Adam Greenfield

_ Giuseppe Attoma

_ Paul Kahn

_ Peter Merholz

_ Ben Fry

_ Edward tufte

_ richard Saul Wurman


_ Ecole de design de Nantes

_ Université Paris 8 Saint-Denis – DESS Hypermedia

_ Carnegie Mellon University

_ University of Baltimore – Information Arts and technology

_ IIt Institute of Design

_ Stanford Institute of Design – d school

_ University College London

_ Manchester Metropolitan University

_ Web para Designers

_ Florida State University School of Information Studies

_ Illinois Institute of technology

_ State University of New York Oswego


_ the Information Architecture Institute www.iainstitute.org

_ Information Design Association www.informationdesignassociation.org

_ Interaction Design Association

www.ixda.org

_ ASIS&t the American Society for Informa-

tion Science & technology

www.asis.org _ User Experience Network www.uxnet.org

_ Human Factors and Ergonomics Society www.hfes.org

_ UPA – the Usability Professionals’ Associationwww.upassoc.org

The Elements of User Experience: User-Centered Design for the Web,Jesse James Garrett, new Riders Press, 2002

Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces,Carolyn Snyder, Morgan Kaufmann, 2003



_ AIGA – Experience Designwww.aiga.org

_ IIID Vision Plus www.iiid-visionplus.net


MAGAzINES Et BLOGS _ www.ergolab.net

_ www.boxesandarrows.com

_ www.uxmag.com

_ www.digital-web.com

_ www.informationdesign.org

_ stc-on.org/id

_ www.guuui.com

_ www.uxmatters.com

_ www.interaction-design.org

_ www.joelamantia.com

éVéNEMENtS

_ IA Summitwww.iasummit.org

_ Euro IAwww.euroia.org

_ Idea Conferenceideaconference.org

_ World Usability Daywww.worldusabilityday.org

_ UPA Conferenceswww.upassoc.org/conference

_ Interaction 09 (IxDA)interaction09.ixda.org

_ IA Konferenzwww.iakonferenz.org

_ Web Content Conferenceswww.webcontentconferences.com

_ UX Londonuxlondon.com

_ UX Weekwww.uxweek.com

Effective Prototyping for Software Makers, Jonathan Arnowitz, Michael Arent, nevin Berger, Morgan Kaufmann, 2006

The Persona Lifecycle : Keeping People in Mind Throughout Product Design, John Pruitt, tamara Adlin, Morgan Kaufmann, 2006



e consultant ergonome coor-donne et réalise des analyses d’activité avec des utilisateurs, afin de rendre des interfaces facilement utilisables. Il tran-

scrit les besoins et objectifs des utilisateurs en modèles structurés d’interfaces et en pro-totypes.

Le consultant ergonome doit connaître et comprendre les utilisateurs d’une interface dans leur contexte (leur profil, leurs besoins et leurs attentes…), afin de répondre à leurs besoins.

Le consultant ergonome est celui que l’on appelle quand « un utilisateur ne comprend rien ». Son travail consiste à créer des inter-faces utiles, intuitives et utilisables.

Il établit les conventions de l’interface utilisateur et sa charte ergonomique afin d’assurer la cohérence entre l’utilisation sur le web et sur des interfaces mobiles. Il colla-bore étroitement avec l’équipe design pour assurer la cohésion et la conformité des choix avec les conventions les plus courantes. Il facilite l’innovation. Il prend une part active dans la définition et l’évolution des pratiques courantes et de la méthodologie.

L

consultant ergonome« Beauté et intelligence, satisfaction et utilisibalité — ils devraient aller main dans la main » — Donald norman


ACtIVItéS

Au niveAu Du Design. Le consul-tant ergonome définit l’expérience utilisa-teur d’interfaces de téléphones mobiles, web, ou d’applications logicielles. Il accomplit un ensemble d’activités liées à la « recherche utilisateur » : des évaluations heuristiques d’applications en ligne, conçoit des person-nages-types (personae), détermine les be-soins utilisateurs, mène des entretiens, des analyses concurrentielles, des recherches eth-nographiques, des séances de co-création, des analyses de tâches, des sondages, des études de besoins , etc. Il formalise le résultat des re-cherches et établit des recommandations, re-transcrit les résultats des tests et les commen-taires en interfaces centrées utilisateur.

Il s’assure également de la faisabilité du de-sign. Il évalue la qualité de l’expérience en les confrontant avec les normes d’accessibilité (par exemple le WAI [Web Accessibility Initia-tive], Section 508 aux Etats-Unis ou Accessi-Web en France) et avec les technologies (par exemple, JAWS). Il élabore et développe des critères d’ergonomie. Il contribue à définir l’architecture de l’information en traduisant les besoins marketing en interfaces, arbores-cences, diagrammes et spécifications fonction-nelles.

Au niveAu Du Client. L’ergonome contribue à animer le brief pour déterminer le besoin du client avec l’équipe projet. Il fa-

ConSULtAnt eRGonoMe

ACtIVItéS LIéES

ingénieur ergonome ; consultant en utilisabilité ; architecte de l’information ; designer d’interface ; consultant en expérience utilisateur ; consultant en conception centrée utilisateur ; consultant fonctionnel ; ingénieur en facteurs humains

Ergonomie web,Amélie Boucher, eyrolles, 2007

Ergonomie du logiciel et design Web : Le manuel des interfaces utilisateur,Jean-François nogier, Dunod, 2008 (4ème édition)


cilite l’exploration des besoins fonctionnels et marketing à travers des entretiens et des work-shops avec le client et les parties-prenantes.

Il formalise ensuite des études concurren-tielles et présente les études d’utilisabilité en lien avec la problématique du client. Il analyse les données, élabore et présente des comptes-rendus écrits pour les conclusions des re-cherches et les livrables de l’architecture de l’information (tels que des arborescences et des story-boards). Il apporte des réponses aux problématiques du client et émet des recom-mandations pour la conception de l’interface et sa réalisation. Il conduit les réunions de vali-dation avec le client et adopte le point de vue de l’utilisateur tout en gardant à l’esprit les im-pératifs marketing.

Au niveAu De l’équipe. Le consul-tant ergonome fait circuler l’information et notamment rend compte aux personnes par-ticipant au projet des travaux menés en termes d'utilisabilité pour en assurer la réussite. Il se charge de la formation des équipes en ergono-mie, les initie à la discipline afin qu’ils en com-prennent la pratique et les bénéfices.

Il traduit les spécifications du produit en documents de travail utilisables par l’équipe de développeurs. Il s’assure avec le directeur

artistique que la partie visible de l'interface est facile à utiliser et cohérente. Il vérifie avec les rédacteurs que tous les libellés (navigation, bouton et étiquettes des champs) sont clairs, concis et facilement utilisables. Il s’assure que les point critiques de l’expérience utilisateur de l’application sont identifiés et communiqués à la direction de projet. Enfin, il défend la dé-marche de recherche utilisateur et contribue à faire reconnaître la valeur de la conception centrée utilisateur.

ConSULtAnt eRGonoMe

Prioritizing Web Usability,Jakob nielsen, Hoa Loranger, Peachpit, 2006

Designing Web Usability,Jakob Nielsen, Peachpit Press, 1999


PErSONNALItéS _ Jakob Nielsen

_ Amélie Boucher

_ Jean-François Nogier

_ Chrisitian Bastien

_ Aaron Marcus

_ Daniel Lafrenière

_ Bruce tognazzini

_ Frédéric Cavazza

_ Elie Sloïm

_ Alain robillard-Bastien

FOrMAtION _ ENSCI (Ecole Nationale Supérieure de Créa-tion Industrielle, Mastère Nouveaux Mé-

dias)

_ CNAM-Ergonomie

_ Université Paris 8

_ Université Descartes Paris 5

_ Université de Nice

_ Université de Provence

_ Ohio State University – Industrial & Sys-

tems Engineering/Human Factors

_ Indiana University

_ Georgia tech

_ City University London

_ Carleton University


_ Linköping and Stockholm University

_ Université de technologie de Belfort Mont-

béliard

_ Stanford Institute of Design | d.school



_ UPA - the Usability Professionals’ Associa-tion www.usabilityprofessionals.org

_ International Ergonomics Association www.iea.cc

_ CM SIG-CHI www.sigchi.org

_ Société d’Ergonomie de Langue Française www.ergonomie-self.org

_ ErgoIHM listes.cru.fr/sympa/info/ergoihm

Information Architecture for the World Wide Web: Designing Large-Scale Web SitesLouis Rosenfeld, Peter Morville, o’Reilly, 2006

Usability for the Web, tom Brinck, Darren Gergle, Scott D. Wood, Morgan Kaufmann, 2001

ConSULtAnt eRGonoMe



_ Interaction Design Association (IxDA) www.ixda.org

_ User Experience Network www.uxnet.org


MAGAzINES Et BLOGS _ www.ergolab.net

_ blog.usabilis.com

_ www.usabilitynews.com

_ www.sqliagency.com/blogs/ergonomic-

garden

_ www.qualitystreet.fr

_ www.ergonomia.ca

_ www.useit.com



_ www.uie.com

éVéNEMENtS

_ CHI 2009 www.chi2009.org

_ European Conference on Cognitive Ergo-nomics

ww.eace.info








The Elements of User Experience: User-Centered Design for the Web,Jesse James Garrett, new Riders Press, 2002

Réussir son Site Web en 60 fiches,Jean-Marc Hardy, Gaetano Palermo, Dunod, 2008(2ème édition)

ConSULtAnt eRGonoMe


n étroite collaboration avec les membres d’une équipe aux compétences transversales, le designer d’interaction évalue les besoins fondamentaux qui

définissent un produit, qu’il s’agisse d’un ter-minal mobile, d’un site web, d’un logiciel, d’un objet interactif ou d’un service.

Dans le but de faciliter l’utilisation du produit et d’optimiser l’expérience utilisateur, le designer d’interaction dispose de toute une gamme d’outils de modélisation qui lui per-mettent d’explorer différentes hypothèses conceptuelles : représentation des flux des tâches de l’utilisateur et de l’interaction, ma-quettes d’interfaces utilisateurs , etc.

En outre, le designer d’interaction est garant du comportement d’un produit — comment le produit agit ou réagit face à l’utilisateur. Les détails de la scénarisation de ce comportement et de sa représentation sont formalisés par un document de spécifica-tions qui sert ensuite de fil conducteur pour la production et le développement.

Le cœur de métier d’un designer d’interaction est constitué de plusieurs ac-tivités distinctes : design produit (définition des principes d’interaction et des concepts à l’échelle du produit), design d’interaction (à l’échelle des fonctions), design d’interface (à l’échelle des composants), architecture d’information/conception (structuration des contenus et principes de présentation).

e

designer d’interaction« Afin d’apporter à la fois du contrôle et de la satisfaction à l’utilisateur, le designer d’interaction adopte d’abord une approche conceptuelle, puis réfléchit en termes de comportement, et c’est seulement en dernier lieu qu’il traite le problème de l’interface. » — Alan Cooper


ACtIVItéS

Au niveAu Du Design. Le designer d’interaction conduit ou exploite des recher-ches sur les utilisateurs et les parties prenantes d’un projet. Il définit les besoins des utilisateurs par l’analyse de tâches spécifiques (objectifs des utilisateurs, motivations , etc.). Il évalue l’utilisabilité des fonctionnalités — existantes ou nouvelles — et propose des améliorations si nécessaire. En collaboration avec l’équipe de développement, identifie les besoins tech-nologiques d’un projet. Il vérifie la qualité des livrables pendant leur production. Il élabore ou valide des story-boards avec le chef de projet.

Le designer d’interaction définit la mé-thodologie et formalise la documentation. Il collabore à la préparation, la rédaction des compte-rendus et l’interprétation des

tests utilisateurs. Il brainstorme avec les équipes produit et ingénierie. Il collabore au développement de prototypes pour mener les tests utilisateurs. Il oriente le design, inspire les clients et suscite l’adhésion au sein de l’équipe par la formalisation des besoins, la conception de personas et de scenarii.

Il réalise des storyboards selon différents degrés de réalisme (« basse fidélité », « haute fidélité »), modélise les interactions, élabore des diagrammes conceptuels, des maquettes et des prototypes afin de communiquer de manière efficace les idées en termes de représentation visuelle et de comportement pour l’interface. Il rédige des spécifications fonctionnelles détaillées

Le designer d’interaction conçoit une inter-face, un service, un produit, etc. Il analyse les

DeSIGneR D’InteRACtIon

ACtIVItéS LIéES

designer industriel ; designer produit ; designer d’information ; consultant en expérience utilisateur ; consultant ergonome ; designer d’interface ; designer d’information

Designing interactions,Bill Moggridge, the MIt Press, 2007

About Face 3: The Essentials of Interaction Design, Alan Cooper, Robert Reimann, David Cronin, John Wiley & Sons, 2007


interactions entre les utilisateurs et les sys-tèmes informatiques. Il analyse et synthétise le résultat des recherches sur des concepts et des prototypes. Il simplifie les systèmes complexes en proposant des représentations adaptées. Il propose des solutions non seule-ment fonctionnelles mais porteuses de sens sur le plan émotionnel. Il met en perspective forme et fonction d’un produit et réalise des maquettes interactives grâce à un outil de pro-totypage (papier, Flash, Visual Basic, HtML, , etc.). Il teste et affine le design selon un pro-cessus itératif.

Au niveAu Du Client. Le designer d’interaction intègre les besoins commerciaux et techniques comme paramètres du design. Dvans le recensement des besoins, il attribue un ordre de priorité en adéquation avec le de-sign afin de dégager une solution qui répond à la fois aux besoins des utilisateurs et aux objec-tifs commerciaux. Il présente oralement, par écrit et visuellement les livrables pour explic-iter les choix du design et le rend convaincant.

Au niveAu De l’équipe. Le designer d’interaction collabore étroitement avec les équipes marketing, les chefs de produit et l’ingénierie afin de définir le positionnement d’un produit. Il traduit les besoins en spécifi-

cations fonctionnelles exploitables par une équipe de développement. Il collabore avec les designers graphiques pour une traduction visuelle en adéquation avec les objectifs de l’expérience utilisateur.


Sketching User Experiences: Getting the Design Right and the Right DesignBill Buxton, Morgan Kaufmann, 2007

Thoughts on Interaction Design, Jon Kolko, Brown Bear LLC, 2007


PErSONNALItéS _ Alan Cooper

_ Gillian Crampton Smith

_ David Malouf

_ Bill Moggridge

_ Dan Saffer

_ Bruce tognazzini

_ Jean-Louis Fréchin

_ Donald Norman

_ Bill Buxton

_ Jacob Nielsen

_ Ben Fry

_ Casey reas

FOrMAtION _ ENSCI (Ecole Nationale Supérieure de Création Industrielle, Mastère Nouveaux Médias)

_ L’école de Design de Nantes

_ Strate college

_ MIt Media Lab

_ Domus Academy

_ DESIGN INtErACtIONS, royal College of

Art Kensington Gore

_ Copenhagen Institute of Interaction Design

_ Master of Science Design for Interaction (Delft University of technology, the Neth-erlands)

_ Umeå Institute of Design

_ Centre for Interaction Design, School of Computing, Napier University Edinburgh


_ GVU Center – Georgia tech

_ School of Literature Communication and Culture – Georgia Institute of technology

_ Simon Fraser University

_ Interaction Design, advanced – Malmö högskola


_ Agence pour la Promotion de la Création

Industrielle (APCI)www.apci.asso.fr

_ Institut Français du Designwww.institutfrancaisdudesign.com

_ FINGwww.fing.org

Interaction Design: Beyond Human-Computer Interaction, Helen Sharp, Yvonne Rogers and Jenny Preece, Wiley, 2007 (2ème édition)

The Design of Everyday Things, Donald A. norman, Basic Books, 2002




_ Interaction Design Associationwww.ixda.org

_ Design Councilwww.designcouncil.org.uk


_ ACM SIGCHI www.sigchi.org

_ SIGGrAPHwww.siggraph.org

_ AIGA www.aiga.org

_ ACIDwww.acid.net.au

MAGAzINES Et BLOGS _ www.internetactu.net

_ www.interaction-design.org

_ interactions.acm.org



_ www.digitalexperience.dk

_ www.core77.com

_ liftlab.com/think/nova

_ http://leapfrog.nl/blog/

_ www.uxmatters.com

_ www.experientia.com/blog

_ www.wired.com

_ labs.ideo.com

éVéNEMENtS

_ Les Entretiens du nouveau monde indus-trielwww.digitallyours.fr

_ CHI Conferencewww.chi2008.org

_ IxDA Interactioninteraction09.ixda.org

_ SIGCHIwww.sigchi.org

_ HCI International www.hci-international.org

_ IDEA www.ideaconference.org

_ User Interface Conference www.uie.com/events/uiconf/

_ International Conference on Intelligent User Interfaceswww.iuiconf.org

Designing Gestural Interfaces: Touchscreens and Interactive Devices, Dan Saffer, o’Reilly, 2008

(Re)Searching the Digital Bauhaus, thomas Binder, Jonas Löwgren, Lone Malmborg, Springer, 2008



es fonctions d’un animateur et d’un développeur Flash sont de conceptualiser, coder, et in-tégrer des contenus interactifs dans des pages web à travers

des langages de programmation orientés ob-jet (notamment l’ActionScript). Ils créent des applications interactives en Flash, pouvant dialoguer avec des bases de données et aisé-ment paramétrables. Leur intervention per-met de donner vie à des design d’interface, imaginés avec le directeur artistique, dotés de possibilité interactionnelles riches.

Ils collaborent étroitement avec les de-signers et les chefs de projet pour imaginer des projets de sites Web, des campagnes de publicité interactives, des jeux, des anima-tions, des CD-roms, des interfaces de DVD et d’autres types de modules interactifs. Ils con-tribuent à chaque étape du travail de création, à la recherche du concept et aux story-boards jusqu’à l’implémentation du site.

L

animateur et développeur Flash « La véritable interactivité ne consiste pas à cliquer sur des icônes et télécharger des fichiers, mais à favoriser la communication » — edwin Schlossberg


ACtIVItéS

Au niveAu Du Design et De l’inteRACtivité. L’animateur et le développeur Flash créent des contenus in-teractifs ou des applications en utilisant à la fois la timeline du logiciel et la programma-tion. Ils intègrent des animations Flash ou de l’interactivité au sein de sites développés en HtML ou produisent des interfaces intégrale-ment en Flash. Ils déterminent la faisabilité des concepts avec les autres membres de l'équipe design. Le cas échéant, ils arbitrent entre les contraintes techniques et les choix design. Ils transcrivent et spécifient les interactions de l’utilisateur et le comportement de l’interface du concept à la mise en ligne du projet.

Ils transcrivent les concepts créatifs et les ci-nématiques en animations Flash. Ils encodent, intègrent la vidéo et le son dans l’interface. Ils programment les éléments du projet en se fondant sur les spécifications fonctionnelles et la direction artistique aussi fidèlement que possible. Pour illustrer un concept, en particu-lier dans les phases d’avant-vente, ils produ-isent des prototypes fonctionnels à partir des fichiers sources du design et des indications fournies dans les documents de conception.

Ils organisent les fichiers sources du projet et créent des composants Flash réutilisables. Ils prennent en compte les problématiques d’accessibilité avec Flash, ainsi que le ré-férencement.

AnIMAteUR et DéveLoPPeUR FLASH

ACtIVItéS LIéES

développeur d’applications riches ; développeur multimédia ; développeur ActionScript ; développeur web ; designer d’interface ; web designer ; motion designer

Foundation ActionScipt 3.0 Animation : Making Things Move! Keith Peters, Friends of eD, 2007

ActionScript 3.0 Cookbook Solutions for Flash Platform and Flex Application Developers,Joey Lott, Darron Schall, Keith Peters, o’Reilly, 2006


Au niveAu Du Développement. Le développeur Flash établit l’architecture technique appropriée pour l’application, fon-dée sur le périmètre du projet et ses spécifica-tions.

Il développe et recette les fonctionnalités. Il intègre des fichiers XML et des scripts aux fichiers Flash. Il écrit et manipule les langages orientés objet et fait interagir l’interface avec les langages orientés serveur.

Il identifie, documente, et anticipe l’application des meilleures pratiques (en termes de méthodologie, de standards de développement, de structure et de méthodes de test).

Il développe, organise une bibliothèque de scripts réutilisables d’un projet à l’autre et les personnalise . Il assure la compatibili-té de l’application avec différents systèmes d’exploitation et navigateurs, débuggue les applications. Il améliore la performance et op-timise le code ActionScript.

Au niveAu De l’équipe et Du Client. L’animateur et le développeur Flash informent et sensibilisent le client des possi-bilités et des contraintes du développement avec Flash. Il formalisent l’estimation de la

charge de travail pour construire et tester l’application. Ils aident les designers à définir les spécifications fonctionnelles des projets, les besoins des clients et à expliquer les con-traintes. Ils tissent le lien entre les designers d’interface et les ingénieurs de développe-ment pour l’intégration des applications web et pour équilibrer les exigences créatives avec les besoins techniques.

Ils influencent la direction artistique et l’inspiration créative, technique et interac-tive. Ils travaillent directement avec les chefs de projet, estiment le temps passé sur les projets, et recettent les différentes étapes de programmation.


Foundation Actionscript 3.0 with Flash CS3 and Flex, todd Yard, Steve Webster, Sean McSharry, Friends of eD, 2007

Foundation Flash Cartoon Animation, tim Jones, Allan Rosson, Barry Kelly, and David Wolfe, Friends of eD, 2007


PErSONNALItéS _ Colin Moock

_ Erik Natzke

_ Joshua Davis

_ Aral Balkan

_ Mike Chambers

_ Darron Schall

_ Joey Lott

_ Jared tarbell

_ Yugo Nakamura

_ Hoss Gifford


_ L’école Multimédia

_ école Nationale Supérieure des Arts Décoratifs (ENSAD)

_ école régionale des Beaux Arts de Saint Etienne

_ école Supérieure d’Art de Cambrai

_ LISAA, l’Institut Supérieur des Arts Appliqués

_ IESA

_ Hyper Island



_ Savannah College Of Art And Design Interactive Design and Game Development


_ Adobe Flash Developer Center www.adobe.com/devnet/Flash

_ FlashXPress www.Flashxpress.net

_ Flash Mediabox Flash.mediabox.fr

_ Flash Kit Forums www.Flashkit.com

_ Flash zone www.flzone.com

_ Flexx Communauté www.flexx.fr

_ Interaction Design Association www.ixda.org


Essential ActionScript 3.0,Colin Moock, o’Reilly, 2007

Adobe Flash CS4 Professional Classroom in a Book,Adobe Creative team, Adobe Presse, 2008



MAGAzINES Et BLOGS _ www.thefwa.com

_ www.Flash-france.com

_ www.yazo.net

_ www.ultrashock.com

_ www.kirupa.com

_ www.Flashmagazine.com

_ www.Flashkod.com

_ www.Flashguru.co.uk

_ blog.schematic.com.au

_ www.actionscripts.org

_ www.osFlash.org

_ www.hebiflux.com/blog

éVéNEMENtS _ Flash Festival www.Flashfestival.net

_ Flash In the Can (FItC) www.fitc.ca

_ Flash Forward www.Flashforwardconference.com

_ Adobe Max max.adobe.com

_ Flash On the Beach www.Flashonthebeach.com

_ Flash Belt www.Flashbelt.com

_ South by Southwest Conference sxsw.com

_ Best in the SW www.bestinthesw.com

_ OFFF www.offf.ws

_ Web Directions _ www.webdirections.org

Designing Web Interfaces: Principles and Patterns for Rich Interactions, Bill Scott, theresa neil, o’Reilly, 2009

Search Engine Optimization for Flash: Best practices for using Flash on the web, todd Perkins, o’Reilly, 2009



e Motion Designer dispose d’un double rôle de directeur artistique et de technicien. Il in-tervient ainsi de manière trans-versale dans un projet. Il prend

en charge des projets dotés de forts enjeux créatifs, dans des domaines aussi distincts que la publicité, le marketing, la diffusion télévisée ou le web. Il se situe en amont et en aval de la production d’une animation ou d’une inter-face. Il créé différents éléments graphiques dérivés de l’identité visuelle avant de produire une animation.

Les différentes étapes du processus de création dans le motion design recouvrent

une phase conceptuelle et une phase de ré-alisation proprement dite. Pendant la phase conceptuelle, le motion designer élabore des planches de tendances (moodboards ou conceptboards, qui mettent en place un univers graphique), établit le storyboard (qui en scénarise le déroulement), définit les choix typographiques et de mise en page d’écrans, la conception des mouvements, des effets de transition , etc. Pendant la phase de réalisa-tion, une première animatique permet de valider auprès du client le déroulement et le rythme de l’animation. Le rendu des images (temps machine), le montage et l’étalonnage complètent le travail d’animation. L’encodage constitue la dernière étape du projet.

L

motion designer« Dans l’industrie du film, l’émergence de génériques animés dans les années 50 a établi une nouvelle forme de design graphique appelée motion design. » — Jon Krasner.


ACtIVItéS

Au niveAu Du Design. Le motion de-signer participe à la recherche du concept et au brainstorming. Il contribue à l’élaboration du story-board et des compositions graphiques, ainsi qu’à la préparation du tournage. Il tra-vaille avec une charte graphique pré-établie ou définit lui-même une nouvelle identi-té graphique avec le directeur artistique. Il imagine un univers graphique, nourri par une forte culture de la typographie, pour le film à partir des conceptboards et de maquettes des étapes-clés. Il prépare et gère toutes les res-sources dont il a besoin pour le compositing (éléments graphiques, illustrations, plans séquences, son). Dans le cadre du broadcast, il créé des gabarits réutilisables.

tRAvAil typique. Le motion designer peut réaliser une variété de supports pour le

web ou la diffusion télé : bandes annonces, clips vidéos, spots publicitaires, génériques d’émissions et éléments graphiques associés (arrière-plan animé, transition vidéo, généri-que de fin), transitions pour des animations Flash, signatures de marque, des présenta-tions et des installations graphiques. Pour cha-cun, il s’appuie sur des story-boards, sa culture graphique et les objectifs du client.

Au niveAu teChnique. Le motion de-signer gère les ressources graphiques et leur rendu dans l’animation. Il adapte son travail au support final, en proposant l’encodage appro-prié (compression, formats vidéo) et s’assure que l’implémentation technique est appro-priée. Le motion designer maîtrise les prin-cipales techniques d’animations 2D, éven-tuellement la modélisation 3D, ainsi que les techniques du montage vidéo.

MotIon DeSIGneR

ACtIVItéS LIéES

directeur artistique ; réalisateur ; video Jockey (vJ) ; graphiste vidéo ; animateur 3D ; broadcast designer ; videographer

Techniques d’animation : Pour le dessin animé, l’animation 3D et le jeu vidéo, Richard Williams, eyrolles, 2003

Motion Graphic Design: Applied History and Aesthetics, Jon Krasner, Focal Press, 2008


Au niveAu Du Client. Le motion de-signer établit un brief avec le client pour com-prendre son modèle économique et ses ob-jectifs, afin de lui proposer des animations qui répondront à ses enjeux marketing. Il travaille en relation directe avec le client et les équi-pes marketing pour présenter les concept-boards, les affiner et les valider. Il communique au client les contraintes techniques et plani-fie le calendrier de réalisation. Il participe aux réunions de débrief avec le client. Il effectue les itérations nécessaires avec le client jusqu’à la validation du projet. Il s’assure que les inten-tions et la mise en oeuvre des idées graphiques sont en phase avec l’identité de marque et les objectifs du marketing.

Au niveAu De l’équipe. Il dirige et forme aux nouvelles techniques l’équipe de graphistes 3D, designers sonores, illustra-teurs et animateurs qui travaillent avec lui sur le projet. Il formalise les briefs graphiques et communique les objectifs du client aux ani-mateurs. Il s’assure que l’équipe suit les spécifi-cations demandées. Il coordonne les échanges d’information entre le directeur artistique et les designers pendant la phase de production. Il encourage l’équipe à travailler à partir des meilleures pratiques de production, des meil-leures méthodologies et techniques. Il veille à la qualité de tous les livrables graphiques.

Motion Blur: 2: Multidimensional Moving Imagemakers, onedotzero, Laurence King Publishers, 2007

Exploring Motion Graphics (Design Exploration), Rebecca Gallagher, Andrea Moore Paldy, Delmar Cengage Learning, 2006

MotIon DeSIGneR


PErSONNALItéS _ Saul Bass

_ Dan Perri

_ Kyle Cooper

_ André François

_ Sandy Dvore

_ Maurice Binder

_ Pablo Ferro

_ Laurent Brett

_ rob Chiu

_ Nando Costa

_ Mauro Gatti

_ tokyo Plastic

FOrMAtION _ Ecole Nationale Supérieure Louis Lumière

_ Ecole des Métiers du Cinéma d’Animation

_ Gobelins

_ E-Art Sup

_ Vocation graphique

_ Supinfocom

_ Ecole Emile Cohl

_ Ecole Estienne

_ école européenne supérieure d’animation

_ USC School of Cinematic Arts

_ Chelsea College of Art and Design

_ Westphal College of Media Arts & Design

_ Pratt Institute

_ Savannah College of Art & Design

_ School of Visual Arts

_ UCLA Design Media Arts

_ Otis College of Art & Design


_ CG Society forums.cgsociety.org _ Mograph.net www.mograph.net _ Mographwiki www.mographwiki.net _ Motion Graphics Chicago www.mgchicago.com _ AIGA www.aiga.org _ Digital Media Artists Los Angeles www.dmala.org/forum5 _ Creative Cow www.forums.creativecow.net

MotIon DeSIGneR

Motion Graphic Design and Fine Art Animation: Principles and Practice, Jon Krasner, Focal Press, 2004

Type in Motion 2, Matt Woolman, thames & Hudson, 2005


_ Creative League www.creativeleague.com _ Creatiu www.creatiu.com _ VJ Forums www.vjforums.com _ *designers interactifs* www.designersinteractifs.org

MAGAzINES Et BLOGS

_ www.xplsv.tv _ www.idents.tv/blog _ www.designflux.com _ www.stashmedia.tv _ www.res.com _ www.motionographer.com _ www.motiongraphics.it _ www.kromotion.com _ www.createdigitalmotion.com _ www.cgart.com _ www.ventilate.ca _ www.boardsmag.com _ www.feedhere.com

éVéNEMENtS

_ OFFFwww.offf.ws _ Cut & Pastewww.cutandpaste.com _ F5www.f5fest.com _ FItCwww.fitc.ca _ Motionwww.motionconference.com _ Onedotzerowww.onedotzero.com _ Semi-Permanentwww.semipermanent.com _ Dotmov Festivalwww.shift.jp.org/mov _ the radar Festival www.radarmusicvideos.com _ Motion Graphics Festivalwww.mgfest.com _ Festival Nemowww.arcadi.fr _ Festival d’Annecywww.annecy.org

Hillman Curtis on Creating Short Films for the Web, Hillman Curtis, new Riders Press, 2005

Motion by Design, Spencer Drate, David Robbins, Judith Salavetz, Laurence King Publishers, 2006

MotIon DeSIGneR


e développeur font-office trans-forme les maquettes d’interface fournies par l’équipe créative en gabarits (X)HtML et des feuilles de styles (CSS : Cascading Style

Sheet) pouvant s’afficher dans un navigateur web, pour des applications alimentées en con-tenus par des bases de données.

Il conçoit, code et gère l’interactivité des pages selon des méthodes de programmation orientées client et serveur. Il échange avec les

designers pour les aider à comprendre les con-traintes ainsi que les opportunités liées aux techniques.

Il étudie les sites web existants et y intègre de nouvelles pages, feuilles de styles et con-ventions d’ergonomie. Le développeur front-office est responsable de l’intégration du con-tenu dans les gabarits HtML ou le système de gestion de contenu (CMS), de l’application des styles et des conventions d’interactivité nécessaires.

L

développeur front-office « Une image vaut mille mots. Une interface vaut mille images. » — Ben Shneiderman


ACtIVItéS

Au niveAu Du Design. Le développeur front-office participe à l’ensemble du proces-sus créatif. Il travaille avec des orientations graphiques établies par le directeur artistique interactif et traduit les maquettes graphiques en fichiers HtML, avec des feuilles de style (CSS) optimisées pour différents navigateurs ainsi que pour l’impression. Il développe des prototypes fonctionnels pour la présentation de concepts et des tests utilisateurs. Il traduit le comportement de l’interface utilisateur, pour des interactions complexes, avec des lan-gages orientés client comme Ajax et JavaScript.

Il apporte des recommandations pour amé-liorer l’utilisabilité à partir des techniques de

développement orientées client et sa connais-sance des interfaces. Il intègre des interfaces conformes aux normes d’accessibilité (Section 508 aux états-Unis et Accessiweb en France). Il optimise les images pour obtenir la meilleure vitesse de chargement. Il fournit des éléments graphiques pour la mise à jour des pages.

Au niveAu Du Client. Le développeur front-office participe à la phase de spécifications fonctionnelles, à l’intégration, au développement, aux tests, et au déploiement d’un site ou d’une application. Il code à la main des pages Web utilisant les langages HtML, DHtML, et JavaScript. Il crée, teste et intègre des mises à jour sur des pages statiques et dynamiques. Il implémente les

DéveLoPPeUR FRont-oFFICe

ACtIVItéS LIéES

intégrateur HtML ; développeur HtML ; développeur multimédia ; développeur web ; développeur Front-end ; web designer ; codeur HtML

CSS2 : Pratique du Design Web,Raphaël Goetter et Sébastien Blondeel, eyrolles, 2005

HTML & XHTML: The Definitive Guide, Chuck Musciano, Bill Kennedy, o’Reilly, 2006 (6ème édition)


éléments multimédias telles que les anima-tions Flash, les images ou encore les podcasts. Il reconnaît et résoud les problèmes de concep-tion graphique. Il assure la compatibilité entre les plateformes et les navigateurs. Il contribue à formaliser les spécifications techniques.

Il participe à l’intégration et à la migration des contenus dans l’outil d’administration. Il développe des éléments d’interfaces réutilisables et des gabarits-types.

Au niveAu De l’équipe. Le développeur front-office effectue la liaison entre les designers et les développeurs du back-office. Il échange avec les directeurs artistiques et les designers pour s’assurer que le design peut être accompli dans le cadre des spécifica-tions techniques. Il fournit un avis consultatif à l’équipe design pour améliorer l’expérience utilisateur du projet, en utilisant les technolo-gies orientées client. Il contribue à améliorer la méthodologie et participe à l’élaboration du calendrier, à l’identification et l’anticipation des problèmes et des risques et communique sur l’état d’avancement des livrables aux per-sonnes participant au projet.


Réussir son site Web avec XHTML et CSS,Mathieu nebra, eyrolles, 2008

CSS: The Definitive Guideeric Meyer, o’Reilly, 2006


PErSONNALItéS _ rapahël Goetter

_ Laurent Denis

_ Molly Holzschlag

_ Eric Meyer

_ Garrett Dimon

_ Jeffrey zeldman

_ Dave Shea

_ Christophe Porteneuve

_ tim O’reilly

_ tim Berners-Lee



_ HEtIC

_ Institut International du Multimédia (Léo-

nard de Vinci)

_ ESIEE Paris – Mastère Ingénierie des mé-

dias numériques


_ World Wide Web Consortium (W3C) www.w3.org

_ the HtML Writers Guild www.hwg.org

_ Forums Alsacréations forum.alsacreations.com/forum.php

_ talk Freelance www.talkfreelance.com

_ Web Design Forum www.webdevforums.com

_ Paris Web (association) www.paris-web.fr


Sites web : les bonnes pratiques,elie Sloïm, eyrolles, 2009

High Performance Web Sites: Essential Knowledge for Front-End Engineers,Steve Souders, o’Reilly, 2007



MAGAzINES Et BLOGS _ www.openweb.eu.org

_ www.pompage.net

_ css.alsacreations.com

_ www.cssbeauty.com

_ www.alistapart.com


_ www.allhtml.com

_ www.sitepoint.com

_ www.positioniseverything.net

_ www.mezzoblue.com

_ www.ajaxrain.com

_ www.ajaxian.com

éVéNEMENtS

_ Paris web www.paris-web.fr

_ Microsoft techDays www.microsoft.com/france/mstechDays

_ An Event Apart www.aneventapart.com



_ South by Southwest Conference www.sxsw.com

_ @media Ajax www.vivabit.com/atmediaAjax

_ Webstock www.webstock.org.nz

_ Web design World www.ftponline.com/conferences/web-designworld

_ Web 2.0 Summit www.web2summit.com

Bien développer pour le Web 2.0 Bonnes pratiques Ajax,Christophe Porteneuve, eyrolles, 2008 (2ème édition)

Réussir son Site Web en 60 fiches,Jean-Marc Hardy, Gaetano Palermo, Dunod, 2008(2ème édition)



e développeur web pro-gramme, teste, corrige les er-reurs, implémente, documente, assure le suivi et la mainte-nance d’applications accessi-

bles depuis un navigateur web.

Grâce aux principaux langages orientés serveur (PHP, ASP , etc.), il assure le dialogue entre la partie visible de l’interface (front-of-fice) et les bases de données. Il conduit une analyse des besoins, l’élaboration de proto-types fonctionnels, pour la partie visible ou non visible des éléments de l’interface. Il veille à l’intégration des applications et des services dans un site web ou un intranet.

Il contribue au processus créatif en apportant son point de vue sur la modélisation

des interactions et les fonctionnalités du site. Il établit un pont entre les dimensions design et technologiques, en offrant un éclairage technique dans la conception, non seule-ment par la mise en lumière des contraintes mais aussi en signalant des opportunités tech-niques qui peuvent faciliter l’innovation.

Il traduit les besoins du client en spécifi-cations fonctionnelles détaillées grâce aux meilleures pratiques comme la conception centrée utilisateur et une excellente com-préhension des étapes clés du design. Il est garant de l’intégrité du design visuel dans le site (mise en page, style graphique) et de son fonctionnement en adéquation avec les prin-cipes de conception.

L

développeur web« que cela soit dans la conception ou dans la programmation, les membres de l'équipe doivent faire preuve d'innovation en imaginant des solutions visionnaires pour répondre chaque problématique » — Garrett Dimon


ACtIVItéS

Au niveAu teChnique. Le développeur web est impliqué dans toutes les étapes du projet du brainstorm créatif à la définition des fonctionnalités. Il prend connaissance des documents de conception (story-boards) et du design de l’interface pour évaluer leur faisabilité technique et les rend fonctionnels.

Il rédige, présente et passe en revue les livrables de développement, notamment l’architecture et les spécifications fonction-nelles. Il développe le code qui rend fonction-nel le design de l’interface, à partir de la stra-tégie créative et marketing. Il conçoit et met en oeuvre l’architecture des bases de données pour les applications dynamiques.

Il intègre les livrables front-office (gabarits HtML notamment) avec les principaux lan-gages orientés serveur (tels que PHP, ruby, Py-thon, Java, .Net), dans la plateforme technique (outils de gestion de contenu CMS, plateforme e-commerce , etc.). Il connecte l’interface du site avec des bases de données (telles que MySQL, PostgreSQL, SQLite, Oracle). Il peut aussi être amené à déployer le système de gestion de contenu (CMS). Il construit des composants réutilisables et des outils pour fa-ciliter le prototypage rapide. Il évalue l’intérêt de recourir à des méthodes alternatives pour atteindre ses objectifs techniques.

Il coordonne les tests pour s’assurer que l’interface réagit comme défini. Il propose et implémente des fonctionnalités nouvelles et des améliorations ergonomiques. Il optimise les performances des applications du site et

DéveLoPPeUR WeB

ACtIVItéS LIéES

programmeur ; développeur multimédia ; ingénieur de développement ; développeur d’applications riches ; développeur d’applications web ; développeur d’interfaces

Bien développer pour le Web 2.0, Christophe Porteneuve, eyrolles, 2008 (2ème édition)

High Performance Web Sites, Steve Souders, o’Reilly, 2007


des bases de données pour permettre une disponibilité et une efficience maximum. Il sécurise les applications. Il effectue une veille permanente sur les nouvelles technologies.

Au niveAu Du Client. Le développeur web participe au recueil des besoins et à la dé-finition du périmètre du projet. Il élabore des analyses fonctionnelles et traduit les besoins du client en recommandations techniques (en avant-vente et/ou sur des projets).

Il préconise les solutions techniques à mettre en oeuvre, notamment le choix de la plateforme, des outils et de la méthodologie adaptée.

Il élabore des présentations et la docu-mentation nécessaire pour communiquer les concepts, la modélisation fonctionnelle de l’interface et les choix techniques.

Le dévelopeur aide le chef de projet à répondre aux questions du client et joue un rôle dans la plannification en communiquant l’avancement du projet directement au client.

Il formalise la documentation qui accom-pagne les livrables. Il forme les utilisateurs à la plateforme à l’issue du projet.

Au niveAu De l’équipe. Le développeur web réunit les besoins tech-niques et design des équipes du projet. Il par-ticipe à la définition du périmètre du projet et à l’estimation en termes de charge de travail.

Il s’interface avec les designers et échange avec le développeur front-office pour assurer la cohésion graphique de l’interface. Il travaille notamment avec le directeur artistique pour garantir que les choix design peuvent être implémentés dans le périmètre technique et fonctionnel. Il facilite les échanges itératifs en-tre les designers et l’équipe technique.

Il travaille aux côtés du chef de projet in-teractif, des designers et de l’architecte de l’information pour influencer la qualité de l’expérience utilisateur et apporter toutes les améliorations nécessaires.

Il maintient à jour un document qui précise les standards de développement, les exigences de qualité pour le code. Il forme également les nouveaux membres de l’équipe.

DéveLoPPeUR WeB

Beautiful Code: Leading Programmers Explain How They Think, Andy oram, Greg Wilson, o’Reilly, 2007

Programming the World Wide Web, Robert W. Sebesta, Addison Wesley, 2009


PErSONNALItéS _ Garrett Dimon

_ Jason Fried

_ Yukihiro « Matz » Matsumoto

_ David Heinemeier Hansson

_ Why the Lucky Stiff

_ zed Shaw

_ Kasper Skårhøj

_ John Maeda

_ Linus torvalds

_ Jared tarbell

FOrMAtION _ Enic telecom Lille 1

_ Supinfocom

_ EPItA

_ IMAC

_ HEtIC

_ Gobelins

_ Ecole Nationale Supérieure d’Ingénieurs de Bourges

_ Ecole Nationale du Jeu et des Medias Interactifs Numériques

_ Institut des Applications Avancées de l’Internet (IAAI)


_ W3C www.w3.org _ the Web Standards Project www.webstandards.org _ Go4Expert www.go4expert.com _ WebDevForumswww.webdevforums.com _ HigherEdWebDev www.highedweb.org _ techrepublic www.techrepublic.com.com _ Evolt.org www.evolt.org


DéveLoPPeUR WeB

Internet & World Wide Web: How to Program, Paul J. Deitel, Harvey M. Deitel, Prentice Hall, 2007

The Pragmatic Programmer: From Journeyman to Master, Andrew Hunt, David thomas, Addison-Wesley Professional, 1999


MAGAzINES Et BLOGS _ www.01net.com

_ www.zdnet.com

_ news.cnet.com

_ www.phpmagazine.net

_ www.programmez.com

_ www.webmonkey.com


_ www.asp-php.net

_ www.developpez.com

_ devzone.zend.com/public/view

_ www.php.net

_ www.phpfrance.com

_ www.thinkvitamin.com

_ www.webdevelopersjournal.com

_ www.techcrunch.com

_ www.devlounge.net

éVéNEMENtS

_ techdayswww.microsoft.com/france/mstechdays

_ Google Developer Daycode.google.com/events/developer-day/2008

_ MIXwww.microsoft.com/events/mix

_ International PHP Conferenceit-republik.de/konferenzen/ipc/psecom,id,1.html

_ Future of Web Appslondon2008.futureofwebapps.com

_ Web 2.0 Expo en.oreilly.com/webexny2008/public/con-tent/home

_ dConstruct 2008.dconstruct.org

_ Web Developer Conferencewww.webdevconf.co.uk

_ An Event Apartwww.aneventapart.com/events

_ the rich web experiencewww.therichwebexperience.com


DéveLoPPeUR WeB

Building Scalable Web Sites, Cal Henderson, o’Reilly, 2006

Ergonomie du logiciel et design Web : Le manuel des interfaces utilisateur,Jean-François nogier, Dunod, 2008 (4ème édition)


e chef de projet interactif est garant de la mise en oeuvre complète de projets de design et de développement. En fonc-tion des contextes d’exercice du

métier (en agence ou chez l’annonceur, par ex-emple), les rôles et responsabilités du chef de projet interactif sont très variés.

Son intervention comprend le manage-ment de l’équipe, des ressources externes ou internes, le respect du budget, du calendrier (plannification), le suivi et l’attribution des tâches.

Il veille également à la rentabilité du projet et à sa qualité globale. Il assure en permanence la relation avec le client. Il peut travailler pour différents clients et sur des projets aussi divers que des campagnes d’e-mails marketing, des créations ou des refontes de sites Web, des campagnes de publicité interactives.

Le chef de projet interactif intervient aux différents moments clés : en phase de cadrage, en phase de conception, en phase de production, en phase de recettage/livraison/clôture. Il peut être mobilisé dans la mainte-nance du site.

L

chef de projet interactif « La gestion de projet web est devenue un enjeu de succès crucial pour une grande diversité d’organisations » — Real Web Project Management, thomas J. Shelford, Gregory A. Remillard, Addison-Wesley Professional, 2002


ACtIVItéS

en phAse De CADRAge. Le chef de projet interactif prépare et anime la réunion de lancement du projet (kick-off meeting). Il ré-dige un manuel d’organisation de projet (MOP) et met en place les comités de pilotage et les comités opérationnels. Il plannifie le calendrier du projet (planning).

Le chef de projet interactif construit l’équipe du projet, assigne les responsabilités de cha-cun, et recense les besoins en ressources. Il sélectionne des prestataires et des freelances selon les besoins. Il définit avec le client le périmètre du projet et peut être amené à for-maliser le cahier des charges.

en phAse De ConCeption. Le chef de projet interactif développe une compréhen-sion approfondie du métier de son client et de ses objectifs internes et externes. Il maîtrise à ce titre l’aspect technique aussi bien que de-sign en termes de méthodologie, et s’appuie sur ces connaissances pour définir l’utilisabilité des interfaces et leur faisabilité.

Il anime des réunions de travail avec le client. Si dans l’organisation de l’agence il n’existe pas d’architecte de l’information ou d’ergonome, le chef de projet prend en charge la formalisa-tion des story-boards et éventuellement les spécifications fonctionnelles, qu’il valide. Il peut jouer un rôle de conseil en formalisant des benchmarks concurrentiels et en formu-lant des recommandations.

CHeF De PRoJet InteRACtIF

ACtIVItéS LIéES

chef de projet web/multimédia ; directeur de production ; directeur de projet ; chef de projet technique ; responsable de l’expérience utilisateur (du projet) ; architecte de l’information

Conduite de projet web,Stephane Bordage, eyrolles, 2003

Conduite de projets en création numérique,Grégory Guéneau, eyrolles, 2005


en phAse De pRoDuCtion. Le chef de projet interactif prépare les différents types de réunion de suivi de projet. Il coordonne les dif-férents intervenants et prestataires entre eux pour que chacun prenne connaissance de son périmètre d’intervention, de la méthodologie et des deadlines. Il détaille à l’équipe de pro-duction sur leurs tâches respectives et en assure le suivi. Il s’assure que les priorités du projet sont clairement énoncées et comprises par l’équipe et s’efforce d’améliorer la col-laboration entre les intervenants (directeur de clientèle, directeurs techniques et respon-sables du design). Il s’assure que les éléments produits correspondent à ce qui a été spécifié et argumente efficacement les propositions design ou les recommandations de l’équipe.

Il prend en compte les retours du client sur les livrables et les demandes de modifications et les qualifie. Il gère ses attentes et priorise les demandes. Il suit le temps passé par les dif-férents intervenants du projet. Il s’assure de la bonne qualité des livrables.

Il évalue l’efficience des méthodes internes. Il diffuse les bonnes pratiques, les objectifs et les débriefs du client pour aider chaque mem-bre de l’équipe à progresser. Il établit une re-lation de pairs avec les autres chefs de projet et collabore avec eux à améliorer progressive-ment la méthodologie de gestion de projet. Il

gère la motivation des membres de l’équipe. Il résout les conflits et lève les blocages liés au projet.

en phAse De ReCettAge, livRAi-son, ClôtuRe. Le chef de projet interactif met en place des tests et toute la démarche afférente (scénarii , etc.). Il assigne les correc-tions aux bonnes personnes, les requalifie si besoin et suit les modifications. Il suit le dé-ploiement du projet. Il s’assure que le client dispose de tous les livrables prévus. Il envoie au client tous les éléments permettant de clô-turer le projet (procès verbal de recette).

Il organise, classe et archive tous les docu-ments et ressources (images, vidéos, docu-ments, etc.) relatifs au projet sur le réseau interne de l’agence et réalise le post-mortem.

Il génère, développe et conclut des oppor-tunités de nouveaux projets. Il formalise des devis pour les nouvelles demandes du client, en explique les charges de travail associées.


Web Project Survival Guide: Real World Tips For Bringing Projects In On Time, On Budget,Stan Shinn, RareClarity, 2004

Managing Web Projects: The Management of Large Projects, etc. J. Rodney turner, Gower Publishing Company, 2004


PErSONNALItéS _ Fredéric Cavazza

_ Stéphane Bordage

_ éric Di Pol

_ Jean-Luc Grellier

_ Scott Berkun

_ Meri Williams


_ Université de Marne-La-Vallée, Licence Multimédia et Arts Numériques

_ HEtIC


_ Institut international du multimédia (Léonard de Vinci)

_ Les grandes écoles de commerce : esCp – MS Stratégie et Management des Systèmes d’Information : E-Business, Conseil, Organisation, em lyon – Management et Développement des Systèmes, grenoble, ecole de managemenent – responsable d’activité Système d’Information, heC – Mastère Management et nouvelles technologies

_ CELSA


_ WOWwww.webprofessionals.org

_ Association for Project Management www.apm.org.uk

_ Australian Institute of Project Managementwww.aipm.com.au

_ UPA - the Usability Professionals’ Associationwww.usabilityprofessionals.org


_ Interaction Design Association (IxDA) www.ixda.org

_ ASIS&t the American Society for Information Science & technologywww.asis.org

_ Project Management Institute www.pmi.org


The Principles of Project Management,Meri Williams, SitePoint, 2008

Managing Interactive Media,elaine england, Andy Finney, Addison Wesley Publishing, 2007



MAGAzINES Et BLOGS _ www.superfiction.net/blog

_ www.scottberkun.com/blog

_ blog.juliendassonval.com

_ gestiondeprojets.wordpress.com

_ blog.geekmanager.co.uk

_ www.sqli-agency.com/blogs/emarketing-garden

_ gestiondeprojets.wordpress.com

_ www.fredericdevillamil.com

_ www.conduitedeprojetweb.com

_ www.qualitystreet.fr

_ www.gestiondeprojet.com

_ www.pmhut.com

éVéNEMENtS _ PICNICwww.picnicnetwork.org

_ Idea Conference ideaconference.org








The One-Page Project Manager for IT Projects,Clarck A. Campbell, Wiley, 2006

Making Things Happen, Scott Berkun, o’Reilly, 2008



e designer sonore exerce des activités ayant pour point com-mun la création sonore ap-pliquée. Comme le designer graphique et industriel, le de-

signer sonore articule fonction et esthétisme. Il peut déterminer en amont des objectifs de plusieurs ordres : ergonomie, mémorisation d’un message publicitaire, signalétique so-nore, feedback utilisateur, identité, etc.

Les applications du design sonore sont di-verses, de l’industrie automobile au cinéma, en passant par l’art contemporain. Le métier

de designer sonore pour le web demeure en définition, tant sa pratique est récente et hé-térogène. Sur Internet, on observe des atti-tudes très diverses : 1) absence pure et simple de sons, soit par omission, soit en raison de la nature, de la technologie ou de l’architecture du site ; 2) présence de sons, sous la forme de boucles musicales en arrière-plan, ou liés à la navigation, aux animations et aux choix opérés par l’utilisateur ; 3) expérimentations artistiques : musique générative, installa-tions sonores virtuelles (Cf. Edo Paulus), syn-thèse sonore et traitement audio avec Flash (Cf. André Michelle).

L

designer sonore« La musique commence là où s’arrête le pouvoir des mots. » — Richard Wagner


ACtIVItéS

Au niveAu Du Design et De lA teChnique. Le designer sonore observe l’actualité et connaît l’histoire musicale, so-nore, technologique, dispose d’une ouverture/approche transversale de la création multimé-dia/arts visuels/arts vivants/design.

Il crée des sons et musiques à l’aide d’outils de studio (mixage, effets, prise de sons, synthèse sonore, électro-acoustique, jeux d’instruments virtuels, acoustiques, électro-niques…).

Il propose une charte sonore et des ma-quettes au client en fonction du brief initial et des itérations successives. Il adapte le contenu sonore à l’espace, au contexte et aux modalités de diffusion (sphère privée/publique, espace réel/virtuel, usage personnel/professionnel,

utilité/distraction…). Il organise une veille ar-tistique et technologique.

Pour le web, un designer sonore gère les modalités d’apparition, de récurrence et de transition des sons. Elles dépendent notam-ment du type d’expérience proposée et des solutions permises par la technologie du site (Flash, HtML, JavaScript…).

Il teste l’interface afin de corriger les volumes et les panoramiques (place dans l’espace stéréophonique) respectifs des élé-ments sonores, les récurrences d’apparition, les modalités d’enchaînements des sons (dans le cas d’une musique générative).

Il intègre et encode dans l’interface des fichiers audio dans les formats spécifiés (MP3, AAC, OGG, , etc.). Il adapte le débit (bit rate) aux contraintes du site (capacités de transfert

ACtIVItéS LIéES

compositeur ; psychoacousticien ; bruiteur ; ingénieur du son ; illustrateur sonore ; plasticien sonore

The Computer Music Tutorial, Curtis Roads, Mit Press, 1996

Le Sonore et le visuel, Jean-Yves Bosseur, Daniel Charles, Alexandre Broniarski, Distributed Art Pub Inc (Dap), 1992

DeSIGneR SonoRe


côté serveur) et en fonction du public visé (côté client). Il effectue des tests sur plusieurs sys-tèmes d’exploitation et navigateurs Web.

Au niveAu Du Client. Le designer so-nore établit un brief créatif appliqué au design sonore. Le vocabulaire musical et sonore étant rarement partagé, il est courant de recourir à des valeurs et références extra-musicales pour communiquer efficacement : sentiments, métaphores, descriptions synesthésiques. Il écoute, observe et réagit au gré de l’évolution des étapes du projet.

Après validation du client, il remet un sup-port dit « master » comprenant les fichiers au-dio non compressés.

Au niveAu De l’équipe. Le de-signer sonore établit avec le client/directeur artistique un « cahier des charges sonore » associant les pré-requis techniques et créatifs (type de média, formats audio, mono/stéréo, linéaire/génératif, durées et modalités des rapports entre l’espace de présentation et les sons, interaction ou pas…). Lors de la phase d’intégration, il est en contact permanent avec le développeur afin de préserver les choix cré-atifs et d’optimiser les temps de chargement pour une « transparence » maximale.

les ChAmps D’AppliCAtion Du Design sonoRe. Le designer sonore pour l’industrie automobile cherchera par exemple à renforcer le sentiment de sécurité perçu lors d’une fermeture de portière. L’habillage sonore d’un tramway devra créer un climat propice à l’annonce de la prochaine station (mettre le voyageur en situation d’éveil per-ceptif). La charte sonore d’une radio ou d’une émission devra être facilement identifiable et porteuse des valeurs, de l’identité qui lui sont propres. Le travail sonore dans l’industrie se fo-calise parallèlement sur la réduction du niveau de bruit produit par l’utilisation d’un objet. Des ingénieurs acousticiens interviennent ainsi sur le choix des matériaux et de leur utilisa-tion (matériaux absorbants, pièges à son). Les objets électroniques du quotidien laissent une place croissante au design sonore : citons Nabaztag, le lapin communiquant multifonc-tions (design sonore de Jean-Jacques Birgé), mais aussi les téléphones portables, les réveils matin…

Au cinéma, un grand nombre de sons ne sont pas issus du lieu de tournage mais re-créés pendant la post-production, afin d’en isoler certains et d’amplifier les effets ressentis (lire les ouvrages de Michel Chion à ce sujet). Louis Dandrel parle du cinéma comme étant le « révélateur du design sonore ». En effet, une prise de son naturelle ne suffit pas toujours :

Real Sound Synthesis for Interactive Applications,Perry R. Cook, AK Peters, Ltd., 2002

Guide des objets sonores: Pierre Schaeffer et la recherche musicale, Michel Chion, Buchet Chastel, 1994

DeSIGneR SonoRe


les sons demandent à être corrigés, magnifiés, filtrés selon les effets scénaristiques ou drama-tiques souhaités (illustration, renforcement, contradiction…).

Le multimédia : Dans le contexte du jeu vi-déo, le design sonore est essentiel car il y joue plusieurs rôles simultanés : ambiance musi-cale, environnement sonore virtuel immersif, feedback sur l’action effectuée (coup, sort jeté, tirs…) et élément de l’interface et des menus. De plus, la nature interactive et non linéaire du jeu ajoute une dimension aléatoire et parfois générative qui rendent sa mise en œuvre dif-ficile mais passionnante.

PErSONNALItéS _ Pierre Schaeffer

_ Pierre Henry

_ Jean-Claude risset

_ Jean-Jacques Birgé

_ Michel Chion

_ Louis Dandrel

_ Ludovic Germain et Frédérique Guyot

_ roland Cahen

FOrMAtION _ IrCAM (Paris, France)

_ école nationale du jeu vidéo et des médias interactifs (Angoulême, France)

_ INA et le Lycée Evariste Galois

_ (Noisy le Grand – Val-de-Marne)

_ école Nationale Supérieure des télécommunications (Paris, France)

_ Columbia Academy (Vancouver, Canada)

_ Vancouver Film School (Vancouver, Canada)

_ the Center for Digital Imaging Arts at Boston University, (Boston, USA)

_ Université de technologie de Belfort Montbéliard , (Montbéliard, France)


_ IrCAM, Institut de recherche et de coordination acoustique musique

www.ircam.fr

Le Son Michel Chion, Armand Colin, 2005

L’Audio-Vision : Son et image au cinémaMichel Chion, Armand Colin, 2005, 2ème édition

DeSIGneR SonoRe


_ GrM, Le groupe de recherche musicale www.ina.fr/entreprise/activites/recherches-musicales/index.html

_ Sound designers www.sounddesigners.org

_ Société française d’acoustique www.sfa.asso.fr

_ Pan European Brand Design Association www.pda-europe.com

_ CEC cec.concordia.ca/cec-conference/index.html


MAGAzINES Et BLOGS _ 204.151.38.11/cmj, Computer Music Journal, magazine édité par le MIt

_ www.sounddesigners.org, forum de

professionnels autour du son à l’image

_ ressources.electro.free.fr, site de ressources sur la musique électro-acoustique

_ www.soundkonfusion.net

_ www.sfa.asso.fr

_ www.lecentreduson.info

_ www.admirabledesign.com

_ sonoriscausa.over-blog.com

éVéNEMENtS _ AES www.aes.org

_ La semaine du son www.lasemaineduson.org

_ Conferences IrCAM www.ircam.fr/conferences.html

_ ICAD – Internation Conference on Auditory Displaywww.icad.org

_ SAtISwww.satis-expo.com

_ MIDEM www.midem.com

L’Architecture sonore, Louis Dandrel, Atelier de sociologie, coll. Recherche nø1212000, Documents officiels, 2004

Exploring Sound Design for Interactive Media, Joseph Cancellaro, CenGAGe Delmar Learning, 2005

DeSIGneR SonoRe


e rôle du webmaster est de concevoir, d’implémenter et faire vivre un site Web efficace. Pour ce faire, le webmaster doit avoir des connaissances dans

divers domaines, tels que la configuration des réseaux, le design d’interface et le design graphique, le développement d’application, le marketing, l’écriture en ligne, et la gestion de projet. Comme la fonction de webmas-ter englobe de nombreux champs d’action, cette position est souvent occupée par une équipe et non par une personne seule.(the Webmasters’ Guild)

Le webmaster crée, programme et met à jour des pages web à l’aide des techniques de développement orientées client et serveur. Le webmaster est un professionnel pluridis-ciplinaire avec un large champ d’activités qui vont de la conception de l’interface au market-ing. Il travaille à l’amélioration permanente du site web et à sa gestion quotidienne.

L

webmaster« Le titre “webmaster” fait référence à un professionnel qui travaille sur le contenu final d’un site web. quand on regarde de plus près ses attributions, on voit qu’il existe plusieurs définitions possibles » — Webmaster in a Nutshell: A Desktop Quick Reference, S. Spainhour, v. quercia, o’Reilly, 2006


ACtIVItéS

Au niveAu Du Design. Le webmaster assure la maintenance et la mise à jour quo-tidienne du contenu du site. Il coordonne la production et l’implémentation de vidéos, de podcasts, de webcasts et d’autres contenus multimédias. Il met en place la procédure interne pour mettre à jour/modifier/réviser/valider le contenu. Il aide à la rédaction et à la modification du contenu du site, dans le re-spect des conventions d’écriture pour le web. Il conçoit et intègre en HtML des pages web, crée et optimise les images du site pour un affi-chage rapide et maintenir un design cohérent.

Il crée des bannières, des formulaires, des campagnes d’e-mail marketing et/ou des

newsletters. Il s’assure de l’accessibilité du contenu pour tous les utilisateurs, selon les critères énoncés par les organismes référents. Il développe le trafic du site web et promeut son contenu à travers des campagnes de pub-licité interactives.

Il rédige le cahier des charges pour un nouveau projet et pilote l’agence pendant pendant son développement. Il met en place un rapport d’audience mensuel pour mesurer la perfor-mance du site.

Au niveAu teChnique. Le webmaster développe et optimise des pages HtML et des scripts côté client. Il effectue le recettage, et optimise la performance du site. Il apporte son

ACtIVItéS LIéES

webmestre ; responsable multimédia/internet ; chef de projet web ; web designer ; développeur front-office ; intégrateur HtML ; concepteur multimédia ; responsable du site

Designing Web Interfaces: Principles and Patterns for Rich Interactions, Bill Scott, theresa neil, o’Reilly, 2009

Conduite de projets en création numérique,Gréogory Guéneau, eyrolles, 2005

WeBMASteR


aide pour la mise en place de nouvelles fonc-tionnalités et de nouveaux développements. Il intègre les contenus dans le système de ges-tion de contenu (CMS). Il s’assure du référence-ment du contenu du site.

Il intègre les critères d’accessibilité et s’assure que le code du site est développé selon les standards. Il veille à la compati-bilité du site sur les différents navigateurs et systèmes d’exploitation. Il travaille pour que les pages mises en ligne soient conformes à l’identité de la marque, la charte graphique, technique et éditoriale et à la politique de con-fidentialité du site.

Il recueille les commentaires des utilisa-teurs et répond à leurs e-mails. Il conduit des études en ligne et organise régulièrement des tests utilisateurs. Il analyse mensuellement l’audience du site et en dégage des recom-mandations marketing.

Au niveAu De l’équipe. Le webmas-ter prend en charge la gestion du projet en in-cluant l’analyse des besoins, sa formalisation dans un cahier des charges, son intégration et sa validation. Il travaille en collaboration avec l’équipe marketing pour définir la stratégie, développer, mettre en oeuvre et mesurer le résultat des campagnes d’e-mail marketing. Il

assure l’intermédiaire entre le marketing et les développeurs Web et d’éventuels prestataires externes. Il constitue et dirige une équipe de collaborateurs internes et externes.

Conduite de projet web,Stéphane Bordage eyrolles, 2006


WeBMASteR


PErSONNALItéS _ rapahël Goetter

_ Laurent Denis

_ Olivier Andrieu

_ tim Berners Lee

_ Molly Holzschlag

_ Eric Meyer

_ Garrett Dimon

_ Jeffrey zeldman

_ Dave Shea

_ Christophe Porteneuve


_ Université de Marne-La-Vallée, Licence Multimédia et Arts Numériques

_ HEtIC


_ Institut International du Multimédia (Léonard de Vinci)

_ IUt Evry – Licence Professionnelle Commerce option « Marketing et commerce sur internet : les métiers du e-business »

_ CELSA

_ ItECOM, Institut privée des technologies de la Commmunication & des Arts Appliqués

_ IUt,Paris V, Licence professionnelle, activités et techniques de communication, spécialité webmaster éditorial


_ Not-For-Profit Webmaster round table www.webroundtable.org

_ World Organization of Webmasters www.webprofessionals.org

_ International Webmasters Association www.iwanet.org

_ National Association of Government Webmasters (U.S.) www.nagw.org

_ UPA - the Usability Professionals’ Association www.usabilityprofessionals.org


_ Interaction Design Association (IxDA)

L’écrit web, traitement de l’information sur Internet,Joël Ronez, editions CFPJ, 2007

Réussir son site web en 60 fiches,Jean-Marc Hardy, Gaetano Palermo, Dunod, 2008 (2ème édition)

WeBMASteR


www.ixda.org

_ ASIS&t the American Society for Information Science & technology www.asis.org


MAGAzINES Et BLOGS _ wowtechminute.com

_ www.openweb.eu.org

_ www.pompage.net


_ www.allhtml.com

_ www.nouveau-webmaster.fr

_ www.google.com/webmasters

_ googlewebmastercentral.blogspot.com


_ www.sitepoint.com

_ www.abondance.com

_ thinkvitamin.com

_ webdevelopersfieldguide.com

_ www.presse-citron.net

éVéNEMENtS _ Web Directions www.webdirections.org

_ Webmasters Expo www.webmasters-expo.com

_ Paris web www.paris-web.fr

_ An Event Apart www.aneventapart.com



_ South by Southwest Conference www.sxsw.com

_ Web design World www.ftponline.com/conferences/web-designworld

_ Voices that Matter www.voicesthatmatter.com

_ WOW2009Spain www.wow2009spain.org

Webmaster in a Nutshell: A Desktop Quick Reference,Stephen Spainhour, valerie quercia, o’Reilly, 2006

Information Architecture for the World Wide Web: Designing Large-Scale Web Sites, Louis Rosenfeld, Peter Morville, o’Reilly, 2006

WeBMASteR


contributeursRédaction en chef du document : Benoît DrouillatSecrétariat de rédaction : Fabienne Guibé

Contributions : Amélie Boucher, Guillaume Brachon, Xavier Collet, olivier Dexant, emmanuel Diner, eric Di Pol, Benoît Drouillat, Sacha Gattino, valéry-xavier Lentz, Pierre Magnol, Philippe Mermi, tran nguyen ngoc, vivien Ripoche, Julien Strulens, Alexandre tonneau.

*designers interactifs* est une association dont l’objectif est

d’organiser et de promouvoir les professionnels qui conçoivent des

interfaces, des services et des objets numériques.

200 membres indépendants, salariés, agences, annonceurs,

étudiants et écoles de design s’organisent pour la

reconnaissance de ces métiers, en France et en Europe.

A travers un programme de 7 missions, l’association cherche

à inventer les définitions et les contours des métiers du design

interactif, et suivre leur évolution.

Une diversité de nouveaux métiers a changé la donne au sein du design, depuis le début des années 1990 et l’avènement des médias et des outils numériques. Ces nouveaux métiers à la terminologie et aux définitions floues, fluctuantes en fonction du contexte culturel (et géographique) ont été laissés pendant longtemps, de par leur nature évolutive, sans définition satisfaisante. Pour retirer les bénéfices de la pratique du design numérique, la compréhension et le suivi de ces métiers à travers un observatoire a semblé indispensable à *designers interactifs*. L’association a tenté de combler ce manque à travers la deuxième édition de son référentiel métier élaboré par les professionnels eux-mêmes. Au terme d’ateliers et d’une longue réflexion, l’observatoire des métiers de *designers interactifs* livre le résultat de ses recherches sur les métiers du design numérique, sous la forme d’un livre blanc de 13 fiches métiers, etc.

Avec le soutien de la Délégation aux Usages de l’Internetwww.metiers.internet.gouv.fr

un nuage de nouveaux

métiers, des définitions

à inventer