sun

Annuel, RSE, d’activité… au rapport !

Aujourd’hui on s’intéresse aux publications “lourdes” que sont ces chers rapports annuels, rapports RSE, rapports intégrés, bilans sociaux, documents d’assemblée générale, etc.

Pour de nombreuses entités, l’établissement de ces documents est obligatoire. Ouvrages complexes et exigeants, ils sont destinés à informer les différentes parties prenantes quant à l’activité de la société, ses ambitions pour les années à venir, son regard quant à l’année passée, …

Renfermant un ensemble d’informations que l’on penserait trop souvent indubitables et à peine parcourues, tant la mise en forme est qualifiée de secondaire face au fond même du propos… On a tendance à associer le rapport annuel à une suite de tableaux Excel, graphiques laids et illisibles, notes de bas de page plus longues que l’article même, annexes de 3 kilomètres, etc.

Alerte Spoilers ! Maquettistes comme Graphistes aiment le rapport d’activité ! Parce que c’est cool, parce que ça peut être fichtrement beau et orchestré, et qu’on s’en donne à coeur joie de créer de la visualisation de données.

Parce qu’en effet, il y a belle lurette que les sociétés ont embrassés la culture du data design au service d’un contenu intelligemment et agréablement mis en valeur. C’est fini le pavé cale-porte qu’on ouvre une demi seconde pour jouer l’intéressé(e).

Éditer son rapport d’activité, c’est participer à la communication active de son image. Les entreprises le savent et elles se prennent au jeu de “l’objet à consulter de l’année”. Exercice laborieux dans la constitution de son fond il est vrai, il n’en n’est pas moins une réelle opportunité de communiquer ses réussites, ses valeurs, la pluralité de ses équipes, ses réalisations, engagements et ambitions.

En somme, travailler ces publications, c’est valoriser son image et participer à la stratégie de sa communication. Ces documents sont des outils stratégiques et fédérateurs, dont il est important de réaliser la portée de communication interne, mais également externe.

On ne vous apprend rien n’est-ce pas ! Par contre, on peut faire avec vous le tour de ces petites pépites graphiques qui émoustillent nos regards de créatifs. On en prend pleins les mirettes !

Le Report Love :

  • Les Graphiquants pour KERING :

Année après année, on attend avec impatience de visualiser le rapport annuel de Kering, effectué par le studio graphique des Graphiquants. On vous a sélectionné la version 2015…

Une utilisation intelligente et toujours très brandée du “K” de Kering. Une grille “coupée-décalée”, des visuels élégamment et sobrement apposés afin d’illustrer les marques du groupe (Gucci, Bottega Veneta, Alexander Mc Queen, Volcom, etc.)

  • …ainsi que l’indémodable version 2014 :

Notre amour du pattern, des dégradés éthérés et de la forme pour la forme, ne s’en remet toujours pas, 4 ans après. La version 2017 est visible ICI. Bien que nous ayons publié un article sur l’épure totale du brutalisme dernièrement, nous nous avouons un peu déçus par la version de cette année… Graphiquement parlant, on est restés sur notre faim.

  • Caroline Fabès pour PARIS HABITAT :

