De nombreuses modes sévissent sur Internet, notamment sur les imageboards. L’une d’entre-elles, le « stencil » , a pour principe d’imiter un pochoir en y ajoutant un texte qui reprend en général une citation célèbre du sujet.



Je vais donc aujourd’hui te montrer comment créer de magnifiques stencils avec GIMP. Il n’égaleront bien entendu jamais la qualité de vrais travaux d’artistes, mais il te permettront de faire rire facilement ton entourage. Pour commencer, tu ouvres bien évidemment l’image contenant ton sujet.



Afin d’obtenir un meilleur effet il va falloir augmenter le contraste, pour cela tu vas devoir jouer avec les potentiomètres pour obtenir un bon relief de peau, sans toutefois tomber dans la surexposition de la photo. Pour cela tu vas dans le menu « Couleurs » puis « Luminosité – Contraste » .



Il suffit ensuite d’appliquer un filtre donnant un effet de photocopie, cela se passe dans le menu « Filtres » , « Artistique » puis « Photocopie » . Grossièrement, tu pousses tous les réglages à fond.



Ton image devrait maintenant avoir le rendu final. Afin de suivre la règle imposée tu vas maintenant gommer tout ce qui ne fait pas partie de la tête de ton sujet, c’est à dire le corps ainsi que les traces qui pourraient rester sur le fond blanc de l’image.

Tu sélectionnes l’outil pinceau, la couleur blanche et la brosse la plus grossière. T’en a pour trente secondes normalement, pas besoin de finesse.



Puis tu rajoutes ensuite ton texte en dessous, avec une police qui donne un effet de pochoir. La règle veut que l’on reprenne une phrase clé prononcée par le sujet, dans notre cas il s’agit d’une citation du caporal Guisan reprise par notre vénéré chef de l’armée lors de son dernier discours.



Et voilà!

Tu peux même simuler un graffiti en appliquant ton image sur une texture de mur.



Cette dernière étape est relativement simple. Tu trouves une texture via un moteur de recherche, tu l’ouvres dans GIMP, tu ouvres ton stencil en tant que calque et tu appliques le mode « Multiplier » à ce calque.

gimp, stencil, tutoriel    Imprimer le billet   11 commentaires

N’ayant à ce jour pas trouvé de plugin pour WordPress permettant l’ajout de vidéos sur mon blog selon mes besoins précis, je me suis lancé dans le codage d’un petit hack qui a finalement répondu à mes attentes. Pour suivre cette manipulation il suffit d’avoir une légère maitrise de PHP, du XHTML ainsi que savoir se servir d’un client FTP.

Je n’utilise pas d’espace de stockage public tels que Youtube ou Dailymotion pour mes vidéos, tout est enregistré sur mon serveur web. J’utilise depuis longtemps le lecteur vidéo JW Player de chez Longtail, il peut être téléchargé gratuitement pour une utilisation non commerciale. Il est écrit en Flash et reconnait la plupart des formats du web (flv, mp4, etc.).

Intégrer une vidéo dans un billet en utilisant ce lecteur est une sinécure, le code HTML est énorme et rébarbatif, d’où l’idée d’utiliser les shortcodes de WordPress pour simplifier à l’extrême. Au final, l’insertion d’une vidéo dans un article se résume ainsi en une simple ligne écrite directement dans le texte du billet.



Ce shortcode « flv » permet au moyen des attributs de spécifier la vidéo, l’image facultative qui sera utilisée en attendant la lecture, la largeur et la hauteur. Il est important de noter que toutes les vidéos et toutes les images d’attente sont stockées dans un répertoire particulier et envoyées sur le serveur au moyen d’un client FTP, donc pas de belle interface dans le tableau de bord, tout est fait à la main. Dans l’exemple qui suit, le répertoire contenant ces fichiers est le répertoire « /bin » .

