Bienvenue sur mon blog !

Je vais travailler cet été (entre autres) sur la réalisation d’un CDROM pédagogique, qui comportera des décors en illustrations isométriques. Pour l’instant j’en suis au stade des croquis, que voici ci-dessous. Je vous montrerai les étapes de mise en couleur ensuite.

Faites tourner :

Tags : Croquis, Illustration, isométrique, wip

Je fais une mise à jour de Wordpress en version 2.8, donc pendant quelques minutes (si tout se passe bien) le blog devrait être un peu perturbé… désolé pour la gêne occasionnée. Si tout se passe mal, ca durera plus longtemps. c’est beau, la technique.

Edit 12h34 : bon la mise à jour a été faite, j’ai suivi les instructions trouvées ici.

Par contre j’ai des soucis avec quelques unes des extensions, celles qui me permettent de modifier l’ordre des catégories et des liens dans la colonne de droite. Pas bien grave…

Plus génant, l’extension qui permet d’ouvrir en “box” certains éléments ne fonctionne plus… Je vais essayer de trouver une solution. Si vous constatez d’autres bugs, n’hésitez pas à me le signaler !

Faites tourner :

Tags : Wordpress

La société Profileo m’a demander de réaliser l’interface du blog et de la boutique d’un projet bien sympathique : De Sab à Tom. Le principe est simple : Sab parcourt le monde, déniche des objets d’artisanat local, et les envoie à Tom qui les vends… Donc des objets uniques, et le principe n’est pas simplement un concept ou un coup de buzz, Sab et Tom existent bien ! Il y a donc le blog sur lequel ils parlent de leurs voyage, racontent comment ça se passe, et en parallèle la boutique ou vous pourrez acheter les objets si vous le souhaitez. Le blog est basé sur le moteur Wordpress. J’ai essayé de faire un header qui “raconte une histoire”, et résume graphiquement le principe, en mélant photos et illustrations. Le police utilisée pour le logo est du Caterpillar.

N’hésitez pas à aller voir tout ça par vous-même, pour les encourager !

Faites tourner :

Tags : Illustration, Webdesign, Wordpress

Et oui, comme l’indique le début du titre de cet article, celui-ci est le centième sur ce blog ! Pour l’occasion, je me suis dit qu’il faudrait un peu marquer le coup et fêter ça dignement… J’ai réfléchi longuement à ce que je pourrais faire d’un peu inhabituel, et n’ai pas vraiment trouvé… J’ai a un moment pensé à louer le stade de France le week-end dernier pour tous vous inviter, mais il parait que ça n’était pas libre. Et les Rolling Stones, que je comptais faire venir pour l’occasion, n’était pas disponibles, ou leur carte vermeil pas à jour, enfin je sais plus trop.

J’ai donc demandé autour de moi, notamment sur mon compte Twitter, et bé oui, ayé, moi aussi je touitte…

Or donc, sur Twitter, Olybop m’a conseillé de faire une sorte de récap de mes statistiques. J’ai donc regardé ça et me susi aperçu que son conseil n’était peut-être pas dénué de perfidie… Parce que pour lui, en effet, les stats sont flatteuses, avec ses plus de 600 articles en 6 mois… Mais de mon côté, avec mes 100 articles en plus de 4 ans, disont que je peux difficilement la ramener… Ca me fait une bonne moyenne de 2 articles par mois… C’est “léger”… Au niveau du nombre de visites, ça n’est pas non plus énorme, il y a entre 2000 et 3000 visites par mois.

Pas de quoi bomber le torse, je ne vais donc pas épiloguer sur mes stats, mais du coup j’ai un peu fouillé, et dans la rubrique “mots clés”, j’ai vu des choses amusantes… Cette rubrique de stats, c’est là ou on voit quels mots-clés recherchés dans Google ont permit d’aboutir sur mon blog. Les premières positions, c’est logiquement “blog graphiste”, ou “blog illustration”… mais il y a aussi des choses surprenantes, et notamment plusieurs personnes qui sont arrivés ici en cherchant dans Google “animation contraction excentrique”. Si si ! Tapez ces mots clés dans Google et vous verrez que j’arrive en 2e position des résultats !

