Bi-Weekly Frontend News

Collective #103

Inspirational Website of the Week: Weecom Digital Agency

Collective103_websiteoftheweek

Weecom's website has a refreshing color scheme and some creative animations. Our pick this week.

Get inspired

Grid

Collective103_grid

A beautiful and well-made guide to responsive web design and the usage of grids by Adam Kaplan.

Check it out
Advertisement

Placeholdem

Collective103_placeholdem

Jack Rugile created this little JavaScript plugin that animates placeholder carets on inputs and textareas.

Check it out

Dug.js: A JSONP to HTML Script

Collective103_Dugjs

A very useful, light-weight script for pulling JSONP from various APIs and display it using customized markup. Made by Rogie King.

Check it out

Outdated UX patterns and alternatives

Collective103_outdateduxpatterns

A great summery and analysis of the "Outdated UX Patterns" section of North. By Brian Krall.

Read it

Design Lab

Collective103_designlab

Bilal Mechairia's animation explorations will give you some wonderful inspiration.

Check it out

Random User Generator Photoshop extension

Collective103_randomusergenerator

The Random User Generator can now be used in Photoshop with this useful extension.

Get it

New CSS Shapes Syntax

Collective103_cssshapes

Read all about the new syntax for CSS Shapes in this article on the Web Platform Team Blog.

Read it

Creating A Client-Side Shopping Cart

Collective103_shoppingcart

Gabriele Romanato explains how to use session storage on the example of a simple shopping cart in this in-depth tutorial.

Check it out

Free Font: Streetwear

Collective103_streetwear

A bold and stylish retro inspired script typeface designed by Artimasa.

Get it

UI Animation and UX: A Not-So-Secret Friendship

Collective103_uianimation

A nice article about animations with tips on how to use them properly by Val Head on A List Apart.

Read it

pageres

Collective103_pageres

Get screenshots of websites in different resolutions with this little app. It generates 100 screenshots from 10 different websites in just over a minute. Made by Sindre Sorhus.

Check it out

Make a Flippin’ 3D Countdown with CSS & JavaScript

Collective103_countdown

Doug Avery shows how the countdown component from the Gear in Action interactive lookbook works.

Check it out

GitHub goes to school

Collective103_githubeducation

GitHub launches education.github.com, a site dedicated to using GitHub at school with free micro accounts for students and teachers and great educational discounts.

Check it out

Free Font: Mink Type

Collective103_mink

A creative, hand-drawn display typeface by Filiz Sahin.

Get it

HTML5, CSS3, and the Bookmarklet that Shook the Web

Collective103_harlemshake

Read how the fun Harlem Shake bookmarklet was done in this article on Mozilla Hacks.

Check it out

CMS Administration – Profile Details (PSD)

Collective103_profiledetailspsd

A lovely and clean Photoshop design from sm-artists.com.

Get it

Recordit

Collective103_recordit

For Mac users who would like to create screencasts super quickly.

Check it out

Year of the Horse

Collective103_yearofthehorse

Send your happy horse year wishes by creating your own rider and horse on this classy website by Knock.

Check it out