Bi-Weekly Frontend News

Collective #104

Inspirational Website of the Week: LiveAreaLabs

Collective104_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

Collective104_vizicities

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

Collective104_typequest

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?

Collective104_rdf

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

Collective104_stackicons

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
Advertisement

One Page Website Wireframes (PSD)

Collective104_1pagewireframes

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

Get it

Creating a geometric star in Illustrator

Collective104_geometricstar

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

Collective104_scrolljacking

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

Read it

The Icons: 100 Free Icons (PSD)

Collective104_100freeicons

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

Get it

FontPrep Web Font Generator

Collective104_fontprep

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

Collective104_illustratorprototypes

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

Collective104_gss

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

Collective104_modum

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

Get it

On Creative Direction

Collective104_creativedirection

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

Collective104_guitartuner

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

Check it out

Office monkey life icons

Collective104_officemonkey

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

Collective104_lesssass

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

Check it out

Ice Cream Icons (PSD)

Collective104_icecream

A lovely set of ice cream icons over at Blugraphic.

Get it