Mais on arrive sur une page qui n’a aucun rapport avec les mots-clés suscités… mystères des algorithmes de référencement… Mais bon, comme je suis un garçon qui a le souci constant de satisfaire mes visiteurs, je me suis dit qu’il fallait que je réponde à cette demande, voici donc une animation de contraction excentrique :

Voilà, j’ai fait ce que j’ai pu, si cette animation vous semble ridicule dites vous que vous aviez qu’à chercher autre chose, hein ! Je n’y suis pour rien, moi, si vous cherchez des choses aussi bizarres, d’abord.

C’était donc ma façon à moi de fêter dignement ce centième article de blog !

Par ailleurs, j’en profite pour vous demander de me faire toutes les suggestions possibles pour améliorer ce blog… Si vous pensez à des types d’articles que vous aimeriez voir ici, ou des choses que vous n’aimez pas, n’hésitez pas à le dire dans les commentaires ! Je ne dis pas que je prendrai en compte toutes vos remarques, parce que je suis une tête de mûle, mais on ne sait jamais

Par exemple j’ai souvent hésité à faire des articles un peu “hors graphisme”, des articles sur des livres ou BDs que j’aime, ou musique… A chaque fois j’hésite en me disant que mon avis à moi ne vous importe sans doute pas tellement, mais au pire, vous pouvez zapper… A voir…

En attendant, à bientôt, j’essayerai de fêter aussi dignement le 200e articles… dans 5 ans…

PS : toujours en consultant mes stats, j’ai pu voir qu’un gentil mexicain avait trouvé l’interface de mon blog assez attrayante pour que ça vaille la peine de la copier sans vergogne : http://venomezcalito.blogspot.com/

Il a au moins eu le tact d’indiquer dans la page qu’il s’était “inspiré” de mon blog, mais bon, un petit mot pour me demander l’autorisation aurait été le bienvenue. Mais ça ne me pose pas de souci dans l’absolu, je prends ça comme un hommage plus qu’un plagiat, et comme je ne parle pas l’espagnol…

PS2 : on me souffle dans l’oreillette qu’une contraction excentrique est en fait un terme d’anatomie…

“Contraction excentrique : La force de contraction du ou des muscles est inférieure à la force de résistance à laquelle elle est opposée et les leviers osseux s’éloignent. ex., lors du mouvement du squat, la contraction est excentrique lorsque les fesses se rapprochent du sol. “

Il semblerait donc que les visiteurs qui arrivent sur mon blog en faisant ces recherche soient des étudiants en anatomie… Ou des médecins du sport qui veulent expliquer le mécanisme aux sportifs qu’ils suivent. Je tiens donc à préciser que je ne pourrais aucunement être tenu responsable des notes catastrophiques des étudiants qui auront intégré mon animation ci-dessus dans leurs cours. Je décline également toute responsabilité auprès de nos amis les médecins du sport.

PS3 : si vous voyez un jour dans une salle de fitness une personne qui s’entraîne avec un masque d’aviateur et des bottes bleues, dites le moi, ça me fera plaisir de voir que mon blog a de l’influence, enfin ailleurs qu’au Mexique

Faites tourner :

Tags : Animation, Flash

“Compagnons de cordée” : le terme évoque la montagne, l’alpinisme, l’entraide… mais en l’occurence il s’agit d’une société d’accompagnement dans domaine du recrutement online. J’ai été contacté il y a quelques mois par Laurent Joseph, une sorte d’énergumène très bavard, qui était dans la phase de création de cette société. Il avait le nom, “Compagnons de cordée”, et m’a demandé de concevoir le logo. Sachant qu’il a pour principe de travailler “autrement”, le nom étant proche de ses valeurs et de sa façon de travailler. Par exemple pour logo nous avons travaillé à plusieurs, un DA, Pierre, donnant des directives “symboliques”, et Anne Cécile une autre graphiste faisant aussi des propositions. Le tout absolument pas sur le mode “mise en concurrence”, mais au contraire dans l’objectif d’une saine émulation. C’est ce qui m’a plu dans ce travail, tout se fait dans un but réellement constructif. Laurent Joseph n’est pas un client “ordinaire”, il a des valeurs et un fonctionnement qui font que la relation devient enrichissante pour tout le monde, son but est d’aller plus loin qu’une simple relation “client/fournisseur”. Il veut toujours aller plus loin, faire le mieux possible. Il y a parfois des clients qui sont “trop exigeants”, dans le sens ou ils essayent d’avoir plus que ce qui était prévu au départ, qui cherchent juste le profit. Ce qui n’est pas du tout son cas, au contraire. Il s’agit juste d’une volonté de bien faire, pour que ce soit enrichissant pour tout le monde. Ce qui va tout à fait dans le sens de ma façon de travailler, si je me suis installé en indépendant, c’était justement pour travailler “autrement”.

