cClaude.rocks ☕ Le blog

[Nouvelles technologies, sciences et coups de gueule…]

Menu

Ce billet fait partie d’une série d’une dizaine billets : #atelier-web.

Cet atelier n’est pas prévu pour fonctionner sur les smartphones, certain exemples peuvent s’afficher de manière inattendue sur ces appareils.

Merci de laisser un commentaire si vous avez essayé ou fini cet atelier. Le commentaire ne sera pas publié si vous en faite la demande.

On se fait une suite ?

Voici quelques idées…

📌 On change la couleur avec la souris ?

En gros, on se passe du ≺textarea≻ qui n’avait, au final, qu’un but pédagogique.

Une piste (naïve) : chaque case (pixel) devient un bouton. On sélectionne une couleur dans un menu et lorsqu’on clique sur la case cela applique la couleur choisie. On n’a plus besoin de la balise ≺textarea≻, mais on peut garder le même fonctionnement.

📌 Changer la taille de l’image ?

Avoir une solution qui permet de changer le nombre de pixels de l’image qui est actuellement fixée à 15 × 15.

📌 On sauvegarde et on recharge nos images ?

Et si on sauvegardait nos images ?

Il est assez simple de concevoir une structure de donnée pour sauvegarder notre image. Le format JSON est parfaitement adapté à notre solution.

📌 Beaucoup plus de couleurs ?

On s’autorise autant de couleur que l’on veut…

Deux pistes :

  • On utilise toujours la notion de couleurs indexées, et on gère plus de « lettre » – mais on garde un nombre de couleurs limité dans une même image.
  • On change la façon d’encoder et on stocke le code couleur.
📌 On fait une animation ?

Une vidéo, c’est une succession d’images…

Et si on se lançait dans un format maison de vidéos ?

L’idée serait de pouvoir créer une succession d’image et de les afficher les une après les autres pour obtenir de petites animations.

📌 Une approche moins naïve ?

Le modèle utilisé est assez naïf, cela marche, mais si l’image était beaucoup plus grande cette solution produirait un programme assez lent.

📌 Tenir compte des écrans avec une faible résolution

Le projet que l’on a créé ne s’affiche pas correctement sur les téléphones, les tablettes ou les ordinateurs avec une faible résolution. Plus précisément il ne tient pas entièrement sur l’écran.

On pourrait adapter le code pour qu’il fonctionne sur certain d’entre eux.

Il y a cependant une limite, le design actuellement ne permettra pas de supporter les résolutions les plus faibles.



Des ressources pour aller plus loin

La liste des couleurs
  • Un fichier texte contenant la liste des couleurs reconnu par les navigateurs (format : nom-de-la-couleur valeur-hexadécimale),

  • Un fichier JSON contenant cette liste des couleurs,

  • Un fichier JSON conentant cette même liste, mais dans encodé sur une ligne pour prendre moins de place.



L’atelier complet

ᦿ


ℹ 2006 - 2021 | 🏠 Retour à l'accueil du domaine | 🏡 Retour à l'accueil du blog