Collective #32
Inspirational Website of the Week

Typecode is a really nice mix of clean design and surprising effects. The typography is super-clean and the navigation is very interesting.
Get inspiredFree Font: COCO

A free and beautiful fashion typefamily by Hendrick Rolandez.
Get itWordcam: Instagram Image Search by Location

With Worldcam you can easily find the latest Instagram photos from around the world, just add the location and a keyword. The site is built using the APIs from Instagram, Foursquare, Geonames and Geoplugin.
Try itFree Invoice Creator by Paydirt

Make an invoice to save, print, or download as a PDF – totally free, from the folks at Paydirt, the modern time tracking and invoicing app for freelancers and small teams.
Try itPictonic Free Social Icons Font

Pictonic is a great place to create custom icon fonts for your projects. Check out this free social icon font pack with 230 super-useful icons.
Get itCreate a Cool Website with Fancy Scrolling Effects

Chris Spooner will show you how to use a couple of readily available jQuery plugins to quickly put together a cool little single page website, complete with fancy but light-weight scrolling effects.
Read itGoogle Maps UI Controls (PSD)

A set of free Google maps UI controls by Premium Pixels that will come in handy for mocking up mapping in your next design project.
Get itAllofthelights.js

Allofthelights.js is a jQuery plugin by Pierre Vion. It will allow you to "turn off the light" and enjoy your videos.
Try itSimple Social Icons Vol. 1 (PSD)

A great freebie by Pixeden: a set of 22 social icons in vector mask layers in one practical PSD.
Get itNodeCellar: Sample Application with Backbone.js, Twitter Bootstrap, Node.js, Express, and MongoDB

Christophe Coenraets shares the client application that uses the previously built RESTful API. The Node Cellar application allows you to manage (retrieve, create, update, delete) the wines in a wine cellar database. The client application is built with Backbone.js and Twitter Bootstrap.
Check it outPure CSS Mona Lisa

Jay Salvat made a fun experiment: he re-created the Mona Lisa painting using CSS box-shadows with the help of a PHP class that will automatize the "image to box-shadow" process.
Check it outTodo List App in Wordpress

Martin Angelov shows us how to create a really nice AJAX-ed to-do list application on the /todo URL of your WordPress site.
Read itInterface Sketch: Free Sketch Templates

Some really helpful, printable sketch templates for web, mobile and tablet.
Print itBlue UI Kit (PSD)

A pixel-perfect, blue UI kit by Matt Gentile for your next app design project.
Get itA CSS Style Guide
A small, concise style guide for writing CSS that scales by Richard Powell. Learn about the rules, the reasoning and the sources.
Read itTypeScript

TypeScript is a new language developed by Microsoft for application-scale JavaScript development. It is a typed super-set of JavaScript that compiles to plain JavaScript.
Check it outMultiple Columns Layout with CSS3

A tutorial by Thoriq Firdaus on how to create a magazine-like multi-column layout with CSS3.
Read itFree Wood Textures

Get some high-resolution free wood textures for your next design project.
Get itslideControl.js jQuery Plugin

Nik Korablin built this jQuery plugin that allows you to easily make sliders for range inputs.
Get itLazyMeter: Daily To-Do List

A new approach for to-do lists: kiss your overwhelming to-do list goodbye, and start using the only to-do list you’ll finish every day.
Try itFree Font: Moby

A creative typeface by Floodfonts. Moby was created in 2002 by Felix Braden as a corporate and headline font for the Cologne based design bureau Glashaus.
Get itFlowplayer Version 5

Flowplayer has released a brand new version: Version 5.0.0 is raw HTML5 and CSS3, and Flash only simulates the native VIDEO tag. Designed for modern sites where speed and user experience matters.
Get itCSS Image Shapes

Some interesting experiments with shapes for images in CSS by Ana Tudor.
Check it out