Collective #420

Inspirational Website of the Week: Studio Regale
A very different kind of web experience with lots of interesting goodies. Our pick this week.
Get inspired
How far will $10.99 take you?
Find out with Udemy's best of the best online courses in programming, design or app dev. Take top-rated courses from our master instructors, now at a special discount.
Pick your next course today
UTC is Enough for Everyone, Right?
A brilliant write-up on time for programmers by Zach Holman.
Read it
From Beautiful Maps to Actionable Insights: Introducing kepler.gl, Uber's Open Source Geospatial Toolbox
Shan He from Uber Engineering introduces kepler.gl for creating beautiful maps.
Check it out
Sculpting Software Animation
Pasquale D'Silva's interesting guide to designing animations.
Read it
Proppy
ProppyJS is a small JavaScript library for composing props (objects that components receive to render themselves) which can then be used in a components-based UI framework like React or Vue.js.
Check it out
Critters
A Webpack plugin to inline your critical CSS and lazy-load the rest.
Check it out
Whimsical Wireframes
Whimsical includes a rich library of configurable elements for fast mockup creation with collaboration in real-time.
Check it out
Goat
A private URL shortener just for your team.
Check it out
Why is Front-End Development So Unstable?
Jimmy Breck-McKye analyses why front-end technology changes so quickly.
Read it
Jeeliz Face Filter
A face detection and tracking library in JavaScript based on WebGL deep learning.
Check it out
Pawtastic UI Kit for Adobe XD
A beautiful UI Kit to get you started with Adobe XD.
Get it
Building a responsive image
A step-by-step guide for creating a responsive logo by Nils Binder.
Read it
Free Font: Bedebah
A unique looking display typeface designed by Holis Majid.
Get it
Solving Life's Problems with CSS
A great article where Diana Smith shares a nifty CSS technique she used for creating Francine.
Read it
Scantron Answer Sheet
A realistic looking Scantron answer sheet replication powered by CSS grid by Jon Kantner.
Check it out
Prerender-loader
Pre-rendering describes the process of rendering a client-side application at build time, producing useful static HTML that can be sent to the browser instead of an empty bootstrapping page.
Check it out
Buttons falling apart
A playful shattering button demo by Mikael Ainalem.
Check it out
code.xyz
An embeddable development environment for easily building APIs, webhooks, and workflow automation tasks that run atop StdLib infrastructure. Read more about it here.
Check it out
Deno
A secure TypeScript runtime on V8 that supports TypeScript 2.8 out of the box. By Ryan Dahl.
Check it out
Grid System Library
KK UI Store's library of grid systems for iOS, Android and Bootstrap.
Check it out
Bolsters Design Project
Some wonderful and inspiring UI design work by Tai Chen.
Check it out
36 Days of Type Video
In case you missed it: Ben Huynh's amazing compilation of this year's creative type challenge.
Watch it