La première étape consiste à récupérer le lecteur vidéo JW Player depuis le site de l’éditeur. Attention à bien décocher la case « Include Viral, a video sharing plugin » avant de cliquer sur « Download » , sinon tu vas te retrouver avec un lecteur contenant le plugin « Viral » qui est extrêmement lourd, il t’affichera une page très soulante après chaque lecture.

Une fois le téléchargement de l’archive terminé, tu la décompresses où bon te semble. Tu n’auras besoin que de deux fichiers, « swfobject.js » et « player.swf » , tu les envoies dans la racine de ton site web via ton client FTP favori. Si tu as le fichier « player-viral.swf » à la place c’est que tu as téléchargé le lecteur contenant le plugin « Viral » , tu viendras pas te plaindre.

La seconde étape est la mise en place du hack. Tu vas aller ouvrir le fichier « functions.php » qui se trouve dans le répertoire de ton thème WordPress. Normalement le chemin est « /wp-content/themes/ton_theme » . Tu y ajoute le code suivant, bien entendu entre les balises PHP.



Cette fonction PHP sera utilisée par notre futur shortcode. Tu noteras la présence de la ligne permettant d’indiquer le répertoire des fichiers vidéos.



Tu peux modifier « /bin/ » avec le nom de ton répertoire qui contient tes médias. Attention à bien terminer par un slash.

Juste après l’accolade finale de cette fonction, toujours dans le fichier « functions.php » tu ajoutes la ligne suivante qui a pour but la création du shortcode « flv » .



La dernière étape consiste à intégrer le code JavaScript qui permet au lecteur de fonctionner. Tu vas donc aller ouvrir le fichier « header.php » qui se trouve dans le répertoire de ton thème, et tu vas ajouter la ligne suivante à la suite des balises HTML. Attention à l’emplacement, normalement ce code devrait se trouver entre les balises « <head> » et « </head>.



Tu envoies les deux fichiers « functions.php » et « header.php » modifiés sur ton serveur et le tour est joué, tu peux maintenant utiliser le shortcode nommé « flv » pour intégrer facilement des vidéos dans tes billets.

Par exemple, pour jouer le fichier vidéo « mpm.flv » de 320 pixels par 240, avec comme image d’attente « mpm.jpg » .



Ce code affichera le résultat suivant aux visiteurs.



L’attribut « image » est optionnel. Voici le code pour jouer ce même fichier vidéo, mais sans image d’attente.



Une petite astuce pour terminer, si malgré tous mes avertissements tu as téléchargé le lecteur incluant le plugin Viral et que tu as la flemme de télécharger une version sans cette lourdeur supplémentaire, il te suffit d’ajouter ces quelques lignes à la fonction PHP (au milieu de celles qui se ressemblent) pour désactiver cet horrible message de partage en fin de vidéo.



C’est à toi de jouer maintenant. hack, php, shortcode, tutoriel, wordpress    Imprimer le billet   12 commentaires

J’ai pu constater au fil des mois, voire des années, que peu de mes visiteurs possèdent leur propre avatar. Je ne te parle pas des géants bleus qui vivent sur Pandora, mais de ces petites vignettes qui agrémentent chaque commentaire, permettant ainsi d’identifier rapidement son auteur.

Le système d’avatars centralisés le plus répandu se nomme Gravatar, et je vais aujourd’hui t’apprendre à créer le tien. Ainsi, par la suite, chaque fois que tu laisseras un commentaire sur un blog supportant le système de Gravatar, l’image de ton choix accompagnera ton message. Le principe est relativement simple, tu vas devoir créer un compte sur le site de Gravatar en indiquant notamment ton adresse email, cette dernière sera ensuite en quelque sorte liée à une image personnelle.

Pour commencer, rends-toi sur le site et choisis « S’inscrire » dans le menu « Log in / Sign up » . Tu noteras au fil de ce tutoriel que la moitié du site web est en français, et l’autre en anglais, ce qui peut donner une impression de chantier malgré le bon fonctionnement du système.



