Pixels of the Week – March 3, 2019

This content is 3 years old. Remember that the following content might be outdated.

Every week I share a list of curated articles, resources and tools about UX, UI and mobile design, Front-End development, HTML, CSS and more…

This week’s selection: creating a diverse open dataset for voice, relevancy of wireframes, history of LGBTQ+ design, accessibility audits tools, typography inspiration, promoting diversity, learning CSS, validate design decisions, the bad idea of recreating buttons with divs and JS, Interactive Typography cheatsheet, SVG & CSS micro-interactions, Grid layout cheat sheet, footer design, PWAs, CSS drawing basics, etc.

You can follow me on twitter to get a dose of links every days.

What I was up to this week

  • I talked in a podcast in French about my job as a UX designer, how I got there, videos games, design trends, voice interfaces, how movies shape the perception we have of interfaces, my drawings on the iPad and a few more things. You can listen on soundcloud and youtube
  • I prepared a little user interview guide that helped a lot during the interviews. It’s based on some UX cards by 2 Geoffrey Crofte and Julie Muller. Stay tuned, there might something open source coming in the next months 🙂

On this blog


In case you missed it, I had Geoffrey Crofte as a guest this week on the blog. In the article Portfolio Rework Part 1: Animation, Micro interaction & SVG, he explains you the tips and tricks he used to build the menu of this site and a few of the other super cool micro-interactions.

TL;DNR the one you should not miss

#Diversity #Opendata #Voice

voice.mozilla.org, you can  help Mozilla create more diverse and open datasets for voice interfaces

Interesting article




When Is A Button Not A Button? — the complex hell of recreating buttons behavior in JS (keyboard, tabindex, hover focus inactive etc.) tldnr: use a <button> element it was created for that purpose.


Shields Down” one of the best article I’ve read on why and when people resign.

Inspiration, fun demos and Great ideas


Some typography inspiration 🙂


Dear Tech Company is a collaborative video response to IBM’s Dear Tech Ad, trying to promote ACTUAL diversity in tech

#Webdesite #Whimsical

I’ve no idea what this site is or does (which might be an issue from a marketing point of view), but I find it really visually attractive, fun and whimsical: vakula.co

News in the industry


Amazon stops selling Dash buttons, goofy forerunners of the connected home
. The Dash Button demise was a result of the rapid expansion of Alexa based voice commerce


#Front-End #CSS

Useful tools and plugins that will make your life easy

#Text To Speech

Play’s Text to Speech app, if you want to listen to articles instead of reading them. I find this extremely useful, especially when am I tired. I’m wondering if there’s something similar to read ebooks 🙂


5 Tools For Automated Accessibility Audits


Interactive Typography cheatsheet, to help you get the typography vocabulary 🙂

#Grid Layout

GRID: A simple visual cheatsheet for CSS Grid Layout


appsco.pe a nice place to find PWAs

Sign up for new articles

Don’t miss any new content: get notified directly in your mailbox when I publish a new articles or share new freebies.
I won’t share this email, and you can unsubcribe anytime.

Please note that gmail sometimes puts the confirmation in spam.