La semaine en pixels – 28 novembre 2014

La semaine en pixels – 28 novembre 2014

Ce contenu a été rédigé il y a 10 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 : des posters sur les mythes d’UX, des tampons provoc’, des animations qui suivent les lois de la physique, du flexbox pour mobile, encore un petit article sur le burger menu qui propose des améliorations, on parle d’accessibilité, de labels flottants, un peu d’e-commerce, des visualisations impressionnantes des trajets des avions sur les grands lignes, du material design packagé dans un framework, etc.

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

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

#Tampon

Le tampographe Sardon, des tampons bordeline et délicieusement provoc’, j’adore le Tout enfant abandonne sera detruit  et leurs descriptions

Le tampographe Sardon

Les articles de la semaine

#Flexbox #Mobile

Why we can’t use flexbox to re-order elements yet : Android 4.0 ne supporte pas flex-direction du coup on peut pas utiliser flexbox pour re-ordonner des blocs pour le moment, par contre vous pouvez utiliser l’ancienne syntaxe (avec auto-prefixer) tout ira bien (voir commentaires de Raphaël plus bas)

Why we can’t use flexbox to re-order elements yet

#Mobile Navigation

Much Ado About Hamburger Icons, un récapitulatif de ce qui a été écrit sur le “burger icon” mais surtout sur les menus “off-canvas” avec des exemples concrets sur comment les améliorer

Much Ado About Hamburger Icons

#Accessibility

Une question interessante par @notabene : “Background and foreground colours: questioning an old rule” (est-ce que la règle de mettre un fond de couleur sur le body est toujours utile avec nos navigateurs modernes)

#Label

Interactive float-labels : améliorer l’utilisabilité des labels dans le champ de saisie des formulaires (et afficher le mot de passe par la même occasion)

#User Story

A framework for modern User Stories, un framework pour vous aider à écrire de meilleurs scénarios utilisateur

A framework for modern User Stories

#E-commerce

7 Tips for Designing a Better Checkout Page, 7 conseils pour le design de processus d’achat e-commerce

#E-commerce

The Showrooming Threat 5 Ways to Fight Back – 5 façons de combattre le “shorooming”, ce phénomène d’utilisateurs qui viennent voir un produit en magasin pour ensuite aller l’acheter en ligne

The Showrooming Threat 5 Ways to Fight Back

#Programming
Programmers: Please don’t ever say this to beginners, ne dénigrez pas le langage de programmation qu’un débutant est entrain d’apprendre, et proposez lui plutôt des feedbacks constructifs !

Programmers: Please don't ever say this to beginners

Les Nouveautés webdesign

#Firefox OS

La meta <meta name= »theme-color » content= »pink »> pour coloriser la barre du haut de l’application est disponible dans Firefox OS :)

<meta name="theme-color" content="pink">

De l’inspiration et de jolies idées

#Visulalisation

« Watch the invisible patterns of air travel over some of the busiest skies in the world » une magnifique visualisation des couloirs aeriens des grandes companiges aériennes en vidéo

Watch the invisible patterns of air travel over some of the busiest skies in the world

#UX

32 Posters That Debunk Common UX Misconceptions, 32 posters pour casser les mythes de l’expérience utilisateur

32 Posters That Debunk Common UX Misconceptions

#Dribbble

Tindddle.com,un tinder pour dribbble, il fallait bien que ça arrive

Tindddle.com

Les tutoriels de la semaine

#Animation

Creating Animations and Interactions with Physical Models un petit tuto pour jouer avec des animations et les lois de la physique (gravité par exemple)

Creating Animations and Interactions with Physical Models

Des ressources utiles

#Analytics

Improve your Analytics skills with free online courses from Google: Google propose des cours pour vous familiariser avec différentes techniques d’analytics

Improve your Analytics skills with free online courses from Google

Des outils  et plugins pour vous faciliter la vie

#Material

Material UI, des composants CSS et React sur le style Material UI de Google

Material UI

Pour le fun: jeux et démos sympas et impressionnantes

#HTLM

dirtyhtml.tumblr.com  le tumblr du code pas très joli joli