Tu indiques ici l’adresse email dont tu te sers pour remplir les formulaires sur les blogs que tu visites, puis tu cliques sur « S’inscrire » .



Tu vas maintenant devoir confirmer cette inscription, pour cela il te faut aller lire ton courrier, puis cliquer sur le premier lien contenu dans l’email en provenance de Gravatar.



Te voilà de retour sur le site web, tu dois choisir un nom d’utilisateur qui n’est pas encore utilisé par quelqu’un d’autre. Ce n’est pas une étape très importante puisque tu auras toujours le choix de ton pseudonyme sur les blogs que tu visites, tu peux donc écrire à peu près n’importe quoi. Le mot de passe est par contre relativement important, puisque c’est lui qui va te permettre de gérer tes images par la suite.



Félicitations, te voilà maintenant membre de Gravatar! Il faut à présent lier ton adresse email avec une image. Pour cela tu vas cliquer sur « Rajouter une image » .



Tu indiques ensuite par quel moyen tu vas envoyer l’image sur le site de Gravatar. Pour la suite de ce tutoriel, nous allons partir du principe qu’il s’agit d’une image Jpeg stockée sur le bureau de ton PC. On clique donc sur « Le disque dur de mon ordinateur » .



Tu cliques sur « Parcourir… » puis tu sélectionnes le fichier image avec ta photo. Tu cliques ensuite sur « Suite » .



Le fichier est envoyé sur le serveur de Gravatar, tu peux maintenant choisir une partie ou l’intégrité de l’image, la découper, la faire pivoter. Une fois que le résultat te plait tu cliques sur « Crop & Finish » .



L’étape inutile suivante consiste à définir quel est le niveau de classification de ton image. Si comme la majorité des gens normaux tu es resté dans quelque chose de standard alors cliques sur « G » , signifiant ainsi que ta photo peut être vue par n’importe qui.



C’est terminé!



Dès à présent, si tu laisses un commentaire en indiquant ton email sur un blog supportant les Gravatar, alors ta vignette sera affichée à côté.

Tu peux retourner à tout moment dans ton compte Gravatar pour y ajouter des adresses email et des images, en liant ces deux dernières ensembles comme bon te semble. avatar, gravatar, tutoriel    Imprimer le billet   13 commentaires

Il ne se passe pas vingt-quatre heures sans entendre parler de Twitter, outil de communication rapide devenu standard dans de nombreux secteurs d’activités tels que le show business, la politique, et bien d’autres.



Pour faire court, Twitter est le moyen le plus simple et le plus répandu pour partager tout ce qui te passe par la tête, avec une limite de 140 caractères pour chaque message. Chacun de ces messages est appelé un « tweet » , en français on utiliserait le mot « gazouilli » . Pour utiliser cet outil c’est très simple, tu vas sur twitter.com et tu te crées un compte personnel, c’est gratuit et rapide.

Une fois que tu es dans la place il y a deux notions fondamentales à retenir : les « Following » et les « Followers » , en d’autres termes, les gens dont tu vois les messages, et ceux qui voient les tiens. Certaines stars de la musique comme Britney Spears comptent des millions de « followers » , des gens banals comme moi à peine quelques dizaines. Certains médias publient également des résumés via Twitter, c’est le cas de la Télévision Suisse Romande, la Tribune de Genève, CNN, et cætera. Tout ce beau monde se mélange, utile ou futile.

Il existe de nombreux moyens pour visualiser les tweets d’autres personnes et poster les siens. La solution courante est de passer directement par le site web twitter.com.



Si tu as l’immense honneur d’avoir Firefox tu peux également utiliser l’addon Echofon, anciennement appelé « Twitterfox » . Il se loge en bas à droite de ton navigateur et va régulièrement chercher les nouveaux tweets.



Pratiquement chaque téléphone mobile moderne possède un programme permettant d’accèder au réseau Twitter, une des applications phare pour Android se nomme Twidroid, elle est disponible gratuitement via l’Android Market.



