Des pixels et du code #53

Des pixels et du code #53

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

Le gros sujet de la semaine sur les réseaux sociaux qui a généré beaucoup d’articles sur différents blogs orientés graphisme/design était la supposée copie du design de LayerVault pour leur service Designer News par Designmodo dans un petit kit de flat UI (présenté dans les liens la semaine dernière). Ce petit débat a généré quelques articles très sympas et réflexions de fond sur la copie et le « style » graphique. Du côté de la communauté française inté/dev, on s’interroge plus sur les préprocesseurs chez hteumeuleu, iamvdo, IAmNotCyrilou ou chez Nicolas Hoffmann. Une semaine bien chargée  à laquelle s’ajoutent les habituelles ressources, des icônes, des plugins Photoshop, une preview de Bootstrap 3, des templates pour de l’identité corpo,  et quelques excellents articles qui traitent d’ergonomie et expérience utilisateur. Bonne lecture, vous avez de quoi occuper votre weekend là :)

Les tutoriels de la semaine

#UX

UX apprentice, un petit site en plusieurs étapes tutorées pour apprendre les princes de l’ergonomie et du design d’expérience utilisateur

#Animation

12 rules of animation pas vraiment un “tutoriel” mais une petite vidéo rapide qui présente et illustre joliment 12 règles d’animation.

Des ressources utiles

#Bootstrap Flat

Boostrap V3  une petite preview de Bootstrap qui passe en « Flat design » dans sa version 3. Au revoir les gradients sur les boutons et surtout les filtres pour IE !!

#Prix #Cout d’un freelance

How to calculate your hourly rate des calcules simples à faire pour calculer son coût horaire et rester rentable en tant que freelance et entreprise

#Photoshop

8 plugins Photoshop pour le webdesign librairies de symboles, design mobile, découpage des assets, des plugins dont vous ne pourrez plus vous passer pour Photoshop.

Les outils  et plugins pour vous faciliter la vie

#Grid #jQuery

Photoset Grid un plugin jQuery qui va ordonner automatiquement les photos sur un système de grille pour perdre le moins de place possible

#Cordporate identity #Freebies

Corporate Identity Photoshop Mock-up (Psd) un PSD en téléchargement gratuit qui contient des éléments pour présenter un logo ou charte graphique dans un packaging corporate : iPhone, cartes de visite, agenda, stylo, gommes, etc.

#Icônes

Free Outline Icons un petit pack de 200 icônes avec un effet de contour

#LESS

Preboot une collection de mixins, variables et snippets de code utile pour LESS

#Typography

Gridwax.gs un bookmarklet pour ajuster et préserver le rythme vertical sur un site web

Les articles à lire

#Logo

Golden Ratio in logo designs. l’utilisation du nombre d’or dans le design de logo avec des exemples concret

#Keep calm

The Story of Keep Calm and Carry On, l’histoire derrière ces affiches célèbres vues, et revues et utilisées tant de fois

#UI design

The One Pixel Rule  comme contre pied à la technique “double pixel” qui consiste à doubler les pixels pour l’écran retina, de sorte à ce qu’ils soient divisibles par deux pour un écran classique. L’article conseil de ne pas penser au fait qu’il va falloir diviser par deux.

#CSS

We don’t need your CSS grid, un nombre incalculable de systèmes de grilles en CSS apparaissent chaque jour, l’argument de cet article n’est pas que les grilles sont mauvaises, mais que vous n’avez pas forcément besoin de LEURS grilles, quelques lignes de CSS écrites à la main suffisent souvent (et seront moins lourdes qu’une grille dont on utilise 10% des possibilités)

#Graphisme

À quoi penser avant de rencontrer un graphiste un excellent article sur les questions qu’un graphiste va poser au client pour mieux cerner son projet

#Copyright #Plagiat

Flattery  une réflexion de Sacha Greif suite à “l’affaire” LayerVault vs Flat UI sur où s’arrête l’inspiration, le plagiat, et pourquoi ça a choqué plus de gens dans ce cas là alors que le site Kickoff  est clairement très inspiré d’Apple mais que ça a dérangé moins de monde?

Style and Identity une réponse à cette article qui fait la différence entre le “style” général, et l”identité de la marque/du produit qui dérive de ce style. Pour l’auteur le site Kickoff dérive du style Apple, mais ne “vole” pas leur identité.

Inspiration

#Typographie #Portfolio

http://www.marksimonson.com/ , le portfolio d’un typographe, simple, sobre et haut en couleurs sur la présentation des polices d’écriture.

#Minimalisme

Minimalism is simple une petit illustation sous forme de BD très sympa

#Illustration

Deathtobullshit/ la meilleur illustration de la semaine illustra la conférence de Brad Frost “Death to Bullshit and ready to inspire 2012

#Super Heros

If super heros were sponsored” de superbs détournements de super héros avec le logo des marques sur leurs costumes

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

#Performances

Browserdiet.com avec tout ce qu’on lit aujourd’hui sur le RWD et la mobilité, ce petit rappel sur les bonnes pratiques en terme de performance est le site auquel il faut jeter un oeil cette semaine (ne serait-ce que pour vous le garder sous le coude pour plus tard). A défaut d’un régime efficace avant l’été, pourquoi pas un régime pour vos sites web? ;)

Et le tumblr fun de la semaine  soixante-millions-de-graphistes.tumblr.com : “Ce tumblr traite de l’influence du wordart et de la démocratisation des outils de PAO sur certaines créations graphiques contemporaines en France – réalisées sous la contrainte ou pas ;-)  “