Metiers Design Numerique 2009

5 499 vues

Publié le

Livre blanc sur les métiers du design numérique, édition 2009.

1 commentaire
12 j’aime
Statistiques
Remarques



  • <b>[Comment posted from</b> http://www.nicolasaguenot.com/nicoandco/index.php?post/2009/04/18/Les-m%C3%A9tiers-du-design-num%C3%A9rique]
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
Aucun téléchargement
Vues
Nombre de vues
5 499
Sur SlideShare
0
Issues des intégrations
0
Intégrations
753
Actions
Partages
0
Téléchargements
597
Commentaires
1
J’aime
12
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Metiers Design Numerique 2009

  1. 1. les métiers du design numérique 2009
  2. 2. 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
  3. 3. 13 métiers du design numérique | 5 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 à partird’unediversitédesources 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 dudesignnumériqueontsuscité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•WebInformationArchitect•User ExperienceConsultant•WebProjectManager • HTML Coder • Webdesigner • WebMaster • Designer sonore • Flash Developer • Flash Animator • Motion designer • E-Marketing Consultant•Webdeveloper•MotionGraphics Designer•DigitalVideoProducer•Marketing Coordinator•WebGraphicsProductionArtist •WebPageProductionArtist•WebProducer • 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
  4. 4. • 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 Dansl’apparitionprogressivedecesmé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 muterontversd’autresformes,seconfondront 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. EtienneMineurrappelledanssaconférence (Une)histoiredudesigninteractifquelechamp 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ésaupublicprofessionnel.BillMogridge le souligne dans Designing Interactions, le design de l’interface logicielle et de l’objet- interfacesontindissociables.Cettearticulation 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,labarredenavigationproposeun 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ématiquedes«Nouveauxdesignpourune
  5. 5. nouvelleindustrie»(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. Cettedeuxièmeéditiondulivreblancnefait quemarqueruneétapedanslarepré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 offreunephotographieactualiséedesmé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 Drouillat Présidentfondateurde*designersinteractifs* Janvier 2009
  6. 6. 13 métiers du design numérique | 9 introduction par 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 communicationetducommerce é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 étanttraditionnellementclasséesenbranches, 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 sesclassifications,sesconventions,sesacquis. 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
  7. 7. 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, maisforceestdeconstaterqu’ellessontencore 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. Cecidémontrequ’ilyadenouveauxchamps 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 tempsd’enrichirlaprochaineversionduportail des Métiers de l’Internet dont l’objectif est d’informer,orienteretfavoriserlavisibilitédes nouveaux métiers liés au développement de l’Internet.L’association*designersinteractifs* et le Portail des Métiers de l’Internet mettent encommunleursénergiesafindepromouvoir les métiers innovants et les talents de tous ceux qui les exercent. Claude Reynié ChargéedemissionàlaDélégationauxUsages de l'Internet pour le portail des Métiers de l'Internet www.metiers.internet.gouv.fr
  8. 8. 13 métiers du design numérique | 13 edirecteurdecréationinteractif auneconnaissanceapprofondie 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 choixdudesign.Ildirigeleseffortsdel’équipe decréation(directeursartistiques,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
  9. 9. 14 | Les métiers du design numérique Activités  Au niveau du design. Le directeur de création interactif traduit les objectifs marketingdesesclientsenstratégiescréatives etdirigelaréalisationdeprojetsdedesigndela définition de la conception à la validation des livrables. Il intervient sur une diversité de problématiques:sitesdemarques,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,encollaborationaveclesdirecteurs artistiquesinteractifs.Ilformaliseainsilesbriefs 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
  10. 10. 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 etvalidedesdevispourlacréation,s’assurede 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 entrel’équipecréativeetleclient,recueilleles retours du client. Il communique à toutes les personnes prenant part au projet les concepts créatifs, la stratégie et les livrables. Ilorchestrelesréponsesàdescompé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’étatd’avancementdeslivrablesàréaliserpar toutes les équipes participant au projet. Iltravailleaveclesdifférentsresponsablesdu 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. directeur de création interactif 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 Sites Louis Rosenfeld, Peter Morville, O’Reilly, 2006
  11. 11. 16 | Les métiers du design numérique 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 Associations professionnelles et communautés __ Interaction Design Association (IxDA) www.ixda.org __ Design Council www.designcouncil.org.uk __ APCI www.apci.asso.fr __ Alliance Française des Designers (AFD) www.alliance-francaise-des-designers.org directeur de création interactif Designing Interfaces, Jenifer Tidwell, O’Reilly, 2006 Designing Web Interfaces: Principles and Patterns for Rich Interactions, Bill Scott & Theresa Neil, O’Reilly, 2009
  12. 12. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 17 __ 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 & North www.webdirections.org __ Dconstruct www..dconstruct.org __ South by Southwest, www.sxsw.com __ Future of Webdesign, www.futureofwebdesign.com __ @media, www.vivabit.com/atmedia __ OFFF www.offf.ws __ ARS Electronica www.aec.at __ PICNIC, www.picnicnetwork.org __ Transmediale www.transmediale.de directeur de création interactif 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
  13. 13. 13 métiers du design numérique | 19 e directeur artistique interactif s’approprielemétierduclientet ses objectifs de communication pourlestraduireenrecomman- 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 choixconceptuels,fonctionnelsetstylistiques pourpréparerletravaildel’équipedesignqu’il dirige. Il est en relation avec le client, et col- laboreavecledirecteurdecré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
  14. 14. 20 | Les métiers du design numérique Activités  Au niveau du design. Le directeur artistiqueinteractifparticipeàl’élaborationdu briefcréatif,auxbrainstormspourpositionner 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’ergonomiedel’interface,sescontrainteset lesopportunitésqu’offrentleslangagesdepro- grammation et les outils. Il contribue à super- viserdesstratégiescréatives,créeledesignvi- suel,endéfinissantdeschoixtypographiques, 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,soumetdesidéesdefonctionnalités, élabore l’organisation spatiale des pages, des maquettesd’interfacesetleslivrablesfinaux.Il s’assure que les choix du design sont en phase aveclavisionduprojettellequedéfiniedansla 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 demaquettes,enparticipantauxsoutenances 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
  15. 15. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 21 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. Ilprendencomptelesremarquesduclientet y donne suite de manière appropriée, notam- mentlesdemandesdemodificationsetlamise à 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. Ilassurelaqualitédetousleslivrablescréatifs et veille au respect du concept originel pen- dant la phase de production. Au niveau de l’équipe.Ledirecteur 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 lesautresdesigners,lescollaborateursjuniors, indépendantsetstagiairessurtouslesprojets. 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équipesetàaméliorerleprocessusdecré- 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. directeur artistique interactif 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
  16. 16. 22 | Les métiers du design numérique Personnalités __ Joshua Davis __ Marcus Ericsson __ Robert Lindström __ Masayuki Kido __ Etienne Mineur __ Adhemas Batista __ Florian Schmitt __ Andreas Pihlström __ Arnaud Mercier __ Johan Bakken 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) __ 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 __ USC Interactive Media __ Parsons Communication Design & Technology Associations professionnelles et communautés __ Interaction Design Association (IxDA) www.ixda.org __ Design Council www.designcouncil.org.uk __ APCI www.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 directeur artistique interactif
  17. 17. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 23 __ D&AD www.dandad.org __ ADC Global www.adcglobal.org __ *designers interactifs* www.designersinteractifs.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 & North www.webdirections.org __ Dconstruct www..dconstruct.org __ South by Southwest www.sxsw.com __ Future of Webdesign www.futureofwebdesign.com __ @media www.vivabit.com/atmedia __ OFFF www.offf.ws __ ARS Electronica www.aec.at __ PICNIC www.picnicnetwork.org __ Transmediale www.transmediale.de __ The rich web experience www.therichwebexperience.com __ Web Directions www.webdirections.org Advertising Now. Online, Julius Wiedemann, Taschen, 2008 The Web Designer’s Idea Book, Patrick Mcneil, How 2008 directeur artistique interactif
  18. 18. 13 métiers du design numérique | 25 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 dessitesweb,intranet,extranet,desportails, 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,sesactivitéssontsouventenrecoupe- mentaveccellesduwebmaster,voirecellesdu 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- tagecommeundesignerquecommeuntech- nicien.Laconception(livrables:story-boards) estunaspectdeplusenplussouventcité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),sesspécialitésvarientetpeuvent, parexemple,offriruneplacepluscentraleàla gestiondeprojet(notammentenentreprise). Souvent, le type d’outils maîtrisés par le web designer oriente ses activités. Mais en aucun casêtrewebdesignerneseréduitàlamaî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
  19. 19. 26 | Les métiers du design numérique Activités Auniveaududesign.Lewebdesigner 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,desmaquettesetdesprototypes pour représenter les principes du design et le comportement de l’interface. Notamment, il créédesgabaritsdepageàtraversunemiseen scènedel’informationpertinenteauregarddes principes universels et de la charte graphique liée à la marque. A ce titre, il recherche en permanencedel’informationetlesmeilleures 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 lesprincipesd’identitédelamarque.Pourcela ildisposededocumentsderéférences,comme lachartegraphiqueprintet/ouweb.Ils’appuie également sur les standards établis et les bonnes pratiques. Pour chaque contrainte ou opportunitétechniqueliéeàlapartievisiblede 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
  20. 20. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 27 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.Lewebdesigner é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 conceptsdesign.Ilsuitlesdirectionsindiqué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.Iltravailleenétroitecollaborationavec 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 lesrèglesgraphiquesdel’interfacepourguider le travail de développement. Ergonomie web, Amélie Boucher, Eyrolles, 2007 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
  21. 21. 28 | Les métiers du design numérique 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) Associations professionnelles et communautés __ Designer’s Talk www.designerstalk.com/forums __ Coroflot www.coroflot.com __ Alsacréations css.alsacreations.com __ Interaction Design Association www.ixda.org __ Kob One www.kob-one.com __ AIGA www.aiga.org __ Web Standards, www.webstandards.org __ Media Box www.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
  22. 22. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 29 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 south south08.webdirections.org __ An Event Apart www.aneventapart.com __ South by Southwest www.sxsw.com __ Future of Webdesign www.futureofwebdesign.com __ @media www.vivabit.com/atmedia __ Paris web www.paris-web.fr __ Web design World www.webdesignworld.com __ PICNIC www.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
  23. 23. 13 métiers du design numérique | 31 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 esponsabledelastructureetde laterminologieducontenud’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- teractiveduprojetpourpermettreauxutilisa- teurs de combler leur besoin en information et faciliter l’accomplissement d’activités que le service propose. De part la transversalité quesoninterventionimplique,l’architectede 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 lecomportementdesutilisateursensolutions 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.
  24. 24. 32 | Les métiers du design numérique Activités  Au niveau du design. L’architecte de l’information définit des structures, des taxinomiesetdessystèmesdenavigationpour dessitesinternet,extranetetintranetainsique pour d’autres types d’applications en ligne. Il imaginedessolutionsquicomblentlesbesoins marketing et les objectifs des utilisateurs. Il mène des analyses concurentielles (comprenant : utilisabilité, interaction et design d’interface…). Il planifie, conduit ou participeàlarechercheetauxtestsutilisateurs (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’élaborationducahierdescharges enmenantdesséancesdetravailavecleclient, àl’aided’unbenchmarkconcurrentiel.Ildresse l’inventaire du contenu disponible. Ilprésentetouteslesétapesdel’architecture de l’information et du design d’interface aux membresdel’équipeetauclient.Ilconduitdes 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 Ergonomie web, Amélie Boucher, Eyrolles, 2007
  25. 25. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 33 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) sertlesens(laperceptionetlacompré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. Ilprendpartàdessessionsdebrainstorming 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. architecte de l’information 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 Govella New Riders Press, 2009 (2nd edition)
  26. 26. 34 | Les métiers du design numérique 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 formation __ Gobelins, l’école de l’image __ 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 Associations professionnelles et communautés __ 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’ Association www.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 architecte de l’information
  27. 27. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 35 __ AIGA – Experience Design www.aiga.org __ IIID Vision Plus www.iiid-visionplus.net __ *designers interactifs* www.designersinteractifs.org 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 Summit www.iasummit.org __ Euro IA www.euroia.org __ Idea Conference ideaconference.org __ World Usability Day www.worldusabilityday.org __ UPA Conferences www.upassoc.org/conference __ Interaction 09 (IxDA) interaction09.ixda.org __ IA Konferenz www.iakonferenz.org __ Web Content Conferences www.webcontentconferences.com __ UX London uxlondon.com __ UX Week www.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 architecte de l’information
  28. 28. 13 métiers du design numérique | 37 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 assurerlacohésionetlaconformitédeschoix 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
  29. 29. 38 | Les métiers du design numérique Activités Au niveau du design. Le consul- tant ergonome définit l’expérience utilisa- teurd’interfacesdetéléphonesmobiles,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 analysesconcurrentielles, desrechercheseth- nographiques,desséancesdeco-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- transcritlesrésultatsdestestsetlescommen- 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,diagrammesetspécificationsfonction- 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)
  30. 30. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 39 cilite l’exploration des besoins fonctionnels et marketingàtraversdesentretiensetdeswork- 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 lesdonnées,élaboreetprésentedescomptes- rendus écrits pour les conclusions des re- cherches et les livrables de l’architecture de l’information (tels que des arborescences et desstory-boards).Ilapportedesréponsesaux problématiques du client et émet des recom- mandations pour la conception de l’interface etsaréalisation.Ilconduitlesréunionsdevali- dation avec le client et adopte le point de vue del’utilisateurtoutengardantàl’espritlesim- pératifs marketing. Au niveau de l’équipe. Le consul- tant ergonome fait circuler l’information et notamment rend compte aux personnes par- ticipantauprojetdestravauxmenésentermes d'utilisabilité pour en assurer la réussite. Il se chargedelaformationdeséquipesenergono- 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 lesrédacteursquetousleslibellés(navigation, bouton et étiquettes des champs) sont clairs, concis et facilement utilisables. Il s’assure que lespointcritiquesdel’expérienceutilisateurde 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
  31. 31. 40 | Les métiers du design numérique 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 __ Carnegie Mellon University __ Linköping and Stockholm University __ Université de technologie de Belfort Mont- béliard __ Stanford Institute of Design | d.school Associations professionnelles et communautés __ Human Factors and Ergonomics Society www.hfes.org __ 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 Sites Louis Rosenfeld, Peter Morville, O’Reilly, 2006 Usability for the Web, Tom Brinck, Darren Gergle, Scott D. Wood, Morgan Kaufmann, 2001 consultant ergonome
  32. 32. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 41 __ The Information Architecture Institute www.iainstitute.org __ Interaction Design Association (IxDA) www.ixda.org __ User Experience Network www.uxnet.org __ *designers interactifs* www.designersinteractifs.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.boxesandarrows.com __ www.informationdesign.org __ www.uie.com événements __ CHI 2009 www.chi2009.org __ European Conference on Cognitive Ergo- nomics ww.eace.info __ World Usability Day www.worldusabilityday.org __ IA Summit www.iasummit.org __ Euro IA www.euroia.org __ UPA Conferences www.upassoc.org/conference __ Interaction 09 (IxDA) interaction09.ixda.org __ UX London uxlondon.com __ UX Week www.uxweek.com 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
  33. 33. 13 métiers du design numérique | 43 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- minalmobile,d’unsiteweb,d’unlogiciel,d’un objet interactif ou d’un service. Dans le but de faciliter l’utilisation du produitetd’optimiserl’expérienceutilisateur, ledesignerd’interactiondisposedetouteune 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 sontformalisésparundocumentdespécifica- tionsquisertensuitedefilconducteurpourla 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
  34. 34. 44 | Les métiers du design numérique Activités  Au niveau du design. Le designer d’interaction conduit ou exploite des recher- chessurlesutilisateursetlespartiesprenantes d’unprojet.Ildéfinitlesbesoinsdesutilisateurs 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 livrablespendantleurproduction.Ilélaboreou 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éveloppementdeprototypespourmenerles testsutilisateurs.Ilorienteledesign,inspireles clientsetsuscitel’adhésionauseindel’équipe parlaformalisationdesbesoins,laconception 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
  35. 35. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 45 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 maquettesinteractivesgrâceàunoutildepro- 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’interactionintègrelesbesoinscommerciaux 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 à lafoisauxbesoinsdesutilisateursetauxobjec- 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.Ledesigner 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. designer d’interaction Sketching User Experiences: Getting the Design Right and the Right Design Bill Buxton, Morgan Kaufmann, 2007 Thoughts on Interaction Design, Jon Kolko, Brown Bear LLC, 2007
  36. 36. 46 | Les métiers du design numérique 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 __ Carnegie Mellon University __ GVU Center – Georgia Tech __ School of Literature Communication and Culture – Georgia Institute of Technology __ Simon Fraser University __ Interaction Design, advanced – Malmö högskola Associations professionnelles et communautés __ Agence pour la Promotion de la Création Industrielle (APCI) www.apci.asso.fr __ Institut Français du Design www.institutfrancaisdudesign.com __ FING www.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 designer d’interaction
  37. 37. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 47 __ *designers interactifs* www.designersinteractifs.org __ Interaction Design Association www.ixda.org __ Design Council www.designcouncil.org.uk __ Human Factors and Ergonomics Society www.hfes.org __ ACM SIGCHI www.sigchi.org __ SIGGRAPH www.siggraph.org __ AIGA www.aiga.org __ ACID www.acid.net.au magazines et blogs __ www.internetactu.net __ www.interaction-design.org __ interactions.acm.org __ www.informationdesign.org __ www.boxesandarrows.com __ 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- triel www.digitallyours.fr __ CHI Conference www.chi2008.org __ IxDA Interaction interaction09.ixda.org __ SIGCHI www.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 Interfaces www.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 designer d’interaction
  38. 38. 13 métiers du design numérique | 49 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ésavecledirecteurartistique,dotésde 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étapedutravaildecréation, àlarechercheduconceptetauxstory-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
  39. 39. 50 | Les métiers du design numérique 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- mentenFlash.Ilsdéterminentlafaisabilité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. Ilstranscriventlesconceptscréatifsetlesci- nématiquesenanimationsFlash.Ilsencodent, 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.Pourillustrerunconcept,enparticu- 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
  40. 40. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 51 Au niveau du développement. Le développeur Flash établit l’architecture technique appropriée pour l’application, fon- déesurle périmètre du projetetses 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.Ilaméliorelaperformanceetop- 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.  animateur et développeur Flash 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
  41. 41. 52 | Les métiers du design numérique Personnalités __ Colin Moock __ Erik Natzke __ Joshua Davis __ Aral Balkan __ Mike Chambers __ Darron Schall __ Joey Lott __ Jared Tarbell __ Yugo Nakamura __ Hoss Gifford formation __ Gobelins, l’école de l’image __ 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 __ USC Interactive Media __ Parsons Communication Design & Technology __ Savannah College Of Art And Design Interactive Design and Game Development Associations professionnelles et communautés __ 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 __ *designers interactifs* www.designersinteractifs.org Essential ActionScript 3.0, Colin Moock, O’Reilly, 2007 Adobe Flash CS4 Professional Classroom in a Book, Adobe Creative Team, Adobe Presse, 2008 animateur et développeur Flash
  42. 42. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 53 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 animateur et développeur Flash
  43. 43. 13 métiers du design numérique | 55 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,dansdesdomainesaussidistinctsque lapublicité,lemarketing,ladiffusionté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ésdel’identitévisuelleavantdeproduire 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 enscénariseledéroulement),définitleschoix 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ètentletravaild’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.
  44. 44. 56 | Les métiers du design numérique Activités Au niveau du design.Lemotionde- signerparticipeàlarechercheduconceptetau 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 à partirdesconceptboardsetdemaquettesdes é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- tionsetdesinstallationsgraphiques.Pourcha- cun,ils’appuiesurdesstory-boards,saculture graphique et les objectifs du client. Au niveau technique.Lemotionde- signer gère les ressources graphiques et leur rendudansl’animation.Iladaptesontravailau 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
  45. 45. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 57 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,lesaffineretlesvalider.Ilcommunique 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’à lavalidationduprojet.Ils’assurequelesinten- tionsetlamiseenoeuvredesidéesgraphiques 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.Ils’assurequel’équipesuitlesspécifi- cationsdemandées.Ilcoordonnelesé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
  46. 46. 58 | Les métiers du design numérique 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 Associations professionnelles et communautés __ 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
  47. 47. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 59 __ 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 __ OFFF www.offf.ws __ Cut & Paste www.cutandpaste.com __ F5 www.f5fest.com __ FITC www.fitc.ca __ Motion www.motionconference.com __ Onedotzero www.onedotzero.com __ Semi-Permanent www.semipermanent.com __ Dotmov Festival www.shift.jp.org/mov __ The Radar Festival www.radarmusicvideos.com __ Motion Graphics Festival www.mgfest.com __ Festival Nemo www.arcadi.fr __ Festival d’Annecy www.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
  48. 48. 13 métiers du design numérique | 61 edéveloppeurfont-officetrans- formelesmaquettesd’interface fourniesparl’équipecréativeen gabarits (X)HTML et des feuilles de styles (CSS : Cascading Style Sheet) pouvant s’afficher dans un navigateur web,pourdesapplicationsalimentéesencon- tenus par des bases de données. Il conçoit, code et gère l’interactivité des pagesselondesméthodesdeprogrammation orientéesclientetserveur.Iléchangeavecles designerspourlesaideràcomprendrelescon- 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- officeestresponsabledel’intégrationducon- 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
  49. 49. 62 | Les métiers du design numérique Activités Auniveaududesign.Ledé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, pourdesinteractionscomplexes,avecdeslan- gagesorientésclientcommeAjaxetJavaScript. Ilapportedesrecommandationspouramé- liorer l’utilisabilité à partir des techniques de développementorientéesclientetsaconnais- sance des interfaces. Il intègre des interfaces conformesauxnormesd’accessibilité(Section 508auxÉtats-UnisetAccessiwebenFrance).Il optimise les images pour obtenir la meilleure vitessedechargement.Ilfournitdesé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 audéploiementd’unsiteoud’uneapplication. 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)
  50. 50. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 63 éléments multimédias telles que les anima- tions Flash, les images ou encore les podcasts. Ilreconnaîtetrésoudlesproblèmesdeconcep- 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 entrelesdesignersetlesdéveloppeursduback- office.Iléchangeaveclesdirecteursartistiques et les designers pour s’assurer que le design peutêtreaccomplidanslecadredesspé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 ducalendrier,àl’identificationetl’anticipation des problèmes et des risques et communique sur l’état d’avancement des livrables aux per- sonnes participant au projet. développeur front-office Réussir son site Web avec XHTML et CSS, Mathieu Nebra, Eyrolles, 2008 CSS: The Definitive Guide Eric Meyer, O’Reilly, 2006
  51. 51. 64 | Les métiers du design numérique 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 formation __ Gobelins, l’école de l’image __ L’école Multimédia __ HETIC __ Institut International du Multimédia (Léo- nard de Vinci) __ ESIEE Paris – Mastère Ingénierie des mé- dias numériques Associations professionnelles et communautés __ 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 __ *designers interactifs* www.designersinteractifs.org 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 développeur front-office
  52. 52. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 65 magazines et blogs __ www.openweb.eu.org __ www.pompage.net __ css.alsacreations.com __ www.cssbeauty.com __ www.alistapart.com __ www.digital-web.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 __ Future of Webdesign www.futureofwebdesign.com __ Web Directions www.webdirections.org __ 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) développeur front-office
  53. 53. 13 métiers du design numérique | 67 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 nonvisibledesélémentsdel’interface.Ilveille àl’intégrationdesapplicationsetdesservices dans un site web ou un intranet. Il contribue au processus créatif en apportantsonpointdevuesurlamodé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 maisaussiensignalantdesopportunitéstech- 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
  54. 54. 68 | Les métiers du design numérique 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 enoeuvrel’architecturedesbasesdedonnées pour les applications dynamiques. Il intègre les livrables front-office (gabarits HTML notamment) avec les principaux lan- gagesorientésserveur(telsquePHP,Ruby,Py- thon,Java,.Net),danslaplateformetechnique (outilsdegestiondecontenuCMS,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
  55. 55. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 69 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.Ledéveloppeur webparticipeaurecueildesbesoinsetàladé- finition du périmètre du projet. Il élabore des analyses fonctionnelles et traduit les besoins duclientenrecommandationstechniques(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 lacohésiongraphiquedel’interface.Iltravaille notamment avec le directeur artistique pour garantir que les choix design peuvent être implémentés dans le périmètre technique et fonctionnel.Ilfaciliteleséchangesitératifsen- 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 lesstandardsdedéveloppement,lesexigences dequalitépourlecode.Ilformeégalementles 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
  56. 56. 70 | Les métiers du design numérique 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) Associations professionnelles et communautés __ W3C www.w3.org __ The Web Standards Project www.webstandards.org __ Go4Expert www.go4expert.com __ WebDevForums www.webdevforums.com __ HigherEdWebDev www.highedweb.org __ TechRepublic www.techrepublic.com.com __ Evolt.org www.evolt.org __ *designers interactifs* www.designersinteractifs.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
  57. 57. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 71 magazines et blogs __ www.01net.com __ www.zdnet.com __ news.cnet.com __ www.phpmagazine.net __ www.programmez.com __ www.webmonkey.com __ www.alistapart.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 __ Techdays www.microsoft.com/france/mstechdays __ Google Developer Day code.google.com/events/developer- day/2008 __ MIX www.microsoft.com/events/mix __ International PHP Conference it-republik.de/konferenzen/ipc/ psecom,id,1.html __ Future of Web Apps london2008.futureofwebapps.com __ Web 2.0 Expo en.oreilly.com/webexny2008/public/con- tent/home __ dConstruct 2008.dconstruct.org __ Web Developer Conference www.webdevconf.co.uk __ An Event Apart www.aneventapart.com/events __ The rich web experience www.therichwebexperience.com __ Web Directions www.webdirections.org 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)
  58. 58. 13 métiers du design numérique | 73 e chef de projet interactif est garant de la mise en oeuvre complète de projets de design et de développement. En fonc- tiondescontextesd’exercicedu métier(enagenceouchezl’annonceur,parex- emple),lesrôlesetresponsabilitésduchefde 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àsaqualitéglobale.Ilassureenpermanence larelationavecleclient.Ilpeuttravaillerpour différentsclientsetsurdesprojetsaussidivers 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,enphasedeconception,enphasede 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
  59. 59. 74 | Les métiers du design numérique Activités en phase de cadrage. Le chef de projet interactif prépare et anime la réunion delancementduprojet(kick-offmeeting).Ilré- digeunmanueld’organisationdeprojet(MOP) et met en place les comités de pilotage et les comitésopérationnels.Ilplannifielecalendrier du projet (planning). Lechefdeprojetinteractifconstruitl’é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.Lechefde 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 surcesconnaissancespourdéfinirl’utilisabilité des interfaces et leur faisabilité. Ilanimedesréunionsdetravailavecleclient. Sidansl’organisationdel’agenceiln’existepas 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
  60. 60. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 75 enphasedeproduction.Lechefde projetinteractifpréparelesdifférentstypesde réuniondesuivideprojet.Ilcoordonnelesdif- 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 lesdemandes.Ilsuitletempspasséparlesdif- férents intervenants du projet. Il s’assure de la bonne qualité des livrables. Ilévaluel’efficiencedesméthodesinternes. 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, enexpliqueleschargesdetravailassociées. chef de projet interactif 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
  61. 61. 76 | Les métiers du design numérique Personnalités __ Fredéric Cavazza __ Stéphane Bordage __ Éric Di Pol __ Jean-Luc Grellier __ Scott Berkun __ Meri Williams formation __ Gobelins, l’école de l’image __ Université de Marne-La-Vallée, Licence Multimédia et Arts Numériques __ HETIC __ L’école Multimédia __ 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 Associations professionnelles et communautés __ WOW www.webprofessionals.org __ Association for Project Management www.apm.org.uk __ Australian Institute of Project Management www.aipm.com.au __ UPA - The Usability Professionals’ Association www.usabilityprofessionals.org __ The Information Architecture Institute www.iainstitute.org __ Interaction Design Association (IxDA) www.ixda.org __ ASIS&T The American Society for Information Science & Technology www.asis.org __ Project Management Institute www.pmi.org __ *designers interactifs* www.designersinteractifs.org The Principles of Project Management, Meri Williams, SitePoint, 2008 Managing Interactive Media, Elaine England, Andy Finney, Addison Wesley Publishing, 2007 chef de projet interactif
  62. 62. Donnez-nous votre avis sur www.designersinteractifs.org Les métiers du design numérique | 77 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 __ PICNIC www.picnicnetwork.org __ Idea Conference ideaconference.org __ World Usability Day www.worldusabilityday.org __ IA Summit www.iasummit.org __ Euro IA www.euroia.org __ UPA Conferences www.upassoc.org/conference __ Interaction 09 (IxDA) interaction09.ixda.org __ UX London uxlondon.com __ UX Week www.uxweek.com The One-Page Project Manager for IT Projects, Clarck A. Campbell, Wiley, 2006 Making Things Happen, Scott Berkun, O’Reilly, 2008 chef de projet interactif
  63. 63. 13 métiers du design numérique | 79 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- signersonorearticulefonctionetesthé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- tudestrèsdiverses:1)absencepureetsimple 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

×