Pixels of the Week – November 11, 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: accessibility for beginners, accessible color palette tools, ressources to design for colorblind people, inclusive design, UX of notifications, CSS and filters demos, redesign for dark mode, building design systems, CSS HSL colors, CSS grid areas, futur of information architecture and more.
You can follow me on twitter to get a dose of links every days.
TL;DNR the one you should not miss
#Accessibility
“The Web Accessibility Introduction I Wish I Had ” a nice introduction to the basics of accessibility
Interesting article
#Accessibility
- Forging a New Path for Disabled Design: An Interview with Liz Jackson, really interesting interview, empathy and design thinking is not enough when it comes to designing for disabled people, hire them and make them part of the team not just inspiration.
- 5 Digital Accessibility Myths Busted: accessibility is a team effort, won’t cost more if planned from the beginning, it will benefit MANY users and accessible sites are NOT ugly. I mean, this site is accessible and I thing, not ugly 😀
#UX
- Don’t @ me – an interesting read on notifications, how they got abused and how to make them better: timing, customisations and more.
- The future of Information Architecture. A great read on what Information Architecture is and why it’s important and will be even more important for AIs and conversational interfaces
#Design #CSS
Redesigning your product and website for dark mode – also, this will be cool when ambience light media queries will work as well
#Design Systems
Build your design system like the pros, videos by Brad Frost, Dan Mall and Josh Clark to build design systems
#Video Game
“Current And Former Employees Sue Riot Games For Gender Discrimination“, report revealed that Riot’s so-called “bro culture” inspires and, in some instances, rewards behavior that disadvantages women.
Inspiration, fun demos and Great ideas
#Filters
CSS Photo Effects & Filters From CodePen – the things you can do in modern browsers is quite amazing
#CSS
- Recreating the Red Dead Redemption 2 Tintype Loading Screen Effect in CSS
- Codevember is back, let’s get creative it our code!!
Webdesign news
#CSS
The CSS Working Group At TPAC: What’s New In CSS?
Tutorials
#CSS #HSL
“On Switching from HEX & RGB to HSL” by SaraSoueidan. I love HSL, like she explains, it makes color variation really easy, I use the L to create variations for hover and active buttons for example (in CSS and Sketch)
#CSS Grid
Useful tools and plugins that will make your life easy
#Color and #Accessibility
- Palx, a tool to generate color palette
- Color Matrix, a tool to check the contrast ratio of different colors against each other
- Accessible color palette builder, another tool to help you build accessible color palettes
- wearecolorblind.com Making the world a better place for the colorblind – articles and ressources