{"id":3900,"date":"2015-04-17T08:37:53","date_gmt":"2015-04-17T06:37:53","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=3900"},"modified":"2015-04-17T08:44:16","modified_gmt":"2015-04-17T06:44:16","slug":"la-semaine-en-pixels-17-avril-2015-2","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/","title":{"rendered":"La semaine en pixels \u2013 17 avril 2015"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 10 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

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 : du SVG (logo responsive, et outil pour en r\u00e9duire le poids), \u00a0des vid\u00e9os gratuites en CC0, des objets sympas du c\u00f4t\u00e9 de l’inspiration, du filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, une des meilleurs explication que j’ai pu lire sur flexbox jusque l\u00e0 et de quoi faire semblant de hacker juste avec deux doigts pour \u00e9pater les copains.<\/p>\n

Pour plus de liens vous pouvez me suivre sur twitter<\/a>. Bonne lecture :)<\/p>\n

tl;dnr, s’il devait n’en rester qu’un ?<\/p>\n

#SVG<\/p>\n

SVGOMG!<\/a> un outil en ligne bas\u00e9 sur SVGO pour optimiser vos SVGs dans le navigateur<\/p>\n

\"SVG<\/p>\n

Les articles de la semaine<\/h2>\n

#Font #UI<\/p>\n

The best UI typeface goes unnoticed<\/a>, un excellent article sur l\u2019importance de bien choisir sa police d\u2019interface pour qu\u2019elle soit facilement lisible m\u00eame en tr\u00e8s petit caract\u00e8re et quelques conseils pour vous y aider<\/p>\n

\"The<\/p>\n

#Animations #Motion<\/p>\n

How to Captivate Your Audiences with Motion<\/a> ou comment captiver l\u2019utilisateur avec des animation et un peu de motion sur votre site<\/p>\n

#Graphisme<\/p>\n

Les phrases \u00e0 ne pas dire devant un graphiste<\/a> :)<\/p>\n

\"Les<\/p>\n

#SVG #Responsive<\/p>\n

Responsive Logos, Part 2: Making Logos Truly Responsive with Inline SVG <\/a>\u00a0des exemples de logos responsive en SVG<\/p>\n

\"Responsive<\/p>\n

L\u2019actualit\u00e9 webdesign<\/h2>\n

#Blink #img<\/p>\n

Fuzzt logic<\/a> : comment blink va choisir la bonne image qu\u2019on lui propose dans srcset<\/p>\n

De l\u2019inspiration et de jolies id\u00e9es<\/h2>\n

#House<\/p>\n

Unbelievable House Truck Transforms Into Fantasy Castle<\/a> ce couple a transform\u00e9 un vieux camion en une maison ch\u00e2teau sp\u00e9cieuse et fonctionnelle et c\u2019est juste g\u00e9nial<\/p>\n

\"Unbelievable<\/p>\n

#Macbook<\/p>\n

Une protection pour macbook tout en LEGO <\/a>pour vous amuser \u00e0 customiser (et faire hurler les gens qui vont marcher sur une brique)<\/p>\n

\"Une<\/p>\n

#Responsive<\/p>\n

Le responsive expliqu\u00e9 aux fran\u00e7ais avec une baguette<\/a><\/p>\n

 <\/p>\n

\"Le<\/p>\n

#Cuisine<\/p>\n

Il me faut ce rouleau \u00e0 p\u00e2tisserie pour imprimer des chatons sur des cookies<\/a><\/p>\n

\"rouleau<\/p>\n

Les tutoriels de la semaine<\/h2>\n

#Responsive #Tableau<\/p>\n

Un tableau responsive en pure CSS<\/a> qui utilise les data- attributes<\/p>\n

\"Un<\/p>\n

#Filter #SVG<\/p>\n

MultiLayer Effects With CSS Clip Paths, Filters, and Blend Modes MultiLayer<\/a> une d\u00e9mo de ce qu\u2019on peut faire avec du clip path, des filtres et du blend mode en SVG<\/p>\n

\"MultiLayer<\/p>\n

Des ressources utiles<\/h2>\n

#Videos<\/p>\n

