Communication graphique d'une école de design interactif

Le Lycée Léonard de Vinci à Villefontaine, spécialisé dans Métiers de l’audiovisuel et du design, ouvre un nouveau diplôme en septembre 2012 : un DSAA avec deux options : design interactif et design de produit. Ayant fait une année de scolarité dans cet établissement, et ayant gardé de bons liens avec certains des enseignants, je me fais l’apôtre de cette nouvelle formation. D’ailleurs, c’est probablement une formation que j’aurais rêvé de suivre, si elle avait existé il y a dix ans…

Ce Diplôme Supérieur d’Arts Appliqué, de niveau Master 1 (reconnu par l’État), est donc organisé en deux options ( design de produits et design interactif ). Cette double orientation, inédite en France, me semble extrêmement intéressante et devrait répondre aux nouveaux usages numériques émergents ( objets connectés, interfaces tangibles, services numériques, etc. ).  L’aspect design d’interaction devrait se retrouver au centre du sujet. Pour couronner le tout, tous ces projets seront menés en partenariat avec des centres de recherche (CEA notamment), des entreprises et agences du secteur des nouvelles technologies.

Ça fait envie !

Et comme toute bonne promo, j’en remets une couche,ce n’est ni une, ni deux, mais trois années offertes pour le prix de deux !
Désormais, les étudiants pourront continuer, s’ils le souhaitent, leurs études avec une 3e année (ce qui correspond à un Master 2), dans un établissement partenaire à l’étranger (Angleterre, Suède, Danemark). Une opportunité d’ouverture à l’internationale qui sera une véritable valeur ajoutée à ce diplôme.

Enfin, cerise sur le gâteau, la 2e année se déroule en alternance.L’occasion pour les étudiants de mettre en application leurs compétences, savoir-faire et méthodologies en conduisant des projets dans la « vraie vie« . Celle où la deadline est déjà passé avant même d’avoir reçu un brief !

Pour en savoir plus : http://dsaa-master.designvillefontaine.com
Date limite pour l’inscription en ligne : 2 mai 2012.
10 places par option. Études gratuites (!).

- – - – - – - – - – - - – - – - – - – - – - - – - – - – - – - – -

QUELQUES EXEMPLES DE PROJETS…

Quelques exemples de projets menés dans leur BTS qui rendent compte des orientations de ce futur DSAA.

Projets « L’après-télécommande » avec la société 4mod. Il s’agissait de s’interroger sur les nouvelles manières d’interagir avec la télévision à l’ère de la télévision connectée… voici quelques exemples en vidéo :

Projet Muséolab mené l’année dernière en binômes BTS design produits/ BTS multimédia avec le centre Erasme (musée et nouvelles technologies) autour des usages innovants dans le domaine de la muséographie. Découvrez les 10 projets ici > http://museolab.pixelpoivre.net/expo/

Museo Lab Workshop Design Interactif

Retrouvez encore plus de projets sur le site de leur section : http://www.pixelpoivre.net

- – - – - – - – - – - - – - – - – - – - – - - – - – - – - – - – -

UNE COMMUNICATION ORIGINALE

L’arrivée du nouveau DSAA s’accompagne d’une nouvelle identité visuelle réalisée par Mahé Chemelle. Elle a plusieurs objectifs. D’une part, elle est née de la volonté de valoriser la section design. Pour cela, les personnes en charge du projet ont décidé de concevoir un nouveau logotype  ainsi qu’un nouveau nom:   »Pôle Supérieur de Design – Lycée Léonard de Vinci – Villefontaine. »

D’autre part, de l’innovation et des spécificités du nouveau diplôme, découle la nécessité de communiquer dessus. Le besoin d’information et d’explication sur le DSAA était tel, qu’une brochure et un site spécifique ont été réalisés. Graphiquement ces notions sont abordées à travers un travail typographique évoquant la création d’un langage propre, en avance sur son temps, dont le décryptage nécessite un effort qui permettra d’accéder à leur univers.

