Collective #290

Inspirational Website of the Week: Anagram.paris
An interesting dragging effect and a great design. Our pick this week.
Get inspired
Design Patterns for Humans
A guide to design patterns that explains everything in a simple way.
Read it
Moving to HTTPS Guide
A community site to help site owners migrate to HTTPS with a simple tested process for different platforms.
Check it out
On Design Tools and Processes
A fantastic article on the limitations of current static design tools and the need for a major shift in the design process.
Read it
Deep dive CSS: font metrics, line-height and vertical-align
An interesting article on the characteristics of font metrics and what it means for aligning text vertically. By Vincent De Oliveira.
Read it
Speed up Service Worker with Navigation Preloads
Jake Archibald explains how to use the new experimental feature, navigation preload, to speed up service workers.
Check it out
DIY Web Animations: Promises + rAF + Transitions
Learn how to re-create web animations using Promises, rAF and CSS Transitions.
Check it out
Operating System: From 0 to 1
Learn the core concepts on how to write an OS from scratch. By Do Huang Tu.
Read it
The Anatomy of a Button in Sketch
Alberto Orsini dissects the button in Sketch and shows how to design the element in a flexible way.
Read it
Free Font: Befindisa Script
A lovely hand-written font with elegant sharp lines designed by Mercurial Roxxane.
Get it
Great Alternatives to Hamburger Menus
What can you use instead of the default mobile navigation pattern? Find out in this great round up by Levi Kovacs.
Check it out
Free Eco Font (AI)
Pavel Storchilov shares his leafy green alphabet vectors perfect for eco designs and logos.
Get it
ES6 Features
An overview of new ES6 features with evaluable code blocks. The GitHub repo can be found here.
Check it out
How to Build Animated Microinteractions in React
Learn how to build some animated microinteractions with the React framework. By Christian Sepulveda.
Read it
A Better Way to Make Buttons in Sketch
Jon Moore shows how to efficiently design button elements in Sketch.
Check it out
Free Business Icon Set (AI SVG EPS)
40 free vector icons with a business theme by Diego Naive.
Get it
Writing JavaScript with Accessibility in Mind
Some advice on how to improve the accessibility of your JavaScript components. By Manuel Matuzovic.
Read it
Exclusive Icon Set: Elements From Space To Earth
A set of 30 free icons that celebrate mankind’s urge to explore. Designed by Vexels.
Get it
What is Atomic Design?
An article that shows how to use Atomic Design to build interface systems. By Christopher Nguyen.
Read it
Confetti Jam!
Celebrate and spew some confetti in this fun demo by Eli Fitch.
Check it out