Des pixels et du code #81

Ce contenu a été rédigé il y a 11 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, HTML, CSS, outils, ressources et inspiration. Dans les articles sélectionnez cette semaine vous trouverez de quoi planifier votre contenu pour aller au delà du web, l’histoire d’internet ou encore une comparaison des icônes pleines et en contours ainsi que de bons conseils pour trouver des clients lorsque l’on est freelance. Du côté de l’inspiration de la semaine, des couleurs, de très belles couleurs, des illustrations et des chatons. Et bien évidement une sélection de ressources gratuites, polices d’écriture et PSD à télécharger, outils de prototypage et un ressource en français pour vous aider à créer des newsletter responsive. Enfin, ne manquez surtout pas l’article de la semaine sur tout ce qui est (sera ?) enfin possible de faire avec Flexbox !

Pour plus de liens n’hésitez pas à me suivre sur twitter. Bonne lecture :)

Les articles à lire

10-Things-Designers-Need-to-Stop-Doing-to-Kick-Agile-s-Ass

#Agile

10 Things Designers Need to Stop Doing to Kick Agile’s Ass! Dix conseils sous forme de slides de ce que les designers ne devraient pas faire pour arriver à travailler sur un projet avec des méthodes agiles. Tous ne sont pas forcément à prendre au pied de la lettre attention :)

#Content

Planning for Content Beyond the Web  pourquoi et comment préparer son contenu pour toutes les plateformes, et pas seulement le bureau et le mobile

#Tableaux

A Complete Guide to the Table Element tout ce que vous avez toujours voulu savoir sur les tableaux HTML et CSS, et bien plus encore

#Couleur

Take the Test: How Well Do You See Color?  procrastination du matin, classez les couleurs pour savoir à quel point vous êtes capables de les différencier (à mon avis le calibrage de l’écran joue pas mal dans le teste aussi)

#Histoire

A timeline of the history of the World Wide Web  une timeline pour apprendre l’histoire de web

#Icon #UX

Optimizing UI icons for faster recognition résultats d’un test utilisateur pour déterminer l’efficacité des icônes “pleines” vs les icônes formées de lignes (spoiler : la différence n’est pas très notable selon cette étude)

#Freelance

Freelance et prospection : comment trouver des clients prospection active, passive, quelques bons conseils pour trouver des clients

Inspiration

#Webdesign

www.qunb.com un très joli sites avec des effets au survol pour un service de visualisation de données

#Illustration

Le portfolio de Yannick Robert et ses très jolies illustrations pour les livres d’enfant

The creative process  une jolie illustration pleine d’humour et de couleurs sur le processus creatif

#Publicité

Creative advertising and fashion des publicités plutôt originales pour des vêtements

New Logo and Identity for 2013 Brand New Conference by UnderConsideration

#Logo

New Logo and Identity for 2013 Brand New Conference by UnderConsideration le redesign du logo pour UnderConsideration et c’est des grands fous sur les exemples d’utilisation du logo

#Dessins

Johnkenn.blogspot.fr très sympa bien qu’un poil flippant, des cauchemars d’enfant dessinés sur des post-its.

#Chats

Idraw_on_cats un compte instagram de photographies de chat sur lequelles les auteurs ont dessiné

braingames-fr.natgeotv.com

#Webdesign

Braingames-fr.natgeotv.com un site plein de couleurs et d’interactions au défilement de la page pour le plaisir des yeux

Les tutoriels de la semaine

#Form

Forms: validation, styling & semantics design et validation de formulaire en pure CSS et HTML

#PixelArt

The Easy Way to Create Pixel Art with Object Mosaic un tutoriel pour créer du Pixel Art à partir d’une photo directement dans Illustrator

Des ressources utiles

#Select

FancySelect un script pour styler une liste de selection qui passe en liste native sur iOS

#Responsive

Responsive web design et e-mailing un très bon article sur l’intégration de newsletter responsive dans Mailchimp

Des ressources gratuites

UX Storytellers - Connecting the Dots

#UX

UX Storytellers – Connecting the Dots  un ebook gratuit sur l’expérience utilisateur

#Corporate Identity

Corporate identity mockup un PSD gratuit pour créer vos présentations d’identité graphiques

#Police

Born, une police d’écriture humanist serif gratuite

Les outils  et plugins pour vous faciliter la vie

#Prototype

Marvelapp.com un outil en ligne pour transformer les maquettes PSD, PNG et JPG stockées dans votre dropbox en un prototype interractif dans lequel l’utilisateur peut cliquer

Les démos sympas et impressionnantes

#CSS

How to (de)construct an icosahedron construction et déconstruction d’une forme géométrique 3D en CSS

#Jeu

Mapdive plongez dans le ciel et atterrissez au bon endroit avec ce jeu dans le navigateur basé sur des cartes Google qui va tuer votre productivité

Et s’il devait n’en rester qu’un ?

#CSS

Solved by Flexbox une galerie de techniques CSS qui utilisent flexbox pour résoudre des problèmes jusque là complexes sur le web avec des display et des flottants