Pixels of the Week – June 17, 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: CSS animations gallery, predictive UX, prioritize product roadmap, rapid prototyping guide, designer new tools, variable fonts, remote user testing, inclusive cards, Specificity in :not(), :has(), and :matches() and other CSS selectors, building a web performance culture, 2 articles on search experience, feeds design and a great article with UX portfolio tips.
You can follow me on twitter to get a dose of links every days.
I gave a talk
#Performance #UX
week I gave a talk at Pixel Pioneers on perceived performance and how to make your site or app feel faster even when there’s no line of code left to optimize. You can find the slides of the talk right there.
TL;DNR the one you should not miss
#CSS
Animista, a gallery of CSS animations to inspire you for your next project 🙂
Interesting article
#UX and #UI
- “Icons and Big Data: Using Predictive Analytics for Search Accuracy” really interesting article on using data analysis to provide a better experience for users
- “Architecture vs. (so-called) UX Design” I like the metaphor and comparison here 🙂
- A Guide to Wireframe Tools & Rapid Prototyping. I always start with paper
- Always nice to be aware of new design tools: The new design tools on the block (doesn’t mean you have to change your workflow, it can become exhausting to keep up with tools and trends ^^)
- How to “Remote User Test” – pros, cons and how to
- Search redesign: Defining search patterns and models and Site Search Suggestions, 2 articles on search experience
- Downplaying Empty States in Design – A nice read on handling empty states
- Stop “feeding” your users – interesting read on feed design and machine learning
- “I Reviewed 573 UX Designer Portfolios, This Is I Want To See In Yours” > yes yes to all of that. “You can’t stand out with visual design skills anymore. It’s time to highlight design stories instead.” !!
#Design
- What London’s Underground Map Can Teach You About Design -interesting read on simplicity
- The Story Behind Susan Kare’s Iconic Design Work for Apple – awww pixels and icons <3
#Product Design
3 ways to prioritize your product roadmap with a matrix, great read and I love how they used airtable for that
#Front-End (HTML, CSS and more)
- How to start with variable fonts on the web
- Cards, a great article on building and coding a progressively enhanced, usable card with special attention to accessibly and inclusive design
- Specificity in :not(), :has(), and :matches()
- Another great read on CSS basics “Level up your CSS selector skills“
- Fostering a Web Performance Culture – Web Performance is not only about understanding what makes a site fast. It’s about creating awareness amongst both developers and non-developers.
Inspiration, fun demos and Great ideas
#Posters
Super freaky recently declassified NSA security posters
#Logos
2018 Logo Trends – always interesting to keep up with the trends
Tutorials
#A11Y
How to test accessibility of emails
#CSS
Z-Index Explained: How to Stack Elements Using CSS