Que fait asset-size-matrix ?

Un master, chaque format, rien d’important coupé, et un reçu pour chaque fichier.

Ce qu’est cette compétence

Un lancement nécessite rarement une seule image. Il faut un aperçu de lien, une miniature vidéo, un post carré, un post portrait, une couverture 3:4, une story verticale, une bannière de profil, une icône d’application, un aperçu de dépôt, peut-être une vidéo verticale. Chacun a sa propre taille en pixels, ses propres règles de fichier, et sa propre superposition d’interface : la colonne « j’aime » à droite d’un flux vertical, le badge de durée dans le coin d’une miniature, l’avatar placé au-dessus d’une bannière, le masque arrondi d’une icône.

D’habitude, les gens gèrent cela en faisant glisser une zone de recadrage une douzaine de fois. Les résultats sont familiers : un titre coupé en deux sur la version 9:16, un logo caché sous l’avatar, du texte lisible sur le master 4K et qui fait trois pixels de haut dans le flux, une miniature rejetée parce qu’elle fait 2,3 Mo, un court qui passe 8 dB plus silencieux que tout ce qui l’entoure.

Cette compétence transforme le travail en tableau. Chaque destination devient une fiche de format avec des chiffres et une date. Le master est marqué une fois : quelles boîtes doivent survivre. Un petit planificateur calcule, pour chaque format, le recadrage le plus large qui garde ces boîtes dans la zone de sécurité du format, et dit clairement quand aucun recadrage ne fonctionne. Ensuite, chaque fichier exporté est vérifié par rapport à sa fiche.

Le problème qu’elle résout

Les recadrages sont décidés à l’œil, un par un, donc ils sont incohérents et personne ne peut expliquer pourquoi un recadrage donné a été choisi.
Les zones de sécurité sont oubliées jusqu’à ce que le post soit en ligne et que l’appel à l’action se retrouve sous un bouton.
« Recadre juste » est appliqué à des formats où le recadrage ne peut pas fonctionner (une disposition large compressée en 9:16), donc le résultat est soit coupé, soit réduit jusqu’à être illisible.
La taille du texte est jugée sur le master, pas à la taille à laquelle le format est réellement affiché.
Les règles de fichier (format, poids, codec, fréquence d’images, volume sonore) sont découvertes par des erreurs de téléchargement.
Les chiffres des plateformes sont copiés de vieux articles de blog sans date ni source.

Quand l’utiliser

Utilisez-la quand :

un design doit être livré en plusieurs tailles ou sur plusieurs plateformes ;
quelqu’un demande un « kit de lancement », « pack social », « toutes les tailles », « jeu de bannières » ;
une couverture ou miniature continue d’être coupée ou floue après téléchargement ;
une courte vidéo doit aussi exister en version verticale, carrée et large ;
vous êtes sur le point d’exporter un lot et vous voulez une preuve que chaque fichier respecte ses spécifications.

Ne l’utilisez pas pour créer le design à partir de rien (faites d’abord le master), pour monter du contenu vidéo (coupe, sous-titres, colorimétrie), ou pour publier. Elle peut vous dire qu’un format a besoin d’une nouvelle disposition ; la nouvelle disposition est une tâche de design.

Ce dont vous avez besoin

Le master : idéalement la source modifiable (Figma/PSD/HTML/SVG/fichier de projet) plus un export plat à la plus grande taille disponible. Les pixels seuls suffisent pour les formats uniquement recadrés.
La liste des destinations, ou l’objectif (« lancement sur X, Instagram et notre blog »).
Pour les formats vidéo : le fichier vidéo, et ffmpeg/ffprobe installé si vous voulez des vérifications automatiques.
Python 3.8+ pour le script d’aide scripts/matrix.py (bibliothèque standard uniquement).

Pas à pas

1. Faites l’inventaire du master

Enregistrez dans master.json (voir examples/master.json) :

la largeur et hauteur en pixels, et s’il s’agit d’une image fixe ou d’une vidéo ;
si une source modifiable existe (cela détermine le coût d’un REFLOW) ;
la plus grande version disponible. Ne planifiez jamais à partir d’une copie réduite que quelqu’un a collée dans un chat.

Si le master est plus petit que le plus grand format, dites-le maintenant ; cela apparaîtra comme UPSCALE plus tard.

2. Écrivez la liste des formats, avec les dates

Créez slots.json (partez de examples/slots.json). Une fiche par format :