Une grille constructiviste ; et on comprend pourquoi, lorsque l’on parle d’habitat. La typographie se fait immeuble, dessinant avec les motifs présents le plan d’un rapport annuel mobile et contemporain.

  • Toujours PARIS HABITAT, mais en 2014, par l’Agence Simone
  • Ici on retrouve la présence forte de la construction ; comme éclatée et très acidulée. On s’amuse, c’est beau, c’est fun. A consulter son rapport annuel, il fait bon vivre chez Paris Habitat !

    • Aussi acidulé et dans le jeu de formes aux lignes de conduites très construites, le rapport annuel de  l’Université Bretagne Loire (UBL), réalisé par Pollen studio en 2017 :

    Le cartouche du logotype est repris et décliné comme pour dévoiler les diverses strates du document imprimé. Une grande part à l’illustration humanise le rapport d’activité. L’ajout de “bruit” dans l’illustration et les aplats de couleurs rend plus sensible le travail de l’édition.

    • Du même studio graphique, et avec le même traité “bruit”, le rapport annuel de Ouest Valorisation, en 2017.

    “Le bruit un jour, le bruit toujours !” Chez Agence’O, on aime particulièrement ce traité. Nous l’avons notamment utilisé pour le rapport annuel 2018 de Paris21, Partenariat dont le but est de promouvoir, influencer et faciliter la croissance des pays en voie de développement, à l’aide notamment d’une meilleure utilisation des statistiques.

    • ôde aux carreaux emblématiques de la maison Burberry, réalisée par Tiffanie Sibille en 2015 :

    De la même manière que l’exploitation poussée du logo Kering par Les Graphiquants, Burberry décline ici son célèbre pattern, imprimé en transparence sur la couverture, servant de base aux différents graphiques du rapport, ainsi qu’en reliure japonaise au revers des pages. Une édition au graphisme très propriétaire !

    • Un bond très arty pour Art&Innovation Space (on comprend pourquoi 🙂 par we3studio en 2017.

    Traitée comme un magazine et présentée de manière aussi disruptive, on salue cette édition au design très innovant !

    La rentrée est belle et bien sonnée, et avec elle, son flot de rapports à créer. De notre côté, on a déjà commencé à imaginer, designer et maquetter ces fameux rapports.

    Si vous souhaitez discuter du vôtre avec nous, voici notre numéro, on se fera une joie de concevoir vos datas !

    La recherche, une navigation alternative

    La barre de navigation permet de classifier par thèmes les différentes pages d’un site, d’un logiciel ou d’une application. C’est un point de repère stable et fiable pour chaque utilisateur qui le guide lors de l’exploration de l’interface.

    Si, pour une grande majorité de cas ce système de navigation est suffisant, il faut se rappeler que les utilisateurs et les contextes de navigation peuvent être différents.

    La recherche est un parfait système de navigation alternatif. Il permet à l’utilisateur de trouver une information ciblée. Cet outil répond à deux scénarii :

    • L’utilisateur ne trouve pas l’information via la navigation : après exploration du site, il va utiliser le moteur de recherche pour la trouver ;
    • L’utilisateur sait exactement ce qu’il recherche, la recherche est précise et ciblée : l’utilisateur n’a pas besoin d’explorer le site, le moteur de recherche est un gain de temps et lui permet d’accéder rapidement à l’information souhaitée. Cette alternative est utilisée principalement par les visiteurs réguliers du site, qui connaissent le site et qui savent ce qui s’y trouve.
    Moteur de recherche – fnac.com

    Le rôle du champ doit être clairement identifiable

    Il est important de respecter les standards graphiques : un champ de saisie et une icône loupe, le tout placé en haut de page de préférence sur la droite. C’est sous cette forme et à cet emplacement que les utilisateurs s’attendent à trouver le champ recherche. Il doit être présent sur toutes les pages, toujours au même endroit.

    Emplacement du moteur de recherche – nike.com

    Dans le cas où le site dispose de très peu de contenu, il est envisageable d’opter pour un champ recherche discret : une simple icône loupe, avec un champ qui se déploie au clic pour permettre la saisie.

    Champs recherche minimisé en état normal – chobani.com

    La recherche doit être simple et optimisée

    Les études montrent que les options de recherche avancée ne sont utilisées que par un public très averti. Pour la majorité, les utilisateurs ne savent pas les utiliser. Ces options sont perturbatrices. Un champ simple, parfaitement identifiable, optimisé sur quelques mots répond au mieux aux attentes des utilisateurs.

    La recherche doit pouvoir être catégorisée et restreinte à certaine partie du site

    Pour éviter de noyer l’utilisateur sous un nombre important de résultats de recherche, il est intéressant de restreindre la recherche à une partie du site. Par défaut la recherche se fait dans tout le site, la possibilité de restreindre la recherche doit être le choix de l’utilisateur. Sinon elle peut être source d’un grand nombre d’erreur.

    L’autocomplétion permet de guider l’utilisateur dans sa recherche. L’internaute indique uniquement un mot clef, le moteur de recherche lui propose une liste de résultats.

    Moteur de recherche qui peut être restreint en fonction des catégories – amazon.fr

    Dans le cas où le site dispose de beaucoup de contenu il est intéressant de regrouper les résultats de la recherche selon les catégories. Si nous prenons en exemple un site e-commerce important, il est judicieux de classer les résultats de recherche par rayons.

    Résultats de recherche classés par catégories – natureetdecouvertes.com

    Un champ recherche presque parfait, c’est bien. Avec des résultats pertinents, c’est mieux !

    Le champ recherche n’est pas une bouée de secours. Il n’est pas là pour pallier à une manque d’organisation du contenu dans un site Internet.

    Le moteur de recherche se doit de fournir des résultats pertinents, ce qui demande une bonne indexation de toutes les pages du site. Dans le cas contraire, l’internaute se trouvera noyé sous un nombre trop important de résultats de recherche qui ne répondent pas à sa demande.

    Pour arriver à combiner le champ recherche presque parfait avec des résultats pertinents, vous devrez veiller à :

    • Indexer régulièrement le contenu sur lequel porte la recherche afin de disposer d’une information récente et à jour ;
    • Classer les résultats de recherche selon la manière dont ils répondent aux critères de recherche de façon à afficher dès les premières pages les résultats les plus pertinents pour l’utilisateur ;
    • Fournir un titre à chaque résultat et une description courte afin d’accélérer la lecture et de faciliter la compréhension.

    Et pourquoi pas un champ recherche alternatif ?

    Osez l’originalité, si le contenu du site et la cible de celui-ci vous le permet !

    Arte propose une moteur de recherche qui permet d’affiner de façon très ludique la liste des résultats de recherche – Arte.tv
    Une recherche sous forme de phrase à trous ? Permet, ici aussi, de filtrer de façon très ludique le contenu, à l’aide de listes déroulantes – Feelactiv.com

    Brutalisme : sous le béton, le graphisme

    Il y a un mois Flavien Berger sortait son dernier morceau accompagné d’un clip sobrement nommé “Brutalisme”. On y suit l’histoire d’amour entre un chevalier en armure et une femme en kimono rouge, entre le sable de la plage d’Acapulco et les murs des tours Nuages de Nanterre…

    Une occasion très poétique pour nous de revenir sur une tendance qui ne date pas d’hier : Le Brutalisme. Quand, même derrière un bloc de béton, on peut susciter de l’émotion…

    Découvrez la vidéo – > https://www.youtube.com/watch?v=E11DAkrjlP8

    Ôde au béton

    Soyez prêt à troquer vos moulures et divers ornements haussmanniens contre la rigueur allemande. Répétitions, formes géométriques simples, matériaux bruts ; avant de revenir en force dans l’univers du graphisme et du web design, le brutalisme est avant tout un courant architectural.

    Issue de l’oeuvre de Mies van der Rohe ainsi que celle de Le Corbusier, le brutalisme puise son inspiration dans le mouvement moderne. Ce terme tient son origine du mot “brut” en relation avec l’expression “béton brut” souvent utilisée par Le Corbusier et non de “brutal” comme certains pourraient le penser.

    À la fin des années 1940, il est urgent de reconstruire rapidement les villes touchées par la seconde guerre mondiale et ce à moindre coût. De nombreux architectes optent alors pour des matériaux bruts tel que le béton ou la brique, des volumes massifs et une certaine mise en avant des éléments structurels des bâtiments. Le style se veut primaire, le raffinement et l’aspect décoratif sont mis au placard pour plus de minimalisme ; c’est ainsi que les paysages urbains prennent des formes abruptes et “crues”.

    Robin hood Gardens (1972), Alison & Peter Smithson’s , photographie Sandra Lousada
    Cité Radieuse (1952), Le Corbusier

    Après un pic de popularité dans les années 1950/1960, ce mouvement va connaître une critique sévère : défiguration des paysages, suspecté de favoriser la criminalité, mauvais vieillissement des matériaux. On juge les bâtiments “laids et dénué d’esthétisme”.

    Le brutalisme divise par son aspect rude et grossier. Il frotte le regard quand on s’y attarde. Il bouscule. Cependant il faut lui reconnaître une particulière qualité graphique, en témoignent de nombreux travaux de photographes et amateurs. Les complexes architecturaux issuent du brutalisme se prêtent très bien au jeu des shootings photos ou vidéos. Une liste non exhaustive de clips musicaux se déroule dans un décor architectural empreint au brutalisme, ce qui apporte une puissance visuelle et une griffe caractéristique.

    Geisel Library, University of California, San Diego, California, USA, 1970 by William Pereira & Associates, photographie Peter Chadwick “This brutal world”
    Les Choux (1974), Gérard Gradval

    Naître brut ou le devenir

    Faisons un bond dans le futur ; quelques décennies plus tard, dans les années 1990. Dès la naissance du web et l’utilisation des premiers logiciels de PAO le brutalism design se fait ressentir, non pas par volonté dans un premier temps, mais en réponse directe aux outils disponibles pour créer. Le design au début de l’ère numérique tend vers un style rudimentaire, dénué d’ornements, avec une structure particulièrement mise en avant. On retrouve nos codes si chers au brutalisme. Alors évidemment, on ne va pas construire nos sites internet avec du béton, mais avouez qu’on croirait presque regarder des blocs d’immeubles face à cette fenêtre du tout premier navigateur web :

    Fenêtres du premier navigateur web, appelé WorldWideWeb (plus tard rebaptisé Nexus) 1995 https://thehistoryoftheweb.com/web-first-and-second-browser/
    Captures d’écrans de la version 1.0.1 de Photoshop, 1990

    Abrupt certes, mais si depuis plusieurs années les designers de divers horizons reviennent vers des créations teintées d’inspiration brutaliste, c’est qu’au final il doit bien y avoir quelque chose à garder dans ce courant si méprisé, non ?

    Réaction et provocation

    Au-delà de la construction pure et dure d’un bâtiment, le brutalisme cherche plus profondément à provoquer une réaction, à nous sortir de notre zone de confort, face à une certaine uniformisation de la beauté et une harmonisation des goûts. À l’heure du règne d’Instagram, “du beau et du bon”, le brutalism design apparaît comme une réponse à un monde un trop lisse.

    En novembre 2017, un tweet de Janny Johannesson largement relayé dresse un certain état des lieux du web design en postant “Stop. Making. Websites. Like. This.” Formule accompagnée d’un tableau des captures écrans des sites du moment, quasi tous identiques.

    https://twitter.com/chopse/status/930935055274225664

    S’affranchir des standards est un exercice difficile, surtout lorsque qu’à force de les côtoyer, on finit par se reconnaître dans des designs consensuels et rassurants… (Autant du côté des designers que des marques).

    C’est à ce moment que la bête noire qu’est le brutalisme refait son apparition, afin de donner un coup de pied dans le monde du design print et digital, un peu comme une philosophie d’outsider, tout en gardant une partie des codes du mouvement architectural. Cette fois-ci non pas en conséquence des outils numériques – qui ont bien évolués depuis – mais volontairement, comme une anti-tendance avec un esthétisme à contre-courant.

    Comment cela se traduit-il alors ?

    Nostalgiques du early web ou aficionados d’une esthétique rétro, certains designers reprennent les codes graphiques des premières interfaces quand d’autres privilégient des typographies aux graisses épaisses et imposantes.

    Pictures NOW http://picturesnow.org/

    On distinguera alors deux styles dans le brutalisme appliqué au web :

    Un premier qui se veut dépouillé, basé sur des structures géométriques proche d’un zoning, avec des typographies ou des couleurs impactantes pour aller à l’essentiel. L’exemple ayant créé le buzz étant le dernier site de Balenciaga par le Bureau Mirko Borsche.

    Dépouille visible ensuite sur des sites comme ZK/U ou encore Posh-Space :

    https://www.zku-berlin.org/

    On pourra noter l’atout d’un taux de chargement des pages très bas dû au design minimaliste ainsi qu’un accès brut et direct à l’information.

    Quant à sa seconde utilisation, elle prendra forme dans dans une veine beaucoup plus “punk”, où une partie de l’UX – en particulier le parcours utilisateur – sera bien souvent mis de côté pour offrir une expérience visuelle plus intense. Couleurs criardes, lisibilité réduite, matières et forme 3D sont mis à l’honneur.

    Souvent déconseillés pour les épileptiques, ces sites ne sont pas voués à un usage quotidien, mais permettent de provoquer une certaine sensation lors de la navigation. Ils sont expérientiels. Ce sont des oeuvres en soi. Ils n’ont pas vocation à être “sexy” ou informatifs. On aime ou on déteste, mais peu sont indifférents.

    https://0b673cce.xyz/
    http://a-school-a-park.ca/
    Uncover Designfest

    Un index en ligne à l’initiative de Pascal Deville recense une liste de sites qui se revendiquent appartenir au brutalism design. On peut ainsi lire en page d’accueil :

     

    In its ruggedness and lack of concern to look comfortable or easy, Brutalism can be seen as a reaction by a younger generation to the lightness, optimism, and frivolity of today’s web design. 

    Dans sa rudesse et son manque d’intérêt pour paraître confortable ou facile, le brutalisme peut être vu comme une réaction, par une génération plus jeune, à la légèreté, à l’optimisme et à la frivolité du web design d’aujourd’hui. http://brutalistwebsites.com/

    Cependant un des risques dans l’expérimentation brutaliste est de tomber dans une forme trop conceptuelle qui ne s’adresse qu’à un public restreint dans le monde du graphisme. Du design pour des designers (et/ou artistes) en somme.

    Brut is the new hype

    Dans le monde de la mode, de nombreuses marques ont utilisés un esthétisme issu du brutalisme, souvent associé à un style urbain et moderne. Cela est davantage accentué par l’essor du streetwear et sa relation inhérente aux banlieues autrefois emblèmes de la modernité. On assiste en parallèle à une appropriation de codes populaires par les milieux branchés ; l’art primaire et abrupt remplaçant la subtilité et le raffinement pour devenir le top de l’élégance. Les marques de luxe succombent à la tendance en même temps qu’elles la nourrissent.

    Il y a quelques années déjà, Prada sortait sa campagne FW 2014 sur fond de béton brut ou encore Rick Owens lors de son défilé FW 2016 2017.

    Prada FW 2014
    Rick Owens FW 2016 2017

    Dernièrement, les deux géants de la sneakers ont sortis des campagnes aux saveurs de béton brut. Adidas avec la Deerupt et Nike avec son opération On Air.

    On reconnaît des bâtiments aux formes massives et géométrique pour le Court métrage Deerupt, avec un focus sur la grille, le filet, la structure même de la chaussure. https://vimeo.com/258511022#at=7

    Quant à la campagne Nike On Air, l’ensemble de l’identité et l’interface du site sort droit des premières navigations internets. Blocs simples tel un zoning, focus sur les matières, typographies bold… La marque a proposé de créer 6 designs de chaussure à l’image de 6 villes.

    https://news.nike.com/news/nike-on-air-winners-2018

    Pour conclure, les tendances et styles graphiques ne cessent de réinterpréter des codes déjà existants, ce qui leur permet une certaine évolution. Nous pouvons voir aujourd’hui des hybrides de genres qui puisent leurs inspirations un peu partout, années 90, brutalisme, color block, etc.

    Le designer Aurelio Sanchez signe par exemple ainsi une identité minimaliste inspirée de l’architecture :

    Ou encore le travail du bureau Mirko Borsche qui ne cesse de défier les règles de l’esthétisme.

    Bureau Mirko Borsche: Tunica AW17 http://bureauborsche.com

    S’il ne fallait garder qu’une leçon venant du brutalisme, ce serait peut-être celle de toujours chercher à se démarquer en sortant des sentiers battus. Cela afin de toujours revendiquer son identité propre et forte, et ne pas suivre une masse rassurante certes, mais trop lisse et impersonnelle.

    Puissent nos bétons si rudes révéler que sous eux nos sensibilités sont fines.

    LE CORBUSIER
    Mareike, pour Agence’O

    #2 L’inspiration du mois. Les belles planches

    Ce mois-ci, on vous invite à prendre votre premier bain de l’année – oui oui, en mai ! – apprécier la peinture à sa juste valeur et surtout, profiter de vos prochains week-ends pour aller découvrir une nouvelle exposition à Paris !

    1 – L’eau au service du digital

    Les températures estivales ont enfin pointé le bout de leur nez ! Pour beaucoup d’entre nous le mois de Mai rime avec une envie soudaine de baignade et d’évasion au soleil. En attendant vos prochaines vacances, laissez vous enivrer par l’ivresse des profondeurs à travers ces 2 sites dont l’identité visuelle s’articule autour de l’eau : This, studio de design américain et Rive Noire, agence de création parisienne.

    On apprécie la poésie qui émane dès l’accueil du site. Constitué de courtes boucles vidéos filmées au ralenti, l’image est silencieuse et hypnotique. Elle donne l’irrépressible envie de plonger à son tour ! Pari osé, les 3 fondateurs du studio se montrent ici dans leur plus simple appareil (un shorty rayé). On pense transparence, authenticité, méthodes de travail immersives et bien chorégraphiées, donc orchestrées. Un concept original et inspirant qui donne un avant goût des vacances d’été !

    On descend d’un palier de décompression avec ce studio aux couleurs sombres et abyssales ! Les éléments typographiques y sont en constant mouvement, reprenant le rythme lent des vagues. Mention spéciale pour le développement impeccable et le storytelling de la page Contact qui s’accorde à la perfection avec le concept global posé par les 3 fondatrices. De vraies sirènes du design et de l’écriture 🙂

    2 – La peinture au service du digital

    Dans un tout autre registre, on notera un regain d’intérêt pour la peinture avec l’exposition en ligne du peintre Leon Löwentraut : #Art4GlobalGoals, initiative engagée par l’UNESCO pour sensibiliser aux problèmes mondiaux à travers 17 objectifs, et le tout nouveau site de l’agence de création parisienne Paris Calling.

    Ce site a fait l’unanimité à l’agence ! On ne résiste pas à l’envie de projeter de grands coups de pinceaux hasardeux sur les 17 objectifs pour révéler l’interprétation en peinture de l’artiste. La typographie, très condensée et à la graisse généreuse, rappelle les codes des affiches de propagande. Un concept fort et engageant au design ultra soigné !

    En touches plus subtiles, on apprécie ici les effets d’animation révélant ça et là des coups de pinceaux sur les boutons du site. L’alliance du fait main et du numérique donne à cette agence une image de proximité qui rassure. Une joyeuse bande de nanas aux talents multiples, comme en atteste la page Team du site !

    3 – L’exposition immersive de Gustave Klimt à l’Atelier des Lumières

    Si vous êtes à Paris, ne manquez pas de visiter le nouveau Centre d’Art Numérique ouvert dans le quartier du 11e ! Installé dans une ancienne fonderie du XIXe, ce lieu de 2000m² se prête 

    Parfaitement à des projections de tableaux autour de grands artistes viennois. Pendant environ 1 heure, 3 films se succèdent au moyen de 140 vidéoprojecteurs et d’une sonorisation spatialisée pour faire vivre au spectateur des sensations inédites.

    Testée et approuvée, l’immersion est totale ! A peine entré, on est plongé dans l’univers de l’artiste, ne sachant pas où regarder tant les façades sont nombreuses. Les émotions sont amplifiées par une ambiance sonore adéquate qui accompagne l’exposition tout au long des projections. Pour une appréciation optimale de l‘expérience, on vous conseillera de vous promener tranquillement parmi tous les recoins de cet immense lieu, la mezzanine vous faisant profiter d’une vue quasi panoramique sur les oeuvres projetées, l’observation depuis le sol étant plus sujette à la contemplation et la relaxation. N’oubliez pas de faire un tour dans la pièce miroir, expérience à part entière, ainsi que dans le bar du lieu, au design particulier et psychédélique. Un lieu très prometteur à découvrir d’urgence !

    4 – Le coffret mystère Cook & Nelson

    Réalisé par l’agence Butcher & Butcher, le panier Cook & Nelson piquera votre curiosité. Ce coffret, d’un bleu profond et au minimalisme intriguant, dévoile une collection de spécialités culinaires protégées dans des étuis sur mesure, aux couleurs vibrantes et primaires. Chacun d’eux est orné d’un motif graphique basé sur le drapeau de la ville dans laquelle le produit a été fabriqué.

    L’effet de surprise est réussi ! On apprécie la simplicité des formes graphiques et de la gamme colorielle choisie. On notera en outre l’absence totale d’emballages en plastique au profit d’emballages en carton. Une belle initiative pour compenser l’impact carbone générée par l’importation de ces produits de tradition issus des 4 coins des Etats-Unis.

    Say it with a gif / Dites-le avec un gif

    Qui n’a jamais répondu à une conversation ou un mail avec un gif animé ?

    Vrai phénomène de la culture web, le gif – que l’on prononce “giffe” – est partout et se décline sous toutes les formes. Vidéo-gag, mème, photographie animée, prétexte à l’expérimentation 3D, témoignage d’une expression artistique, le gif animé ne connaît aujourd’hui aucune limite.

    Décryptage d’un véritable phénomène numérique et culturel.

    1. Plus de 30 ans d’histoire

    Le gif a connu de nombreuses périodes de mutations avant d’obtenir sa reconnaissance actuelle.

    Il naît le 15 juin 1987 des mains expertes de Steve Wilhite, développeur de CompuServe travaillant alors sur un nouveau format de fichier d’image numérique.

    En 1990, il donne vie aux pages web et permet d’augmenter l’attractivité des publicités du web.

    L’entrée dans le 21e siècle marque une période sombre dans son histoire, laissé de côté pour son côté trop pixellisé, kitsch et désuet, au profit du format Adobe Flash.

    Au début des années 1990, il fait son coming back avec l’arrivée du smartphone et des plateformes de partage photos et vidéos (ex : Tumblr).

    En 2012, à l’aube de ses 25 ans, il est élu “mot de l’année” par l’Oxford University Press Dictionary, tout juste un an avant le mot « selfie ».

    En 2015, Mark Zuckerberg cède enfin à la pression de ses utilisateurs en autorisant l’entrée du gif sur Facebook, jusqu’alors boudé par le jeune milliardaire du fait de son caractère intrusif et polluant.

    2. Le GIF façon mème

    Entrons maintenant dans le vif du sujet.

    Vous les voyez partout depuis les années 2000, les mêmes demeurent aujourd’hui un moyen de communication aussi pertinent que les mots. Running gags imagés tirés d’extraits de films comiques ou de vidéos populaires, on les retrouvent sur les réseaux sociaux tels que Facebook, Twitter, Tumblr.

    Vous n’êtes sans doute pas passés à côté du fantastique Tumblr “Les joies du code”, sorti en 2012 et illustrant les private joke des développeurs informatiques, duquel ont suivi toute une série de Tumblr reprenant et déclinant ce même concept en masse, pour ne citer que les plus connus : Ciel mon Agence ! ou Je suis une vraie fille.

    Au même titre que les emojis, l’utilisation des mêmes est devenu un moyen d’expression à part entière permettant d’émettre un avis ou partager un sentiment sur l’actualité de façon plus ludique et légère qu’une simple image ou un texte.

    3. Le GIF photographique

    Le gif connaîtra une toute nouvelle dimension artistique avec l’avènement du Cinemagraph, inventé par Jamie Beck et Kevin Burg, respectivement photographe dans le milieu de la mode et graphiste spécialiste de l’animation. Ce procédé consiste à réaliser des images photographiques animées par un léger mouvement répétitif sur une zone définie, donnant à leurs images une impression de profondeur visuelle très poétique et envoûtante.

    On verra alors apparaître de nombreux artistes jouant avec cette nouvelle technique d’images montées en boucle, recherchant un certain réalisme photographique.

    Julien Douvier

    Le concept peut aussi être poussé de façon plus audacieuse et décalée, laissant place à l’imagination débordante de l’artiste. Ci-après quelques références incontournables :

    Romain Laurent

    Rrrrrrrroll

    Bill Domonkos

    Milos Rajkovic

    4. Le GIF expérimental

    Dans une toute autre forme, certains artistes emprunteront un chemin plus expérimental, composant leurs gifs de toute pièce dans des univers hypnotiques, mêlant des formes basiques en 3D avec des composantes mathématiques. Dénuée de toute forme humaine, ces gifs “pour le beau” deviennent un vrai terrain d’expérimentation, prétexte pour exprimer leur talent et leurs idées.

    Voici un panel des travaux les plus représentatifs de ce mouvement.

    Doze Studio

    Matthieu DiVito

    Alexey Romanowsky

    Carl Burton

    Paolo Čerić

    5. Le GIF vectoriel

    Depuis l’apparition de la plateforme sociale Dribble en 2009, une véritable explosion de talents émergents des 4 coins du globe a chamboulé le monde du gif.

    Dribble est devenue une vraie mine d’or d’inspiration. De nombreux designers adeptes de l’animation y publient régulièrement leurs histoires muettes, nous faisant alors profiter de leur créativité sans limite sur un laps de temps restreint.

    Les marques l’ont compris, ces boucles d’animation courtes représentent un potentiel fort en terme de storytelling où l’on peut aujourd’hui communiquer afin de booster son image de marque, quelque soit son secteur d’activité.

    Quelques illustrateurs/animateurs à suivre de près :

    Guillaume Kurkdjian

    James Curran

    Marcus Magnusson

    Teodor Hristov

    Tony Babel

    Robin Davey

    6. Le Gif-iti

    Devant ces moyens d’expression exclusivement digitaux, en 2010, le graffeur londonien INSA a eu l’idée d’un nouveau concept : le gif-iti, où l’art de mixer le graffiti et le gif, donnant lieu à des créations numériques animées immortalisant le travail faramineux du street artiste. Une manière inédite de consommer l’art urbain.

    7. Le gif illustratif

    Les illustrateurs non adeptes du vectoriel et peu familiers du logiciel After Effect ne sont pas en reste puisque sur le même principe que l’animation image par image, ils peuvent aussi donner vie à leurs peintures numériques.

    Saching Teng

    Rebecca Mock

    Henrique Lima

    Anna Taberko

    Laurène Boglio

    Quelques artistes de la blogosphère BD exploiteront magistralement cette technique jusqu’à composer une bande dessinée aux moyens de plusieurs gifs animés mis bout à bout. On assiste alors à une expérience de lecture nouvelle démontrant que le 9ème art est en perpétuelle évolution.

    Boulet

    “Notre Toyota était fantastique”

    Jen Lee

    “Thunderpaw”

    Discipline en constante mutation, terrain de jeu pour les créatifs d’aujourd’hui et de demain, le gif n’a pas fini de se réinventer et de nous surprendre.

    Depuis 2014, il est même reconnu comme média de création à part entière puisqu’il jouit dorénavant d’un concours : le Prix de la Motion Photography, lancé par la Saatchi Gallery à Londres.

    Sujet de partage et de convivialité numérique, il fait partie intégrante de la réflexion digitale pour son esthétique et ses moyens d’expressions inépuisables. En clair, vous n’avez pas fini d’en voir s’animer !

    A l’agence, on ne communique plus que par gifs. Chacun son style : l’épileptique, le poétique, l’ultra concept ou encore l’humoristique.  Devenu un vrai sujet de veille en soi, on ne passe pas un jour sans se partager nos dernières découvertes ! Et comme les marques en redemandent, on boucle cet article en gif gif gif !

    Pour ceux ou celles qui ne seraient pas totalement rassasié(e)s ?
    Quelques perles rares à visionner…

    Si vous êtes amateur du pixel art et non sujet à l’épilepsie, ne passez pas à côté de l’univers bariolé et déjanté de Paul Robertson !

    Pour les fans de Games Of Thrones, le compte d’Eran Mendel est une excellente source de gifs complètement décalés illustrant les scènes les plus mémorables de la série. Attention, spoilers 🙂

    Ils ne datent pas d’hier, mais cet article serait incomplet sans ces 2 références de clips musicaux  inspirés du cinemagraph : Joel Compass “Back To Me” et Casseurs Flowters – 06h16 – Des histoires à raconter.

    Enfin, pour les cinéastes en herbe, le tumblr Orbo Cinemagraphs regorge de gifs magnifiques au format 16/9 tirés de films cultes. Un tumblr à suivre pour son esthétisme irréprochable et envoûtante.

    Le dégradé est mort, vive le dégradé !

    Chez Agence’O, on peut dire que nous avons une réelle Histoire avec le dégradé ! Il y a encore quelques minces années, comme tout un chacun, nous criions au drame en en apercevant un, subsistant dans les communications de nos clients.

    Alors qu’aujourd’hui, nous sommes les premiers à les désirer, les travailler, et surtout les revendiquer comme système graphique HAUTEMENT CONTEMPORAIN. Nous ne sommes pas les seuls et certainement pas les premiers à retourner notre veste de la sorte.

    Le dégradé est mort, vive le dégradé !
    Retour en image sur cette bête (tout sauf) noire, qui nous a rendu chèvre…

    Un peu d’histoire

    Le “bon goût” des 90’s

    Si vous étiez déjà un adepte des ordinateurs dans les années 1990, il y a de fortes chances que vous ayez croisé la route des fameux WordArts, premiers logotypes typographiques digitaux en dégradé (si l’on puis dire)

    Disponible via Microsoft Word, cette fonctionnalité de modification de texte est principalement caractérisée par ses effets 3D et son panel de dégradés colorés (le fameux “gradient” pour les plus anglophones d’entre nous). Bien qu’extrêmement populaire à l’époque, on s’accordera pour dire que dans cet univers haut en couleurs, le “bon goût” n’a pas sa place…

    Rapidement adopté sur les pages de garde des exposés et autres documents de présentation pour apporter une touche “pop”, le WordArt illustre parfaitement l’engouement pour les dégradés de couleurs dans les 90’s.

    Wordart

    À cette période tout est permis, on retrouve les dégradés linéaires les plus excentriques dans de nombreux habillages graphiques, des logos, des génériques d’émissions télé, des artworks ou des jeux vidéos. Du bleu vers le rose, du violet au vert, rien n’arrête les designers dans leur quête de modernité, d’identités flashy et saturées à souhait.

    Logo Antenne 2 de 1986 à 1987 par Antenne 2 / Logo Canal+ de 1984 à 1995 par Etienne Robial
    ATARI Crazy cars 1987
    Suede – Coming Up – 1996 / Wham – Music from The Edge of Heaven – 1986 par Peter Saville

    Associés au début de l’ère numérique et à la création assistée par ordinateur, les dégradés chatoyants font désormais partie du décor et sont peu à peu délaissés à cause de leur connotation vieillotte, voire ringarde.

    Bonjour Internet. Au revoir petit dégradé !

    Avec l’explosion d’internet, la multiplication des devices et l’omniprésence des interfaces, le graphisme appliqué au web se développe à vitesse grand V. Il s’oriente alors vers plus de minimalisme pour guider les utilisateurs. C’est à partir de 2010 que l’on voit apparaître le Flat Design axé sur la fonctionnalité et la simplicité. Dans le web-design les mots d’ordre sont aplat de couleur, accessibilité, épure, épure ou encore ÉPURE : le dégradé vit les heures les plus sombres de son histoire…

    Mais face à trop de rigidité, voire une certaine “froideur” (avouons-le) dans le design numérique, comment replacer de “l’humain” au cœur de nos créations graphique et ainsi susciter l’émotion ?

    Aujourd’hui, l’expérience utilisateur est au centre de toutes les problématiques et engendre la quête d’un design dit “émotionnel”. Pour captiver son public on cherche à toucher sa sensibilité et entretenir une relation particulière avec lui. On parle à ses souvenirs, à son vécu pour y trouver de l’écho / le faire vibrer.

    Aujourd’hui cela est rendu possible grâce au progrès des langages et techniques d’intégration qui insufflent un vent nouveau dans la création digitale. Ainsi la recherche d’une empreinte plastique et d’une patte graphique plus éditoriale, davantage assimilé au print, est particulièrement mise en avant ces dernières années dans le design numérique.

    On travaille des formes plus organiques, on s’essaye à des rendus aléatoires proposés par les logiciels qui laissent place à l’interprétation, on ajoute des effets de papier découpé ou collé. Numériquement on ajoute du bruit ou du grains volontairement sur les visuels pour ainsi se rapprocher des rendus analogiques. Tout est bon pour retrouver de la sensibilité et de l’émotion.

    Le Come-Back

    Gradient 2.0

    Tapi dans l’ombre depuis quelques temps, le dégradé est enfin prêt à resurgir.

    Notre Gradient 2.0 fait son grand retour, il se veut plus contemporain ; on choisit des gammes colorées plus travaillées et inspirées de la nature (coucher de soleil, aurore boréale, profondeur de l’océan…) avec des transitions plus douces.

    Par ailleurs le mode d’image RVB permet, au même titre qu’une 5e couleur en impression, de proposer des visuels aux nuances fluos et vibrantes très appréciées dans les applications lifestyle.

    En matière d’identité visuelle on garde en tête le dernier logo d’Instagram, un bon exemple du renouveau des transitions colorées progressives. Sorti mi-2016, il est reconnaissable grâce à son background dégradé et son dessin linéaire blanc représentant un appareil photo en défonce. Dans un article publié sur Medium Ian Spalter, le Responsable Design chez Instagram explique :

    We wanted to create a look that would represent the community’s full range of expression — past, present, and future. (…) we knew that people loved the rainbow (…) the rainbow is a bridge into the colorful gradient

    IAN SPALTER

    Désormais nous connaissons le bleu Facebook, le jaune Snapchat et le dégradé Instagram.

    Plus récemment (fin 2017), le logo Tinder a troqué son typogramme pour plus de minimalisme. Seule la flamme reste en se parant d’une transition chaude allant du jaune orangé vers le fushia.

    Dans la création web plusieurs tendances ressortent, comme l’utilisation du background dégradé multicolore, le travail de formes et d’univers oniriques abstraits, les dégradés “Duo Tone”.

    http://elje-group.com/
    http://adova-group.com/fr
    https://www.spotify.com/fr/
    https://www.ducotedechezvous.com
    Insymbiosis site web par Phoenix Creative studio

    La consécration !

    On notera également la démarche créative du projet Baugasm lancé début 2017 par Vasjen Katro, friand de dégradés extravagants alliant formes 2D et 3D. En produisant un visuel par jour pendant 365 jours, il a décidé de poursuivre l’expérience deux années de suite pour 2018.

    Le travail du studio Irradié pour le Peacock Society Festival édition 2017 est décliné aussi bien en version numérique qu’imprimée. Il mélange des grilles très géométriques à des formes flottantes dans un large nuancier multicolore. On retrouve une certaine empreinte graphique numérique appliquée pour une campagne d’affichage.

    Plus récemment, on se souvient de l’affiche des Nuit blanches 2017 par Manuel Bürger et Pierre Vanni, dans un style résolument rétro jouant sur la symbolique d’un levé de soleil aux aurores après une longue nuit.

    Dans le milieu du packaging on retrouve les même teintes acidulées dans différentes gammes de produits. Du textile à la cosmétique en passant par l’industrie agro-alimentaire.

    Indigo packaging par Fabula Branding
    Blend packaging par Siegenthaler & Co

    Et après ?

    Dans le graphisme comme dans la mode, tout est un éternel recommencement. Adopté puis délaissé pour être enfin remis au goût du jour sous une autre forme, les dégradés n’ont pas fini de faire parler d’eux. Très présents dans toutes les formes du design, on peut se demander à quelle autre tendance vont-ils finir par laisser leur place, à quoi ressemblera leur prochaine évolution…

    Allons-nous encore retourner notre veste sous peine de supprimer par tous les moyens cet article apologétique de la toile dans quelques années ?

    L’arrivée de la réalité augmentée et le recours de plus en plus courant aux créations 3D ouvrent de nouvelles perspectives graphiques et offrent un large terrain d’expérimentation pour la suite.

    Mais aujourd’hui la seule vraie question qui trotte encore dans nos têtes reste : Pourquoi Photoshop propose toujours, en 2018, le même nuancier dans sa palette de dégradés ?

    #1 L’inspiration du mois. Les belles planches

    Avec l’arrivée du printemps, fleurs en big pattern, teintes acidulées & naïves qui sentent bon le thé vert, un joyeux coup de vent dans les cheveux, et puis…comme un retour sur les bancs du collège…

    1 – Les affiches punchy d’Andreea Robescu (Illustration & Graphisme)

    Pour fêter l’arrivée du Printemps et réchauffer un peu les températures actuelles, quoi de mieux que l’univers graphique d’Andreea Robescu ? Voici une sélection non exhaustive de ses réalisations qui mêlent couleurs vives, formes abstraites et techniques variées avec une omniprésence du girl power, thème de prédilection de cette artiste pluridisciplinaire.

    “La plus belle […. de la plus fraîche] de tes copines …”. Elle n’aura pas attendu le printemps pour faire pousser les fleurs, mais on peut dire qu’elle le porte haut et contrasté cette Andreea !
    A l’agence on adore ! C’est frais, c’est coloré, vivant, jeune… ça donne la pêche et l’envie de croquer dedans. Un beau mélange pictural pour une technique qui nous rappelle nos années lycées.

    http://andreearobescu.com/

    2 – Le rouge et/ou bleu en couleur(s) dominante(s) (Digital)

    Ce mois-ci on notera une vague de camaïeux de rouge vif et de bleu Klein, teintes franches s’adaptant facilement sur des illustrations en page d’accueil, comme en atteste ces 2 exemples ci-dessous : Creddy, une compagnie d’investissements BtoB et The Mads, une agence de design russe. Mention spéciale au travail d’animation et de développement impeccable sur ces 2 références.

    Ici l’alliance de ses teintes rassure ; et on comprend pourquoi. On parle tout de même d’investissement, de capitaux. Alors on a beau se jeter de le vide et faire de jolies cabrioles illustrées, le tout est bel et bien de retomber sur ses pattes ; pouvoir jouer l’équilibriste en toute confiance.
    Le vent dans les cheveux oui ; mais une brise qui ne décoiffe pas. Un bel exercice de style !

    https://en.creddy.ru/

    On pense à l’analytique rouge des feutres de nos professeurs. Cerclant de manière approbatrice ou non nos devoirs ; les annotant. Faisant passer du mauvais ou bon côté de la moyenne nos copies d’étudiants plus ou moins émérites. Un rouge analytique, expert, brut, aux contours parfaits de celui qui n’hésite pas, ou que trop peu.

    https://themads.agency/

    3 – Les packagings atypiques de la marque de thé anglaise Ukiyo (Identité & Packaging)

    Vent de fraîcheur dans l’industrie du thé vert avec ce packaging peu conventionnel aux couleurs acidulées et à l’identité graphique soignée. Indéniablement un packaging qui ne passera pas inaperçu en magasin et provoquera un coup de coeur avant même d’y avoir goûté. Une identité graphique réalisée par l’agence londonienne I Want Design.

    http://www.iwantdesign.com/

    C’est beau, c’est mignon…. ça fait principe de collection.
    Attention tout de même à ne pas trop rappeler l’univers du savon… Risque de cafouillage dans les rayons.

    http://www.ukiyo.co.uk/

    4 – Les animations décalées de Toggl (3D & Motion)

    On finit avec un outil de time tracker familier des agences de communication : Toggl. Récemment, la société a rafraîchi son image par une mise à jour de son site internet, laissant de côté les vidéos décalées des enfants transposés dans l’univers du travail/bureau au profit d’animations 3D cartoonesques et acidulées, présentant de manière ludique un process de travail efficace.

    L’outil fait évoluer son mode de communication en conservant un ADN assez naïf. On quitte la photographie de l’enfant pour le retrouver dans les teintes et modes de représentation des illustrations. A croire que “timer” ses activités au boulot, c’est (réservé) un jeu d’enfants !

    https://toggl.com/

    Marques, comment communiquer via les STORIES sur Instagram ?

    “swipe up”, “boomerang”, “rewind”… 24h pour sortir du lot. Instapreneurs, Storytellez vous !

    Ah ce terme de “swipe up” ! Bien marketing, mais surtout ultra utile ! “Swipe up” ou “balayez vers le haut”. Instagram “dépoussière” le Storytelling dans les Stories, principal levier de click to shop (ou “discover”) à capitaliser.

    Tout d’abord, sachez que 300 millions de personnes utilisent chaque jour le format Story et qu’un tiers des Stories les plus vues ont été créées par des marques. Cela donne à réfléchir, et surtout à investiguer !

    La Story permet de communiquer autrement, avec spontanéité et naturel, de part le caractère instantané de son format comme par sa durée limitée à 24h.

    Julie Pellet, responsable du département Europe du Sud Instagram, nous livre quelques conseils, et on les suit :

    • Miser sur l’authenticité. Le format est court. Les photos s’affichent 5 secondes et les vidéos 15. “il faut oser ! Le contenu organique ne sera disponible que 24h, alors il faut lâcher prise, libérer sa créativité, être impactant pour convaincre.” Livrer une Story, c’est permettre à son audience de pénétrer dans son univers. Si l’on ne donne pas, si l’on n’est pas vrai et spontané, généreux, cela n’accroche pas.
      “Un seul mot d’ordre : soyez authentique. Sur Stories, le contenu disparaît après 24 heures, l’occasion de montrer quelque chose de différent, de créer l’exclusivité et d’engager. Backstages, tutoriels, interviews, promotions, contenu interactif… Les variations sont infinies.”
    • La vidéo PORTRAIT est à privilégier. “Le temps passé par les utilisateurs à regarder des vidéos sur Instagram a augmenté de 80% par rapport à l’an passé et les Stories y ont très largement contribué. Ce contenu est consommé sur un écran mobile, 98% des utilisateurs découvrent le contenu en gardant leur smartphone en mode portrait. Développer de la vidéo verticale pour Stories permet d’investir l’intégralité de la surface d’un écran mobile et ainsi de créer une expérience immersive, pour capter efficacement l’attention”.
    • Le petit plus pour les marques : penser à la publicité dans les Stories. Elle permet d’ajouter un lien sortant ou d’utiliser le format Canvas pour inviter le spectateur à prolonger l’expérience et à lui faire découvrir un produit. “Si votre objectif est de renvoyer du trafic vers votre site internet, pensez à encourager votre audience à «swipe up», c’est-à-dire à faire glisser leur pouce vers le haut de l’écran pour découvrir votre site.”

    Quelques campagnes success Stories de l’année 2017

    Airbnb

    Airbnb et son hashtag #LiveThere lors de la campagne “Live like a local”. La marque souhaitant donner plus de visibilité à son concept Airbnb Experiences, a imaginé plusieurs Stories dévoilant tantôt les coulisses d’un restaurant japonais connu seulement des locaux, les paysages d’une communauté voyageant à San Francisco, etc. La marque a alors parlé d’une « augmentation à deux chiffres de son ancrage mémoriel » pour la campagne lancée.

    Parfois, la beauté du produit et l’univers d’un spot TV sur la plateforme parlent d’eux-même. Asos et Maybelline New York l’ont bien compris, créant des mini spots accrochants et extrêmement immersifs.

    Asos

    Asos, aux stories acidulées, rythmées de musiques accrocheuses, de visuels et sons simples ainsi que de beaucoup de mouvements pour renforcer la perception d’une marque expressive.

    Nous cherchons une conversation plus émotionnelle avec notre audience

    Leila Thabet, directrice du contenu et de l’engagement chez Asos.
    Maybelline New York

    Le “Colossal Big Shot” de Maybelline New York. Une succession de stories de 15 secondes mettant en lumière le packaging brillant du mascara, des vues rapprochées du produit, ainsi que des zooms sur la manière de l’appliquer.

    Notre audience cible est activement engagée avec le contenu Instagram au quotidien, ce nous permet d’enrichir la manière dont nous partageons notre histoire de marque dans une logique plus intégrée et pertinente grâce à du mouvement, de la musique, et avec deux influenceuses beauté Manny Mua et Makeup Shayla

    Anne Marie Nelson-Bogle, senior vice presidente de Maybelline New York

    Dernières nouveautés : la création de boomerang* dans les Stories, la possibilité de mentionner d’autres comptes, l’apposition de stickers, ou la création d’un hashtag réunissant le contenu permanent*.

    Le défi des marques va être de trouver le bon rythme entre des contenus permanent et éphémère. Le challenge est de créer du contenu qui ne vivra que 24 heures.

    Julie Pellet

    La to-do list

    • Changer votre compte instagram en un compte entreprise si ce n’est pas déjà le cas.
    • Soyez audacieux, authentiques et généreux.
    • Trouvez le bon rythme en alternant contenus permanents et éphémères.
    • Montrez les coulisses de vos événements, de votre société. Dévoilez les tutoriaux, les étapes des process de fabrication, diffusez des interviews des équipes ou égéries.
    • Intégrez des publicités dans vos stories, ainsi que des liens sortants.
    • Encourager votre audience à “swipe up”, c’est-a-dire à faire glisser leur pouce vers le haut de l’écran pour découvrir votre site.
    • Créez des contenus verticaux, pour une expérience plus immersive car adaptée au mobile.
    • Consultez vos statistiques et adaptez vos posts en fonction. De nouvelles statistiques ont été ajoutées récemment par le réseau social, notamment au sein des Stories : ainsi, les marques peuvent connaître le nombre de personnes ayant sauvegardé le contenu qu’elles publient. « Il s’agit d’un vrai signal sur les produits qui marchent le mieux », note Julie Pellet.
    • Communiquez aux bonnes plages horaires selon les cibles que vous visez. Ne perdez pas de vue que la cible est majoritairement millenials.
    • Privilégiez la qualité à la quantité des posts.
    • Conservez l’ADN de votre marque et trouvez votre champs lexical instagram propre.

    Et pourquoi ne pas tester les nouvelles lunettes connectées ACE pour faire des Stories encore plus immersives ?

    INSTAGRAM, ou comment doper ses canaux e-commerce ?

    “tap to view”, “shop via link in bio”, “swipe up”.
    Instapreneurs, voici votre nouvel Eldorado !

    Il est aujourd’hui établi qu’Instagram n’est plus “seulement” un réseau social de partages de photos à filtres avantageux, mais une réelle plateforme de communication. Pour ceux que l’on nomme les “instapreneurs”, c’est l’eldorado business par excellence !

    Dans les chiffres, ce sont environs 800 millions de comptes dans le monde dont 500 millions actifs chaque jour.

    Majoritairement tenus par des millenials (90% des utilisateurs ont moins de 35 ans), la convoitée audience Insta passe en moyenne 7,5 heures par jour en ligne.  Pour elle, l’achat mobile est banalité.

    Le développement des “Instagram Brands”, marques direct-to-consumer, est massif.
    Passant de l’anonymat à la consécration via la plateforme, les marques – comme les bijoux Loü.Yetu par exemple – peuvent augmenter de 750% leur CA en un an, dopé par le canal de communication Insta et ce parfois bien avant d’avoir un site web (encore moins une boutique physique).

    Instagram louyetuparis

    Avec Instagram, j’ai eu la chance de construire très vite une visibilité. Il y a un mois et demi, nous étions à 8 000 fans sur le réseau et nous avons atteint les 47 000 aujourd’hui. Nous avons été approchés, en septembre 2016, par la directrice des achats du Printemps Haussman, via Instagram, et ce, alors que nous n’avions même pas de site Web.

    Camille Riou, Fondatrice de la marque de bijoux Louyetu.

    Quelques exemples d’Insta Success Stories :

    Instagram Glossier
    • Glossier, marque de cosmétique dirigée par Emily Weiss, ancienne bloggeuse d’Into the Gloss, a vu ses ventes augmenter de 600% en 2016 en se basant sur sa communauté de followers et en utilisant à bon escient le réseau social. C’est un peu à partir d’elle que tout à débuté.
    • Cult Gaia, au sac “Ark” ayant généré plus de 12 000 posts a connu une envolée de son CA de 850% en 2017. La marque estime que 70% des ventes sur son e-shop proviennent d’’Instagram.
    • Ganni, marque à l’origine confidentielle de prêt-à-porter danoise, a construit sa notoriété sur le réseau avec son hashtag #GanniGirls. LVMH est aujourd’hui son principal actionnaire.
    • Ciao Lucia, Maison Cleo, Shantybiscuits, Saks Potts, Coucou Suzette, Aycactus, …
      La liste de ces insta brands (majoritairement mode, beauté, déco & lifestyle) ne cesse de s’allonger tant la plateforme est porteuse de clicks to shop en instantané.

    Pourquoi tant d’engouement pour des marques d’origine si confidentielles si ce n’est le fait, en tant qu’instagrammeur, de dénicher la perle rare, l’objet “valeur clé” ?

    La génération Z aime l’unicité, la transparence, l’authenticité. Une petite marque, indépendante et pourquoi pas familiale, découverte sur Insta et appréciée d’un influenceur trendy et connecté, sera comme un gage d’appartenance à la communauté UP des “initiés” de la marque, donc de sa communauté.

    Les marques ne s’y trompent pas. Pour se faire remarquer et être suivies, elles ont dû inventer un nouveau système de communication, en évolution conjointe avec les nouvelles fonctionnalités de la plateforme. On pense notamment aux fameuses Stories.

    Pandora Sykes nommait récemment cette mécanique dans le Business of Fashion Magazine la “BFF Marketing” :

    […] une approche friendly du consommateur qui lui donne l’impression que la marque est sa meilleure amie, qu’elle crée des produits faits sur mesure pour lui, et lui donne le sentiment d’appartenir à une communauté.

    Pandora Sykes

    L’instagramer est un dénicheur de talents. Les marques en sont les meilleures amies, et fédèrent des communautés d’”initiés”. Quant à Instagram, de Social media, il est devenu plateforme m-commerce.

    Les grands noms de la mode et du luxe tiennent la tête du classement, avec Zara, H&M, Chanel ou Dior. Cependant, certaines marques nées à l’heure des réseaux sociaux ont su profiter pleinement des fonctionnalités d’Instagram pour se glisser en haut du classement, comme les montres Daniel Wellington, Fitvia ou Natural Mojo.

    Parmi les grandes innovations m-commerce au service des marques se trouvent :

    • La possibilité de sauvegarder des images et les classer par thèmes dans des “Collections” privées. Fonctionnant comme une whishlist, la sauvegarde permet l’achat en différé.
    • Le “Tap to View”, permettant de créer des tags shoppables (lancé en 2016 lors de l’opération “Instagram Shopping” testée en partenariat avec une vingtaine de marques).
    • Enfin, le “Swipe Up”, permettant d’acheter un produit par l’intermédiaire d’un lien dans une Story, et ce sans quitter Instagram.

    L’instagramer est un shopper, et bon nombre de solutions se mettent en place pour améliorer cette mouvance.

    Headoo propose par exemple des solutions simples pour transformer le compte instagram des marques en nouveaux points de vente. Avec son simulateur de chiffre d’affaire sur Instagram, le service propose d’orchestrer l’expérience de social selling des abonnés des marques, augmenter jusqu’à 600% le nombre de clics VS un lien vers un site internet (à l’aide notamment des liens iShop Gallery), gérer cette même “gallery” et mesurer le taux de “shoppabilité” des images.

    L’équation semble simple et prometteuse et il est vrai que certains comptes professionnels sont devenus maître dans l’art de l’insta-shoppable comme celui de Leandra Medine, fondatrice du blog ManRepeller, avec son Instagram mrinmycart 100% shoppable, dont les followers peuvent acheter directement tous les produits mis en image sur le compte.

    Comment cela se traduit-il ?

    Instagram a publié il y quelques jours une Story mettant en avant le service Instashop.

    • Les comptes invitent via les images postées à cliquer sur le lien de la bio de la marque, en haut de page. On retourne ainsi à la page Insta pour accéder au lien dans la bio.
    • On accède alors à une autre page, sorte de passerelle entre Instagram et le site e-commerce de la marque.
    • Les images du compte sont présentées sur cet espace, de la même manière ou agencées différemment avec parfois des contenus supplémentaires et aux formats variés (gif, vidéos, etc.).  
    • Au clic, ils sont légendés sous forme d’images comme sur un e-commerce si l’image comporte plusieurs produits à shopper.
    • Ces images re-dirigent les instagramers sur les produits en questions mais au sein de l’e-commerce de la marque. On note que certaines marques travaillent particulièrement (comme « mrinmycart » cité plus haut) leur “tunnel d’achat” dans le sens où l’on semblerait ne pas quitter le réseau social. Tout semble facilité. Les liens sont exacts et tombent directement sur les bons produits. Le parcours est d’une fluidité telle qu’il est difficile de résister à shopper.

    Quant à Instagram, il continue sur sa lancée en donnant accès à de la data mesurant le succès des campagnes des marques, le trafic généré par la plateforme ou encore le nombre de clics sur des liens shoppables. Ces mêmes données que Headoo – mentionné plus tôt – propose de savamment analyser.

    Alors, prêt à doper vos ventes via Insta ?

    Consultez notre article sur les Stories pour en savoir davantage sur les opportunités à ne pas rater.

    Les tendances design à suivre en 2018

    L’année commence à peine et les sites récompensés sont déjà florissants. Quels sont les nouveaux critères qui définissent un bon site internet ? Que nous réserve 2018 en matière de nouveautés ? Les tendances 2017 sont-elles déjà révolues ou sont-elles en mutation ? 

    Découvrez les grandes tendances qui définiront le design en 2018…

    1. Les grilles asymétriques

    2017 a marqué un changement majeur dans la structure des grilles CSS avec la popularité des designs en split screen.

    En 2018 cette tendance à la déstructuration se poursuit en libérant les contenus de toute contrainte de gouttières, le côté aérien permettant de gagner en contemporanéité et esthétique.

    Noyées dans un univers concurrentiel fort, les marques doivent aujourd’hui privilégier l’expérience utilisateur pour atteindre leur cible et augmenter leur taux de conversion. On leur conseillera un design unique et différenciant, plus engageant et en harmonie avec leur image, donnant plus de visibilité à leurs contenus éditoriaux et photographiques.

    La grille perdure donc en 2018 mais s’efface au profit d’une balance harmonieuse entre les éléments visuels et les espaces vides afin d’aérer la présentation des contenus.

    http://www.lanapapier.fr/fr/
    https://en.leviev-group.com/
    https://dribbble.com/shots/4078804-Architecture-Firm-Minimal-Concept

    2. Les ombres portées

    En réaction à l’essor du flat design apparu en 2013, la tendance au “semi-flat” a renversé les codes en 2017 et est toujours de rigueur cette année, répondant à une vraie demande d’authenticité.

    La considération pour l’ombre portée n’est donc pas prête de s’amoindrir, on en use et abuse encore mais elle s’utilise de manière plus douce et diffuse dans les designs à venir afin de leur donner plus de nuance.

    On note aujourd’hui une recrudescence de variations originales autour de cette tendance graphique :

    • L’ombre portée s’anime. Grâce aux possibilités infinies qu’offre l’animation CSS, elle se déforme ou s’agrandit à la navigation, permettant d’apporter fluidité et profondeur au design.
    • L’ombre portée se colore. Terminé les tonalités de gris, l’ombre est diffuse dans des tons pastel ou plus vifs pour donner une atmosphère chaleureuse et gaie, dissimulée derrière des formes plus incurvées.
    • L’ombre portée se pare de détails. Elle aiguille le regard de l‘internaute pour rendre sa navigation efficace et intuitive.
    https://dribbble.com/shots/4101695-Promotion-Walkthrough
    https://dribbble.com/shots/3375891-Oscar-Artificial-Intelligence
    https://dribbble.com/shots/4100353-Renewed-version

    3. La typographie

    Elément essentiel et gage d’un design efficace, la typographie prend un véritable tournant cette année avec l’apparition de la police de caractère responsive et personnalisable. Preuve d’une constante évolution, elle devient intelligente et respecte les principes du Responsive Design en faisant évoluer sa largeur, son épaisseur ou sa courbure en fonction du type d’utilisation. Cette nouvelle souplesse d’utilisation favorise une expérience utilisateur optimale.

    Choisie comme élément central sur un design épuré, la customisation typographique remplace aisément un visuel pour donner de la personnalité à votre marque.

    On privilégiera une police de caractère en gras et sans empattement pour plus d’impact, mais les jeux entre typographies serif et sans serif sont toujours d’actualité, permettant de donner du rythme à la lecture.

    https://dribbble.com/shots/3552084-Web-UI-discovery-process-by-gleb
    http://8artistmanagement.com/
    http://xtian.design/

    4. Les couleurs vibrantes

    L’ère du pastel est définitivement révolue !

    2018 éclipse cette tendance et met en lumière les couleurs flashies, comme en atteste la nouvelle teinte de l’année élue par Pantone, le fameux “UltraViolet”.

    Dérivées des teintes écrans, ces couleurs vives et originales se retrouvent partout, particulièrement sur des projets éditoriaux, permettant de faire le lien entre culture print et digitale.

    Les marques se veulent plus audacieuses, exprimant le désir d’attirer l’attention, transmettre de l’émotion ou se démarquer par des couleurs vives et originales.

    Plusieurs choix possibles s’offrent alors aux designers :

    • Travailler des aplats de couleurs ultra-saturés, comme Spotify l’avait amorcé en 2015 avec sa nouvelle identité
    • Opter pour de grands dégradés dynamiques appliqués sur des formes organiques, dans la tendance du “blob”
    • Incruster des dégradés éclatants en opacité sur des photos en noir & blanc pour les rendre plus inspirantes.
    https://loaded.gg/
    https://2017wrapped.com/fr/
    http://elje-group.com/

    5. Les illustration immersives

    Dans un désir de retour aux techniques traditionnelles, les illustrations sont toujours en vogue cette année pour enrichir la personnalité d’une marque et marquer sa différence face à la concurrence.

    On oublie donc les banques d’images surfaites et on laisse la part belle aux illustrations personnalisées et aux infographies. On notera un engouement pour l’imperfection avec le retour du bruit sur les illustrations pour rappeler la texture granuleuse du papier.

    En parallèle, le SVG est en train de devenir le leitmotiv des designers, format flexible et idéal pour conserver la qualité de ses éléments graphiques (logos, icônes, graphiques vectoriels etc.). Pour les adeptes du pixel perfect, le SVG offre une multitude de possibilités et s’anime facilement avec le talent des développeurs.

    https://dribbble.com/shots/3630446-Illustration-for-the-essensys-tech-part-1
    https://mixpanel.com/
    https://www.inturn.co/

    6. L’animation / L’interaction

    Dans cette volonté de donner toujours plus de vie à ses créations, 2018 prolonge la tendance à l’animation sous toutes ses formes.

    Les sites se parent de micro-interactions destinées à renforcer l’engagement des utilisateurs.

    Fini les sites statiques qui renvoient une image dépassée et vieillissante, les boutons s’animent, les menus hamburger évoluent, même le parallaxe, que l’on pourrait croire dépassé, s’adapte pour ne pas être ennuyeux. On trouve aujourd’hui de nouvelles façons de l’appliquer en l’associant à une navigation en one-page.

    Le plaisir du scroll perdure avec l’utilisation quotidienne des mobiles et la navigation intuitive des réseaux sociaux.

    L’animation ne doit pas être un gadget ludique, mais donner du sens aux contenus, et l’on préfèrera donc – côté CSS – des animations se déclenchant au scroll ou des effets de transition entre les pages. Toute une flopée d’éléments visuels se présentent également aux designers pour voir leurs créations prendre vie et décrire de manière plus immédiate l’ADN d’une marque : les images en 3D, les gifs, le support vidéo, les logos ou icônes animés etc.

    https://getobachan.com/
    http://disasterartist.movie/home
    https://dribbble.com/shots/4069756-Snow-Hunt-Interaction-Concept

    7. Le mobile first

    La navigation sur mobile est devenue une habitude pour les utilisateurs. Depuis 2017, elle a même dépassé la navigation sur ordinateur. Si bien que 2 paramètres majeurs sont plus que jamais à prendre en compte dans les conceptions digitales :

    • Le lancement par Google d’un nouvel index Mobile First, mettant en avant des pages web sur les résultats de recherche si ces dernières répondent à un design adapté aux mobiles.
    • La popularisation de l’AMP (pages mobiles accélérées), nouvelle norme de codage plus légère permettant d’accélérer le chargement des pages sur mobile et augmenter considérablement son taux de visibilité et de clics

    La conception des sites futurs devront impérativement prendre en compte ces nouvelles normes afin de se tourner davantage vers l’utilisateur.

    https://dribbble.com/shots/4101566-Snug-Mobile-App-Real-Project
    https://dribbble.com/shots/4044613-Home-Finder-App-Exploration

    8. La photographie

    Dans de nombreux domaines, notamment le e-commerce, le choix d’un contenu photographique peut rester plus pertinent que l’illustration.

    La photographie apporte immédiatement une dimension humaine engageante et authentique. Si on la veut soignée, la meilleure option pour le directeur artistique reste de travailler en collaboration avec un photographe qui définira une ligne directrice pour représenter au mieux le sujet donné.

    On peut en outre donner encore plus d’interaction et de vie dans une photographie en l’associant avec les techniques d’animation évoquées précédemment : les gifs façon cinemagraph, la vidéo ou les shootings photo en 360°.

    https://droledemonsieur.com/
    https://www.duroc.ma/fr/
    http://circulardev.com/nike/cortez/
    https://dribbble.com/shots/4062487-Adicolor-SS2018-Lookbook-Carousel

    En 2018, l’internaute est roi. On privilégie l’accessibilité et l’expérience utilisateur plutôt que l’apparence, on priorise la consultation mobile.

    L’enjeu sera donc de faire face à tous ces défis techniques pour optimiser la navigation sans bouleverser les habitudes des utilisateurs.

    Malgré ces contraintes, l’engouement pour l’esthétisme perdure, le designer se risque aux expérimentations pour fournir des sites toujours plus originaux, conviviaux et innovants.

    2018 s’annonce inspirante, à vous de vous lancer !

    1 2 3 4