{"id":3511,"date":"2015-01-16T08:55:13","date_gmt":"2015-01-16T07:55:13","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=3511"},"modified":"2015-01-16T09:05:08","modified_gmt":"2015-01-16T08:05:08","slug":"la-semaine-en-pixels-16-janvier-2015","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-16-janvier-2015\/","title":{"rendered":"La semaine en pixels \u2013 16 janvier 2015"},"content":{"rendered":"
Comme chaque semaine, \u00a0je vous propose un condens\u00e9 de mes lectures et ma veille Web Design et graphisme, exp\u00e9rience utilisateurs, design d’interface et mobilit\u00e9, mais aussi des outils et ressources pour le webdesign et inspiration en tout genre (illustrations, photos, sites web, etc.).<\/p>\n
Au programme : effets de survol en CSS, prototype papier, statistiques CSS pour 2014, le retrait du burger icon chez redbooth expliqu\u00e9, l’attaque des clones dans le web, de jolis livres chez fivesimplesteps, des photos magnifiques de New York vu du ciel la nuit, du sticker header et animations Photoshop en tutoriel, des JavaScripts pour les animations et am\u00e9liorer le bouton suppression.<\/p>\n
Pour plus de liens vous pouvez me suivre sur twitter<\/a>. Bonne lecture :)<\/p>\n #CSS<\/p>\n Hover.css<\/a>, une collection d\u2019effets de survol en CSS \u00e0 r\u00e9utiliser ou simplement pour votre inspiration<\/p>\n <\/p>\n #Prototype<\/p>\n How Prototyping is Replacing Documentation<\/a>, \u00a0comment le prototype peut remplacer une documentation longue \u00e0 lire et \u00e0 r\u00e9diger. \u00ab\u00a0People don\u2019t read products,\u200athey interact with them.\u00a0\u00bb et c\u2019est tellement vrai<\/p>\n <\/p>\n #CSS<\/p>\n D\u2019int\u00e9ressantes statistiques d’utilisation du CSS en 2014<\/a> sur 10 400 domaines<\/p>\n <\/p>\n #Burger icon #App<\/p>\n Chez Redbooth ils ont retir\u00e9 le menu burger de leur application<\/a> au profit d\u2019onglets en bas apr\u00e8s quelques \u201ctest utilisateurs\u201d sur les coll\u00e8gues (faut de mieux)<\/p>\n <\/p>\n #Test Utilisateur<\/p>\n Tests utilisateurs en laboratoire sur tablette et mobile : 4 installations test\u00e9es<\/a><\/p>\n #Clone #Projet Web<\/p>\n Le Web : L\u2019attaque des clones<\/a> par mon coll\u00e8gue Matthieu qui en a un peu marre des projets clon\u00e9s<\/p>\n <\/p>\n #Livres<\/p>\n Fivesimplesteps.com<\/a> a eu droit \u00e0 un joli redesign, et certains livres dans les packs sont \u00e9galement disponibles en version papier<\/p>\n <\/p>\n #Instagram<\/p>\n Un compte instagram qui va vous faire mourir de rire<\/a>. Litt\u00e9ralement.<\/p>\n <\/p>\n #Photos<\/p>\n Des images \u00e0 vous couper le souffle de New York vu du ciel la nuit<\/a>, c\u2019est magique et magnifique (et un peu lent \u00e0 charger par contre les images sont lourdes)<\/p>\n <\/p>\n #Sticky Header<\/p>\n Quelques lignes de codes suffisent \u00e0 masquer automatiquement une ent\u00eate fixe<\/a> quand l\u2019utilisateur fait d\u00e9filer la page vers le bas, pour la r\u00e9-afficher quand il remonte<\/p>\n <\/p>\n #Photoshop #Animation<\/p>\n UI Animation in Photoshop \u2013 Tutorial #2<\/a> un tutoriel d\u2019animations sous Photoshop avec dans cette seconde \u00e9dition l\u2019ajout d\u2019easing sur une animation pour la rendre plus fluide et naturelle<\/p>\n <\/p>\n #Pattern Library<\/p>\n Mailchimp a rendu public sa librairie de patterns <\/a>pour construire leur interface. Par contre j\u2019ai du mal \u00e0 voir la diff\u00e9rence avec un Style Guide.<\/p>\n <\/p>\n #JavaScript<\/p>\n Vanillajsf.tw<\/a>\u00a0\u00a0la syntaxe de JavaScript s\u2019est grandement simplifi\u00e9e<\/p>\n #Font<\/p>\n CABANA<\/a>, une nouvelle tr\u00e8s jolie police de caract\u00e8re par le talentueux designer Adrien Coquet <\/a>:)<\/p>\n <\/p>\n #Animations<\/p>\n Snabbt.js<\/a>, une librarie JS d\u2019animations, la \u00a0demo<\/a> d\u2019animation de 200 \u00e9l\u00e9ments du DOM est plut\u00f4t impressionnante de fluidit\u00e9<\/p>\n <\/p>\n #HTML<\/p>\ntl;dnr, s’il devait n’en rester qu’un ?<\/h2>\n
Les articles de la semaine<\/h2>\n
Les Nouveaut\u00e9s webdesign<\/h2>\n
De l\u2019inspiration et de jolies id\u00e9es<\/h2>\n
Les tutoriels de la semaine<\/h2>\n
Des ressources utiles<\/h2>\n
Des outils \u00a0et plugins pour vous faciliter la vie<\/h2>\n