Bi-Weekly Frontend News

Collective #90

Inspirational Website of the Week

Collective90_ps4review

The great PS4 review website has some stunning SVG animations and some cool styles and effects. Our pick this week.

Get inspired

An Introduction To DOM Events

Collective90_domevents

Wilson Page gives a great overview on how DOM events work and how we can make use of them to solve common problems.

Check it out

The Ultimate Flexbox Cheat Sheet

Collective90_flexbox

It's time to get serious with CSS Flexbox and this excellent cheat sheet by Sean Fioritto will help you get started.

Check it out

HTML5 Time Tracker

Collective90_timetracker

A smart HTML5 time tracker web app made by Juani Ruiz Echazú. Define the cycle length and simple add what you were doing after you're done.

Check it out
Advertisement

HTML Imports

Collective90_htmlimports

Eric Bidelman shows how the new HTML Imports, which are part of the Web Components cast, will make it very simple to include HTML documents in other HTML documents.

Check it out

A super simple starting point for 2D JavaScript games

Collective90_2dgames

Seth Vincent shares his work on creating a simple starting point for 2D JavaScript games.

Check it out

Flexible Google-style loader with CSS

Collective90_googleloader

A nice CSS version of the subtle Google apps loader by Lea Verou.

Check it out

CSS Mac Plus

Collective90_macplus

Donovan Hutchinson created this stunning animated CSS 3D version of a Apple Mac Plus.

Check it out

ROBO BOOGIE

Collective90_robo

A really cool competition for kids to create some fancy robot dance moves. It's organized by Code Club, a really great organization with the aim of giving children the chance to learn to code.

Check it out

Introducing the Whiteboard Drum - WebRTC and Web Audio API magic

Collective90_whiteboard

Take a look behind the scenes of Whiteboard Drum by Tatsuya Shinyagaito, an interesting music application that is a great example of what can be achieved using the Web Audio API and getUserMedia().

Check it out

Have a Hairy Movember

Collective90_movember

Let this talking Canvas mustache enchant you for some sensual touches during this year's Movember.

Check it out

Free WordPress Theme: Bearded

Collective90_Bearded

A beautiful and clean WordPress theme by Hermanto Lim from Bonfirelab.

Get it

CSS Text filling with water

Collective90_waterfilling

A great pen by Lucas Bebber with a wavy loading animation for text.

Check it out

Responsive images - end of year report

A must-read by by Bruce Lawson on the current status of responsive images and the problematic of deciding on a sensible solution.

Read it

Sticky Navigation Menus with stickUp

Collective90_stickup

A useful jQuery plugin by Liran Cohen that "sticks" an element to the top of the browser window while scrolling past it, always keeping it in view.

Check it out

Apollo.js

Collective90_apollojs

Apollo is a light-weight, standalone DOM class manipulation API for adding, removing, toggling and testing the existence of classes on an element. Made by Todd Motto.

Check it out

Free Font: Sketchetik Fill Light

Collective90_Font

An interesting hand-drawn font by Ossi Gustafsson. The light variant is for free.

Get it

Free Vector Infographic Kit (EPS)

Collective90_Inforgraphic

On of a total of three sets of vector elements for flat style infographics. Made by Trent Salazar.

Get it

Flat Social Icons (AI + EPS)

Collective90_flatsocial

Roberts Ozolins created these qualitative flat social network icons with exact colors and a clear style.

Get it

Type Scale - A Visual Calculator

Collective90_typescale

A useful visual type scale calculator made by Jeremy Church.

Check it out