Sélecteur de couleur : Le moteur Google incorpore un outil

Parmi les nombreuses requêtes qu’on peut faire avec google, (on peut aussi les faire avec la réconnaissance vocale), voilà une requête que pourrait aimer les graphistes, les photographes et bien sûr, les curieux.  Il s’agit de la requête suivante

« Sélecteur de couleur« 

Cette requête marche aussi sur le navigateur chrome pour mobile avec la possibilité de naviguer sur la palette de couleur avec le doigt,comme le montre l’animation qui suit.

On pourra donc capter rapidement ce qu’est une couleur dans le monde de l’informatique, puisque dans l’option « show color value » on découvrira les codes informatiques correspondants en plusieurs formats comme le montre la figure qui suit :

On aura respectivement le code des couleurs en :

  •  HEX (hexa decimal) C’est-à-dire un code à six caractères Hexa décimaux (123456789ABCDEF)
  • Le code RGB (rouge, vert bleu), plutôt utiliser dans la vidéo, puisqu’on sait bien que si on mélange les couleurs primaires, on peut obtenir toutes les couleurs du spectre visible.
  • HSV (hue saturation, value), qui sont la teinte, la saturation et la luminosité (voir l’exercice passé ici)
  • HSL qui est à peu près pareil que HSV sur le même principe.
  • CMYK (cyan, magenta, yellow and key (black)) utilisés avec les imprimantes couleurs (https://fr.wikipedia.org/wiki/Quadrichromie) .

Ok, il ne s’agit certe pas de la découverte du siècle, ni de la requête qu’on va faire tous les jours. Pour ceux qui veulent aller plus loin, on conseillera plutôt l’outil en ligne créé par ADOBE, color-wheel/ qui est un outil incontournable  pour les graphistes et les photographes. J’en ai d’ailleurs déjà parlé sur Deviner la couleur en fonction de son code hexadecimal

règles de couleur

 

 

 

Editeur d’image en pixel en ligne : 5 outils

Si le gif est un dinosaure qui a survécu au web2.0, on peut presque en dire autant des images créées en pixel. En fait toutes les images sont faites de pixels, mais quand on parle de l’art du pixel, on parle en fait de dessiner une image pixel par pixel (point par point) , comme on peut le voir dans la figure de gauche.

Commençons par expliquer ce qu’est un pixel ! Le pixel  est l’unité de base permettant de mesurer la définition d’une image numérique matriciellePour faire plus simple : le pixel est un point lumineux. Chaque point lumineux ajouté à un autre point forme une image. Au fur à mesure des évolutions technologiques, on a commencé par le premier pixel qui ne pouvait prendre que deux états, le noir et le blanc et qui prenait en mémoire 1 seul bit! (C’est l’époque où la mémoire des ordinateurs manquait cruellement ). Puis on a créé un pixel à 4 bits et donc à 16 couleurs (4 à la puissance 2), puis 8 bits avec 256 couleurs, 16 bits avec 65 mille couleurs et maintenant 24 bits avec 16 millions de pixels. Avec 24 bits, on est plus fort que l’oeil, donc on aura plus aucune évolution en terme de pixel.

  • Exemple FF FF FF qui est le blanc, en binaire ça fait 16 bits à 1111 1111 1111 1111 1111 1111
  • Exemple 00 00 00 qui est le noir, en binaire ça fait 0000 0000 0000 0000 0000 0000 .

Bref, nous les vieux geeks, le pixel est pratiquement gravé& dans notre DNA. Pour les plus jeunes, il s’agit d’un truc vaguement familier.  Mais nous les vieux geeks on s’accroche à la partie nostalgique, c’est un peu comme les taxis face à UBER, on s’accroche, mais contrairement à Uber, les jeunes peuvent tout de même s’intéresser au vieux pixels car en fait le pixel n’est pas prêt de mourir et  à ce titre, je viens de dresser une liste de service en ligne qui offrent une option de dessin au pixel.

Piskelapp.com

On commence par le meilleur, car en terme d’image, on peut créer des animations au pixel qui vont prendre un minimum de mémoire sur une application de jeu par exemple.

Dessin au pixel 1

On aura donc une grande facilité à créer une animation comme celle qui suit :

On pourra se référer la fiche : Créer une animation en pixel et sauvegarde en GIF qui explique plus en détail cet outil.

Piq.codeus.net/draw

Cet outil en ligne est assez sophistiqué, même si on ne traite que du pixel. On pourrait même dire que c’est le photoshop du dessin au pixel, car il y a déjà une notion de calque, ce qui va faciliter grandement l’élaboration du dessin. De plus, les nombreuses options disponibles permettront un rendu de dessin optimum.

Dessin au pixel 2

Si on est doué, on pourra vraiment réaliser de petite oeuvre numérique de qualité. Dans mon cas, mon essai n’est pas concluant. Dommage qu’on ne puisse pas importer des photos et les retoucher avec cet outil.

Pixieengine.com/pixel-editor

Dessin au pixel 3 en gif

Avec cet outil, on est plutôt dans le spartiate ou le minimalisme, en fait on revient à la source de l’édition de pixel avec très peu d’options. On prendra soin de bien définir la taille du dessin. En effet,  si on commence à dessiner avec un dessin de 16X16 pixels, c’est un peu petit.

Sur la gauche voilà une animation qui fait un peu mal aux yeux qui permet de résumer un peu ce qu’on peut faire avec cet outil

L’avantage de cet outil c’est qu’on peut importer une image et la modifier.  Attention toutefois à ne pas importer des images trop grosses sous peine de blocage.

Makepixelart.com

Cet outil est encore plus simple d’usage, il faudra donc passer un peu plus de temps pour faire un truc assez valable. L’avantage, c’est qu’on peut faire une sauvegarde en format PNG ce qui permet de pouvoir faire des dessins avec des zones transparentes (alha) , ce qui sera très utile pour la superposition d’image.

Dessin au pixel 4

 

Make8bitart.com

Cet outil en ligne est encore plus simple d’usage et la simplicité implique aussi un résultat très simple, comme son non l’indique on a le droit à 8bits en terme de couleur soit 256 couleurs plus la couleur alpha qui permet l’option transparent. On appréciera le grand espace disponible pour faire des

Dessin au pixel 5

Avec l’outil on a le droit au minimum : la pipette, le remplissage et le crayon avec une taille variable. Avec un peu de patience, on pourra faire un truc simple et bien meilleur que ce que j’ai réalisé pour le test.

Un sujet voisin le Favicon

Un favicon, c’est une photo « iconisée » (extension en .ico) que vous trouvez la plupart du temps devant un url. Cette « photo » est d’une dimension petite de 16X16 pixels.  Vu la petitesse de la photo, on peut vraiment créer un favicon grâce aux outils que je viens de décrire ci-dessus.

Vous pourrez donc aussi consulter la liste de 10 outils qui permettent de créer des favicons.

exemple de favicon pixel

Conclusion : malgré la prolifération des mémoires et des images de 20 millions de pixels, il existe toujours un créneau pour la création d’image en pixel. Cet univers appartient surtout à la section des icones qu’on voit dans les logiciels et les jeux vidéos. Noramlement une image en pixel doit être sauvegardée en format bitmap, ou PNG, mais pas en JPG qui a une facheuse tendance à compresser les images. 

 

 

 

 

Transformer les photos en demi-ton en ligne.

Le halftone ou  demi-ton est une technique utilisée dans le domaine de l’impression. Cette technique  permet de rendre plusieurs niveaux de gris d’une couleur à partir d’une impression monochrome. Avec la couleur l’impression est également rendue possible par la répétition du procédé halftone ou demi-ton en applicant une couche pour chaque couleur fondamentale.  Pour ce qu’on en a à faire aujourd’hui, l’explication n’est pas très importante, seul l’explication en image va vite nous faire comprendre comment on peut transformer une photo en photo demi-ton, juste pour le fun

Les deux images  qui suivent montrent rapidement la transformation d’une photo d’un papillon prise récemment dans mon jardin.

Papillon

Halftone pro

Cette prouesse est donc générée par l’outil en ligne  halftonepro.com/app  qui :

  • Propose de transformer une photo en un choix infini de points (forme (shape) qui peuvent être représentes par des points, des carrés, des hexagones…. dans l’exemple qui suito, on peut voir un aperçu d’une transformation de la photo en hexagone.

Halftone

  • Il est possible faire choisir le motif (pattern) pour le faire pivoter, pour programmer le nombre de poins pattern horizontaux  et verticaux  le type de grille (grid)…. et plein d’autres paramètre de réglage.

Halftone pro

  • une section preset (formes prédéfinies) permettra au débutant de ne pas trop se  prendre la tête dans les réglages.

  • Une fois un preset choisi, il sera toujours possible de faire varier les paramètres dans le section Shape, Pattern ou couleur. Dans l’exemple qui suit, j’ai choisi le preste Pop Art qui je suis allé dans la section couleur pour modifier les couleurs des points et le fond de la photo.

Halftone popart

  • Encore un exemple avec le preset « Pointillisme »

Après quelques minutes de manipulation on pourra transformer nos photos avec de multiples effet. Je pense que pour les internautes qui se font des selfies à longueur de journée, que cette application va leur plaire.

Le HIC et donc le hack

Une fois que vous avez trouvé l’effet photo qui va bien, vous allez vouloir sauvegarder la photo sur votre disque dur et éventuellement vous l’envoyer vers votre smartphone. Le hic c’est que la version gratuite, nous colle un gros filigrane (watermark) au beau milieu de la photo. Ça casse un peu vraiment le coup de coeur du départ.

Pour supprimer le filigrane il y a des solutions :

  • Passer au mode payant pour 10 dollars (jusqu’à ce que le service disparaisse dans les nimbes de l’internet pour faute de moyen).
  • Faire une copie d’écran en appuyant sur la touche « Imp Ecran »  et faire un collé (CTRL C) sur un outil d’éditon photo comme photoscape (outil que j’utilise quotidiennement pour agrémenter ce blogue) . Il faudra tout de même savoir que la copie d’écran ne fait pas tout. On ne pourra pas récupérer les photos en mode vectoriel, ni la photo en mode alpha (transparence du fond pour superposer la photo avec un autre fond par exemple.

  • Il y aurait une autre méthode pour ne pas payer, mais qui permettrait tout de même de récupérer la photo via l’outil de sauvegarde. Il suffit, par exemple de mettre deux photos et d’intercaler au milieu un espace sufisamment grand pour le filigrane ne soit pas au milieu de la photo. J’ai fait un essai pour la démonstration.

Conclusion : Pour nous les geeks pauvres, la copie d’écran sera suffisante. En revanche pour certains professionnels de retouche photo, il est certain que 10 dollars est une petite somme à investir pour finalement avoir sous la main un outil efficace qui permettra ensuite d’être intégré dans des outils comme photoshop ou un outil de traitement de dessin vectoriel. Notons que pour les passionnés du selfie, cette application pourrait faire des émules. Cela dit côté applcation mobile essayez donc de charcher le mot halftone dans les playstore.

halftonepro.com/app

 

Pin It on Pinterest