champ	signification
`id`	racine du nom de fichier de l’export, ex. `video-thumb` -> `video-thumb.jpg`
`w`, `h`	taille livrée en pixels ; `exact: false` signifie « au moins ça, même rapport hauteur/largeur »
`safe`	marges haut, droite, bas, gauche en pixels du format que l’UI de la plateforme recouvre
`drop`	boîtes nommées qui ne doivent pas apparaître dans ce format (ex. titre sur une icône)
`fit`	`wide` (défaut, garde autant de contexte que possible) ou `tight` (remplit la zone de sécurité)
`display_w`	largeur réelle d’affichage du format, en px CSS, ex. une miniature dans une grille
`min_text_px`	plus petite hauteur de capitale encore lisible à `display_w`
`formats`, `max_kb`	types de fichiers autorisés et limite de poids
champs vidéo	`video_codec`, `audio_codec`, `pix_fmt`, plage `fps`, `min_s`/`max_s`, `sample_rate`, `lufs` (+`lufs_tol`), `true_peak_max`
`source`	d’où viennent les chiffres

Règles pour la liste :

Mettez as_of (la date d’aujourd’hui) en haut. Les tailles et superpositions changent ; une fiche sans date est une rumeur.
Vérifiez chaque fiche par rapport à la page d’aide actuelle de la plateforme ou au modèle téléchargeable. Si vous ne pouvez pas vérifier un nombre, gardez-le mais écrivez "source": "unverified" et dites-le dans le transfert.
Demandez des formats seulement lorsque la destination n’est pas claire. Une question groupée vaut mieux que cinq : « Je ferai une carte de lien, une miniature, un carré, une story 9:16 et une bannière. Ajouter ou enlever ? »

3. Marquez le master

Toujours dans master.json, listez les boîtes comme [x, y, w, h] en pixels du master :

keep : ce qui doit être visible dans tous les formats qui ne le suppriment pas (produit, visage, élément clé) ;
text : chaque bloc de texte avec son cap_px (hauteur d’une lettre capitale sur le master) ;
logo : la marque ;
focus : un point sur lequel centrer lorsque rien n’est marqué.

Obtenez les boîtes en mesurant dans l’outil de design, en lisant les limites des calques depuis le fichier source, ou en ouvrant l’image et en estimant soigneusement. Ajoutez quelques pour cent de marge à chaque boîte ; une boîte qui colle à un visage coupe le menton en pratique.

4. Planifiez chaque format

python3 scripts/matrix.py plan --master master.json --slots slots.json

Pour chaque format, vous obtenez un verdict :

CROP : un recadrage + mise à l’échelle garde tout ce qui est requis à l’intérieur de la zone de sécurité. La ligne inclut le rectangle de recadrage et un filtre ffmpeg prêt (crop=w:h:x:y,scale=W:H).
UPSCALE : un recadrage fonctionne mais agrandit le master. La ligne indique la taille de master nécessaire. Demandez un export plus grand ou un logo vectoriel au lieu de livrer une image molle.
REFLOW : aucun recadrage ne peut fonctionner, ou le texte serait illisible à la taille d’affichage. Si la ligne inclut art_only, l’illustration se recadre proprement et seuls le texte/logo listés doivent être réajustés pour cette forme. Sinon, la composition elle-même doit changer.

Montrez le tableau à l’utilisateur avant d’exporter quoi que ce soit. C’est le moment le moins coûteux pour changer d’avis.

5. Résolvez chaque REFLOW

Choisissez la correction la plus légère qui fonctionne, dans cet ordre :

Réajustez la typo : recadrez l’illustration avec le rectangle art_only, puis placez à nouveau le titre et le logo à l’intérieur de la zone de sécurité du format, à une taille qui passe min_text_px.
Réorganisez : les dispositions larges (texte à gauche, illustration à droite) deviennent des dispositions hautes (illustration en haut, texte en dessous), à partir de la source modifiable, en conservant les mêmes polices, couleurs et rapports d’espacement.
Étendez le canevas : élargissez l’arrière-plan dans le fichier source (ou avec une couleur de marque unie) pour que l’illustration tienne dans la zone de sécurité, plutôt que de réduire l’illustration.
Raccourcissez pour les petits formats : les icônes et avatars ne portent que la marque ; une couverture 3:4 dans une grille à deux colonnes peut nécessiter un titre plus court. Ne réécrivez jamais le contenu vous-même ; proposez la ligne plus courte et laissez le propriétaire l’approuver.

Relancez plan après chaque changement jusqu’à ce que chaque format soit CROP ou une exception délibérée et expliquée.

6. Exportez

