Collective #104

View All

ViziCities * Type Quest * Stackicons * "Scroll-Jacking" in Fullscreen * FontPrep * Grid Style Sheets

Cover design by Emanuel Serbanoiu
Collective 104

Inspirational Website of the Week: LiveAreaLabs


Subtle transitions and thoughtful interactions combined with a smart color and typography choice, make exploring the website of LiveAreaLabs a great experience. Our pick this week.

Get inspired



ViziCities is a 3D city and data visualization platform powered by WebGL. A fantastic project by Robin Hawkes and Peter Smart.

Check it out

Type Quest: Beautiful OpenType Features


Type Quest is designed to help educate graphic designers and web designers understand the power of OpenType in Web fonts while giving insightful information from current professionals in the industry. A project by Tyler Sanguinette.

Check it out

Responsive Design Frameworks: Just Because You Can, Should You?


Jen Kramer dives into Responsive Design Frameworks and explains why despite some criticism they are great base for a responsive website, when used adequately.

Read it



Stackicons use a layered technique for icon fonts that let you color your icons and do more with their style. Read Parker Bennett's article over at CSS-Tricks and find out more.

Read it

One Page Website Wireframes (PSD)


A really useful wireframe set of one-page websites for creating rapid prototypes.

Get it

Creating a geometric star in Illustrator


Polygonal shapes are very much in style these days and Veerle Pieters will teach you how to create a beautiful star shape in Illustrator.

Check it out

"Scroll-Jacking" in Full Screen


Wes Hatch writes about how and why the fullscreen "work" navigator on's homepage was made.

Read it

The Icons: 100 Free Icons (PSD)


Another awesome freebie by GraphicBurger: 100 useful icons made by PixelBazaar.

Get it

FontPrep Web Font Generator


FontPrep is a Web font generator for Mac OSX and it's now open source. It takes your TTF and OTF font files and generates all of the respective font-formats for the web: WOFF, EOT, and SVG.

Get it

How designers can create interactive prototypes with Illustrator


In this tutorial, Tom Germeau shows you how you can quickly create interactive prototypes in the browser without actually writing HTML, using Illustrator.

Read it

Grid Style Sheets: CSS polyfills from the future


GSS re-imagines CSS layout and replaces the browser's layout engine with one that harnesses the Cassowary Constraint Solver, the same algorithm Apple uses to compute native layout. GSS was created by Dan Tocchini.

Check it out

Free Font: Modum


Modum is an elegant and contemporary serif font that comes with two free weights: regular and italic.

Get it

On Creative Direction


An insightful primer by Daniel Mall on creative direction as compared to art direction and design; and what they all mean in a digital context.

Read it

HTML5 Guitar Tuner


An HTML5 guitar tuner by Tom Hoddes. Turn your microphone, play the notes and tune!

Check it out

Office monkey life icons


Live through one day of an office monkey and check out these interesting icons made my Sergey Kondratev. He offers these public domain icons over at The Noun Project for download.

Get it

Live Editing Sass and Less in the Firefox Developer Tools


Firefox 29 developer tools let you now debug your Sass and Less using source maps.

Check it out

Ice Cream Icons (PSD)


A lovely set of ice cream icons over at Blugraphic.

Get it

Would you like to become a Collective sponsor?

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

Would you like to send us some news?

The Collective features the latest news and resources from the web design & web development community. If you have spotted or created something that you'd like see published in the next issue, just submit the resource or article here.