Bi-Weekly Frontend News

Collective #75

Inspirational Website of the Week

Collective75_wotw

Usually we're not big fans of sound effects on websites but HELLOHIKIMORI's website is just out of this world. Very interesting effects happen as the site elements build up in front of you. Dive in and enjoy.

Get inspired

MockUPhone

Collective75_mockupphone

Wrap your app screenshots into a device mockup using this great tool by FileSquare.

Check it out

Animated line drawing in SVG

Collective75_linesvg

Jake Archibald explains how to smoothily animate an SVG line drawing.

Check it out

The "Other" Interface: Atomic Design With Sass

Collective75_atomicdesignsass

An interesting article by Robin Rendle on improving our current best practices of project organization based on the principles of atomic design introduced by Brad Frost.

Read it
Advertisement

Responsive Pricing Table (PSD, HTML, CSS)

Collective75_priceplan

A clean and elegant pricing table over at WeGraphics.net.

Get it

tidyTime.js

Collective75_time

TidyTime.js by Aaron Lumsden takes any regular time and changes it into a more human friendly expression.

Check it out

SimpleSlideView

Collective75_simpleslideview

A great plugin (jQuery or Zepto) for the classic sliding views by Cloud Four.

Check it out

DevTools: Working with CSS Preprocessors

Collective75_preprocessorsdevtools

Learn how to live-edit your preprocessor source files in the Chrome DevTools.

Read it

Skeuocard

Collective75_creditcard

Definitely a great example for using skeuomorphism: Skeuocard by Kenneth Keiter progressively enhances credit card inputs to provide a skeuomorphic interface.

Check it out

Perspective App Screen Mock-Up (PSD)

Collective75_appscreen

A fantastic mobile app screen mockup in perspective by Pixeden.

Get it

Free WordPress Theme: Empo

Collective75_empo

An elegant and responsive WordPress theme by Anariel Design which comes with a detailed documentation and some customization options. Download it from WordPress.org.

Check it out

PSD.rb

Collective75_psdrb

A Ruby library by LayerVault that opens up the PSD format and allows you to easily work with Photoshop documents.

Check it out

Creating a 3D Game With Three.js and WebGL

Collective75_3dpong

In this tutorial Nikhil Suresh shows you how to get into 3D game development with Three.js and WebGL.

Check it out

The classList API

Collective75_classListAPI

Derek Johnson writes about the classList API and shows you what you can do with it.

Read it

Music Player (PSD)

Collective75_musicplayer

A slick music player concept by Atique with a free PSD.

Get it

Free Font: PHANTOM

Collective75_phantom

An elegant uppercase display typeface designed by Frank Hemmekam.

Get it

Sign in form (PSD)

Collective75_signin

A PSD freebie of an elegant sign in form by Faure Benjamin.

Get it

PW Small Icons (ttf)

Collective75_pwicons

A beautiful sketched icon font by Peax Webdesign.

Get it

Free Font: Look Up

Collective75_LookUp

Filiz Sahin did it again: Look Up is a playful and unique font that will give your project a special touch.

Get it

Free Font: Parley

Collective75_parley

Parley is an interesting geometric font by Filipe Rolim.

Get it

WelcomeMat.co

Collective75_welcomemat

Haven't you always wanted to include one of those fancy ASCII drawings into your website's source? Now you can find some great inspiration on WelcomeMat.co created by Zac Halbert.

Check it out