« Un diplôme venu d’ailleurs » : Je trouve cette nouvelle accroche très pertinente et décalée. Pour ceux qui connaissent Villefontaine, ça évoque avec humour leur situation géographique… proche de Lyon, mais à côté de rien… C’est donc une section extra-terrestre située sur une autre planète… Ce qui peut sembler un défaut peut se transformer en qualité quand on connait l’état d’esprit et la solidarité qu’il peut régner entre les étudiants ( et même avec leurs enseignants).




Graphéine vient de réorganiser l’architecture de marque du groupe Fia-net, société qui se positionne comme le leader français des solutions de confiance pour le e-commerce et de lutte contre la fraude à la carte bancaire sur Internet. L’entreprise était arrivée à un stade où la multitude de ses services et de ses produits imposait de revoir la charte graphique complète du groupe. Nous avons donc conçu un système graphique qui puisse donner de la cohérence visuelle à l’ensemble, et en même temps qui permette d’opérer une distinction de ses produits au sein de la marque.

Ce travail c’est accompagné d’une refonte complète de l’iconographie des services Fia-net ainsi que par la création de la charte graphique du site de la marque mère, jusqu’alors inexistant.

Nouvelle architecture de marque Fia-net : chaque produit possède désormais une dénomination et un emblème distinctif. La forme « en goutte » des emblèmes renseigne sur l’appartenance des entités au même groupe. L’identité visuelle « Kwixo » a été conçue par l’agence Seenk.

Avant la refonte de la charte, le système graphique était essentiellement basé sur la déclinaison chromatique du symbole de Fia-net.com

Création de l’identité visuelle de la Marque-mère distinctive de ses produits

La nouvelle marque-mère est complétée par la signature «e-solutions». Cette signature souligne l’envergure du groupe Fia-net, ainsi que sa position de leader en services de confiance en ligne

Nouvel emblème du système de détection de la fraude à la carte bancaire

Création de la nouvelle dénomination + identité visuelle de l’offre «détection de la fraude à la carte bancaire»

Nouvel emblème de Fia-net.com

Refonte du logotype sceau de confiance Fia-net.com. Fia-net.com propose un annuaire de sites marchands évalués par les acheteurs.

Nouveau dessin du bloc typographique fia-net.com, optimisé pour l’affichage en petites tailles du logotype et du widget

Emblème de Kwixo (conçu par l’agence Seenk)

Nouvelle identité visuelle de la solution de paiement renommée «Kwixo» conçue par l’agence Seenk

Refonte du label «Site Premium»

Couverture des plaquettes commerciales certissim et fia-net.com utilisant leurs nouvelles chartes iconographiques respectives

Charte graphique du site de Fia-net group

Création de la nouvelle charte graphique du site Fia-net.com

 




Museum Expression

21 juillet 2011 » AFFICHES + GRAPHISME + INTERNET

Création de l'affiche d'un salon dédié aux musées

Voici l’identité visuelle que nous venons de créer pour “Museum Expressions”, un salon dédié à l’objet et au marketing culturel.
http://www.museum-expressions.fr

Conception graphique et dévéloppement web site Museum Expression




Profitant d’une visite à Cluny dans le cadre d’un travail sur la signalétique de l’École des arts et métiers, voici un petit aperçu d’un dispositif muséographique en réalité augmentée.

Construite en 910, par les bénédictins, Cluny devient un centre intellectuel de premier plan au Moyen Âge. L’abbatiale est alors le plus grand édifice religieux d’Occident (187 mètres). La Révolution française sera fatale, et l’abbaye servira de carrière de pierres jusqu’en 1813 pour les maisons du bourg. Aujourd’hui, il ne subsiste que 8% des bâtiments de l’époque, d’où la problématique: comment rendre visible la « magnificence » d’un lieu qui n’existe plus… c’est là que la réalité augmentée intervient !

Ce dispositif a été mis au point à Cluny par l’équipe de l’Institut Image. Le visiteur oriente un écran à sa convenance et observe l’abbaye telle qu’elle était au XIIe siècle. La lumière ambiante éclaire à la fois les parties réelles et les parties virtuelles, grâce à une capture en temps réel de la voûte céleste et de sa luminosité.

