Bi-Weekly Frontend News

Collective #54

Inspirational Website of the Week

Collective54_site

Handsome is our pick this week. It's an elegantly designed website with a unique portfolio section that has some subtle transitions with shadows and lights.

Get inspired

MagicSuggest

Collective54_magicS

MagicSuggest by Nicolas Bize is an auto-suggest combobox with Bootstrap theme using jQuery.

Check it out

Building A Better Responsive Website

Collective54_betterresponsive

A great read about creating responsive websites and an adjusted workflow by Jeremy Girard.

Read it
Advertisement

Mixing Responsive Design and Mobile Templates

Collective54_rwdmt

Chris Coyier explains how a mixed mobile strategy can work for your site; with insights on the development of Codepen.

Read it

Donuts

Collective54_donuts

Need some clean, subtly animated dashboard gauges? You might like Donuts, a jQuery plugin developed by by Mattia Larentis.

Check it out

Free Font: Technik Mono

Collective54_technikmono

Technik Mono is a complementary monospaced version of Technik typeface. Technik Mono 50 is available for free.

Check it out

The One Pixel Rule

Collective54_onepixelrule

Meng To explains the importance of 1px and what the rule means for app design.

Check it out

Better Navigation Through Proprioception

Collective54_navigation

Some interesting insights on how to apply the concept of proprioception to create better navigation patterns by Cennydd Bowles.

Read it

Corporate Identity Photoshop Mock-up (PSD)

Collective54_cidentity

Bluegraphic released this clean and complete corporate identity mockup set for free.

Check it out

Breaking down Amazon’s mega dropdown

Collective54_amazon

A very interesting look into the magic behind the fast drop-down menu of Amazon by Ben Kamens.

Read it

dsgnjbs - All of the best design jobs in one place

Collective54_jobs

Tom Cavill developed this great site that shows design jobs from the best job sites out there.

Check it out

Free Font: Supergrass

Collective54_supergrass

Luca Ferrario shares this interesting and fun hand-drawn typeface for free.

Get it

Horizontal centering using CSS fit-content value

Collective54_fitcontent

Learn about the experimental fit-content value for widths in CSS and how it could become an interesting problem-solver.

Read it

Handy Icons Vol2 – Free Web Font Kit

Collective54_handyicons

This resource includes 99 hand drawn icons that have been converted to a webfont for easy integration into your projects.

Get it

:focus tooltip

Collective54_tooltipfocus

Some sweet tooltips folding out on focus of the input fields by Victor Pegado.

Check it out

Koken: Creative website publishing

Collective54_koken

Koken is a free system designed for photographers, designers, and creative DIYs to publish independent websites of their work.

Check it out

Map Markers (PSD)

Collective54_mapmarkers

Some really nice map markers by Gaston Figueroa.

Get it

The Foundation for Responsive Design – Flexibility

Collective54_flexibility

Emily Lewis dives into the main foundations of responsive web design and explains how to employ flexibility.

Check it out

Free Outline Icons

Collective54_outlineicons

A very useful set of almost 200 icons that come in handy for a wide variety of web and app design projects.

Get it

Free Font: Corbert

Collective54_corbert

Jonathan Hill designed Corbert, a geometric sans serif typeface influenced by Bauhaus and the early modernist era. The regular and the italic styles are for free.

Check it out

Using SVG

Collective54_usesvg

Learn how to use SVG in a web project from Chris Coyier. With some important facts and useful tips.

Read it

Free Font: Astroman

Collective54_astroman

Astroman is an original and unique display typeface by Darren McArdel.

Check it out

10 Business Card Templates (PSD)

Collective54_businesscards

A great freebie release by Honkiat: 10 clean and modern business card templates.

Check it out

Flat UI Blog (PSD)

Collective54_flatuiblog

Riki Tanone has put together a set of blog widgets with a "flat" design.

Check it out

Make your website printable with CSS

Collective54_printcss

Responsive design isn't just about screen size; it also means adapting to different media – including print. Adrian Roselli shares some techniques in this .net article.

Read it