Le brief initial était de concevoir un logo reprenant la symbolique de 2 mousquetons, symboliques du lien, du travail d’équipe, de la solidarité… Design épuré, plus suggestif que réaliste.

Ci dessous les premières pistes que j’ai réalisées :

Les polices utilisées : A – Qlassik / B – Libel / C – Cocon

Anne-Cécile avait elle proposé une piste plus figurative, représentant 3 alpinistes. J’ai donc par la suite retravaillé sur cette piste, mais de manière plus figurative, en essayant d’épurer de plus en plus, ce qui a donné ces deux autres essais :

Les polices utilisées : D – Med regular / E – Rotis semi serif

La proposition E étant celle que nous avons décidé de retenir sur la forme, mais pour laquelle j’ai retravaillé les couleurs, ce qui a donné cette version finale (la police finale retenue est du Fertigo) :

La suite a été  de mettre en place un site internet, la solution retenue a été d’utiliser le moteur Wordpress et de personnaliser un thème existant, le résultat est en ligne officiellement depuis aujourd’hui !

Cliquez sur l’image ci-dessous pour y accéder :

Faites tourner :

Tags : graphisme, Webdesign, Wordpress

J’ai été contacté il y a quelques mois par les dirigeants du site internet www.sitew.com. Il s’agit d’un site internet proposant un outil de création de site internet, selon des templates existant, tout est automatisé. Ils m’ont demandé si je pouvais travailler à une refonte de leur site internet. Pour être franc j’étais d’abord réticent, il existe plusieurs sites proposant ce genre de services, c’est souvent assez mal foutu, et dans l’absolu ces sites sont potentiellement concurrents de mon activité, puisqu’ils permettent de créer un site internet en se passant des services d’un graphistes…

Mais j’ai quand même été voir comment fonctionnait le site, ça m’a paru largement mieux fait que d’autres services similaires, pas mal d’options qui montrent que les personnes derrière tout ça connaissent le web… Deuxième étape, comme toujours je fait quelques recherches via notre ami Google… Hé oui, cela peut vous paraitre un peu parano, mais en général quand il s’agit d’un premier contact, je fait une rapide recherche sur les noms des dirigeants, etc. Ca ne prend que quelques minutes, et si ça peut éviter des impayés, c’est toujours ça. Et donc là je suis tombé sur un court métrage en animation stop-motion fait par Fabien Versange, la personne qui m’avait contacté. Ce petit clip est d’ailleurs visible ici.

Une personne qui peut passer des heures avec ses amis à photographier un bonhomme en pâte à modeler et des Playmobils ne peut pas être foncièrement mauvais !

J’ai donc accepté l’offre ! Le site existant ressemblait à ça :


Le brief était, en résumé, de faire “simple, ludique et moderne”.
Il fallait au passage revoir le logo, j’ai donc essayé de garder le principe du puzzle, mais en le modernisant, ce qui a donné ceci :


Manque de pot, quelques semaines après la mise en ligne du site revu, le client s’est aperçu que le logo ressemblait beaucoup trop à celui d’Office 2000 !


Je ne me souvenais pas de ce logo, n’ayant pas eu cette version d’Office, mais j’avais du le voir forcément, et il est ressorti sans que je m’en aperçoive… J’ai donc retravaillé le logo, parce que bon, vous je sais pas, mais moi l’idée d’un procès face à Microsoft©™ ben ça m’enchante qu’à moitié…