Il en existe également de nombreuses pour l’iPhone, le problème de cet appareil étant que lesdites applications ne tournent pas en tâche de fond, on ne peut donc pas être prévenu automatiquement lors de nouveaux tweets comme c’est le cas avec Twidroid.

Place à quelques astuces. Les tweets peuvent contenir des caractères ou codes spéciaux qui feront qu’ils seront interprétés de manière différente par ton lecteur préféré (Echofon, Twidroid, etc.).

Les utilisateurs
Les comptes twitter sont précédés par le célèbre signe arobase, le même « @ » utilisé dans les adresses de courriel. Par exemple, mon compte twitter s’appelle @memepasmal.

Les mentions et réponses
Comme indiqué ci-dessus, si tu parles d’un membre de Twitter alors tu précèdes toujours son nom par le fameux arobase. Par exemple : « Je trouve le blog de @memepasmal vraiment excellent! » . La personne concernée verra qu’elle est mentionnée dans un tweet, ce genre de technique s’appelle d’ailleurs une « mention » . Si le message commence directement par le nom d’un membre, alors ce tweet peut être considéré par certains logiciels comme un message direct, un genre de SMS visible publiquement. Par exemple : « @memepasmal Merci pour ton billet sur la reproduction des poulpes norvégiens! » . On appelle alors bêtement ce genre de message une « réponse » , ou un « message direct » .

Le retweet
Autre technique très employée, le « retweet » symbolisé par le code « RT » . Tu vas prendre le message d’une personne que tu suis (following) et le re-transmettre aux personnes qui te suivent (followers). C’est le principe du bouches à oreilles, tu entends quelque chose qui te plait, et tu le répètes à tout le monde. Par exemple : « RT @grosgeek J’ai installé Windows 95 sur mon Game Boy » . Tu peux également placer un petit commentaire avant ton retweet, par exemple : « Mon pote a une annonce, RT @grossebaleine Je vend mon fusil, utilisé une seule fois dans les chiottes. » . Par politesse on ne modifie pas un message que l’on retweet, bien que ce soit possible.

Les hashtags
Dernier gros point, les hashtags. Ce sont des mots-clés que tu peux créer ou utiliser dans tes messages, toute personne cliquant sur un hashtag pourra voir tous les messages le contenant, même ceux d’autres personnes non-suivies. Un hashtag commence toujours par le caractère dièse et devrait être utilisé avec parcimonie, par exemple : « Je suis un grand fan des #hummer et du #tricot » .

Les trending topics
Les hashtags ou mots les plus cités dans tous les tweets du monde sont appelés « trending topics » , le top dix est affiché et mis à jour en permanence sur la page principale de twitter.com. Le grand jeu étant bien évidemment de voir un de ses propres « trending topics » affiché dans la liste, mais il faut pour cela avoir un sacré réseau de followers.

Les liens
Dernier point, les liens. Twitter étant limité à 140 caractères, cela peut poser problème lorsque l’on veut poster un lien « http » , ces derniers étant souvent longs. Il existe des services de « url shortening » qui convertissent les longs et illisibles chemins en quelque chose de plus court. Ils sont gratuits et intégrés de manière invisible dans la très grande majorité des outils de tweeting, ce qui signifie que tu peux coller tes longues adresses web dans tes messages, et ils seront automatiquement raccourcis. Par exemple, « http://www.memepasmal.ch/index.php/2009/10/09/grande-puissante-violette-et-toufue » deviendra « http://bit.ly/PJPHR » , tu peux cliquer si tu veux.

Puisse ce petit tutoriel t’aider à mieux comprendre la Bête, surtout n’oublie pas le guide.

On se tweet et on se fait une bouffe. android, firefox, iphone, musique, tutoriel, twitter    Imprimer le billet   29 commentaires