Videos.pexels.com<\/a> des vid\u00e9os gratuites \u00e0 utiliser pour vos projets sous licence Creative Commons Zero (CC0)<\/p>\n

\"Videos.pexels.com\"<\/p>\n

#Ebook<\/p>\n

Vous pouvez t\u00e9l\u00e9charger gratuitement la version ebook de The Field Guide to Human-Centered Design<\/a><\/p>\n

\"The<\/p>\n

#Ebook #Clients<\/p>\n

Sinon l’ebook \u00ab\u00a0Pay me or else<\/a>\u00a0\u00bb est enfin disponible avec un chap\u00eetre bonus de t\u00e9moignages auquel j’ai pu participer (oui c’est pas du UIfaces c’est vraiment moi cette fois ^^)<\/p>\n

\"Pay<\/p>\n

#Flexbox<\/p>\n

Un des meilleurs guide pour l\u2019utilisation de flexbox<\/a> que j\u2019ai lu pour le moment avec un petit playground<\/a> pour tester les propri\u00e9t\u00e9s<\/p>\n

\"guide<\/p>\n

Des outils \u00a0et plugins pour vous faciliter la vie<\/h2>\n

#CSS #form<\/p>\n

Formfactor.io<\/a> des \u00e9l\u00e9ments de formulaire uniquement styl\u00e9s en CSS<\/p>\n

Pour le fun: jeux et d\u00e9mos sympas et impressionnantes<\/h2>\n

#Fun #Geek<\/p>\n

Geektyper.com<\/a> \u00a0si toi aussi tu as toujours r\u00eav\u00e9 de faire semblant de hacker juste avec deux doigts en tapant tr\u00e8s vite au clavier comme dans les flims<\/p>\n

\"Geektyper.com\"<\/p>\n

#Silicon Valley<\/p>\n

Le site web de Pied Piper<\/a> (attention spoilers inside si vous n\u2019avez pas encore vu l\u2019\u00e9pisode de cette semaine)<\/p>\n

\"Pied<\/p>\n

#Font<\/p>\n

Le Washington Post propose un \u00e9diteur en ligne pour jouer avec Hillary Bold, la police (parodiquement ?) d\u00e9riv\u00e9e du du logo d\u2019Hillary Clinton<\/a><\/p>\n

\"Hillary<\/p>\n

