Collective #237

Inspirational Website of the Week: Apollo 11
A beautiful project with a really great design and amazing details. Our pick this week.
Get inspired
Apply to Top Tech Companies Simultaneously Using Hired
On Hired, companies compete for the chance to interview you. Get 1:1 support for your job search plus upfront compensation details.
Check it out
Scrollanim
Scrollanim is JavaScript library for creating CSS powered scroll animations.
Check it out
Animated stacked bar charts with D3.js
Massimiliano Pesente shows how he created some D3 powered animated bar charts for fatturaconbilly.it.
Read it
A Beginner's Guide To Progressive Web Apps
A great hands-on tutorial by Kevin Farrugia that will teach you how to create progressive web apps.
Read it
Smooth as Butter: Achieving 60 FPS Animations with CSS3
José Rosário shows some great tips on how to achieve super smooth animations.
Check it out
Olympic Bodies: Can You Guess Their Sport?
An interactive quiz by the New York Times with some interesting animations.
Check it out
gping.io
Monitor your vehicle from a web browser with this great project.
Check it out
I hack time.
Quincy Larson from Free Code Camp shares some really great tips on how to manage time better.
Check it out
Free Font: Buffalo Script
A lovely hand-drawn script font designed by Hustle Supply Co. for Pixel Surplus.
Get it
Little Browser
An interesting experimental web browser/art project and 3D game engine hybrid made for Framed.
Check it out
Fantasy Map Generator
An awesome script for generating great looking fantasy maps. By Martin O'Leary.
Check it out
Olympic Rings
Animated Olympic rings demo by Steve Gardner.
Check it out
Return true to win
How well do you know truthy values in JavaScript. Test yourself with this fun project.
Check it out
Mobile App Revenue Calculator
Figure out how much your app will make with this handy calculator.
Check it out
Reverse Engineering the InVision Interface
Jose Bento shows how educational it is to understand someone else's design by recreating it.
Check it out
Mobile Push Notifications API (Beta)
A unified API to build cross-platform apps and send programmable Push Notifications to iOS and Android devices.
Check it out
Zooming Background Images
Dylan Winn-Brown shows how to create a zooming background effect with CSS.
Check it out
Developing a WordPress Theme from Scratch (Part 3)
Another great part of Tania Rascia's WordPress tutorials; this time it's all about custom posts, custom fields and meta boxes.
Read it
Typr.js
Typr.js is a Javascript parser and utility for working with fonts (TTF, OTF). Made by Photopea.
Check it out
How to use CSS and SVG clipping and masking techniques
Some helpful tips by Abbey Fitzgerald on how to use clipping and masking.
Check it out