Pixels of the Week – January 17, 2021

Pixels of the Week – January 17, 2021

👉 Your curated weekly Design and Front-End resources: public speaking diversity, UX research papers, observational user research, free illustrations,  inspiring videos, CSS animations and transitions, accessible button generator, UI inspiration, design tool history, Chrome music lab, a CSS game tutorial, diverse stock photos, old book illustrations and more.

Pixels of the Week – January 10, 2021

Pixels of the Week – January 10, 2021

👉 Your curated weekly Design and Front-End resources: HTML/CSS stack, progressive enhancement, designing components, a beautiful typeface, motion and accessibility, CSS properties almanac, 2020 ipsum generator, terms and conditions, designer bias, infinite scroll, results of the NNgroup UX career survey, computer advertising pictures, an essay on newsletter, generative art, etc.

Pixels of the Week – December 27, 2020

Pixels of the Week – December 27, 2020

👉 Your curated weekly Design and Front-End resources: the cupcake model for product strategy, typography, CSS glitch effect, a nice color palette generator and a pattern generator, CSS animations tool, a fun pinkish platform game in the browser, accessibility anchor links, handling long content and centering in CSS, more UI game inspiration, etc.

Pixels of the Week – December 20, 2020

Pixels of the Week – December 20, 2020

👉 Your curated weekly Design and Front-End resources: you belong in tech, learning CSS, game UI inspiration, diversity in tech and design, some fun little browser games, UI history & the history of the burger menu, CSS variables, CSS scroll snap, figcaption and accessibility, contextual inquiry, next level PWAs on desktop, the “UX community” on Instagram, colorful inspiration, and so much more

Pixels of the Week – December 13, 2020

Pixels of the Week – December 13, 2020

👉 Your curated weekly resources:  CSS full bleed content, a free UX design starter kit, why you should conduct user research, a cool accessibility project, 2 typefaces, testing the “abusability” of your product, CSS margin collapse explained, free icons, 3D art, diverse stock photos and books,  2 advent calendars (accessibility & UXD ), a cute mindmap tool, pure CSS Monument Valley, etc.

🎁 A Free User Research and UX Design Starter Kit

🎁 A Free User Research and UX Design Starter Kit

Today I want to share with you my User Research and UX Design Starter Kit. It a 51 pages PDF that contains my user interview cheat-sheet, my templates for product / service concept, a user journey map template, my user flow kit, some mobile, tablet and desktop templates for paper prototyping and a guerrilla usability testing checklist. I created this kit because I re-use a lot of tools and templates across all my projects. So I like having them all in one single place. I also use this kit to facilitate workshops and teaching class.

Pixels of the Week – December 6, 2020

Pixels of the Week – December 6, 2020

👉 Your curated weekly Design and Front-End resources: 10 NNgroup heuristics illustrated with posters, a UX tools database, teaching remotely, CSS aspect-ratio, a figma course, behavioral science, UX design interview tips, UX metrics, an accessibility buddy, cute manga font, 2020 state of CSS, and a lot of cool design, sound and video inspiration and tools to make your life easier.

Pixels of the Week – November 29, 2020

Pixels of the Week – November 29, 2020

👉 Your curated weekly Design and Front-End resources: a font with greater legibility, 10 CSS layouts, CSS masonry, fonts for coding, dataviz, foldable objects templates, why the HTML/CSS/JS separation is good, black and white design, accessibility & aria explained, CSS clip-path editor, design strategy, beautiful illustrations, a LGBTQ inclusive survey, a design challenge, some cool music, etc.

Enhancing User Experience With CSS Animations

Enhancing User Experience With CSS Animations

With CSS and JS progress, implementing animations on websites has never been easier. But how do we make sure that our CSS animations and transitions will be meaningful to our users? That they will not be just some annoying “in-your-face” eye candy? That they will not trigger motion sickness and cause accessibility issues to some?
You will find here a transcript with CSS codepen and video examples and LOT of resources to dig further in specific topics. I also published the PDF version of the slides at the end of the article.

Pixels of the Week – November 1, 2020

Pixels of the Week – November 1, 2020

👉 Your curated weekly Design and Front-End resources:  typography CSS vertical rhythm tool, a UI challenge generator, balance and composition in UI layouts, UX glossary, user friendly data tables, improving UI with typography, responsive grid design, free icons, usability of state switch buttons, a CSS escape game, some really cool CSS drawings, mobile flow inspiration, a cat keyboard, some photo inspiration, beautiful botanic and animals illustrations , a naked HTML page, etc.