What’s new for designers, May 2014

The May edition of what’s new for web designers and developers includes new web apps, plugins, frameworks, grid systems, educational resources, icon sets, blogging tools, mobile app tools, and some really great new fonts.

Many of the resources below are free or very low cost, and are sure to be useful to a lot of designers and developers out there.

As always, if we’ve missed something you think should have been included, please let us know in the comments. And if you have an app or other resource you’d like to see included next month, tweet it to @cameron_chapman for consideration.

 

Crumpet

Crumpet is a simple, straightforward framework. It uses placeholder selectors to reduce the size of your HTML, makes it easy to create responsive sites, and gives you the freedom you want.

crumpet

 

Tinypress

Tinypress makes it easy to create and manage a Github page blog. Just login with Github to get started.

tinypress

 

Jeet

Jeet is a grid system with markup that resembles the way a human would describe it. Get rid of the rigid column rules and needlessly nesting elements, and build a grid faster and with less code.

jeet

 

5apps Deploy

Want to build your own client-side HTML5 web apps? 5apps Deploy is a turn-key deployment and hosting service for these apps.

5apps deploy

 

Twproject Gantt

Twproject Gantt is a free online tool for creating Gantt charts, which are great for project management purposes. It includes in-place editing, CSS skinning, and more.

twproject gantt

 

Lavish

Lavish is a color scheme generator for Bootstrap. Just provide an image, customize the resulting scheme, and get the code in CSS or LESS.

lavish

 

Jolly UI Free

Jolly UI Free is a free set of hand-drawn vector UI elements. It comes in both .AI and .PSD formats, as well as EPS and JPG (for previewing). There’s a larger paid UI kit available, too.

jolly ui free

 

Hand Drawn Cooking Icons

Hand Drawn Cooking Icons is a set of 55 vectorized food-related icons that you can use as you please. Included are things like apples, fish, carrots, cooking utensils, and more.

cooking icons

 

Project Parfait

Project Parfait, from Adobe, lets you extract all the information you might need from your PSD comps right in your browser. It currently works in Google Chrome, with support for other browsers on the way.

project parfait

 

Captain Icon

Captain Icon is a set of 350+ free vector icons for mobile and web designs. It includes icons for design, sports, social, weather, and more.

captain icon

 

Project Naptha

Project Naptha lets you highlight, copy, and translate text from any image. Use it to extract text from any image so that you can then edit it or otherwise use it.

naptha

 

Shine.js

Shine.js is a library for creating pretty shadows. It offers dynamic light positions, customizable shadows, works with text or box shadows, and has no library dependencies, among other features.

shine.js

 

Webflow

Webflow lets you create design animations and interactions without writing any code. There’s a 14-day free trial available.

webflow

 

Dot’s Dictionary

Dot’s Dictionary is an illustrated dictionary of graphic design terms. It includes a lot of terms, including “baseline”, “orphan”, “pixel”, and more, and is a great guide for beginners.

dot's dictionary

 

Trianglify

Trianglify is a JavaScript library for creating triangle meshes automatically, which can then be used as CSS backgrounds or SVG images.

trianglify

 

Carousel

Carousel is a new image gallery from Dropbox for both iOS and Android. It can organize every photo and video you take, and keep it all at the tip of your fingers.

carousel

 

TitleNotifier.js

TitleNotifier.js is a lightweight JavaScript library for dynamically showing the number of unread notifications in your page title. It’s dependency-free and easy to use.

titlenotifier

 

fullPage.js

fullPage.js is a plugin for creating fullscreen scrolling websites. Pages can be made with both horizontal and vertical scrolling, and it even works on mobile devices.

fullpage

 

GitBook

GitBook makes it easy to create interactive books using GitHub/Git and Markdown. Just write your books and courses in Markdown, and GitBook converts them into a complete static website.

gitbook

 

The CSS Animations Pocket Guide

The CSS Animations Pocket Guide is now available as a digital edition where you can name your own price. You can download it in PDF, MOBI, and EPUB versions.

css animations pocket guide

 

The Style Guide Guide

The Style Guide Guide is a listing of styleguide generators for Node.JS, Gulp, Grunt, Ruby, and PHP.

style guide guide

 

Sidebar Transitions

Sidebar Transitions is a set of transition effects for sidebars or off-canvas navigation. It includes things like slide-ins, reveals, rotations, and more.

sidebar transitions

 

CSS Vocabulary

CSS Vocabulary is a simple app for learning CSS terms. Just click on the part you want to learn and the name will be highlighted in the sidebar (along with any other instances in the markup).

css vocabulary.jpg

 

Stereomood

While not strictly a design app, Stereomood is a great app if you’re looking for music to fit your mood. Just type in your mood (or select from those featured) and you’ll get a custom playlist. It’s also available as an iOS and Android app.

stereomood

 

Dorm Room Tycoon

Dorm Room Tycoon is a podcast that interviews creators from the business, design, and technology sectors. Recent interviewees have included Zach Klein, the co-founder of Vimeo, and Jason Fried, the founder of 37signals.

dorm room tycoon

 

Laudanum ($10)

Laudanum is a condensed serif typeface perfect for display use and inspired by 19th century posters.

laudanum

 

Foenician 2.0 ($10)

Foenician 2.0 is an update to the original, with some kerning improvements and even some entirely new glyphs. Both weights have a full set of “normal” characters as well as alternates.

foenician

 

Hovel (free)

Hovel is a free, modern display font designed by Sergey Karas.

hovel

 

Dilem Handwritten (free)

Dilem Handwritten, designed by Dilem Akiner, is a handwritten display typeface with slightly condensed letterforms and a certain childish quality.

dilem handwritten

 

Microbrew ($24.50)

Microbrew is a retro display family with 14 styles, plus ornaments, symbols, and banners. Its style falls somewhere between wood type posters and vintage letterpress.

microbrew

 

Darwin ($31.80)

Darwin is an eclectic type family that includes grotesque, geometric, and humanistic styles, with 20 fonts (10 normal and 10 alternates).

darwin

 

Bookeyed Martin (free-$29.95)

Bookeyed Martin is the newest edition to the Bookeyed family, with flashy serifs and ball terminals.

bookeyed martin

 

The End (free-$3+)

The End is a deeply distressed font that’s free for personal use. If you’d like to use it commercially, it requires a minimum $3 donation.

the end

 

Marine ($29.67)

Marine is a geometric sans serif typeface with humanistic strokes. The family comes with more than a dozen fonts, and can work as both a text and display font.

marine

 

Adria Slab ($18)

Adria Slab is a slab serif typeface that comes in seven weights as well as upright italics. It works well in combination with Adria Grotesk.

adria slab
  • Jamie Wade

    Great article! A little typo though under the fullPage.js section, the link to the website says fullPage.sj instead of .js

  • http://www.freewebtrends.iblogger.org/ Ardream – FreeWebTrends

    Nice set of tools !

  • istrt

    Project Naptha – THE Best Thing Happened to Us Designers!

  • Guest

    Man some great tools there.

  • http://www.phoenixstudios.co.uk Greg Donert

    Man some great resources there. Trianglify looks cool!

  • http://www.owoos.com/ Ejaz Karim

    Wonderful list. :) Thanks for sharing. I love fullpage.js