{"id":2728,"date":"2014-05-23T08:32:26","date_gmt":"2014-05-23T06:32:26","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=2728"},"modified":"2014-05-23T08:32:26","modified_gmt":"2014-05-23T06:32:26","slug":"semaine-en-pixels-23-mai-2014","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/","title":{"rendered":"La semaine en pixels \u2013 23 mai 2014"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 11 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.). Une semaine consacr\u00e9e en partie aux ressources et plugins utiles : tableaux responsive, compression d’image et grilles Photoshop, vous trouverez de quoi am\u00e9liorer votre workflow quotidien. Et puisqu’on est vendredi, je vous propose deux jeux \u00e0 la fin de l’article pour procrastiner tranquillement avant le weekend.<\/p>\n

Pour plus de liens n’h\u00e9sitez pas \u00e0 me suivre sur twitter<\/a>. Bonne lecture :)<\/p>\n

Les articles \u00e0 lire<\/h2>\n

#Photoshop<\/p>\n

Redesigning Photoshop’s font panel<\/a>, un designer a redesign\u00e9 le panneau des polices dans Photoshop pour le rendre plus utilisables avec des id\u00e9es assez int\u00e9ressantes<\/p>\n

\"<\/p>\n

#Ergonomie<\/p>\n

Hellonomad.com<\/a> \u00a0\u00a0Une modale d\u00e9clench\u00e9e quand la souris de l’utilisateur quitte la page pour aller dans les menus du navigateur En th\u00e9orie \u00e7a servirait \u00e0 lui proposer une promotion quand il quitte la page, en pratique elle se d\u00e9clenche m\u00eame s’il veut mettre la page en favoris ou utiliser n’importe quel bouton du navigateur.<\/p>\n

#Workflow<\/p>\n

HTML Wireframes<\/a>, Brad Frost nous d\u00e9crit son workflow de wireframe dans le navigateur<\/p>\n

\"HTML<\/p>\n

Et pour continuer dans le workflow alternatif \u00a0: \u00ab\u00a0How I designed a website without Photoshop<\/a>\u00a0\u00bb<\/p>\n

#Responsive Images<\/p>\n

Responsive Images Done Right : A Guide To <picture> And srcset<\/a> : le meilleur article sur la nouvelle syntaxe srcset et size qui m\u2019a enfin permis de comprendre comment tout \u00e7a fonctionne<\/p>\n

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

#Persona<\/p>\n

Persona<\/a>, des photos pour inspirer vos personas sur flickr<\/p>\n

\"Persona\"<\/p>\n

#Illustrations<\/p>\n

Kevindart.tumblr.com<\/a>, une jolie dose d\u2019inspiration avec les illustrations color\u00e9es de Kevin Dart \u00a0<3<\/p>\n

\"Kevindart\"<\/p>\n

#Wireframe<\/p>\n

Web Without The Words<\/a> : \u00e0 quoi ressembleraient les sites plus plus connus en version wireframe ?<\/p>\n

\"Web<\/p>\n

#Agence<\/p>\n

Letters-inc.jp<\/a> un joli portfolio d\u2019agence compos\u00e9 de lignes et formes g\u00e9om\u00e9triques<\/p>\n

\"Letters-inc.jp\"<\/p>\n

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

#HTML5<\/p>\n

HTML5 Forms: The Markup<\/a> nouveaux attributs, nouveaux inputs : le code de base destin\u00e9 aux formulaires HTML5<\/p>\n

#CSS<\/p>\n

Fixing Typography Inside of 2-D CSS Transforms<\/a> ou comment r\u00e9soudre les soucis de texte flou sur le transformations 2D CSS<\/p>\n

Des ressources utiles<\/h2>\n

#Toolbox<\/p>\n

Oozled.com<\/a>, une boite \u00e0 outils de plus de 482 ressources pour les designers r\u00e9parties en 39 cat\u00e9gories<\/p>\n

\"Oozled\"<\/p>\n

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

#Responsive #Tableaux<\/p>\n

Tablesaw<\/a>, un ensembles de plugins pour des tableaux responsive avec diff\u00e9rents comportements : stack, swipe, etc.<\/p>\n

\"Tablesaw\"<\/p>\n

#Responsive<\/p>\n

Dimensions Toolkit<\/a>, un plugin payant Chrome pour vous aider \u00e0 tester des sites responsive<\/p>\n

\"Dimensions<\/p>\n

#Compression<\/p>\n

Compressor.io<\/a> un outil de compression d\u2019image en ligne (pas de traitement par lot comme Kraken.io<\/a>)<\/p>\n

\"Dimensions<\/p>\n

#Tumblr<\/p>\n

Tumblrboilerplate.com<\/a> un boilerplate pour servir de base simple pour la cr\u00e9ation de th\u00e8mes Tubmlr<\/p>\n

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

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

#Game<\/p>\n

