métiers du design_

Andrieux Thomas / Lalanne Jonathan / Sequeval Jade

Flashez-moipour ma version numérique

Flashez-moipour ma version numérique

graphisme print & numérique

métiers du design_

_RédactionAndrieux ThomasLalanne Jonathan

Sequeval Jade

_GraphistesAndrieux ThomasLalanne Jonathan

Sequeval Jade

_PhotographesAndrieux ThomasLalanne Jonathan

Sequeval Jade

_Directeurs de la publicationAndrieux ThomasLalanne Jonathan

Sequeval Jade

métiers du design_ est une publication éditée par

STUDIO T2JSARL au capital de 8000 euros

SIRET 49999999999ISSN : 1969 - 2440

_impressionstuerlinckx N.V.

3294 Molenstede / Belgique

avant-propos

1.le graphisme histoire du graphisme

2.le webhistoire du graphisme numérique

3.Smartphones et tablettes print & web se rencontrent

avant-propos_

Aujourd’hui la consommation d’informations se fait de façon dynamique. Le texte défile. Avec son défilement, il se frag-mente et se lit en petites portions. Une portion remplit exac-tement l’espace donné, l’écran. Dans le texte, des mots sont reliés à d’autres stocks d’informations, d’autres ensembles et entités de texte. Les images, elles, ont réduit leur format et s’organisent / se composent de façon typographique, à l’instar des lettres. L’image remplace/synthétise le mot, l’image devient hors-champ de la lettre.Nous pouvons choisir notre mode de lecture, notre entrée en matière, par l’image ou par le texte. Les ressources visuelles et écrites sont indépendantes. Le graphisme décuple leur pouvoir narratif, ainsi que leur accessibilité. L’information se dématérialise. Peut-on parler alors de démo-cratisation du verbe ? Le graphisme deviendrai-t-il un acte politique ? Il agence des protagonistes dans un espace donné, met en lumière des informations, change les modes de lecture. La personnalisation des solutions graphiques va mettre en abime un métier jusque la statique. Il va devenir dynamique et s’adapter constamment aux contenus. Seul le support reste matériel, le contenu se fragmente, le graphisme devient un programme, la mise en page interchangeable.Mon journal devient une caméra et mon téléphone est un livre.Notre rapport à l’écrit change et l’image change. Aujourd’hui.

Quelles mutations a subi le métier de graphiste avec l’arrivée du numérique ?

Le graphisme existe depuis que l’homme eu le besoin de s’exprimer. Parfois artistique, parfois scientifique, il est le subtil mélange du dessin, de la typographie, de la photographie, de la mise en page, de la couleur, du support alliant des principes, des théories et des pratiques. Il créé, ma-nipule, articule des informations et des savoirs dans un but promotion-nel et informatif. Véritable langage, il communique visuellement des idées et des émotions.

Le graphisme suit l’évolution hu-maine dans la transmission. L’art pariétal est considéré comme la pre-mière forme du graphisme avec les peintures dans les grottes de Las-caux (18 000 et 15 000 ans avant J.-C). Le second élément est fondateur de la communication visuelle, l’écri-ture. Elle est un pilier et est née en Mésopotamie à Sumer vers -3500 av JC. Nous considérerons le graphisme en tant qu’évolution de l’écriture et de l’image au travers des siècles jusqu’à aujourd’hui.

De 700 av JC jusqu’à la fin des an-nées 1970, la typographie est l’élé-ment moteur du graphisme. Etroite-ment liée à l’histoire de l’imprimerie, elle est une production graphique se basant sur la lettre. En effet, le graphisme voit apparaître différents styles d’écritures allant de la phéni-cienne à la capitale romaine en pas-sant par la gothique. L’invention de l’imprimerie par Guten-berg en 1440 est une véritable ré-volution pour la typographie. Elle permet une diffusion plus large des supports. Prenons comme exemple la bible qui fut le premier ouvrage à utiliser la technologie à caractères métalliques et mobiles. On dis-posait des caractères mobiles en plomb pour former des mots et des phrases. C’est à cette époque que le terme typographie est employé pour la première fois. La typographie aide le graphiste à connoter et donner des valeurs à ses projets quels qu’ils soient, elle fait partie intégrante de son métier.

1.le graphisme_

9

Histoire du graphisme

Le 19 ième siècle est synonyme de libération. En effet, après une longue période sans avancées technolo-giques, le graphisme est libéré de ses contraintes grâce à l’invention de la lithographie, technique d’impres-sion à plat qui permet la création et la reproduction à de multiples exem-plaires d’un tracé exécuté à l’encre ou au crayon sur une pierre calcaire.

Une distinction se créer alors entre arts et arts appliqués au début du 20 ième siècle. L’industrialisation ain-si que la société de consommation favorisent l’apparition de nouveaux medias comme par exemple la publi-cité ce qui créer de nouveau emplois. Nous ne sommes plus dans l’artisa-nat mais réellement dans l’industriali-sation de l’art. La création graphique devient un outil de communication. Elle permet de répondre à une com-mande précise.

La création d’affiches publicitaires fait émerger de nouveaux “graphistes artistes”, artistes qui mettent à profit

leur art dans la société industrielle, comme Toulouse Lautrec ou encore Alphonse Mucha, peintres emblé-matiques de l’Art nouveau qui réa-liseront un grand nombre d’affiches publicitaires.

