Pixels of the Week – July 19, 2020

This content is 4 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, HTML, CSS, the web industry, process inspiration and more…

This week’s selection: modern CSS showcase, game ethics, design teams structures, an avatar generator, the UX of videogames, accessibility resources, github readmes, intrinsic web design, a small CSS buttons library, UX education and bootcamps, UX roadmaps, UX research resources, a fun GSAP demo, SVG shape generator, 558 free SVG icons, optimizing for core web vitals, a cute site to open a window somewhere in the world, etc.

TL;DNR the one you should not miss

#CSS

Remember CSSZenGarden? This is something quite similar: A modern CSS showcase styled by community contributions. You can fork it and create your own custom style for the page to show what cool things you can achieve with modern CSS techniques!

Interesting article

#Organisation #Design

Team structures and operating models” different examples of some team structure models for user research and some operating models

#UXEducation #Bootcamps

Should We Give the Boot to UX Bootcamps?” an interesting article on UXBooth
on the many issues of UX bootcamps education. I love the “Do you want fries with that certification?” for me this sums it up quite nicely.

#UXStrategy

A UX roadmap is a high-level, living artifact that prioritizes and communicates a UX team’s future work and problems to solve.” on NNgroup, an interesting concept to help you with you strategy and know where you are and want to go

#CSS

#JavaScript

Your blog doesn’t need a JavaScript framework

Inspiration, fun experiments and great ideas

#Illustrations

The portfolio of Clémence Dupont has some amazing illustrations

#Zen #Travel

This is cute: open a window somewhere in the world

#Fun

This xkcd COVID risk chart made me laugh

#GSAP #Fun

How To Make A Dribbble Shot (GSAP ScrollTrigger), haaa this is fun, accurate and a cool GSAP scroll trigger demo by @meowlivia_

Podcast & Talks

#BeyondResponsive #WebDesign

Intrinsic Web Design with Jen Simmons” (2018) she explains how flexbox and grid layout can help build websites beyond responsive web design and media queries, with components that can adapt on their own

#Podcast #VideoGames

The UX of video games, another great episode of Delta CX podcast, this time with Celia Hodent
as a guest. She talks about game design, game psychology and gives advice if you want to enter this industry, talks about onboarding, cognitive psychology, etc.

#Performance #WebVitals

Optimize for Core Web Vitals” a video by Addy Osmani where he explains how Chloe optimized Chloe’s website for Largest Contentful Paint (LCP), First Input Delay (FID) and Cumulative Layout Shift (CLS):

News in the industry

#Game

The Last of Us 2 dev Naughty Dog condemns harassment, death threats – Devs and talent behind the game are getting hate” in case some of you still had doubt abouts how toxic some gamers can become.

Tutorials

#github

How To Create A GitHub Profile README ” by Monica Powell (@waterproofheart
) with examples of cool things people are doing with this area on their profile:

Useful tools and resources that will make your life easy

#Avatar

An online random characters generator to create avatars for apps, gaming, etc. Fun but it’s missing curly long hair 😀

#SVG

Who doesn’t like a little SVG shape generator, right?

#Icons

Tabler Icons – 558 Fully customizable SVG icons. (MIT license)

#Accessibility

Accessibility for Product Managers“, a starter guide for product managers about delivering accessible websites. Sooo, no more excuses?

#Game

ethicalgames.org, a collaborative website with guides, tips and resources to build ethical games and gaming communities

#UI #CSS

A small CSS button library for your projects.  And yes, I love the name it’s the German and Alsatian word for “button”.

#Resources #UserResearch

This is a list that links different resources and templates in airtable, miro, coda, milanote, trello etc. to help you get started with user research (some links are not working though so you might have to test a few)