Spell Up <\/a>\u00a0un jeu dans Chrome o\u00f9 il vous faudra \u00e9peler les mots avec le micro de votre appareil<\/p>\n

\"Spell<\/p>\n

#CSS<\/p>\n

Lichtenstein<\/a>, une exp\u00e9rimentation en CSS<\/p>\n

\"Lichtenstein\"<\/p>\n

#Jeu<\/p>\n

Race.assassinscreedpirates.com<\/a>: Assassin’s Creed Pirates disponible sous forme de mini jeu multitouch dans le navigateur<\/p>\n

\"Race.assassinscreedpirates.com\"<\/p>\n

Et s’il devait n’en rester qu’un ?<\/h2>\n

#Photoshop<\/p>\n

Griddify<\/a> \u00a0un plugin Photoshop qui rend la cr\u00e9ation de grilles tr\u00e8s simple, avec quelques petites options en plus de Guideguide comme la possibilit\u00e9 d’ajouter des grilles autour d’un \u00e9l\u00e9ment avec des padding internes ou des marges externes, etc.<\/p>\n

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

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 11 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.). Une semaine consacr\u00e9e en partie aux ressources et plugins utiles : tableaux responsive, compression d’image et grilles Photoshop, vous …<\/p>\n","protected":false},"author":3,"featured_media":2731,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"link","meta":{"_acf_changed":false,"footnotes":""},"categories":[105],"tags":[],"class_list":["post-2728","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 23 mai 2014 - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"Web Design et graphisme, exp\u00e9rience utilisateurs, design d'interface et mobilit\u00e9, outils, ressources et inspiration: les liens \u00e0 ne pas manquer le 23 mai 2014\" \/>\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\/semaine-en-pixels-23-mai-2014\/\" \/>\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 23 mai 2014 - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"Web Design et graphisme, exp\u00e9rience utilisateurs, design d'interface et mobilit\u00e9, outils, ressources et inspiration: les liens \u00e0 ne pas manquer le 23 mai 2014\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/\" \/>\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=\"2014-05-23T06:32:26+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2014\/05\/pixel-semaine-23mai-2014.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\/semaine-en-pixels-23-mai-2014\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/\",\"name\":\"La semaine en pixels \u2013 23 mai 2014 - par St\u00e9phanie Walter - UX Researcher & Designer\",\"isPartOf\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2014\/05\/pixel-semaine-23mai-2014.jpg\",\"datePublished\":\"2014-05-23T06:32:26+00:00\",\"dateModified\":\"2014-05-23T06:32:26+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"Web Design et graphisme, exp\u00e9rience utilisateurs, design d'interface et mobilit\u00e9, outils, ressources et inspiration: les liens \u00e0 ne pas manquer le 23 mai 2014\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2014\/05\/pixel-semaine-23mai-2014.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2014\/05\/pixel-semaine-23mai-2014.jpg\",\"width\":850,\"height\":350,\"caption\":\"La semaine en pixels \u2013 23 mai 2014\"},{\"@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 23 mai 2014 - par St\u00e9phanie Walter - UX Researcher & Designer","description":"Web Design et graphisme, exp\u00e9rience utilisateurs, design d'interface et mobilit\u00e9, outils, ressources et inspiration: les liens \u00e0 ne pas manquer le 23 mai 2014","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\/semaine-en-pixels-23-mai-2014\/","og_locale":"fr_FR","og_type":"article","og_title":"La semaine en pixels \u2013 23 mai 2014 - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"Web Design et graphisme, exp\u00e9rience utilisateurs, design d'interface et mobilit\u00e9, outils, ressources et inspiration: les liens \u00e0 ne pas manquer le 23 mai 2014","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2014-05-23T06:32:26+00:00","og_image":[{"width":850,"height":350,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2014\/05\/pixel-semaine-23mai-2014.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\/semaine-en-pixels-23-mai-2014\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/","name":"La semaine en pixels \u2013 23 mai 2014 - par St\u00e9phanie Walter - UX Researcher & Designer","isPartOf":{"@id":"https:\/\/stephaniewalter.design\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2014\/05\/pixel-semaine-23mai-2014.jpg","datePublished":"2014-05-23T06:32:26+00:00","dateModified":"2014-05-23T06:32:26+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"Web Design et graphisme, exp\u00e9rience utilisateurs, design d'interface et mobilit\u00e9, outils, ressources et inspiration: les liens \u00e0 ne pas manquer le 23 mai 2014","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/semaine-en-pixels-23-mai-2014\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2014\/05\/pixel-semaine-23mai-2014.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2014\/05\/pixel-semaine-23mai-2014.jpg","width":850,"height":350,"caption":"La semaine en pixels \u2013 23 mai 2014"},{"@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\/2728","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=2728"}],"version-history":[{"count":0,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/2728\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/2731"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=2728"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=2728"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=2728"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}