En 1923, durant la période de art déco, apparaît en France la première affiche dite moderne, avec Charles Loupot « voisins ». Dans les années 1925, les ar-tistes commencent à travailler sur de nouveaux vecteurs de communication : la photographie, le cinéma. En 1927, le terme de « graphisme » apparaît dans la revue Arts et métiers graphiques. C’est la grande revue du temps, qui recueille les contribu-tions des meilleurs professionnels de la typographie, mais aussi d’artistes, d’écrivains, comme Pierre Mac-Orlan.

Le constructivisme russe (1917-1935) vient marquer le paysage graphique mondial. Il se base sur exclusion du réel de l’œuvre en créant une ten-sion au sein de celle-ci comme en

10

témoigne les affiches de El Lissitzky.

L’artiste Jan Tschichold, représentant du Bauhaus, met l’accent sur la va-leur de la mise en page asymétrique, sur l’aération de la page, l’emploi de caractères simples et efficaces, comme l’akzidenz grotesque, et l’appropriation par les typographes de la photographie, en tant que vec-teur de la modernité. Il met en page lui-même, dans Arts et métiers gra-phiques, ses travaux et ceux de ses condisciples, adeptes de la nouvelle typographie.

Les années 30 sont marquées par Paul RAND, l’un des plus cé-lèbre graphiste américain. Il a créé de nombreux logos d’entreprises comme IBM ou UPS.

En 1950, l’Alliance graphique inter-nationale est fondée à Bâle. C’est dans le contexte contemporain que la discipline et le terme « graphisme » se popularisent, tout comme le design, la bande dessinée ou la

vidéo. Dans le cinéma, le graphisme connaît de grands changements. Le graphiste Saul Bass, révolutionne l’affiche et le générique avec le film vertigo, dans les années 1950, en adoptant une approche diamétrale-ment opposée à celle en vigueur à cette époque.

L’édition n’est pas en reste de ces multiples mutations du graphisme. Robert MASSIN. Graphiste, direc-teur artistique et typographe fran-çais connu sous le nom de Massin, il est une figure majeure du graphisme français, notamment dans le do-maine de l’édition. Son approche non conventionnelle de la typographie le rendra célèbre. Parmi ces travaux les plus remarquable on peut compter : « Exercices de style » paru en 1963, « »Cent Mille Milliards de Poèmes » paru en 1961 et « La Cantatrice » en 1964. Il va exposer les différentes intonations au travers de la typogra-phie.

11

Durant la seconde moitié du 20 ième, il est important de relever les travaux de Romain CIESLEWICZ, polonais, qui compte parmi les plus influent de la seconde moitié du XXème siècle. Il a influencé d’une façon décisive le développement des arts graphiques et de l’affiche. Ses travaux se dis-tinguent par des associations d’idées originales, une structure recherchée, des détails qui, à force de répétition et de transformations deviennent un signe clair, ses techniques de collage et de photomontage, sa poésie, son romantisme et son rationalisme.

Michel BOUVET, graphiste et affi-chiste français quand à lui, réalise de nombreuses affiches pour l’Opéra de Massy, le Théâtre Les Gémeaux ain-si que des catalogues pour Arles. Il est également commissaire de nom-breuses expositions et reçoit plu-sieurs récompenses dans la plupart des grandes biennales internatio-nales d’affiches (Pologne, Finlande, République, États-Unis, Mexique, Chine et Japon) ; En France, il recoit le Grand Prix de l’Affiche en 1987 et en 1992. Il reçu également le Prix Al-phonse Mucha de la 22ème Biennale Internationale des Arts Graphiques de Brno en République Tchèque.

Il faut également noter que Neville BRODY Graphiste, typographe et di-recteur artistique britannique est une figure emblématique de la culture graphique. Iinventeur de la typogra-phie moderne, il a considérablement

bousculé les conventions et dévelop-pé de nouveaux systèmes de com-munication et est considéré comme l’un des artiste les plus reconnus de sa génération. Il révolutionne la mise en page des magazines avec des titres cultes comme « The Face », « Arsena » ou encore « Actuel » en France. Il est notamment le créateur de la typographie « Blur ». Parallèle-ment, il publie deux monographies considérées aujourd’hui comme de véritables références du design gra-phique : « The graphic language of Neville Brody » 1 et 2, en 1988 et 1994.

Plus recement, Shepard FAIREY, graphiste et illustrateur issu de la scène du skateboard, s’est d’abord fait connaître par les autocollants « André Giant Has a Posse », qui a donné la campagne « Obey Giant ». Son travail est devenu mondialement célèbre lors de la campagne prési-dentielle américaine de 2008 avec la création du poster « HOPE » de Ba-rack Obama qui deviend une image-icône de la campagne. L’Institut d’art contemporain de Boston le considère comme l’un des plus connus, des meilleurs et des plus influents artistes de Street Art du moment. En 2007, il participe au film associé à Bansky « Faites le mur ».

Jonathan HOEFLER,c réateur amé-ricain de polices typographiques, est le fondateur de la fonderie de polices numériques « Hoefler & Frere-

12

13

Jones » à New York. Il est connu pour les identités visuelles de « The Rolling Stone Magazine », « Harper’s Bazaar », « The New York Time Maga-zine », « Sports Illustrated », le groupe musical « They Might Be Giants ».En 1995, il a été reconnu comme un des quarante designers les plus influent des Etats-Unis par I.D. Magazine. En 2002 il reçoit le prix « Charles-Pei-gnot » par l’Association typogra-phique internationale.

Contrairement au autres, Stefan SAGMEISTER, designer graphique et typographe considéré comme l’un des designers marquant du début du XXIème siècle, approche le sup-port de manière originale. En effet, la plupart de ses oeuvres ne sont pas réalisées sur ordinateur. Il questionne constamment la pratique même du design graphique.

