La semaine en pixels – 6 janvier 2016

La semaine en pixels – 6 janvier 2016

Ce contenu a été rédigé il y a 9 ans. Il se peut qu'il ne soit plus à jour.

Comme chaque semaine,  je vous propose un condensé de mes lectures et ma veille Web Design et graphisme, expérience utilisateurs, design d’interface et mobilité, mais aussi des outils et ressources pour le webdesign et inspiration en tout genre (illustrations, photos, sites web, etc.).

Au programme cette semaine : plusieurs réflexions sur le métier de designer, la façon de construire le responsive et le code, un peu d’UX, de mobile et d’onboarding, de la jolie typographie et des couleurs du côté de l’inspiration et surtout des tutoriels CSS et SVG cette semaine et des outils pour Flexbox, OpenType, créer un style guide à partir du CSS d’un site ainsi qu’un petit menu responsive.

Pour plus de liens vous pouvez me suivre sur twitter. Bonne lecture :)

tl;dnr, s’il devait n’en rester qu’un ?

#Responsive #Design

Content Display Patterns, un excellent article sur l’organisation du code HTML d’un composant en fonction de la réutilisabilité des éléments d’une page et non pas forcement par rapport à leur design

Les articles de la semaine

#Design

I’m Not a Talented Designer, le design ce n’est pas de la magie ou de l’art mais des règles et des principes pour rendre le monde et les interfaces attractives à l’oeil humain, et tout cela, ça s’apprend.

#T-shirt

How to Optimize Your T-Shirt Designs for Max Wearability, article intéressant surtout si vous finissez pas devoir faire des t-shirts pour les conférences par exemple :)

#CSS

Feeew: CSS STILL SUCKS 2015 – And How We Try To Work Around It, les slides d’une présentation très complète sur différentes méthodes pour améliorer l’écriture du CSS

#Mobile

Small is Beautiful, les points où l’expérience utilisateur sur mobile doit encore s’améliorer pour arriver au niveau du desktop

#UX

Fight for UX, une introduction à 5 principes d’expérience utilisateur sous forme de posters

#Onboarding

The 21-Step Checklist for Bulletproof Mobile User Onboarding, une checklist en 21 points sur l’onboarding (la première utilisation) mobile

#Demission

Shields Down, une excellente réflexion sur la démission et à quel moment on commence à se dire qu’on va accepter les propositions reçues ailleurs

De l’inspiration et de jolies idées

#Cute

Le truc le plus choupi et triste à la fois que vous verrez cette semaine

#Robot

Comment ai-je pu louper ce site avec des robots boooogiie ??

#CSS #Typographie

Swissincss.com un hommage tout en CSS au Style Typographique International (ou Style Suisse) et c’est très joli

#Color #Tea

Paletteforyourpalate : un thé, un pantone et une humeur, pour inspiration, mélangez le tout et vous obtenez cette superbe expérience culinaire colorimétrique

#Vidéo

22 Inspirational Videos for Designers

#CSS

Inspiration pour des menus horizontaux

Les tutoriels de la semaine

#CSS

Blending Modes Demystified, les Blend Modes de CSS désmystifiés

#CSS

An Introduction to CSS’s @supports Rule (Feature Queries) une introduction à @supports pour tester le support d’une propriété CSS et proposer le cas échéant une alternative

 

#SVG

Optimiser les SVGs pour le web, Partie 1 et Partie 2

Des ressources utiles, outils et plugins pour vous faciliter la vie

#CSS #Opentype

Utility OpenType, un petit starter CSS avec les fonctionnalités OpenType avancées expliquées et des fallbacks

#HTML5

L’attribut HTML5 inputmode a l’air prometteur pour proposer des claviers personnalisés en fonction du type d’input, dommage qu’il soit si peu supporté :(

#Menu #Mobile

Paradeiser – un menu (et le script qui va avec) pour le site responsive et mobile, pour peu que votre architecture d’information ne comporte qu’un niveau et peu d’éléments

#Flexbox

Layout-editor un éditeur en ligne pour construire des mises en page avec flexbox

#CSS #Chrome

Snatchr, une petite extension Chrome bien pratique qui vous montre la couleur de fond, de texte et les polices utilisées avec leur taille sur un site.