Ce qui a donné cette v2 du logo :


Et le site final, avec la nouvelle charte, est donc visible ici :


Cliquez sur l’image pour aller visiter le site !
Les visuels du petit personnage en 3D viennent de la photothèque iStock La police utilisée pour le logo et certains titres est du Qlassik.

Je ne regrette absolument pas d’avoir accepté cette misson, déjà il n’y a finalement pas de concurrence, la cible de ce site n’étant pas la même que la mienne. Ce genre de service est parfait pour les personnes ayant besoin d’un “petit” site qu’ils devront mettre à jour eux-même, qui n’ont aucune connaissance en informatique, mais ont quand même besoin d’un site sérieux. Ils proposent des formules gratuites et d’autres payantes, mais dans tous les cas à bas prix.

Qui plus est, il est toujours agréable quand on est indépendant de travailler dans de “bonnes conditions”, ce qui a été largement le cas ici. Budget réduit, mais client qui ne cherche absolument pas à abuser, ouverts aux échanges, qui propose de lui même un accompte et paye dès réception de la facture, c’est assez rare pour le noter !

Faites tourner :

Tags : graphisme, Webdesign

Je travaille en ce moment à une série d’illustrations et animations pour une application de e-learning, dans le domaine du bâtiment. Cliquez sur le lien ci-dessous pour voir quelques une des illustrations en cours.
Read the rest of this entry »

Faites tourner :

Tags : Illustration, isométrique

J’ai enfin pu avancer un peu sur mon projet “clonks”… Ayant un planning surchargé en ce moment, je ne peux avancer qu’au compte-goutte, désolé. En clair, j’arrive difficilement à trouver 1 ou 2 heures par semaine pour y travailler, ce qui explique la lenteur de l’avancée du projet ! Mais merci aux quelques personnes m’ayant demandé des nouvelles, ça me motive pour avancer !

Bref, je n’avait pour l’instant travaillé que sur l’animation du premier robot, Blew… J’ai pu lui faire un tapis roulant, et l’ampoule associé.
Voici ce que ça donne :

Un zoom sur la partie “mécanique” du tapis roulant et l’ampoule :

Pour rappel, le principe de l’économiseur d’écran que j’ai prévu est le suivant : 3 robots, Raid Grin et Blew font avancer des tapis roulant qui alimentent chacun une ampoule à sa couleur. Chaque robot marche pendant un temps aléatoire (random Flash sur le nombre de boucle de marche), puis s’arrête pendant un temps lui aussi aléatoire. Quand un robot s’arrête, son ampoule s’éteint, donc la luminosité de l’écran diminue. Donc comme tout est aléatoire pour chaque robot, il peut arriver que les 3 robots soient en marche, auquel cas la luminosité est maximum, et il peut aussi arriver que les 3 robots soient arrêtés, auquel cas la luminosité est au plus bas.

Rien de bien compliqué techniquement… par contre j’ai donc commencé l’intégration de l’ensemble dans Flash, et première déconvenue : avec juste un robot, l’animation est déjà trèèèèès gourmande en ressources processeurs… Chez moi presque 90% du processeur est sollicité. Donc avec 3 robots, ca devrait être totalement saturé, perdre en fluidité, etc. Un économiseur d’écran ruineur de processeur, c’est pas top…
Vous pouvez tester par vous même, c’est visible ici :
Economiseur V1
Pour la gestion du plein écran, je me suis basé sur ce tutorial : http://www.flashxpress.net/ressources-flash/site-en-flash-a-100/ que je trouve très didactique, et un fichier d’exemple est disponible.

Pour l’instant j’ai mis des points rouge et vert à la place des robots manquants. En haut à gauche sont visibles les variables de boucles de marche et d’arrêt, c’est juste provisoire, pour vérifier le fonctionnement. Mais donc avant de continuer et de travailler sur les 2 autres robots, il faut optimiser tout ça ! J’ai donc demander conseil autour de moi, que ce soit sur la mailinglist Flash-fr, le réseau PAO dont je fais partie, etc.
Les principales pistes d’optimisation qu’on ma conseillé : passer en bitmap la plupart des éléments vectoriels, vu que ces derniers sont assez complexes et comportent beaucoup de vecteurs, parfois un gros bitmap est préférable. Gérer aussi la luminosité de l’écran par l’ActionScript plutôt que par des interpolation.
Cet essai est visible ici :
Economiseur V2
Mais sauf erreur, c’est en effet un peu plus fluide, mais quand même aussi gourmand en ressources processeurs…

