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 inspiredViziCities

ViziCities is a 3D city and data visualization platform powered by WebGL. A fantastic project by Robin Hawkes and Peter Smart.
Check it outType 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 outResponsive 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 itStackicons

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 itOne Page Website Wireframes (PSD)

A really useful wireframe set of one-page websites for creating rapid prototypes.
Get itCreating 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 Hugeinc.com's homepage was made.
Read itThe Icons: 100 Free Icons (PSD)

Another awesome freebie by GraphicBurger: 100 useful icons made by PixelBazaar.
Get itFontPrep 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 itHow 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 itGrid 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 outFree Font: Modum

Modum is an elegant and contemporary serif font that comes with two free weights: regular and italic.
Get itOn 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 itHTML5 Guitar Tuner

An HTML5 guitar tuner by Tom Hoddes. Turn your microphone, play the notes and tune!
Check it outOffice 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 itLive 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 outIce Cream Icons (PSD)

A lovely set of ice cream icons over at Blugraphic.
Get it