Pixels of the Week – May 6, 2018
Every week I post a lot of my daily readings about Web, UI and UX Design, mobile design, webdesign tools and useful resources, inspiration on twitter and other social networks.
This week’s selection: unsubscribe design mistakes, a guide to UI fonts, paper wireframing, publishing a PWA to the stores, Sketch symbol tricks, priority guides, dataviz design, CSS relative units, using:focus-within for dropdown menus, inputmode and mobile form, CSS display: contents, illustration inspiration, CSS experiments, duotone effect generator and amazing web crew embroidered patches
You can follow me on twitter to get a dose of links every days.
TL;DNR the one you should not miss
#Patchs
Yeah, my friend Julien created some super cool Cyberspace Building Crew embroidered patches & stickers. If you need designer and developer swag, this is it, go go gooo 🙂
Interesting article
#UX / UI
- Top 10 Design Mistakes in the Unsubscribe Experience – Canceling email subscriptions should be a one-click process, with no additional hurdles for users.
- UI Designer friends you need to bookmark this: The Ultimate Guide to Font Sizes in UI Design
- Quantitative User-Research Methodologies: An Overview
#Wireframes
- “Priority Guides: A Content-First Alternative to Wireframes” oh this is really close to what I build in content priority workshops but with post its, nice to read about alternative methods to improve mine.
- How paper wireframing will make you a better designer – also it works offline hehe it might sound silly but you might not always get a nice connexion in those meeting rooms ^^
#Mobile
- Now this is super interesting and a little bit at the same time, process should be waaay easier: “I built a PWA and published it in 3 app stores. Here’s what I learned“
- Finger-friendly numerical inputs with `inputmode`
#Front-End
- A Guide To The State Of Print Stylesheets In 2018
- The Relative Units of CSS: em, rem, ch, ex, vh, vw, %
- Display: Contents Is Not a CSS Reset (for the moment it causes accessibility issues)
- This is a really nice use of :focus-within : “Solved With CSS! Dropdown Menus“
#Dataviz
Old but still really relevant article: “Data Visualization – How to Pick the Right Chart Type?”
#Society
How a Common Interview Question Fuels the Gender Pay Gap (and How to Stop It) – Tldnr stop asking people for they previous salary in job interviews
Inspiration, fun demos and Great ideas
#CSS
- This should help you spend the rest of your afternoon (requires a mouse): CSS Sunset Sunrise using gradients
- This is super cool (and might kill your GPU haa) recurss.github.io , a collection of recursive css specimens
#UI
- Some nice ideas for proximity feedback
- Oh this is adorable. A little security shade so the wombat can’t peek at your password!
#Posters and illustrations
- I really like this illustration style
- Some un-inspirational posters, I need the “Not everything is possible” one
#Joke
To help you find silly jokes if you colleague forgot to lock their session: Practical Jokes in the Browser
Webdesign news
#Edge
PWAS get push notifs and Service Workers in EdgeHTML 17, YEAHY
Tutorials
#Sketch
Wow this is a really smart tip: Using Sketch’s Symbols as Links for Big Projects
Useful resources, tools and plugins that will make your life easy
#Color
A cool online tool: Duotone Effect Generator