Du coup j’ai essayé en enlevant certains calques, pour essayer d’isoler les éléments d’animations qui prenaient trop de ressources, et il semble que ce soit les rayures du tapis roulant… En les enlevant, ca semble mieux :
Economiseur V3

Dernier essai en remetant les éléments en vectoriels, mais donc sans les rayures :
Economiseur V4

Je vais encore faire quelques essais avant de trancher…

Dernier point sur lequel il faut que je me penche : quel logiciel utiliser pour transformer l’animation Flash en économiseur d’écran… Après quelques recherches, il semble qu’il ne soit pas évident de trouver un logiciel pas cher et qui permette de générer des économiseur d’écran à la fois pour Mac et Windows… J’ai posé la question aux créateurs du célèbre économiseur Anooki, si vous ne le connaissez pas, je ne peux que vous conseiller de l’essayer, il est vraiment très très chouette ! Et donc, en plus ces créateurs, l’agence Inook sont apparement très sympas, vu qu’ils m’ont répondu dans l’heure en me donnant des informations précises sur le logiciel utilisés, les avantages et inconvénients, etc. Encore merci à eux !
Ils utilisent donc le logiciel Screentime. Inconvénient, pour générer un économiseur pour les 2 plateformes, il est necessaire d’acheter les 2 versions, donc 400$… Ca commence à faire cher pour un économiseur que je ne compte pas vendre…
Si jamais vous avez d’autres pistes, n’hésitez pas !
Et à bientôt pour la suite…

Faites tourner :

Tags : Animation, Flash, Illustration, wip

Voici 4 liens vers des sites de “collègues” graphiste et/ou illustrateurs indépendants. Parmi ceux-ci certains me font la gentillesse de commenter parfois sur mon blog, mais n’y voyez aucun copinage, je ne connais personnellement aucun des 4, au mieux nous nous sommes croisés sur “café salé“. Donc si j’ai choisi de parler d’eux c’est uniquement parce que je trouve leur travail remarquable, c’est dit !

Portfolio de Philippe Mignotte, graphiste/illustrateur indépendant de talent. Un site sobre et fonctionnel, très efficace. Passez du temps sur le portfolio, tous les travaux sont d’une grande qualité. Ca sent l’amour du travail bien fait et la rigueur !

Portfolio de Christophe Andrieu, graphiste/illustrateur/développeur… Il est rare de voir des personnes ayant un aussi bon niveau dans autant de discipline ! Surtout dans des domaines aussi “éloignés” que l’illustration et le développement, personnellement je n’en connais que 2 ou 3, donc chapeau bas !

Portfolio de Bastien Baudenon, graphiste/illustrateur. Là aussi, un vrai régal, on sent la “patte” du graphiste qui est dans une vraie recherche. Rien de “facile”, de la création, et de la belle !

Portfolio de Renaud Forestié, illustrateur dont j’adore le style. Très joli travail des couleurs, des matières…

Pour finir, vous trouverez ci-dessous quelques liens vers des sites qui m’ont fait l’honneur de sélectionner ce blog dans leurs liens… Il s’agit en général d’articles sur les blogs graphiques, si j’en parle ici ça n’est pas pour frimer mais bien pour les remercier, et aussi parce que dans les articles en question il y a de très bonnes chose à voir !

Faites tourner :

Tags : graphisme, Liens

Réalisation de la charte graphique et de l’intégration Flash d’un site pour la Cité des Sciences.
Cliquez sur le visuel pour visiter le site, ou sur ce lien

Réalisé dans le cadre de ma collaboration avec l’agence ComCiComCa.

Faites tourner :

Tags : Animation, Flash, graphisme, Webdesign