Collective #314
![C314_WOTW](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_WOTW.jpg?x86293)
Inspirational Website of the Week: Trüff
An interesting and artful web experience with beautiful animated illustrations.
Get inspired![C314_Northwestern](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_Northwestern.jpg?x86293)
Online Master's in Information Design and Strategy
This online, part-time program at Northwestern University is taught by industry leaders and top professors.
Check it out![C314_BreakingOutCSSGrid](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_BreakingOutCSSGrid.jpg?x86293)
Breaking Out With CSS Grid Layout
Tyler Sticka shows a CSS Grid powered technique for breaking out of a fixed width container.
Read it![C314_MomentsHappiness](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_MomentsHappiness.png?x86293)
Moments of Happiness
Moments of Happiness is a super-cute series of WebGL experiments developed using Three.js and GSAP Library. Made by Karim Maaloul.
Check it out![C314_DesigningPurpose](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_DesigningPurpose.jpg?x86293)
Designing Purpose
Read about the motivation and idea behind The Purpose Project in this fascinating article by Minnie Bredouw.
Read it![C314_WebAssembly](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_WebAssembly.png?x86293)
An Abridged Cartoon Introduction To WebAssembly
Lin Clark illustrates what it is about WebAssembly that makes it fast.
Read it![C314_CockroachDB](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_CockroachDB.png?x86293)
CockroachDB 1.0 is Production-Ready
Read all about the release of the first open source, cloud-native SQL database.
Read it![C314_Outline](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_Outline.png?x86293)
Outline
Outline is a free service that makes websites more readable by removing ads, related links, and comments.
Check it out![C314_StackoverflowTrends](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_StackoverflowTrends.png?x86293)
Introducing Stack Overflow Trends
David Robinson introduces the new Stack Overflow Trends tool for tracking interest in programming languages and technologies.
Read it![C314_AspectRatio](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_AspectRatio.jpg?x86293)
Experiments in fixed aspect ratios
Stephanie Liu shows how to maintain embed aspect ratios in a responsive site.
Read it![C314_MaterialComponents](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_MaterialComponents.png?x86293)
Material Components
The open source library of modular and customizable UI components for Android, iOS, and web apps by Google.
Check it out![C314_Rosid](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_Rosid.png?x86293)
Rosid
A Node.js static site generator that transforms your files on-the-fly before serving them to the browser.
Check it out![C314_SpreadShare](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_SpreadShare.png?x86293)
SpreadShare
A place to explore community-curated spreadsheets for startups and professionals.
Check it out![C314_FontStarway](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_FontStarway.jpg?x86293)
Free Font: Starway
Meriton Salihu designed this interesting two-line font.
Get it![C314_TypekitReactStarter](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_TypekitReactStarter.png?x86293)
TypeScript React Starter
A starter template for TypeScript and React with a detailed tutorial on how to use the two together.
Check it out![C314_D3js](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_D3js.jpg?x86293)
The Hitchhiker's Guide to d3.js
A great introduction and road map to d3.js by Ian Johnson.
Check it out![C314_JSFunctions](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_JSFunctions.png?x86293)
The Many Faces of Functions in JavaScript
Leo Balter and Rick Waldron give an illustrative overview of the existing syntactic forms for functions in JavaScript.
Read it![C314_NaturalInterface](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_NaturalInterface.jpg?x86293)
Approaching a Truly Natural Interface
A very nice read on the history and challenges of designing GUIs. By Tyler Waite.
Read it![C314_Hasty](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_Hasty.png?x86293)
Hasty
A code snippet generator for custom WordPress code like shortcodes, custom post types and more.
Check it out![C314_CSSFirstMeaningfulPaint](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_CSSFirstMeaningfulPaint.png?x86293)
CSS and the First Meaningful Paint
An in-depth talk by Patrick Hamann on the current, past, and future best-practices for loading CSS in the browser.
Watch it![C314_Blendid](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_Blendid.png?x86293)
One build tool to rule them all — Blendid!
Dan Tello introduces Blendid (formerly known as Gulp Starter), a stand-alone blend of tasks and build tools poured into Gulp to form a full-featured modern asset pipeline.
Read it![C314_Butternut](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_Butternut.png?x86293)
Butternut
Butternut is a fast JavaScript minifier that works with the latest version of JavaScript (ES6, and beyond). By Rich Harris.
Check it out![C314_InfiniteTubes](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2017/05/C314_InfiniteTubes.jpg?x86293)
Infinite Tubes with Three.js
Louis Hoebregts built some WebGL experiments where the viewer seemingly travels through a textured tunnel. Powered by Three.js and inspired by the effect seen on fornasetti.com.
Check it out