`<\/p>\n","protected":false},"excerpt":{"rendered":"

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 10 ans. Il se peut qu’il ne soit plus \u00e0 jour.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.). Au programme : du SVG (logo responsive, et outil pour en r\u00e9duire le poids), \u00a0des vid\u00e9os gratuites en CC0, …<\/p>\n","protected":false},"author":3,"featured_media":3902,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"link","meta":{"_acf_changed":false,"footnotes":""},"categories":[105],"tags":[],"class_list":["post-3900","post","type-post","status-publish","format-link","has-post-thumbnail","hentry","category-veille-liens-utiles","post_format-post-format-link"],"yoast_head":"\nLa semaine en pixels \u2013 17 avril 2015 - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"logo SVG responsive, outil pour en r\u00e9duire le poids du SVG, filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, flexbox expliqu\u00e9.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"La semaine en pixels \u2013 17 avril 2015 - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"logo SVG responsive, outil pour en r\u00e9duire le poids du SVG, filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, flexbox expliqu\u00e9.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/\" \/>\n<meta property=\"og:site_name\" content=\"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.\" \/>\n<meta property=\"article:published_time\" content=\"2015-04-17T06:37:53+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2015-04-17T06:44:16+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2015\/04\/lienssemaine.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"850\" \/>\n\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"St\u00e9phanie Walter\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@walterstephanie\" \/>\n<meta name=\"twitter:site\" content=\"@walterstephanie\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"St\u00e9phanie Walter\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/\",\"name\":\"La semaine en pixels \u2013 17 avril 2015 - par St\u00e9phanie Walter - UX Researcher & Designer\",\"isPartOf\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2015\/04\/lienssemaine.jpg\",\"datePublished\":\"2015-04-17T06:37:53+00:00\",\"dateModified\":\"2015-04-17T06:44:16+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"logo SVG responsive, outil pour en r\u00e9duire le poids du SVG, filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, flexbox expliqu\u00e9.\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2015\/04\/lienssemaine.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2015\/04\/lienssemaine.jpg\",\"width\":850,\"height\":350,\"caption\":\"La semaine en pixels \u2013 3 janvier 2015\"},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/\",\"name\":\"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.\",\"description\":\"Je partage ici mes conseils, mes ressources et outils sur la conception centr\u00e9e utilisateur, la recherche et tests utilisateur, le design de produits, la strat\u00e9gie mobile, l'utilisabilit\u00e9 et l'accessibilit\u00e9.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/stephaniewalter.design\/fr\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\",\"name\":\"St\u00e9phanie Walter\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g\",\"caption\":\"St\u00e9phanie Walter\"},\"description\":\"UX Researcher & Product Designer. Mobile Expert. Public speaker. Blog writer. Google Dev Expert Web Platform and Product Design (GDE)\",\"sameAs\":[\"https:\/\/stephaniewalter.design\/\",\"https:\/\/www.linkedin.com\/in\/stephaniewalterpro\/\",\"https:\/\/x.com\/walterstephanie\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"La semaine en pixels \u2013 17 avril 2015 - par St\u00e9phanie Walter - UX Researcher & Designer","description":"logo SVG responsive, outil pour en r\u00e9duire le poids du SVG, filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, flexbox expliqu\u00e9.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/","og_locale":"fr_FR","og_type":"article","og_title":"La semaine en pixels \u2013 17 avril 2015 - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"logo SVG responsive, outil pour en r\u00e9duire le poids du SVG, filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, flexbox expliqu\u00e9.","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2015-04-17T06:37:53+00:00","article_modified_time":"2015-04-17T06:44:16+00:00","og_image":[{"width":850,"height":350,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2015\/04\/lienssemaine.jpg","type":"image\/jpeg"}],"author":"St\u00e9phanie Walter","twitter_card":"summary_large_image","twitter_creator":"@walterstephanie","twitter_site":"@walterstephanie","twitter_misc":{"\u00c9crit par":"St\u00e9phanie Walter","Dur\u00e9e de lecture estim\u00e9e":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/","name":"La semaine en pixels \u2013 17 avril 2015 - par St\u00e9phanie Walter - UX Researcher & Designer","isPartOf":{"@id":"https:\/\/stephaniewalter.design\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2015\/04\/lienssemaine.jpg","datePublished":"2015-04-17T06:37:53+00:00","dateModified":"2015-04-17T06:44:16+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"logo SVG responsive, outil pour en r\u00e9duire le poids du SVG, filtre CSS pour faire de jolies choses, deux ebooks gratuits sur le design centr\u00e9 humain et comment faire pour que votre client vous paye, flexbox expliqu\u00e9.","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/la-semaine-en-pixels-17-avril-2015-2\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2015\/04\/lienssemaine.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2015\/04\/lienssemaine.jpg","width":850,"height":350,"caption":"La semaine en pixels \u2013 3 janvier 2015"},{"@type":"WebSite","@id":"https:\/\/stephaniewalter.design\/fr\/#website","url":"https:\/\/stephaniewalter.design\/fr\/","name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","description":"Je partage ici mes conseils, mes ressources et outils sur la conception centr\u00e9e utilisateur, la recherche et tests utilisateur, le design de produits, la strat\u00e9gie mobile, l'utilisabilit\u00e9 et l'accessibilit\u00e9.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/stephaniewalter.design\/fr\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf","name":"St\u00e9phanie Walter","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g","caption":"St\u00e9phanie Walter"},"description":"UX Researcher & Product Designer. Mobile Expert. Public speaker. Blog writer. Google Dev Expert Web Platform and Product Design (GDE)","sameAs":["https:\/\/stephaniewalter.design\/","https:\/\/www.linkedin.com\/in\/stephaniewalterpro\/","https:\/\/x.com\/walterstephanie"]}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/3900","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/comments?post=3900"}],"version-history":[{"count":0,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/3900\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/3902"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=3900"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=3900"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=3900"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}