Bienvenue sur mon blog !

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 :

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 :

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 :