Bi-Weekly Frontend News

Collective #85

Inspirational Website of the Week

Collective85_mario

The Museum of Mario is a fantastic interactive experience made with modern web technologies. Out pick this week.

Get inspired

Gone In 60fps – Making A Site Jank-Free

Collective85_gonein60fps

Learn how to use Chrome DevTools for performance diagnosis and fixing rendering issues from this video by Addy Osmani from the SmashingConf 2013.

Check it out

Development Is Design

Brad Frost shares his thoughts on why front-end development is not something detached from the design process and how HTML and CSS development actually is design.

Read it
Advertisement

Creating geometric patterns in Illustrator

Collective85_illustratorPatterns

Learn how to create stylish geometric patterns in Illustrator from this tutorial by Veerle Pieters.

Check it out

Free Font: Rose

Collective85_rose

Rose is a beautiful and romantic typeface by Kadu Supanik.

Get it

Lightening Your Responsive Website Design With RESS

Learn how to use RESS (responsive design with server-side components) for creating high-performance mobile websites in this article by Ronan Cremin over at Smashing Magazine.

Read it

Free Font: Plethora 1984

Collective85_plethora

A unique swirly uppercase font by ONO Creates.

Get it

So We Wanted To Build A File Uploader... (A Case Study)

Collective85_fileuploader

Konstantin Lebedev gives some fantastic insights on building a file uploader.

Read it

Prioritize visible content

Collective85_prioritizevisiblecontent

FeedTheBot is great resource for understanding and applying the Google webmaster guidelines by Patrick Sexton. This part is about prioritizing visible or "above-the-fold" content.

Read it

Touch Type Game

Collective85_touchtype

An addictive game where you need to type fast to reach the next level.

Check it out

JavaScript remake of MacPaint

Collective85_cloudpaint

Cloudpaint is a remake of the vintage MacPaint done in JavaScript made by Martin Braun.

Check it out

Responsive Webfont Icons

Collective85_responsiveWebfont

Understand the benefits of Webfont icons and how to use them in you project in this tutorial by Jason Cranford Teague.

Check it out

Building Web Apps With Yeoman And Polymer - Scaffold your webapps with modern tooling

Collective85_polymer

Addy Osmani shows you how to use Yeoman, a workflow of tools for web apps to streamline creating apps using Polymer, a library of polyfills and sugar for developing apps using Web Components.

Check it out

fleep.io

Collective85_fleep.io

A promising looking new app for group chats with some interesting features.

Check it out

Zoomquilt

Collective85_zoomquilt

Zoomquilt is a fantastic project that will zoom you through some wonderful artwork.

Check it out

Case Study: Redesigning Commit for iOS 7

Collective85_casestudyios7

An insightful case study on the redesign of an iPhone app by Nathan Barry.

Read it

iOS 7 Alternate Color Kits (PSD)

Collective85_ios7color

A nice freebie containing all the essential iOS 7 UI elements in 5 different color themes by Tony Thomas for MediaLoot.

Get it

iOS7 style UI kit (PSD)

Collective85_iosuikit

A nice iOS 7 style UI kit composition including some free resources.

Get it

Free programming books

Collective85_freeprogrammingbooks

A fantastic collection of free programming books for many languages.

Check it out

Free Font: Anson

Collective85_anson

A clear and elegant typeface made by Mikko Nuuttila.

Get it

Inspecting :before/:after content in Chrome DevTools

Collective85_beforeaftercontent

Finally you can inspect :before and :after pseudo elements with Chrome DevTools (Canary). Check out this video by Eric Bidelman to see how.

Watch it

What does designing in the browser mean?

Collective85_designbrowser

Brian Krall explains what "designing in the browser" means and how the process behind it looks.

Read it

Free icons set: Adore

Collective85_adore

If you need a break from flat icon designs then Jackie Tran's creation is the right thing for you: a free set of pixel perfect and beautiful icons.

Get it