Formats uniquement recadrés : appliquez le filtre planifié, pour les fixes comme pour les vidéos : ffmpeg -i master.png -vf "crop=...,scale=..." link-card.png.
Formats REFLOW : exportez depuis la source modifiable à la taille exacte du format.
Nommez chaque fichier <id du format>.<ext> dans un dossier, pour que le vérificateur puisse le trouver.
Fixes : sRGB, pas de transparence là où la plateforme l’aplatit sur une couleur inconnue, qualité réduite pas à pas seulement jusqu’à ce que max_kb soit atteint.
Vidéo : largeur et hauteur paires, yuv420p, la fréquence d’images de la source sauf indication contraire sur la fiche, volume sonore normalisé vers la cible de la fiche. Pour une limite de taille, calculez le débit : python3 scripts/matrix.py budget --seconds 58 --max-mb 50.
Plus de recettes dans references/export-recipes.md.

7. Vérifiez chaque fichier

python3 scripts/matrix.py check --slots slots.json --dir out/ --loudness

Chaque format revient avec PASS, FAIL, CHECK (quelque chose n’a pas pu être mesuré) ou MISSING. Corrigez librement les échecs mécaniques (mauvaise taille, format, poids, format de pixels, taux d’échantillonnage). Les échecs qui changent le contenu (durée plus courte, recadrage plus serré, audio plus fort qui fait ressortir le bruit de fond) nécessitent le choix du propriétaire : énoncez l’option et son coût.

8. Regardez-le, à la taille réelle

Le vérificateur ne voit pas. Construisez une planche contact qui montre chaque format à son display_w, avec la zone de sécurité délimitée, et ouvrez-la :

python3 scripts/matrix.py sheet --slots slots.json --dir out/   # écrit out/contact-sheet.html

Recherchez : le texte qui franchit la ligne de sécurité, les visages coupés aux articulations (menton, haut de la tête, mains), le logo sur un fond chargé, deux formats qui ressemblent à des marques différentes.

9. Transférez

Livrez le dossier plus un court manifeste :

Kit : lancement Tidepool, formats en date du 24-10-2026 (2 fiches non vérifiées : note-cover, article-cover)
link-card.png       1200x630   184 Ko  PASS  crop
video-thumb.jpg     1280x720   402 Ko  PASS  reflow : titre réajusté à 96 px de capitale
story-vertical.png  1080x1920  1,1 Mo  PASS  reflow : réorganisé, canevas étendu
app-icon.png        1024x1024   61 Ko  PASS  à partir du logo vectoriel (le raster était 1,6x trop petit)
vertical-video.mp4  1080x1920  21 Mo   PASS  -14,2 LUFS, -1,3 dBTP, 30 ips, 41,0 s
Regard : contact-sheet.html (tous les formats à la taille d’affichage)

Exemples

« Fais fonctionner cette bannière de lancement partout. » Master 4000x2250, titre à gauche, maquette de téléphone à droite. Plan : carte de lien et aperçu de dépôt CROP ; miniature REFLOW (titre seulement 13,5 px de haut à la taille de grille, besoin de 14) ; carré, portrait et 3:4 REFLOW avec un recadrage art_only (réajuster le titre sous le téléphone) ; 9:16 REFLOW sans art-only (la maquette est trop large pour la colonne de sécurité, donc étendre le canevas et réorganiser) ; icône d’application UPSCALE (utiliser le logo vectoriel). Voir examples/plan.output.md.

« YouTube rejette toujours ma miniature. » Un seul format. La vérification montre 2,4 Mo contre une limite de 2 Mo et 1280x721. Réexportez à 1280x720, qualité JPEG abaissée de 95 à 88 : 1,3 Mo, PASS.

« Même courte pour Reels, Shorts et un extrait large YouTube. » Trois formats vidéo. Les formats verticaux CROP à partir du master 16:9 seulement parce que l’intervenant est centré ; l’extrait large est le master. La vérification trouve de l’audio à 44,1 kHz (WARN) et -21,9 LUFS (FAIL contre -14) ; normalisez, réexportez, revérifiez. Voir examples/check.output.txt.

Conseils

Marquez le master une fois et conservez master.json avec le fichier de design ; la prochaine campagne le réutilise.
Quand deux plateformes partagent une forme, donnez-leur quand même des fiches séparées si leurs superpositions diffèrent.
Préférez une zone de sécurité conservatrice unique pour une vidéo verticale si un export doit servir plusieurs flux.
Un recadrage qui passe les chiffres mais coupe une articulation de personne échoue toujours ; faites confiance à l’étape de regard.
fit: tight est réservé aux marques et icônes ; tout le reste devrait garder du contexte (wide).
Gardez les chiffres non vérifiés visibles dans le manifeste plutôt que de leur faire confiance en silence.
Revérifiez après chaque réexport, pas seulement le fichier que vous avez modifié : les outils par lots écrasent les fichiers voisins.

asset-size-matrix

Qu'est-ce que asset-size-matrix ?

Demander à votre IA préférée

Documentation