C’est une sorte de fenêtre temporelle qui donne envie de se prendre pour Marty McFly au moyen-âge ! Malheureusement, pour rentrer sur Paris, ma DeLorean s’appelait SNCF, et c’était plutôt back to the past avec 30 min de retard.

Le site internet du projet: www.ray-on.fr/

Plus sur le sujet cluny-numerique.fr, et aussipar ici »




Diaspora* est-il un futur Facebook killer ?

A ce stade difficile de répondre par l’affirmative !

Mais commençons par le début : Diaspora* c’est quoi ?
Il s’agit d’un projet permettant de créer un réseau social aux fonctionnalités similaires à Facebook, mais dont l’originalité est vouloir être totalement non-commercial, décentralisé et sécurisé afin, par exemple, de préserver la vie privée des participants. Diaspora* est distribué sous licence AGPL*.

Diaspora Facebook like screenshot explication

ScreenShot de Diaspora en cours de développement


Comment ça marche ?

Ce sera comme un Facebook que chacun pourra héberger sur son serveur. L’utilisateur disposera d’une « seed » (graine) correspondant à son profil et à une URL. De base, on peut accéder à la version publique de ce profil via cette URL, mais si on devient « ami », alors on aura accès à une version privée via une URL personnalisée et sécurisée.
Quoi, ce n’est pas clair ? bon, reprenons l’exemple de la page wikipédia :
Admettons que le profil de Sophie se trouve à l’adresse http://www.sophie.com/. Elle a autorisé Pierre à être son ami. Pour cela, il a dû fournir sa clé publique au système, qui lui a fourni la clé d’ami « 6389″ en échange. Il peut accéder au profil public de Sophie à l’adresse http://www.sophie.com/, mais il obtiendra plus d’informations, étant un ami, à l’adresse http://www.sophie.com/6389. Il verra par exemple les photos de vacances que Sophie est prête à montrer à ses amis à l’adresse http://www.sophie.com/6389/photos. Les informations en réponse à la requête de Pierre sont chiffrées en utilisant la clé publique de Pierre, et donc lui seul pourra les déchiffrer à l’aide de sa clé privée. Élémentaire mon cher Watson !

L’équipe de Diaspora* a récolté la coquette somme de 200 000 dollars de dons via le site Kickstarter. Même Mark Zuckerberg a donné ! (…d’ailleurs c’est louche  ?). Ils ont travaillé sur l’interface utilisateur, en collaboration avec la designer Janice Frasier (LUXr*). Bien que le projet soit bien parti, il s’agit d’un projet à long terme, nécessitant une importante communauté de développeurs. Nous ne pouvons que saluer toute cette matière grise en action et espérer que 2011 verra naître un Facebook libre de droits.

Pour en savoir plus : www.joindiaspora.com
et aussi : http://fr.readwriteweb.com/2010/05/06/a-la-une/projet-diaspora-anti-facebook/