_

15

16

interview Romain Bourguet

Scolairement, quel est ton parcours ?

Alors, j’ai passé un Bac littéraire op-tion audiovisuelle, avant d’entamer une année de fac en « Arts du spec-tacle cinéma audiovisuel à Bordeaux trois. J’ai vite décidé de changer de voie, je voyais que je ne m’investis-sais pas assez tout simplement parce que les cours trop théoriques de la fac ne m’intéressaient pas plus que ca, je me suis rendu compte que j’aimais les images mais qu’il y avait d’autre moyen de communiquer par elle que par le biais du cinéma. En fait j’avais envie de créer. Du coup, je me suis inscrit en année de Mise a niveau en arts appliqués (MANAA) a l’école ECRAN au Campus de Bis-sy, et j’ai continue dans cette voie en passant un BTS communication Visuelle. Option Graphisme Edition Publicité. Bon, c’est vrai, je n’ai pas

eu mon BTS du premier coup. Pas par manque de compétences, mais plutôt par manque de confiance en moi : je ne me suis pas présenté aux examens de fin d’année parce que je n’étais pas pleinement satisfait de mes travaux. J’ai alors déména-gé à Paris, et j’ai passé mon BTS en candidat libre, que j’ai obtenu avec mention. J’avais besoin de changer d’air, et d’être au contact de la ca-pital, qui, je pense, offre beaucoup de choses aux graphistes, en ma-tière de rencontres, d’expos… Et comme je suis jeune, je peux me permettre de migrer. Je devais sai-sir cette opportunité. Cette année, je suis a la Sorbonne, en 3ème année de licence de « Médiation Culturelle » option livre. J’avais comme pre-mier choix l’option « image », mais beaucoup trop de monde postule à cette option, et bien que finalement,

Graphic designer & étudiant_25 ans, graphiste, Wad magazine, Paris

17

j’ai eu « libre » par défaut, je suis sa-tisfait de ce parcours car il est dans la continuité de mon BTS, et j’aime énormément l’univers du papier et de l’édition. Quels obstacles as-tu rencontrés pen-dant ta recherche d’emploi ?

Je pense que le BTS Communication Visuelle tel que j’ai pu l’appréhender m’a donné une vision trop « indus-trielle » du graphisme. J’ai très peu vu la part « purement créative » du travail. Du coup je crois que je ne me sentais pas assez « mure » pour me lancer en agence. Les obstacles ne venaient pas du « monde de l’entre-prise », mais plutôt de moi.

Qu’est-ce qui t’a aidé ?

Comme j’ai pu le faire entrevoir un

peu plus tot : je ne suis pas pleine-ment dans l’univers du travail. Je suis étudiant et graphiste indépendant su de petites missions. Par contre, oui, je suis en stage, grâce a la fac. Pour trouver mon stage (je suis chez WAD (le magazine) pour deux mois, trois jours par semaines jusqu’à fin dé-cembre), j’ai répondu a une annonce que j’ai trouvée sur leur compte Facebook. Aujourd’hui, les réseaux sociaux jouent beaucoup dans les re-lations professionnelles. Et pour l’uni-vers du graphisme tout marche par le bouche a oreille, et les contacts : j’ai écrit quelques articles pour Spray magazine parce qu’une copine bos-sait chez eux, j’ai pu bosser une se-maines a Cannes pendant le festival l’an dernier grâce a un client a qui j’avais fait un logo… On peut vrai-ment avoir de très bonnes surprises.

quel

le p

hoto

vou

s re

prés

ente

rait

?

18

Quels consei ls donnerais-tu a quelqu’un qui souhaiterait exercer une profession comme la tienne ?

Définitivement : ne pas cracher sur les petits boulots. Il faut bien se faire un peu la main et glaner des sous la ou on peut, mais surtout : se rendre visibles des qu’on le peut pour ferrer des clients plus intéressants de fil en aiguille. Où en es-tu maintenant? Et quelles sont tes perspectives.

Et bien.. C’est une bonne question. Je veux valider mon année de BAC+3 (6 ans après avoir passé mon Bac, ca ne me ferait pas de mal je trouve (rires)), voir ce que me réserve l’ave-nir grâce a mon stade chez WAD, que je continue chez eux ou que je rencontre des gens qui m’appor-teront quelque chose d’intéressant professionnellement. Trouver de pe-tites missions car a cause de l’univer-sité je n’ai plus vraiment l’occasion de « créer » comme j’ai pu le faire en BTS… Et puis je me suis ache-

té un ouvrage sur la création de site web et j’ai découvert le « siteduze-ro » et compte bien me mettre aux langages HTML et CSS des que je le pourrai, car c’est véritablement une lacune que je souhaite combler : a la fois pour me créer une visibilité sur le net a travers un portfolio en ligne, mais aussi parce que j’estime qu’au-jourd’hui, pour être graphiste, il faut avoir un maximum de cordes son arc, pour ne pas se laisser dépasser par les nouvelles technologies. J’irai également me renseigner a la Mairie de Paris, apparemment, ils proposent des formations courtes web pour les graphistes… A voir.

_

19