Ajouter une bordure à un texte peut être simple dans une grande partie des logiciels de traitement de texte ou de retouches d’images. Dans GIMP, il faut un peu plonger les mains dans le cambouis.

Il faut en effet créer une copie de la forme du texte, l’agrandir et la remplir de la couleur désirée.

Démonstration. Imaginons un texte pris au hasard.



Nous allons tout d’abord créer un chemin depuis ce texte, c’est à dire mémoriser sa forme. Pour cela tu sélectionnes ton texte et tu cliques sur « Créer un chemin depuis le texte » .



Rien de visible ne se passe quand tu cliques là-dessus, c’est normal. Ensuite tu ajoutes un nouveau calque, tu le nommes comme bon te semble, il contiendra notre bordure.



Tu le déplaces en dessous de ton texte, vérifie qu’il soit bien sélectionné.



Menu « Sélection » puis « Depuis le chemin » .



Ton texte va paraitre sélectionné, il n’en est rien. En fait, la sélection que tu vois se trouve sur ton nouveau calque, nous allons l’agrandir pour ensuite la remplir. Menu « Sélection » puis « Agrandir » .



Tu indiques le nombre de pixels pour ta bordure, puis tu valides.



Sur la boite à outils, tu choisis « Remplissage » , c’est l’icône avec un bidon de peinture qui verse. La couleur de premier plan sera utilisée pour le remplissage, tu peux donc la modifier.



Ensuite tu cliques n’importe où dans la sélection, et pouf, magie.



Il existe probablement une méthode plus simple, mais c’est moins drôle. gimp, tutoriel    Imprimer le billet   4 commentaires

Suite à une forte demande (une personne en tout cas), voici l’incroyable tutoriel qui va t’apprendre à ajouter un effet de sabre laser sur tes photos de vacances. Cette technique a été fortement inspirée par quelques unes disponibles sur tutorialized.com.

Pour commencer, il te faut la photo d’un gars qui se la pète avec quelque chose de long et dur dans la main. Ça fonctionne aussi avec une femme.



Je sais à quoi tu pensais, pervers.

Si tu es pointilleux tu remarqueras que j’ai préalablement gommé numériquement les deux quillons de la garde.

Ajoute un calque vide, on va travailler dessus, on ne touche pas à l’image originale.



Nomme ton calque de manière intelligente, et fait en sorte qu’il soit de fond noir.



Tu devrais avoir quelque chose comme ça, sélectionne le calque noir, on ne touchera jamais au calque de l’image originale.



Change le mode d’affichage du calque pour « Ecran » , il va devenir transparent.



Sélectionne l’outil « Sélection à main levée » dans la boite à outils.



Puis trace le contour de ton futur sabre laser, tu peux le faire plus large que sur l’image originale.



Ensuite tu sélectionnes « Remplissage » dans la boite à outils, et tu fais bien attention que le blanc soit défini comme couleur d’avant plan.



Tu cliques n’importe où dans ta zone sélectionnée, ce qui va nous faire une belle arme entièrement blanche.



Tu annules la sélection en allant dans le menu « Sélection » puis « Aucune » .



Dans la liste des calques, tu vas cliquer deux fois sur le bouton de duplication. Au final tu devrais avoir trois calques identiques, tous noirs avec une forme de sabre blanc vaguement visible.



Tu sélectionnes le calque tout en haut puis tu vas dans le menu « Filtres » , « Flou » , « Flou gaussien » .



Tu choisis une valeur de 5, et tu valides.



Tu fais la même chose pour le calque du dessous mais avec la valeur 20, et encore une fois pour le troisième calque noir avec la valeur 40.

Nous allons maintenant fusionner ces trois effets de flous, de sorte à obtenir un sabre laser avec une aura. Tu sélectionnes donc ton premier calque, tu fais un clic droit dessus et tu choisis « Fusionner vers le bas » .