*AGPL : C’est une licence libre dérivée de la Licence publique générale GNU avec une partie supplémentaire couvrant les logiciels utilisés sur le réseau. En gros, c’est de l’open source, dont on doit rendre publiques les modifications. C’est une façon de luter contre la récupération commerciale d’une application open-source. Par exemple, Google utilise de nombreuses solutions open-source qu’il modifie allègrement afin de les améliorer, mais ces améliorations restent secrètes pour ne pas permettre à un concurrent de les utiliser. Si google avait utilisé des solutions « AGPL », tout le monde aurait profité de ces améliorations et le monde aurait été plus beau ! Cependant cette licence semble soulever quelques questions ( cf: http://philippe.scoffoni.net/agpl-resout-tous-les-probleme-open-souce-et-cloud-computing/ )

*LUXr (luxr.posterous.com): il semble que se soit des sortes de « wokshops » entre professionnels afin de faire collaborer différents spécialistes du Design dans le but d’aider des start-up prometteuses… sympa !

La typographie du logo : Il s’agit de la Brandon Grotesque Light Regular. Dommage de ne pas utiliser une typographie libre de droits pour un projet de ce type ! (cf: www.fontsquirrel.com)




Jean Giraud dit Mœbius est l’invité de La Fondation Cartier pour l’Art Contemporain du 12 octobre 2010 au 13 mars 2011. Pour le compte du studio WeWe qui s’est occupé de l’identité visuelle de l’exposition (cf: visuel ci-dessus), nous avons réalisé la bande-annonce cinéma et la page d’accueil du site. Il s’agissait d’animer en 3D le visuel de l’affiche. Le travail a été réalisé sous Blender.

Vous pouvez découvrir ce travail ici . N’hésitez pas à survoler et cliquer l’image à la recherche de toutes les animations réalisées.

Ci-dessous : la bande-annonce cinéma de l’exposition ( à regarder en HD, c’est mieux ! )

Image de prévisualisation YouTube

Illustration : Jean Giraud
Direction artistique:  we-we
Musique : Jean François Gautier
Réalisation 3D : Graphéine




Grâce aux efforts conjugués de keepa pour le développement et de graphéine pour la DA, le site de la 24e édition du festi’val de marne est lancé. Vous y retrouverez autour d’une programmation toujours riche et éclectique, les refrains des gamins, les artistes qui font leur « premiers pas » et la journée JIMI ! Et un grand merci à Cyril pour son animation qui décoiffe le « childemarne »…

http://www.festivaldemarne.org/




Sony Animation pixel-art ecologie

http://www.sony.fr/article/animation-ecologie

Réalisation d’une illustration pixel-art pour Sony. Il s’agissait de présenter le cycle de vie de leurs produits: recherche, production, conditionnement… jusqu’au recyclage. Nous avons donc imaginé une mini-mappemonde regroupant ces différentes étapes. L’illustration a également été imprimée sous forme de brochure papier.

Ps: Saurez-vous retrouver le petit Chaperon Rouge ?




Tout nouveau, tout frais … voici la version beta de « Paint The Web »  :
http://www.grapheine.com/paint-the-web .

Il s’agit d’une petite application permettant de dessiner sur n’importe quelle page web. En enregistrant son œuvre, on obtient un lien que l’on peut partager avec ses amis.

Un dessin publié peut ensuite être modifié à nouveau par dessus… à l’infini… (On peut ainsi imaginer de jouer au cadavre exquis entre amis…).

Évidement, une tablette graphique facilite grandement le travail !

Vos remarques sont les bienvenues…
:-)




Il s’agissait d’un appel doffrese lancé par le Centre Pompidou portant sur la direction artistique et l’ergonomie du projet Centre Pompidou Virtuel. Ce site devant permettre de rendre disponible facilement leur immense collection de médias numériques (images, vidéos, sons…).
Voici notre interprétation de ce que pourrait être ce musée virtuel ( Projet non-retenu )  :

Interface de recherche multi-médias Centre Pompidou virtuel

Nous avons imaginé une interface modulaire permettant d’aborder les collections du centre Pompidou demultiples façon.

L’idée première étant de montrer à travers cette grille d’images la diversité et la quantité des informations disponibles sur le site. La barre de recherche et ses fonctionnalités avancées sont là pour rechercher, trier, organiser cette masse d’informations.

Synopsis de navigation : En arrivant sur le site, l’internaute se voit proposer une mise en avant des dernières actualités ( expositions, conférences, etc. ) qu’il peut consulter directement. D’autres « médias » lui sont proposés « aléatoirement ». Au survol d’une image, une légende contextuelle apparait. Il peut également lancer une cherche simple ou avancée lui permettant par exemple de trouver tous les « médias » se rapportant à cette recherche.

Lorsqu’il consulte un « média », une page s’ouvre par dessus sa recherche. Il peut donc à tout moment, retrouver sa recherche sans changer de page.

Dans cette esquisse, la complexité de l’ergonomie est à peine explorée. De multiples codes visuels et autant de fonctionnalités seraient encore à imaginer…

PS: Il s’agit d’un projet non-retenu qui ne présage en rien de l’éventuel projet qui sera réalisé par le Centre Pompidou.