Le rôle du graphiste a subi d’im-portantes évolutions au cours des dernières années, pour en venir à englober une vaste gamme de nou-veaux supports, outils, ressources ( et par conséquent, de nouvelles res-ponsabilités ). Là où auparavant les spécialistes s’occupaient de tâches allant de la rédaction à la postpro-duction, c’est désormais au graphiste d’en faire plus. Les clients attendent plus que la mise en œuvre créative de leurs idées ; ils font désormais ap-pel aux graphistes pour développer leurs styles visuels spécifiques, qu’ils espèrent voire traduits sur une vaste gamme de supports : par exemple les supports numériques faisant ap-pel au graphisme interactif.

Discipline la plus jeune de l’univers graphique, le graphisme interactif est en cours de redéfinition depuis le mi-lieu des années 1990.Avant Internet, le graphisme inte-ractif prenait la forme de guichets, de CD-Rom et d’autres interfaces d’utilisation, mais la discipline a vé-

ritablement explosé avec les progrès techniques et la montée en puis-sance d’Internet. Si les sites Internet constituent la forme d’expression la plus usuelle de cette discipline, elle trouve également à s’exprimer dans les interfaces d’utilisation des appa-reils électroniques (appareils photo-graphiques numériques, appareils mobiles, ordinateurs), les logiciels, les guichets électroniques, les menus des DVD ou des systèmes de trans-mission par satellite ou par câble, et les écrans électroniques affichant de l’information. L’objectif principal de tout graphiste travaillant sur un projet interactif doit être de faciliter l’utili-sation et l’accessibilité des informa-tions par l’utilisateur final, favorisant une utilisation la plus fluide et la plus intuitive possible de l’interface. De tels projets résultent de la collabora-tion entre graphistes, programmeurs front-end et back-end et architectes de l’information ou bien d’un gra-phiste vraiment doué et polyvalent.

Internet constitue donc la forme la

2.le web_

21

Le graphisme interactif

plus usuelle du graphisme interactif. Il y a à peine vingt ans, Internet res-semblait à une boîte de Pandore dont les premiers utilisateurs se décidaient à retirer le couvercle avec précaution. Le moteur le plus utilisé était Yahoo.La plupart des sites étaient héber-gés par Geocities, on déroulait leurs textes verticalement sur des fonds aux textures prédéfinies, à peine émaillés de quelques lignes souli-gnés ou en gras pour qu’on les re-père bien.L’humanité commençait juste à explorer le grand « réseau des ré-seaux », la possibilité de communi-quer en temps réel, mais ce n’était que l’imitation primitive d’une page imprimée.Aujourd’hui, Internet est la technolo-gie qui a été le plus rapidement ac-ceptée. Chaque jour, chaque minute, chaque seconde, Internet dépasse ses propres possibilités grâce à sa connexion permanente aux nouveaux logiciels puissants, et nous surprend avec un niveau d’interactivité qui nous capture et nous transporte

dans des mondes imaginaires im-prévisibles.

Pour bon nombre de moyens de communication, les sites Web sont devenus le principal outil, détrônant ainsi les supports imprimés. Dans le même temps, les applications Web ont pris leur place aux côtés des médias traditionnels. Par ailleurs, l’utilisation d’Internet est parvenue à un stade de maturité, tout comme la conception Web: au cours des dix dernières années, cette discipline a franchi une étape d’incertitude et d’expérimentation pour parvenir à une place assurée et estimée. L’uti-lisation toujours plus répandue des accès Internet à large bande permet aux designers d’employer des fi-chiers image plus volumineux.

L’émergence des réseaux sociaux et l’évolution vers un stockage et une gestion des données sur le Web changent notre manière d’utiliser Internet et de concevoir des pages Web. Bien que des avancées tech-

22

nologiques majeures aient été ac-complies en matière de conception graphique Web, la tendance pré-dominante récente a été marquée par le passage de l’utilisation de la technologie comme nouveauté vers un équilibre entre la conception, la facilité d’utilisation et la technologie.La transparence PNG, par exemple, a offert aux concepteurs toute une gamme de nouvelles possibilités permettant d’incorporer des images dans leur travail. Grâce à des polices mieux supportées par les navigateurs , les concepteurs peuvent désormais utiliser la typographie ( en particulier les caractères grands, gras et fantai-sie ) pour ajouter de la personnalité et de la clarté et jouer sur la mise en page avec CSS3.

CSS3CSS (Cascading Style Sheets : feuilles de style en cascade) est un langage informatique qui sert à dé-crire la présentation des documents HTML et XML. Les standards définis-sant CSS sont publiés par le World

Wide Web Consortium (W3C). Intro-duit au milieu des années 1990, CSS devient couramment utilisé dans la conception de sites web et bien pris en charge par les navigateurs web dans les années 2000.L’un des objectifs majeurs des CSS est de permettre la mise en forme hors des documents. Il est par exemple possible de ne décrire que la structure d’un document en HTML, et de décrire toute la présen-tation dans une feuille de style CSS séparée. Les styles sont appliqués au dernier moment, dans le navigateur web des visiteurs qui consultent le document. Cette séparation fournit un certain nombre de bénéfices, per-mettant d’améliorer l’accessibilité de changer plus facilement de présen-tation, et de réduire la complexité de l’architecture d’un document.

Mais il est important de rappeler que certains navigateurs n’ont pas encore implémenté l’ensemble de ces fonc-tionnalités.

23

