Pixels of the Week – October 13, 2019
Every week I share a list of curated articles, resources and tools about UX, UI and mobile design, HTML, CSS, the web industry, process inspiration and more…
This week’s selection: a color palette tool, accessibility in the news, responsive screen size map, an ebook on design systems for developers, iOS 13 and PWAs, typography and text rendering, UX and animations, an article trying to explain the crappy interface we still have today, etc.
#Now – what I’m up to
Yesterday I gave a workshop on cognitive biases with my friend Laurence at Parisweb. For this workshop, we selected 52 cognitive biases out of the wikipedia list of biases, distributed them in 5 different categories and build a nice card game you can use as a cheatsheet or teaching material. The card deck is in French for the moment but I might translate it back to English some day. Here you go: À la découverte des biais cognitifs – le jeu de 52 cartes.
I also gave an interview for Geeky Grils Reality on what it means to be a women in STEM: #STEMStories: Stéphanie, UX and Product designer, Luxembourg.
TL;DNR the one you should not miss
#Color
A really cool color palette tool that lets you preview what this palette could look like with UI elements
Interesting article
#UX #Animations
“Importance of Functional Animation in UX” some great points on how animations can make user experience better. Just remember that some animations might make user sick (motion sickness) so still be careful (check CSS prefers-reduced-motion)
#UX #Process
UX has bad UX “The process is currently often reversed — we copy what mistakes we’ve seen others do and do pointless research to desperately prove our points.” 👉 Yes this is an excellent point that explains the crappy interfaces we have
#PWAs #iOS
“iPhone 11, iPadOS and iOS 13 for PWAs and web development” no Web Push and no App installation APIs, but hope was born on push. Also desktop class browser in iPads might mess up your analytics
#Design #Casestudy
“Case study: web design focused on interaction design.” The part about creating and updating a typography system in Sketch has interesting ideas
#Typography #Rendering
Text Rendering Hates You, an article on fonts, ligatures, emojis, anti aliasing and every little details about font rendering in the browser. I love this kind of super geeky very detailed articles 💛
#Accessibility
“Accessibility in the News” the Dominos Pizza vs Guillermo Robles case explained
#NSFW #Manga #Culture
Sex in Anime and Manga, a really interesting article on difference in Japanese and Western culture regarding sexuality
#Typography
“Trump’s old lawyers really, really love Comic Sans” this made me laughs, but it also reminded me that I signed a contract written in comic sans when I was working as a summer camp counselor, so, well, hum, well 😀
Ebook
#designsystem
Design Systems for Developers – A guide that teaches professional developers how to transform component libraries into design systems and set up the production infrastructure used by leading frontend teams.
Inspiration, fun experiments and great ideas
#Framework #Project
I like this idea of a small sentence completion framework to help projects go well:
We are doing _____
Because we see the problem of _____
We know it’s a problem because _____
If we don’t fix it, we’ll see _____
We’ll know we’ve fixed it when we get _____
Tutorials
#CSS #Lists
Powerful New CSS for Styling Bullets, Numbers, and List Markers (video)
Useful tools and plugins that will make your life easy
#Responsive
Screen Size Map, a tool to understand the landscape and popularity of different screen size, in case you still need to explain that responsive should not be based on specific devices but rather on how content adapts in the browser
