Palette de couleurs

Objectif

À l'origine, je voulais créer un site emybo.com (lien probablement cassé) qui était là pour ending my boredom (mettre fin à mon ennui). J'ai à peine écrit 3-4 articles que j'ai eu ma révélation, à moitié suite à un grave accident routier, à moitié grâce aux bons conseils de cet homme :

J'étais, et je suis encore, intéressé par l'analyse de données. Je n'exclus pas de me poser quelques questions incongrues, d'aller jusqu'au bout, et de poster les résultats ici. Mais ce n'est plus une priorité.

Pour faire de beaux graphes (qui n'aime pas les beaux graphes ?), je cherchais quelques qualités :

Note

Il me manque un outil de plotting, d'interactivité. J'avais commencé à utiliser Apache Echarts avec Hugo. Je trouverai bien quelque chose qui se marie bien avec Zola et Duckquill, avant d'éventuellement proposer un pull request à Daudix, l'auteur du thème. Si possible, quelque chose d'interactif et animé pour inciter le visiteur à explorer et mieux comprendre les résultats que je publierai.

Il n'y a plus qu'à !

Processus

Voici mon déclencheur. N'est-il pas magnifique ?

Photo d'Apollon de Stanisław Wyspiański, avec ses beaux jaunes, verts et bleus
Apollon de Stanisław Wyspiański, Musée du Vitrail, Cracovie
  1. J'ai utilisé cette photo et canva pour générer une palette de couleurs.
  2. Avec coolors, j'ai vérifié si l'ensemble était cohérent et accessible pour les personnes daltonniennes. Je devrais faire valider par quelqu'un qui connaît mieux ce sujet que moi, maintenant que j'y pense.
  3. Pour extraire des valeurs intermédiaires pour les graphes, j'ai utilisé Learn UI tool
  4. J'ai fait un petit shortcode pour avoir facilement la palette sous la main
  5. Quand j'aurai décidé de mon outil de visualisation, je l'intégrerai avec d'autres shortcodes 😊

Résultat final

Cet échantillon semble avoir des dégradés, mais ce ne sont que des illusions d'optique ! Voici ce que vous voyez :

  1. Les 5 couleurs de la palette, principalement pour des données nominales (catégories).
  2. Une échelle divergente neutre, principalement pour des données ordinales (mais dont je ne veux pas assumer qu'un côté est meilleur que l'autre).
  3. Une échelle monochrome, principalement pour les données ordinales (où je peux émettre une hypothèse sur la direction du 0).
  4. Une échelle divergente, principalement pour les données ordinales (que je veux centrées autour d'une valeur servant de point de référence).
  5. Il n'y a pas d'échelle pour les données cardinales, je pourrai en extrapoler en utilisant juste deux points de mes échelles prééxistantes.

Nominales

Ordinales sans préférence

Ordinales avec une tendance

Ordinales avec deux tendances

Palette

Eerie-black (#192324)

Pear (#C4E035)

Verdigris (#58ADA6)

Lapis Lazuli (#3266A1)

Sea Green (#408C56)

#C4E035

#75D95B

#00CD82

#00BCA3

#00A9B9

#0094C1

#007DB8

#3366A1

#C4E035

#67D762

#00C88E

#00B3B0

#009BC0

#0081BA

#3366A1

#C4E035

#50D56B

#00C09D

#00A5BC

#0087BD

#3366A1

#C4E035

#1DD079

#00B3B0

#008FC0

#3366A1

#C4E035

#00C88E

#009BC0

#3366A1

#C4E035

#00B3B0

#3366A1

#3266A1

#3679B0

#3F8DBD

#4DA0C9

#5EB3D4

#73C6DF

#8AD9E9

#A2ECF4

#BCFFFF

#3266A1

#377CB2

#4292C0

#54A8CE

#6ABEDA

#83D4E6

#9FEAF2

#BCFFFF

#3266A1

#3880B4

#4799C5

#5EB3D4

#7ACDE2

#9AE6F0

#BCFFFF

#3266A1

#3A85B8

#50A4CB

#6FC2DC

#94E1ED

#BCFFFF

#3266A1

#3F8DBD

#5EB3D4

#8AD9E9

#BCFFFF

#3266A1

#4799C5

#7ACDE2

#BCFFFF

#3266A1

#5EB3D4

#BCFFFF

#C4E035

#CFE45D

#D9E77E

#E2EB9D

#EAEFBB

#F1F3D9

#F6F6F6

#D8DDE8

#B9C3DA

#9AABCB

#7B93BD

#5A7CAF

#3366A1

#C4E035

#D1E464

#DDE98A

#E7EDAF

#EFF2D3

#F6F6F6

#D1D8E5

#ADBAD4

#889DC3

#6181B2

#3366A1

#C4E035

#D4E66E

#E2EB9D

#EEF1CA

#F6F6F6

#C8D0E1

#9AABCB

#6B88B6

#3366A1

#C4E035

#D9E77E

#EAEFBB

#F6F6F6

#B9C3DA

#7B93BD

#3366A1

#C4E035

#E2EB9D

#F6F6F6

#9AABCB

#3366A1

#C4E035

#F6F6F6

#3366A1

Remonter