LA TYPOGRAPHIEPour tout professionnel du web, l’uti-lisation de polices autres que celles disponibles sur le système des inter-nautes a toujours été jusqu’à présent un exercice délicat et complexe.Pour un imprimé, la seule contrainte par rapport aux polices de caractère est que la police soit compatible avec le système de l’imprimeur (ce qui ne pose presque jamais de problème si la police est fournie). Par contre, sur le web, l’affichage du texte ne se fait pas sur l’ordinateur du créateur, mais sur l’ordinateur de chacun des inter-nautes qui visite le site.Une solution était d’utiliser des images à la place du texte mais le référencent s’effectuait mal.Des solutions techniques ont été mises en place. Avant 2009, nous avions déjà : sIFR (Flash), sIFR Lite (Flash), sIFR Lite, FLIR ou Facelift (PHP + GD) FLIR, typeface.js (SVG/VML).

CUFONEn 2009, Cufón est une alternative pour intégrer des polices TrueType et OpenType au web.Le site se propose de générer un fi-chier JavaScript à inclure sur le site, comprenant les tracés vectoriels calculés à partir du fichier de police fourni (formats TTF, OTF, PFB). Il faut bien sûr aussi télécharger et inclure la librairie Cufón, et sélectionner les caractères pouvant être utilisés (al-phanumériques, latins, ponctuation, cyrillique...) ce qui en augmentera la

taille d’autant.Le fichier obtenu peut être d’une taille raisonnable selon la complexité de la police et la qualité choisie. Si on en fait un usage fréquent à différents endroits d’un site, ce fichier généré s’avére probablement moins lourd qu’un remplacement par des images.

FONT FACECSS 2 (publié en 1998) comprenait un mécanisme qui autorisait les au-teurs de pages web à proposer une fonte au téléchargement, fonte qui serait ensuite utilisée dans la page. Il s’agit de la règle @font-face. Mais celle-ci a été peu implémentée par les navigateurs, ou alors partielle-ment. (En l’occurrence, le bon élève à quelques réserves près, tout de même - était Internet Explorer). Les problèmes rencontrés étaient les sui-vants:La plupart des fontes disponibles sont protégées par le droit d’auteur et ne peuvent pas être redistribuées, y compris comme fonte «intégrée» à un site web;Les fontes rajoutaient un poids conséquent aux pages (jusqu’à plu-sieurs centaines de Ko);Les développeurs des navigateurs étaient peu enclins à affronter les deux problèmes ci-dessus (surtout le premier).Pendant longtemps, le seul naviga-teur à avoir un support tout relatif de @font-face était Internet Explo-rer. Mais il fallait utiliser un format de fonte (EOT) un peu obscur, pro-

24

25

priétaire, et généré par des outils peu disponibles. Bref, c’était assez limité. Lorsque le groupe CSS a pu-blié CSS 2.1 (correctif de CSS 2 qui, entre autres, supprime un certain nombre de choses peu réalistes, pas ou mal implémentées, etc.), @font-face a été supprimée.Depuis fin 2010 et début 2011, @font-face permet d’incorporer des polices externes et variées. Défini en 1998, par la norme css2, Fonface revient sur les devants de la scène grâce à son support maintenant im-plémenté correctement par tous les navigateurs récents. Google Web Fonts sont également des polices hé-bergées en ligne par Google (@font-face). Le web rejoint ainsi le support imprimé par l’utilisation parfois sub-tile de typographies diverses donnant du corps aux mise en page.

ORDINATEURS ET LOGICIELSDans les années 1980 les ordinateurs personnels se répandirent, dont le Macintosh, et mirent à la portée d’un plus large public la puissance

des gros systèmes informatiques jusqu’alors réservés aux laboratoires et aux programmeurs. Les interfaces graphiques comme Mac Os sur Ma-cintosh, GEM et plus tard Windows sur PC, facilitèrent la prise en main de ces ordinateurs de nouvelle gé-nération qui, en s’affranchissant du mode texte des terminaux, s’ou-vrirent à la création avec des mé-thodes de travail plus naturelles : bureau virtuel, icônes, manipulations des graphismes à la souris. Cela per-mit aux artistes et aux maquettistes de passer plus facilement à l’infor-matique grâce notamment à la suite Adobe. Adobe Creative Suite est une suite logicielle de graphisme profes-sionnel commercialisée par Adobe Systems depuis 2003, qui comporte notamment les logiciels Illustrator, Photoshop et InDesign. Adobe Flash faisant partie de la creative suite a la particularité d’allier dessin vectoriel et animations, permettant la corres-pondance des supports imprimés et du web. La plupart des graphistes au début des années 2000 se sont mis

à ce logiciel et à l’action script. Mais depuis fin 2010, il a peu à peu dis-paru d’internet se cantonnant à cer-taines applications. Les graphistes se rapprochent peu à peu également du code informatique grâce à java contenu dans Processing logiciel open source.

ADOBE FLASH ET LE WEBAdobe Flash est un puissant envi-ronnement de création d’animations et de contenus multimédias ( ani-mations vectorielles, sites webs). On peut créer des expériences inte-ractives captivantes qui s’affichent à l’identique sur tous les postes de travail et terminaux mobiles, y com-pris les tablettes, les smartphones et les téléviseurs.Adobe Flash ou Flash (anciennement Macromedia Flash) est une suite de logiciels permettant la manipulation de graphiques vectoriels, de bitmaps et de scripts Actionscript, qui sont utilisés pour les applications web, les jeux et les vidéos.Flash Player, développé et distribué

