November 30, 2023   

View in browser   Send to a friend

Studio Claus Due

ATIO Studio

Værsågod

This content is sponsored via BuySellAds

Integrate an ESP8266 Microcontroller with a Web Database

🌌 Evolving the infinite canvas

Amelia Wattenberger is exploring the potential of infinite canvases in the digital realm by integrating spatial strengths from the physical world and proposing enhancements like hardcoded behaviors and flexible interfaces.

💨 Thoughts on Framework Churn

Navigating the challenges of framework churn, Cory LaViska reflects on the trade-offs of using frameworks, shares a personal experience with Vue, critiques the proliferation of metaframeworks, and advises developers to tread lightly by making key components of their apps more portable for future changes.

🧮 Web Components Eliminate JavaScript Framework Lock-in

Building a todo app using web components, this article explores the use of different JavaScript frameworks (React, Solid, Svelte) together, demonstrating how web components can decouple them and discussing their benefits in maintaining flexibility within an application.

🌀 CSS Tip: Inverted :hover effect

A fresh CSS tip by Jhey where he shows how to create an inverted :hover effect with mix-blend-mode, scoped custom properties, and a touch of JavaScript for moving the spot, along with bouncy transitions using linear() for a sleek UI enhancement.

🤯 Weird HTML Hacks

Tedium's one-year anniversary explores ten HTML hacks that navigated the challenges of web development, from the Netscape Navigator 4.0 @import hack to Google Chrome Frame addressing compatibility issues with Internet Explorer 6.

🧠 Psychology of Speed: A Guide to Perceived Performance

This article by Karolina Szczur explores the challenges of measuring and improving perceived performance in websites and apps, delving into the subjective nature of human perception, principles of time perception, and providing actionable advice on enhancing user experience through smart communication, engagement strategies, avoiding sudden page movements, and preventing intensive processing.

🌐 Behind the scenes of creating a new Web Accessibility Annotation Kit

Jan Maarten from the CVS Health Inclusive Design team shares the development and success of their Web Accessibility Annotation Kit on Figma, highlighting the challenges faced, principles applied, and the positive outcomes achieved in scaling accessibility across the enterprise.

💔 Designer layoff stories

Matej Letin shares tech industry horror stories with firsthand accounts of layoffs, retaliation, and targeted eliminations, shedding light on the challenges faced by designers, with insights on preparing for job uncertainties.

🔮 Projection

From ancient cave drawings to modern computer graphics, this bi-lingual article by Kenichi Yoneda explores the fundamental concept of projection, a method used to transform 3D objects into 2D representations in various fields, including mathematics, art, and cartography.

🎙️ WebGPU and Browser Ideologies

In the latest episode of "Off The Main Thread," Surma discusses the GPU in WebGPU and its impact on accessible programming. Meanwhile, Jake Archibald delves into the varying standards and priorities of web browsers.

🤖 Neural Network Visualizer

A cool project that visualizes how a neural network learns through deep learning in real time.

🔵 Holographic Material for Three.js

Anderson Mancini has just released his new Holographic Material for Three.js/R3F! It’s easy to use and comes well documented.

📝 GitHub Profile Readme

Terkel Gjervig created a fully responsive website within an SVG for his GitHub profile. It’s loaded as an image, using HTML inside markdown inside a readme.md. It’s not only interactive and supports light/dark mode, but it also includes a fallback for Firefox.

🍔 No-JS hamburger menu w/the popover API

Una Kravets shows how to use the popover API to create a script-less hamburger menu.

🏠 Writing Documentation for Your House

Luke Hsiao provides a detailed guide on creating technical documentation for a house, including motivation, recommended frameworks, implementation details, directory structure, Mkdocs configuration, and more.

An Introduction to Shaders in GameMaker

The Unbearable Weight of Massive JavaScript

10 JavaScript changes you missed in 2023

Animation Spotlight: Landing Page for Conceptual Medical AI Toothbrush

Zajno's crew impresses with their storytelling approach to introduce a smart toothbrush. The scroll-based animation showcases the 3D model's details, with content animations paying great attention to detail.

Little Bakery by Ricardo Oliva Alonso

Sweater Configurator using Three.js by Xavier (Jack)

CSS 3D Cylinder Layout by hiro:processinger

Skateboard configurator

Daniel Baramo coded this cool skateboard configurator with Three.js based on a Dribbble shot by Sacha Jerrems. You can find the code here.

3D Glass Portal Card Effect with React Three Fiber and Gaussian Splatting

Explore the creation of a 3D glass portal with React Three Fiber, with optimized rendering using Gaussian Splatting and integrating real-world objects.