Collective #290
Inspirational Website of the Week: Anagram.paris
An interesting dragging effect and a great design. Our pick this week.
Get inspiredDesign Patterns for Humans
A guide to design patterns that explains everything in a simple way.
Read itMoving to HTTPS Guide
A community site to help site owners migrate to HTTPS with a simple tested process for different platforms.
Check it outOn 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 itDeep 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 itSpeed 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 outDIY Web Animations: Promises + rAF + Transitions
Learn how to re-create web animations using Promises, rAF and CSS Transitions.
Check it outOperating System: From 0 to 1
Learn the core concepts on how to write an OS from scratch. By Do Huang Tu.
Read itThe 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 itFree Font: Befindisa Script
A lovely hand-written font with elegant sharp lines designed by Mercurial Roxxane.
Get itGreat 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 outFree Eco Font (AI)
Pavel Storchilov shares his leafy green alphabet vectors perfect for eco designs and logos.
Get itES6 Features
An overview of new ES6 features with evaluable code blocks. The GitHub repo can be found here.
Check it outHow to Build Animated Microinteractions in React
Learn how to build some animated microinteractions with the React framework. By Christian Sepulveda.
Read itA Better Way to Make Buttons in Sketch
Jon Moore shows how to efficiently design button elements in Sketch.
Check it outFree Business Icon Set (AI SVG EPS)
40 free vector icons with a business theme by Diego Naive.
Get itWriting JavaScript with Accessibility in Mind
Some advice on how to improve the accessibility of your JavaScript components. By Manuel Matuzovic.
Read itExclusive Icon Set: Elements From Space To Earth
A set of 30 free icons that celebrate mankind’s urge to explore. Designed by Vexels.
Get itWhat is Atomic Design?
An article that shows how to use Atomic Design to build interface systems. By Christopher Nguyen.
Read itConfetti Jam!
Celebrate and spew some confetti in this fun demo by Eli Fitch.
Check it out