 |
|
Happy new year 🎊 |
Reflecting on the past year, AI has played a prominent role, both overshadowing and empowering, while also leaving many feeling perplexed.
I recently came across an intriguing video by After School (find it below in the Video Vault section), featuring Stephen Fry reading a letter by Nick Cave. The video sheds light on one of the darker aspects of AI-generated art.
Although, I believe, AI can efficiently help us with mundane tasks (like super boring coding tasks), defining what is mundane varies from person to person. It raises thought-provoking questions about our perceptions of creativity, work and learning.
I will leave you with this quote by Paulo Coelho (taken from one of comments on the video, it really is a great fit):
"The reward of our work is not what we get, but what we become."
Happy becoming! |
|
|
 |
|
María Vargas demonstrates her craft with finesse in her latest portfolio design. Brimming with innovation and distinctiveness, it features carefully chosen typography and delightful effects, making it our inspirational choice for the week! |
|
|
|
| | If you're a tech-savvy side hustler looking for a cool branding kit, try Looka's AI-powered platform. It helps design a logo and brand that you and your audience will really love. (sponsored)
Create a brand in minutes 👉 |
|
|
|
|
|
|
|
|
|
|
| Combine Astro, htmx and Alpine.js to create modern web applications sending HTML over the wire, replacing the SPA JS-heavy approach with a much simpler set of mental models and workflows. By Flavio Copes. |
|
|
|
|
|
|
|
|
|
| Mandy Michael has revamped this fantastic website, showcasing her passion for and experimentation with variable fonts. The site features a blend of demos, articles, font lists, and occasional highlights of special fonts or font foundries. |
|
|
|
|
|
|
|
|
|
| Generate moodboards from simple inputs with this tool created by Juan Ignacio Rios. |
|
|
|
|
|
|
|
|
|
| Rajesh Rajput fine-tuned every character for enhanced design in this new version, expanded language support, and improved diacritic marks. Plus it got two new weights in this update. |
|
|
|
|
|
|
|
|
|
| A design system and UI kit for Figma suitable for both beginners and experienced designers. It's a free resource offering monthly updates with new UI components, patterns, and layouts. Made by design sensei Orman Clark. |
|
|
|
|
|
|
|
|
|
| Explore Addy Osmani's new book on Developer Experience (DX), delving into its essence and the crucial relationship between DX and UX. Packed with visuals, examples, and insights from Google's DX experiences. |
|
|
|
|
|
|
|
|
|
| Maggie Appleton discusses the challenge of creating a sense of shared, synchronous space on the web, exploring the limitations of current online interactions, proposing ideas like multiplayer cursors, spatial audio, and annotations to enhance ambient co-presence and create a more immersive digital experience. |
|
|
|
|
|
|
|
|
|
| Nolan Lawson writes about the role of shadow DOM in web components, emphasizing its goal of encapsulation to prevent styling and functionality conflicts between third-party components and their consumers, explores the trade-offs, and suggests a potential solution involving exposing the internal structure of components for greater customizability. |
|
|
|
|
|
|
|
|
|
| Noam Rosenthal created this little library that helps with common things people do with CSS view transitions like generate view-transition-names based on selectors, transition between list & details, and more. |
|
|
|
|
|
|
|
|
|
| Amit Patel, the creator behind the Red Blob Games websites, shares a practical tutorial on incorporating draggable elements for interactive pages. His guide covers coding techniques to accommodate both mouse and touch inputs, with a specific emphasis on addressing complexities like multiple buttons, touch events, and pointer events. |
|
|
|
|
|
|
|
|
|
| A Three.js update that brings significant enhancements to post-processing capabilities. Additionally, two examples have been updated to now offer full web browser support, thanks to the improved WebGL fallback. |
|
|
|
|
|
|
|
|
|
| In this tutorial you’ll learn how to build a scroll-based rotating menu in React. |
|
|
|
|
|
|
|
|
|
| Antirez discusses his experiences using Large Language Models (LLMs), like ChatGPT, to accelerate their coding process by seeking assistance in writing code, solving programming problems, and handling data interpretation, highlighting the efficiency gains in certain scenarios while acknowledging the limitations and the need for discernment in utilizing LLMs effectively. |
|
|
|
|
|
|
|
|
|
|
Video Vault |
|
|
|
|
Animation Spotlight |  | Apertures by Ali Zafar Iqbal |
|
|
|
|
|
|
|
|
|
|
Demo Corner |
| | A Three.js demo by Adrama welcoming the year of dragon. |
|
|
|
|
|
|
|
|
|
| | Three.js FBO particles demo made by MisterPrada. Find the code here. |
|
|
|
|
|
|
|
|
|
| | The Ebenezer launched this Three.js mini project inspired by the anime "Suzume no Tojimari". |
|
|
|
|
|
|
|
|
|
|
From our blog |
| | Get inspired by the latest website designs we’ve gathered in the closing weeks of 2023. |
|
|
|
|
|
|
|
|
|
| | We've made some fun shirt designs! Show your support and wear a stylish message. Enjoy an exclusive 20% discount with code CODROPSTRIBE20 |
|
|
|
|
|
|
|
|
|
|
❓Did you know that… |
…a demoparty is a gathering of demosceners and programming enthusiasts? During these events, participants engage in competitions, or compos, showcasing demos—short audio-visual presentations of computer art, along with digital art and music. These non-stop weekend affairs provide ample time for socializing among like-minded individuals. Today, the oldest ATARI demo party is starting in Poland! |
|
|
|
|
|
And that’s all! Thank you for reading the Collective! If you have something you would like us to feature in the next edition, simply reply to this email! |
|
Codrops is proudly sponsored by KeyCDN, the high performance content delivery network that has been built for the future. |
|
|
|