Change ensuite le mode d’affichage de ce nouveau calque en « Ecran » . Maintenant, tu refais exactement la même opération une deuxième fois, c’est à dire « Fusionner vers le bas » puis passage en mode « Ecran » une fois terminé.

Tu devrais à présent n’avoir plus que deux calques, celui du sabre avec un joli effet, ainsi que l’image originale que nous n’avons pas touchée. Les deux calques étant superposés du devrais voir ton sujet qui tient fièrement en main un sabre blanc partiellement éthéré. Colorons tout ça!

Tu sélectionnes donc le premier calque (celui du sabre), puis tu vas dans le menu « Couleurs » , « Balance des couleurs » .

Et là, tu t’amuses.



Dis bonjour à Aragorn le chevalier Jedi!

gimp, jedi, lightsaber, photo, sabre laser, tutoriel    Imprimer le billet   9 commentaires

Lorsque l’œil humain fixe un objet, celui-ci est généralement net. Si l’entourage est flou et que la cible est loin alors notre vision sera trompée et croira que ce que nous regardons est petit.

C’est là un des principes du Tilt-Shift, une technique photographique donnant un aspect de maquette aux photos.






Pour bien réussir de telles photos il est nécessaire de s’équiper d’un objectif Tilt-Shift, le problème étant qu’un tel équipement coûte au minimum un bon millier d’euros.

Heureusement, si tu n’as comme moi ni l’argent ni l’âme d’un puriste il existe quelques techniques pour créer de fausses images Tilt-Shift au moyen de ton éditeur graphique favori, l’effet sera toutefois bien entendu de bien moindre qualité qu’avec un objectif dédié. Dans cet exemple, c’est le célèbre (et surtout gratuit) GIMP qui sera utilisé. Nous allons en fait rendre flou toute l’image, à l’exception de la zone que nous voulons modéliser.

Quelques règles de bases sont à respecter pour obtenir un meilleur effet. Il faut par exemple si possible prendre les photos du dessus, et de loin, avec une netteté complète. Mieux vaut avoir un sujet sur la photo, les paysages vides donnent d’assez mauvais résultats. Tu peux également donner auparavant un bon coup de contraste à ton image, cela renforce l’effet de peinture flashy propre aux maquettes.

Mais lançons-nous.

Pour commencer, tu ouvres ton image dans le GIMP.



Ensuite tu dupliques le calque de ton image.



Tu devrais avoir deux calques dans ta liste, l’original et la copie. Tu sélectionnes la copie et tu vas dans « Filtres » , « Flou » puis « Flou gaussien » .



Tu règles ensuite la valeur du flou gaussien jusqu’à ce que l’image soit bien floutée, il ne faut pas que ça soit trop, ni trop peu. Ça demande quand même un peu de savoir faire tu vois.



Une fois que ton calque copié est flouté, tu cliques dessus avec le bouton droit et tu choisis « Ajouter un masque de calque » .



Tu laisses le blanc en opacité complète et tu valides.



À ce niveau là, tu as deux calques dont un flou. Le calque du dessus possède un masque, c’est à dire que selon si tu peins en noir ou en blanc dessus, il deviendra plus ou moins transparent, laissant apparaitre le calque du dessous qui est l’image nette.

C’est maintenant qu’intervient le travail de l’artiste qui est en toi, sélectionne le pinceau dans les outils, et choisis « Circle Fuzzy » dans la brosse.



Et maintenant, tu peins en noir ou en blanc, pour ajouter ou supprimer de la netteté à l’image. Pense bien à la profondeur, essaie de rendre net tout ce qui est censé être au même niveau que ton sujet central (ici, le bateau). Tu peux modifier à tout moment la taille de ton pinceau, par exemple pour fignoler les détails entre les zones nettes et les zones floues.



Ensuite, c’est de la pratique. Ou alors l’achat onéreux d’un bon objectif Tilt-Shift. gimp, photo, tilt-shift, tutoriel    Imprimer le billet   16 commentaires