Ayez une rapide pensée émue pour la planète et optimisez vos images.

Bien que ces deux services ne soient au final qu’un seul, que ce dernier soit en ligne depuis bien des années, et qu’il soit encore gratuit … il reste peu utilisé au quotidien.

Avant toute chose ou tout paragraphe de lecture intense, voici le lien vers https://tinyjpg.com qui permet de compresser une image sans se stresser.

Car moi, je suis stressé sur ce sujet. Je vois encore beaucoup trop de fois des images non optimisées pour le web. Pesants des tonnes de CO2, ayant des dimensions à faire pâlir la bâche industrielle qui recouvre la façade d’un bâtiment de 42 étages, ou même prévue pour une impression en ultra haute définition.

Le web, c’est un truc rapide. Un truc même un peu sale : 72 DPI ce n’est pas grand-chose. Il a été créé pour être consommé en moins de 56ko/s.

Mais la résolution de l’image (les fameux DPI) est à mettre en relation avec la définition de celle-ci (largeur x hauteur). Afficher du 4k (4 096 × 2 160 pixels) sur un téléphone mobile n’a pas beaucoup de sens. Surtout si c’est pour être consommé en quelques secondes.

Avec la fibre et la 5G, nos outils oublient que l’optimisation des contenus sera une source de bien vivre ensemble pour les années à venir. Pourtant, ça en vaut la peine.

Déjà que les images sont envoyées sur plusieurs serveurs à la fois, si en plus elles ne sont pas optimisées … ça devient vraiment n’importe quoi.

Il existe des façons de faire pour qu’une image prenne moins de temps à charger à son affichage. C’est un fait et c’est déjà cool. Par contre, si on s’attarde aussi à l’optimiser dès son stockage, on ne pourra qu’être fiers de nous et du geste positif que nous faisons pour l’environnement.

L.

Liste d’outils : Starter kit pour ceux du marketing et de la communication

Comme chaque année, lorsque je commence à donner cours à une nouvelle promotion, je donne une liste des outils pratiques à utiliser. Qu’il s’agisse de quoi faire des présentations, des mockups de produits, de l’inspiration, de quoi s’organiser …

Puisque cette liste a vocation à évoluer dans le temps et à être partagée, autant la déposer ici en libre-service.

Ils ne vous serviront sûrement pas tous, mais sûrement qu’à un moment bien particulier, l’un d’entre eux pourra vous faire gagner de précieuses minutes.

Si vous avez envie d’en ajouter un, n’hésitez pas à me signaler (via Twitter par exemple) !

Principaux outils

  • Pexels : incontournable dès que vous avez des visuels à aller chercher en libre de droits – https://www.pexels.com/
  • Coolors : un générateur de jolies palettes de couleurs pratique quand on est en panne d’inspiration – https://coolors.co/
  • Google Fonts : vos polices directement chez Google – https://fonts.google.com
  • SkyFonts : organisez simplement vos polices de caractères sur votre ordinateur – https://skyfonts.com
  • Coverr : trouvez vos bannières animées en vidéo libre de droits – http://coverr.co/
  • Pablo by Buffer : créez vos images pour les réseaux sociaux depuis ce site, un peu comme Canva mais en plus simple et plus rapide : https://pablo.buffer.com/
  • Muzli : source d’inspiration pour designer souhaitant bénéficier de contenus triés et sélectionnés avec goût – https://muz.li/
  • Iconstore : plein d’icônes utilisables sans souci – https://iconstore.co/
  • Canva : l’incontournable de la création de visuels en ligne – https://www.canva.com/
  • FlatUI Colors : un ensemble de jolies couleurs à copier-coller rapidement – http://flatuicolors.com/
  • Gliphy : de quoi réaliser facilement des diagrammes – https://www.gliffy.com/

Création d’infographie

Blogging

SEO

Optimisation de visuels

Emailings et newsletters

Social Media & Community Management

Stocks de photographies

Icônes

Organisation

Q.

Quelques plugins pour Figma pour être plus productifs

Outil qui ne fait qu’être de plus en plus populaire, Figma prend réellement une place importante dans le workflow de certains collaborateurs.

Bien que déjà bien puissant de nature, il existe une façon d’aller encore plus loin dans les capacités de l’outil : l’utilisation de plugins complémentaires.

Voici une courte sélection de ces modules additionnels qui permettent de traiter plus en profondeur certains sujets particuliers.

Wireframe

https://www.figma.com/community/plugin/742764242781786818/Wireframe

Ce plugin permet de créer rapidement et de façon très naturelle des prototypes d’interfaces sous forme de fils de fer. L’étape de wireframing est alors encore plus simple.

Il dispose d’une liste de templates catégorisés qui répondent aux principaux prérequis du web (desktop, tablettes, mobiles). L’ensemble est géré directement en SVG.

Color Palettes

https://www.figma.com/community/plugin/740832935938649295/Color-Palettes

Trouver la meilleure palette de couleur est une vraie plaie pour chaque projet. Ce plugin permet d’ajouter au sein même de votre interface un petit moteur de recherche pour récupérer des palettes qui peuvent s’avèreraient être idéales.

Au menu : recherche, code hexadécimal, petit nom.

Product Planner

https://www.figma.com/community/plugin/766652281834442616/Product-Planner

Créer un produit peut vite devenir complexe, grâce à ce plugin il est désormais possible de bien démarrer cette aventure. Que ce soit en termes de planification, d’informations produits, de risques à garder en tête, des buts à atteindre … Une extension de Figma réellement tournée vers l’aspect collaboratif de la production.

Remove BG

https://www.figma.com/community/plugin/738992712906748191/Remove-BG

Parmi les petits liens indispensables se trouve RemoveBg qui permet à n’importe qui de retirer ce qui se trouve en arrière-plan d’une image sans sortir la grosse machinerie.

Unsplash

https://www.figma.com/community/plugin/738454987945972471/Unsplash

Très connu sur Internet pour sa quantité de visuels utilisables gratuitement, Unsplash s’intègre directement à vos visuels Figma sans avoir à télécharger en amont les médias.