par Macromedia (racheté en 2005 par Adobe systems, est une applica-tion client fonctionnant sur la plupart des navigateurs web. Ce logiciel, et la diffusion de flux (stream) bi-direc-tionnels audio et vidéo.Pour être bref, Adobe Flash est un environnement de développement in-tégré (IDE), une machine virtuelle uti-lisée par un player Flash ou serveur flash pour lire les fichiers Flash. Mais le terme « Flash » peut se référer à un lecteur, un environnement ou à un fichier d’application.Depuis son lancement en 1996, la technologie Flash est devenue une des méthodes les plus populaires pour ajouter des animations et des objets interactifs à une page web ; de nombreux logiciels de création et OS sont capables de créer ou d’afficher du Flash. Flash est généralement utilisé pour créer des animations, des publicités ou des jeux vidéo. Il permet aussi d’intégrer de la vidéo en strea-ming dans une page, jusqu’au déve-loppement d’applications Rich media.Les fichiers Flash, généralement

appelés « animation Flash », com-portent l’extension .SWF. Ils peuvent être inclus dans une page web et lus par le plugin Flash du navigateur, ou bien interprétés indépendamment dans le lecteur Flash Player.Même si Flash est utilisé sur de nom-breux sites web, il ne s’agit pas d’une norme du W3C, et donc, en tant que tel, il ne fait pas partie du Web. En effet, bien qu’un plugin Flash soit préinstallé sur la majorité des ordi-nateurs grand public, de nombreux systèmes d’exploitation, libres ou non, ne disposent pas d’un lecteur. En l’occurrence, GNU/Linux ne dis-pose d’un plugin que pour proces-seurs x86, comme mentionné sur le site d’Adobe, alors que Linux est dis-ponible sur de nombreuses autres ar-chitectures. Bien qu’Adobe ait publié les spécifications partielles de Flash (hors codecs vidéo, par exemple), il n’existe pas d’application de réfé-rence, et donc, il est impossible de l’utiliser « quelle que soit sa plate-forme ». De plus, l’intégration aux navigateurs par un plugin pose de nombreux problèmes d’accessibilité.

Lors de sa conférence de presse, en janvier 2010, Apple a rappelé que sa tablette tactile ne supporterait pas la technologie Flash, l’une des applica-tions les plus populaires pour lire les vidéos depuis un navigateur Internet. Flash, qui permet de réaliser des ani-mations, était utilisé sur de nombreux sites, qui l’utilisaient également pour des jeux ou des présentations.

Depuis les sites d’agence en flash ont été peu à peu remplacés par des sites en html5 avec les balises video, audio et canvas.

PROCESSING ET LE CODE INFORMATIQUEAvec l’avénement du nu-mérique et de la culture qui l’accompagne (artis-tique mais aussi pro-fessionnelle, dans les métiers du graphisme, du design, de l’image, du son, de l’édition), la nécessité de vul-gariser les outils de création nécessaires au travail du code in-formatique s’est mani-festée dans un contexte du «libre» et de l’open source qui contribue d’au-tant plus à soutenir sa dif-fusion.Processing (autrefois orthogra-phié Proce55ing) est un langage de programmation et un environne-ment de développement créé par Benjamin Fryet Casey Reas, deux artistes américains. Processing est le prolongement « multimédia » de De-sign by numbers, l’environnement de programmation graphique dévelop-pé par John Maeda au Media Lab du Massachusetts Institute of Technology.Processing est tout particulièrement adapté à la création plastique et gra-

28

29

phique interactive. Le logiciel fonc-tionne sur Macintosh, sous Windows et sous Linux, car il est basé sur la plate-forme Java— il permet d’ail-leurs de programmer directement en langage Java.Processing est distribué sous GNU GPL.Les programmes réalisés avec Pro-cessing peuvent être lus par les navigateurs internet équipés du plug-in java, mais aussi sous forme d’applications indépendantes pour

windows, linux ou mac (en réalité n’importe quelle machine dis-

posant d’une Machine virtuelle Java).Le principe majeur de Pro-cessing est la simplicité, dans la mise en œuvre des programmes comme dans la syntaxe du lan-gage. Adapté à la création graphique, Processing réclame moins d’efforts que Java pour effectuer des tâches simples telles que la modification d’une

animation à intervalle régu-lier (qui permet des créations

animées). Ses fonctionnalités sont limitées aux besoins des

créateurs d’images 2D et 3D gé-nérées par programmation mais

peuvent être étendues, par le biais de modules externes, à la capture d’un flux video, à la génération et à la manipulation de son, à l’interfaçage des ports d’entrées-sorties, etc.Processing s’adresse aux artistes

en « arts numériques » et aux gra-phistes, notamment dans le domaine du graphisme d’information et dans celui du graphisme génératif.D’après Julien Gadachoat, Inter-venant Processing Bordeaux, Pro-cessing a permis de démystifier la programmation, qui reste pour le plus grand nombre une discipline de spécialistes voire de geeks. Grâce à Processing, le code informatique est devenu un outil de création à part entière utilisé aujourd’hui par des ar-tistes, des architectes, des étudiants, ou de simples amateurs…Processing peut être utilisé pour ré-aliser des animations interactives, c’est à dire des images produites en temps réel, en direct, qui vont réagir à certains signaux produits par des utilisateurs ou à des flux de données: mouvements devant une caméra, messages envoyés par texto ou sur les réseaux sociaux,etc.Il est très employé aussi dans la vi-sualisation de données (Data vision) et peut servir de base pour la création de visuels destinés à être imprimés.Processing permet d’exporter ses créations sur le web avec javascript en jouant avec les notions de réseau, d’interaction temps réel et de pro-ductions collaboratives.

_

30

interview Chadourne Julien_

Pouvez-vous nous présenter votre parcours ?

Au début, j’ai passé un bac sti élec-trotechnique, j’ai ensuite fais un an en informatique, c’était trop orienté programmation alors je suis rentré en DUT SRC (Services et réseaux de communications). Suite à mes stages au sein de différentes petites agences web, j’ai voulu aller voir ce qu’il se passait dans les grandes agences. J’ai décidé de postuler dans des grands groupes et j’ai fina-lement eu une mission d’un an avec le groupe Express Roularta, à Paris. Le fait d’intégrer un énorme groupe tel que l’Express m’a permis en plus de développer le journal, de toucher au développement d’applications web et smartphones.

Pourquoi le web design ?

Depuis mes 12 ans, je suis sur un ordinateur. J’ai toujours aimé le web et étant très curieux, j’ai voulu com-prendre le pourquoi du comment et c’est comme cela que j’ai voulu de-venir web designer.

Pourquoi ne pas être devenu déve-loppeur dans ces cas la ?

Je dois surement avoir un côté artiste que je n’assume pas ! Et le code pour faire du code, c’était pas pour moi. J’ai trouvé le juste milieu entre gra-phisme et code, à mon avis.

Quels obstacles avez-vous rencon-trés pendant votre recherche d’em-ploi ?

Je suis web designer freelance en plus de mon travail à plein temps, j’ai pu rencontrer pas mal de personne

Web designer_29 ans, web designer, Each x Other, Paris

31

lorsque j’étais étudiant, de fil en ai-guille j’ai pu me faire un réseau et cela n’a pas était trop problématique de trouver un emploi.

Quels conseils donneriez-vous à quelqu’un qui souhaiterait exercer une profession comme la votre ?

Alors les conseils, d’être rigoureux et organisé et surtout de ne pas ac-cepter des contrats trop peu payés ! Nous effectuons un métier qui néces-site une rémunération conséquente alors ne vous laissez pas faire. Le client a besoin de vous, c’est la seule chose à savoir ! Vous devez lui être indispensable.

Où travaillez vous actuellement ?Je suis toujours webdesigner free-lance et je travail aussi pour une marque de vêtements, Each x Other.

Je suis chargé du développement web et du design du site internet. En plus du web je doit faire face à de nouveaux problèmes et avec l’arrivée des tablettes je dois savoir m’adap-ter, ce sont de petits chalenges qui me font apprécier mon métier.

_

quel

le p

hoto

vou

s re

prés

ente

rait

?

De la même manière que l’univers de l’édition a du s’adapter à l’ère du nu-mérique en passant du format codex au format EPUB3 (format standard pour les livres numériques, reposant sur du HTML5), le graphiste a du s’adapter lui aussi en passant des compétences print aux compétences web multiplateformes.

Depuis quelques temps maintenant, le graphiste-designer doit apprivoi-ser de nouvelles plateformes. Suite à l’engouement que suscitent les Smartphones et tablettes tactiles, il doit, en plus de la plateforme « web », être familier de ces nouveaux sup-ports de communication mobiles. De cette manière, lorsqu’un client lui demande de concevoir son identi-té visuelle par exemple, il doit la lui concevoir de manière à ce qu’elle soit lisible sur papier, applicable sur un site web, mais aussi compatible sur Smartphones. Lorsqu’on y pense aujourd’hui, c’est une évidence, il s’agit du monde qui nous entoure, cependant, elle suscite un effort sup-

plémentaire pour le graphiste pour satisfaire sa clientèle, et se donner une plus grande crédibilité au sein de sa propre communauté. Aujourd’hui, il s’agit de « s’adapter » a tout sup-port de communication. Pour cela, le graphiste fait appel à une technique que l’on appelle « Responsive Design ». La notion de Responsive Web Design indique qu’un site est conçu pour s’adap-ter aux différentes tailles d’écrans, tablettes, mobiles, télé connectées, etc. Ce que l’on appelle « web res-ponsive » repense donc la manière de concevoir les parcours de naviga-tion sur Internet, en ce qu’il s’agit de concevoir une interface auto adap-table.

On peut ainsi avoir une navigation et une mise en page spécifique, sans dégradation de ces deux éléments, et sans devoir utiliser les fonctionna-lités de zoom (ou un autre type de re-dimensionnement), car bien souvent, les mobiles ne permettent pas d’affi-cher certains types de contenus mul-

3.smartphones & tablettes_

33

timédias. L’idée du web responsive est alors de créer un site web ba-sique sur les terminaux les plus pauvres et ensuite de l’améliorer pour les usages plus avancés. Ainsi, on bascule d’une navigation dégradée pour les terminaux non classiques à une expérience optimale et person-nalisée. Il s’agit donc de consulter la même information, mais organisée différemment selon le type de termi-nal utilisé. En d’autres termes, c’est une mise en page sur mesure, en se pliant aux standards du web.

(image(s))Ci-dessus : Un site web « responsive », ici affiché sur des appareils de tailles diverses, couramment utilisés.

Concrètement, le concept de web responsive se conçoit selon diffé-rentes techniques :- feuilles de style CSS (mise en page web) permettant d’utiliser des di-mensions relatives aux dimensions écrans ;- solutions de stockage d’images

adaptables (le poids des images s’adaptera directement, côté serveur, à la qualité de l’affichage) ;- ergonomie basée notamment sur l’utilisation massive de JavaScript ;- usage des nouveaux standards du web (HTML5, CSS3, etc.). A travers cette conception du design, nous pouvons nous rendre compte que l’utilisation des téléphones « mobiles », et autres tablettes, notre quotidien se voit changé. Nous sommes de plus en plus amenés a nous déplacer, encore une fois a nous « adapter » a notre environne-ment, tout en restant connectés au reste du monde. De cette manière, que l’on soit graphiste ou client fai-sant appel a des designers, nous sommes de plus en plus sensible a l’information « immédiate ». Nous vi-vons effectivement dans un monde en perpétuel mouvement, grâce a internet, une infinité d’informations deviennent a notre portées en un seul clic, il s’agit alors de rentabili-ser et économiser notre temps en

34

35

37

ne filtrant alors que les informations qui nous sont nécessaires, en un rien de temps. Ainsi, être graphiste, au-jourd’hui, c’est savoir créer du design percutant en toute circonstance, ou plutôt : en toute plateforme.

Pour illustrer cette polyvalence du monde du graphisme au sein même des technologies mobiles, nous pouvons citer Adobe, la société de logiciels les plus utilisés dans l’uni-vers du design graphique. Le géant aura mis du temps a rendre dispo-nible son produit phare « Photoshop » sur l’App Store, mais c’est chose faite depuis septembre 2012 sous sa version « Touch ». Le challenge résidait surtout dans l’ergonomie, et les performances que devait offrir le logiciel sur un écran tactile sans pour autant décevoir ses utilisateurs réguliers, habitués aux écrans d’or-dinateurs. Selon les dires, l’App se veut pourtant intuitive et facile d’uti-lisation. La plateforme étant réduite, l’utilisation en est donc simplifiée. Les utilisateurs réguliers de Photo-

shop peuvent donc être mobiles, au sens propres comme au figuré, et pour la modique somme de 8,99 eu-ros seulement (contre 955,00 euros pour sa version initiale). Les déten-teurs d’iPad, experts ou novices en la matière, peuvent éditer leurs photo-graphies sur leur tablette chez eux ou lorsqu’ils sont en déplacement.

Adobe ne s’est pas rendu seulement compte du besoin des graphistes de travailler de manière mobile : dans la dernière version de la Creative Suite (la CS6), il est désormais possible de choisir le profil de document à éditer a travers le réglage « Périphériques » et réaliser des productions pour des supports de style iPad, iPhone ou Galaxy S.

_

38

interview Rousset Thomas_

Quel est votre parcours scolaire ?

Au début j’ai fais mes trois ans de maternelle, tout s’est bien passé jusqu’au bac. Bac S avec mention, il est important de le souligner. J’ai ensuite décidé de faire une Licence en média numérique, étant un geek dans l’âme, je ne voyais que cette solution ! ( rires) . Je l’ai faite à la rochelle et puis j’en ai eu un peu marre de l’informatique pure et dure et je me suis dirigé vers le graphisme print en faisant un BTS comm visu à Bordeaux.

Pourquoi le design graphique ?

J’ai toujours eu un intérêt pour l’image et j’ai voulu voir l’autre fa-cette, celle derrière le numérique, le print. Je sais que j’ai fais le chemin inverse de pas mal de personnes

mais maintenant c’est bénéfique !

Quels obstacles avez vous rencontrés pendant ta recherche d’emploi ?

Je n’en ai pas eu (rire) ! J’ai postulé dans une agence et après un entre-tien ils ‘mont pris ! J’avoue que j’ai eu un peu de chance mais c’est le jeu !

Quels conseils donneriez vous à quelqu’un qui souhaiterait exercer une profession comme la votre ?

Je lui conseil de bien s’accrocher et de ne pas avoir peur de la concur-rence. Toujours faire des choses que l’on aime. Parlez-nous de la période entre la fin de vos études et votre premier emploi ?

Et bien j’étais directement engagé

Web & Graphic designer_25 ans, graphiste junior, Saguez & Partners, Nantes

39

avant même d’avoir fini, je n’ai pas eu cette transition. Certains de mes anciens potes de promo galèrent maintenant à trouver un travail mais je pense qu’il ne faut pas être trop fine bouche. Il y a des emplois mais il faut aller les chercher

Où travaillez vous ?

Saguez & partners en tant que gra-phiste junior. Je suis chargé de la création des identités visuelles de gros clients comme la SNCF ou l’aquarium de la Rochelle. Je suis in-tégré à une équipe composée d’un directeur artistique et d’un directeur de création. Je travaille aussi avec des web designer et ds architectes. Ce système me permet d’apprendre et d’évoluer. C’est une constante source de motivation.Je suis également graphiste free-

lance. Ma double formation web et print me permet de réaliser des iden-tités complètes. C’est un suivi total d’un projet et une transversalité dans les domaines ce qui est très motivant !

Graphiste préféré ?

Julien Pacaud, j’adore Julien Pacaud. Pour moi, c’est un des grands gra-phistes de ces dernières années.

Dernier coup de cœur graphique ?

Identité de pigment Pol, on a encore du chemin à faire en france en terme de graphisme, ils sont forts ces allemands !

_

quel

le p

hoto

vou

s re

prés

ente

rait

?

Étapes, design et culture visuelle, juillet 2012Web Design Index, The Pepin Press, 2010,Pepin Van Roojen

Web design Index 7,The Pepin Press, 2007, Pepin van Roojen

Web design Handbook, design sur internet, Booqs publishers, 2000

Bryony Gomez-Palacio et Armin VitAnthologie du graphisme, Le guide de référence des pratiques et de l’histoire du graphisme, Pyramid, 2010

Petit manuel de graphisme, éditions Pyramid, 2009

Mise en page et fondamentaux, Pyramid, 2010

L’histoire du graphisme en France, Michel Wlassikoff , conférence du 9 janvier 2007

Les fondamentaux du graphisme,Pyramid, 2009

bibliographie_