Collective #396

Please visit Source Site
Inspirational Website of the Week: Mutt Agency
A playful design with lots of creative elements. Our pick this week.
Get inspired

Our Sponsor
Thinking of building your portfolio?
Grab a FREE .design domain to showcase your work. .design reflects what you do as a designer and helps give you better branding.
Get your FREE .design domain

Loading Third-Party JavaScript
Learn how to optimize the loading of third-party scripts to reduce their impact on performance. By Addy Osmani and Athur Evans.
Read it

Bringing Back Skeuomorphic Design
Read about Michael Flarup’s skeuomorphic calendar design and how this could be the starting point of a revival movement.
Read it

The Chameleon from Null Island
An awesome demo with a very reactive chameleon.
Check it out

Good to great UI animation tips
Pablo Stanley gives some practical suggestions to improve your UI micro-interactions.
Read it

With git-sizer you can compute various size metrics for a Git repository and flag those that might cause problems.
Check it out

Aliza Aufrichtig made this project for turning an SVG into coordinates that can then be used for animations.
Check it out

CSS Techniques and Effects for Knockout Text
Learn how to accomplish knockout text with modern CSS properties.
Read it

Loader Concept
A fantastic loader concept by Robin Delaporte.
Check it out

Increase Font Size with CSS Variables
Dronca Raul shows how to use CSS variables and a range input slider for adjusting the font size of a text.
Check it out

Say Hello to Houdini and the CSS Paint API
Read all about the exciting Houdini project and how it gives devs more power over CSS. By Will Boyd.
Read it

Gabrielle Wee created this awesome Windows 95 version of Instagram.
Check it out

Meet Overflow
Learn about the new cross-platform tool that aims to integrate seamlessly with the most popular design tools to allow designers to create beautiful user flows.
Check it out

Midi Controller CSS
If you’re tired of using a keyboard maybe it’s time to switch to a midi controller to physically edit your CSS 😉 By Dimitri Nicolas.
Check it out

Animated Status Indicator
A great status indicator with an animated worm.
Check it out

We Write CSS Like We Did in the 90s, and Yes, It’s Silly
Jens Oliver Meiert believes that we still write CSS the natural way, with no advances in sorting declarations or selectors and no improvements in writing DRY CSS.
Read it

Developing a Creative Upload Interaction with JavaScript and Canvas
Luis Manuel shows how to code a creative file upload effect.
Read it

Free Font: Mash-Up
A very creative display font by Ilyas Yunusov.
Get it

How We Adopted CSS Grid at Scale
Read how Julian Gaviria went all-in with CSS Grid for the redesign of
Read it

It’s Dangerous to Go Stallone. Take Glyphhanger
Read how to use glyphhanger for subsetting webfonts in this article by Zach Leatherman.
Check it out

CSS Only Snake on Planes
Sean Codes created this CSS-only clone of “Snake on Planes” by Chris Gannon.
Check it out

From Our Blog
Creative Audio Visualizers
An exploration of modern, line-style sound visualization powered by p5.js and its p5.sound library.
Check it out
Collective #396 was written by Pedro Botelho and published on Codrops.