From our sponsor: Meco is a distraction-free space for reading and discovering newsletters, separate from the inbox.
Welcome to Day 4 of “Frontend Rewind 2023”!
Today we have some more links for you, plus inspiration, and a great discount code for Slides!
🌲 Fun fact: The Christmas tree, a beloved symbol of the holiday season, has its origins in ancient pagan rituals. Long before Christianity, various cultures, including the Egyptians, Romans, and Vikings, celebrated the winter solstice with evergreen trees as a symbol of life’s resilience in the face of winter darkness.
Community Discount: Slides
Slides is a presentation platform built for developers. It features a powerful graphical editor, great tools for live presenting, and advanced functionality like custom CSS & HTML. It’s great for presenting syntax highlighted code and embedding demos via iframes. Learn more about their developer features here. Get 50% off any of their paid plans for the first year with discount code codrops.
Article
Invisible Details of Interaction Design
This article explores the intricacies of interaction design and delves into the science behind the details that make great user experiences, discussing concepts such as kinetic physics, responsive gestures, spatial consistency, fluid morphing, frequency and novelty, and fidgetability.
Tutorial
LittleJS Breakout Tutorial
A great tutorial on how to create a breakout-style game using the LittleJS game engine, covering topics such as creating game objects, implementing collision, controlling player movement, and adding sound effects.
Website Design: Guillaume Azadian
UI Interaction & Animation: Online Orangerie Landing Page Design
Tool
Kodemo
Kodemo went open source this year. It lets you write technical documentation and code tutorials in a format that is intuitive and fun to read. It’s perfect for walking readers through changes to code, images and more.
Freebie
Bricolage Grotesque Variable Font
An expressive variable font that blends iconic French and British designs across three axes: weight, width, and optical size. Made by Mathieu Triay.
Web Experiment
Carousel with drag and wheel
A smooth carousel that works by dragging or using the mouse wheel with a stunning design made by Fabio Ottaviani.
Video: Modern CSS Layout is Awesome!
Thank you for checking by and see you tomorrow! 👋🎄
