Collective #37

View All

Website Inspiration * Useful Tutorials * JAM with Chrome * Simple Wireframing * Cool List Animations * Free Fonts * Free Icons

Collective 37

Inspirational Website of the Week


Claudio Calautti's website is our pick this week. The web designer's and front-end developer's website has some interesting effects and plays with creative shapes and layouts.

Get inspired

JAM with Chrome


JAM with Chrome is an awesome collaborative live music experience in your browser, that makes use of several web technologies and Google products, to allow you and up to three of your friends to jam together in real time. Read the case study by Oskar Eriksson on HTML5Rocks.

Jam now!

Collective37_06 is a minimal wireframing tool with which you can create simple wireframes of websites and mobile apps. And the best thing: it's 100% free.

Try it

How to Recreate the New Ebay Site Scrolling Effect


In this great tutorial, PeHaa will show you how to create the scrolling effect (CSS-only) that you might have spotted on the new Ebay site.

Read it

Writing Fast, Memory-Efficient JavaScript


In this in-depth article, Addy Osmani explains some important aspects of JavaScript engines that will help you understand how to avoid common pitfalls and how to write better code.

Read it

Liffect: Effects for Lists


Explore and generate some useful and interesting animation effects for HTML lists by Adem Ilter.

Check it out

Ratchet: Easy Prototype iPhone Apps


With Ratchet you can easily create prototype iPhone apps with simple HTML, CSS and JS components.

Check it out

Create a TV Screen 404 Page with Clever CSS Tricks


Learn how to design and code up a super-creative 404 page in this tutorial by Chris Spooner.

Read it

Free Font: Razor


Jeff Schreiber designed this delicate and interesting font and you can download it for a tweet or donate.

Get it

bootup.js: Cache and load static files from local storage

With this little script you can cache and load static files from local storage. This makes it easier to manage Javascript and other files for offline use, or just to improve the start up time of your web app.

Check it out

Make a Google Powered Shopping Search Website


Learn how to use the Google's Shopping Search API in this great tutorial by Martin Angelov from Tutorialzine.

Read it

Fotor Beta


If you haven't heard about it already: Fotor is a powerful and easy-to-use online photo editor. It comes with many useful and fun effects and you can also use the iPhone and Android apps for your mobile phone.

Try it

Cedvel: Grid System Design App


Cedvel is a prototype application for designing grid systems. It aims to ease the grid design process and help you explore more alternatives.

Check it out

Metro Social Media Icon Set


The slick and free Metro icon set was designed by Kawsar Ali especially for readers of the Vandelay Design Blog.

Get it

Snippic Online Photobooth


With Snippic you can create beautiful and fun photobooth-like pictures or even a video using your webcam.

Try it

Proto: Rapid Prototyping Toolkit


Proto by Adam Whitcroft helps you create responsive layout concepts by providing a set of predefined CSS classes. All what you need to get going is the proto.scss file and some basic HTML.

Try it

Free Font: Facunda


Facunda is a beautiful condensed display font available for free in five different styles.

Get it

jPanelMenu jQuery Plugin


jPanelMenu is a jQuery plugin that creates a panel-like menu similar to the ones seen in mobile apps like Facebook, as well as in many native iPhone applications.

Check it out

Free Font: DHD Cool Regular


DHD Cool Regular is a cool and pretty much regular uppercase typeface with some irregularities by Konrad Bednarski.

Get it

50 Mini Icons (PSD)


Victor Erixon designed these lovely icons for Premium Pixels and you can download them for free (registration required).

Get it

Toolbox (PSD)


Sanadas Young created this stunning freebie of a toolbox.

Get it

Emoticons & Smilies Icon Set (PNG, PSD)


A free icon set by It includes the popular emoticons and smilies in PNG and PSD format.

Get it

The Facebook Loading Animation in CSS

Fabrice Weinberg will show you how to create the Facebook loading animation using CSS only.

Read it

Minimal Light User Interface Freebie


A beautiful and light user interface kit with a unique character by Diego Monzon.

Get it

Would you like to become a Collective sponsor?

You can sponsor a Collective issue with your own news item. Find out more.

Do you want to share some interesting news here?

The Collective features the latest news and resources from the web design & web development community. If you have spotted something that you'd like to appear in the next issue, just submit it here