Collective #631
Inspirational Website of the Week: Goliath Entertainment
A really fun website with lots of interesting interactions and effects. Our pick this week.
Get inspiredNorthwestern Online Master’s in Information Design
Build skills to lead communication strategy, translate complex data, and drive user experience.
Learn moreCSS Grid Layout Module Level 3
The new exciting grid draft that includes a Pinterest/Masonry layout option is out.
Check it outBuild a game this November with GitHub Game Off
GitHub's annual hackatron for building games, Game Off, is about to begin.
Read itAnima 4.0: Design and development, united at least
Anima's latest release helps you transform designs into workable, developer-friendly React code.
Check it outNext.js Commerce
The all-in-one starter kit for high-performance e-commerce sites. With a few clicks, Next.js developers can clone, deploy and fully own their own store.
Check it outLayout projection: A method for animating browser layouts at 60fps
In this short (interactive) series of posts, Matt Perry provides an overview of the layout animation problem and some of the solutions attempted to date.
Read itCurve Modifiers in Three.js
Ada Rose Cannon on her first major PR to Three.js, Curve Modifiers.
Read itSelecting Random Posts in Eleventy
If you work with Eleventy, this might be very useful: Raymond Camdon explains how to add links to random pages in Eleventy.
Read itFree Image and Video API – Pexels
Pexel's free API lets you use their stock images and videos on your website, app or project easily.
Check it outTyrus
Tyrus is a free digital toolkit from Airbnb Design that helps freelance illustrators optimize their business, so they have more time to focus on what they love.
Check it outJean Dawson
What a cool camcorder-like website design!
Check it outPrevent layout shifts with CSS grid stacks
A detailed explanation with real examples of a CSS grid technique for preventing layout shifts when a component state changes.
Read itPart of your world: Why we’re proud to build a truly native Mac app
A great article by the Sketch team that highlights the benefits that come with native macOS apps.
Read itVue Data Table
TJ Fogarty explores how to tackle a data table in Vue without relying on third-party solutions.
Read itbuoy – Illustrator and Animator
The portfolio of buoy is full of WebGL goodness. Made by Keita Yamada.
Check it outML Art
A curated showcase of creative machine learning artworks and projects.
Check it outTetris
A great Babylon.js Tetris demo by by Hitesh Sahu.
Check it outHow to Timeout a fetch() Request
Learn how to use setTimeout(), the abort controller, and the fetch() API to make requests with a configurable timeout.
Read itClip-path demo
A recreation of an effect made by Lorenzo Cadamuro on Robin Noguier's website. By Gianmarco Simone.
Check it out“The CSS Universal Selector Is Slow And Should Be Avoided” — Yet Another Lie!
Jason Knight shows why it's a bald faced lie that the "universal selector" is slow.
Read itVanilla ToDo
A case study on viable techniques for vanilla web development.
Check it outReal people from drawings
Too cool to miss: an experiment using #pixel2style2pixel to create real people from drawings. A thread by Nathan Shipley.
Check it outAwesome Demos Roundup #18
A big selection of the best web experiments made in the past weeks.
Check it outParticles Image Animation from Mathis Biabiany's website
A coding session where you'll learn how to implement the particles effect seen on Mathis Biabiany's website.
Watch it