Des pixels et du code #40

Ce contenu a été rédigé il y a 6 années. Il se peut qu'il ne soit plus à jours.

Une semaine très orientée code, animations et surtout responsive webdesign, avec deux articles français sur le sujet, et des tutoriels et démonstrations d’API HTML5. Pour ceux plus orientés design, quelques belles ressources pour améliorer son workflow dans Photoshop, et sur l’expérience utilisateur.

Les tutoriels de la semaine

#Animation

Sprite sheet animation with steps()  des animations CSS3 qui utilisent la propriété step()

Animation in a Flashless world un second tutoriel plutôt impression pour créer un chat qui cours dans l’herbe

#Email et Font

Using web fonts in email , il serait possible d’utiliser une font “exotique” dans un mail avec un @import (‘lienversgoogleAPI); par contre le support n’est pas génial

#HTML5 API

Fun with the File API une petite démo des possibilités de plusieurs API, pour transformer une video ou une video prise par webcam en gif animé.

#jQuery

Les gestionnaires d’évènements en jQuery: différences et avantages de bind(), live(), delegate() et on(). pour les débutants en jQuery, un petit article qui vous aidera à comprendre la différences entre tous ces éléments.

#CSS3

Lining up your backgrounds un petit tutoriel pour créer un effet de lignes de fond (comme un cahier) qui s’adapte à la taille du texte en gradients CSS3

Des ressources utiles

#HTML5 API

Vibration-api l’API qui permet de faire vibrer un téléphone en JS ça existe (pas très bien supporté par contre)

#Photoshop

30+ tips to improve your iOS design workflow (in Photoshop) des conseils pour améliorer ses méthodes de travail lorsque l’ont fait du design mobile sous Photoshop

Les outils  et plugins pour vous faciliter la vie

#Icônes

Weloveiconfonts.com un service de hosting de font icons en ligne, comme Google Web Font en fait, mais uniquement composé d’icônes.

#Loader

Cssload.net un petit site pour créer des loaders et spinners en CSS en quelques cliques

Les articles à lire

#Responsive Webdesign

Définir ses points de rupture , pour ceux qui croient encore qu’il faut définir les points de rupture en fonction des périphériques, j’espère vous faire changer d’avis avec cet article.

Responsive Webdesign : cas d’études à lire le retour d’expérience sur le site responsive de Nealite

Responsive Images: What We Thought We Needed un retour sur les solutions d’image responsive et une analyse sur ce dont on a vraiment besoin en web

#Mobile

Nine Ways to Improve User Experience in Mobile Design 9 astuces et patterns de design pour améliorer l’expérience utilisateur sur mobile de manière très simple

#Typographie et inspiration

Tanamachistudio.com de la typographie retro à la croie sur tableaux noirs géants pour ce superbe portfolio

#video #client

F*ck you, pay me, une petite vidéo datant de 2011 mais toujours d’actualité ou Mike Monteiro explique comment s’en sortir avec des clients qui refusent de payer

#UX

Les concepteurs de sites internet ne sont pas (tous) des utilisateurs comme les autres car il est bien de rappeler de temps en temps qu’il est difficile de se mettre dans la peau d’un utilisateur lorsque que l’on est le concepteur du site

#Strasbourg

Résumé de l’apéro #4 WdStr, le résumé de notre 4em apéro sur le thème de l’avenir du webdesign, avec de belles discussions durant la soirée

Les démos sympas et impressionnantes

Et la vidéo fun de la semaine, What happens when you pick the wrong font? It ain’t pretty.

Vous souhaitez des conseils en ergonomie ou en expérience utilisateur ? Un design de site, d’interface ou d’application mobile ? Envie de travailler ensemble ou de m’inviter à donner une conférence ? Consultez mes réalisations ou contactez moi directement.

Les commentaires sont fermés.