The September edition of what’s new for web
designers and developers includes new web apps, CSS tools, software,
email templates, inspiration resources, productivity apps, jQuery
resources, pattern 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
@9ajacruz for consideration.
Gravit
Gravit
is a new open source design tool that’s currently available as a beta
release. It offers the possibilities of a full-scale design suite but in
an app-size package.
CSS Guidelines
CSS Guidelines is a collection of high-level advice for writing scalable and manageable stylesheets, written by Harry Roberts.
Transactional HTML Email Templates
This collection of
Transactional HTML Email Templates
makes it easier to create a number of common transactional emails,
including receipts, support requests, password resets, and more. They
work in desktop, mobile, and web-based email clients.
New Slides editor
Slides has a new editor now available in public beta. It’s a big departure and much more visually appealing than the old editor.
Shrthnd
Shrthnd
is an easy to use CSS shorthand web app. Just input your standard CSS
and Shrthnd will output a much shorter version that’s easier to maintain
and keeps your stylesheets smaller.
GoMoodboard.com
GoMoodboard.com
is a free moodboard creator that lets you create and share moodboards
on anything you like. Start with a blank board or with one of their
templates.
Responsive Web Design Podcast
The
Responsive Web Design Podcast
is co-hosted by Karen McGrane and Ethan Marcotte, and in each episode
they conduct interviews with people who have worked on responsive
designs for some very prominent websites, including Capital One,
Marriott, and others.
The Colors of Motion
The Colors of Motion
breaks down the color palettes of famous films in a frame-by-frame
basis. The UI is incredibly well done and user-friendly, just click on a
film, then find the frame whose color you like, and click on it to see
the actual frame.
Web UI Design Patterns 2014 ebook
This
Web UI Design Patterns 2014 ebook
from Chris Bank and Waleed Zuberi takes a deeper look at sites like
Amazon, Kickstarter, AirBnB, Eventbrite, Mailchimp, and more, with a
look at the patterns they use and why.
UXPorn
UXPorn is a collection of UX inspiration for designers. It includes wireframe templates, UI design patterns, and more.
The Stocks
If you’re looking for royalty free stock photos from outside the standard stock photo sites, then check out
The Stocks, which serves as a single jumping-off point for a variety of stock photo sites.
Grid Lover
Gridlover
is a useful tool for creating a typographic system with modular scale
and vertical rhythm. It gives you adjustable CSS for font sizes, line
heights, and margins, with default output that includes body, p, and
h1-h4.
Aesop’s Fables with Google Fonts
This hand-picked collection of
Aesop’s Fables
is created with hand-picked type from Google Fonts. It’s great
inspiration if you’re trying to figure out which font combination to
use.
CommonMark
CommonMark
is a strongly specified, highly compatible Markdown implementation that
aims to create a uniform standard of the Markdown syntax.
Folllowing
Folllowing
is an easy way to find the Twitter accounts of the Dribbble designers
you’re already following. All you have to do is connect your accounts.
Fibonacci Flexbox Composer
The
Fibonacci Flexbox Composer
makes it easy to create a Flexbox layout and then export the HTML and
CSS. Despite its name, it does not actually use the Fibonacci sequence
in any way.
Plain Pattern
Plain Pattern is an SVG seamless pattern creation app that lets you clone shapes and download pattern images, with more features on the way.
UILang
UILang
is a UI-focused programming language specifically for web designers. It
makes it easy to create popovers, galleries, overlays, tabs, and more.
Pexels
Pexels
is a search engine for free photos from across the web. All of them are
licensed under the Creative Commons Zero license, so they can be
copied, modified, distributed, and performed.
Animsition
Animsition
is a jQuery plugin for adding page transitions on CSS animations. It
offers 18 different animations, including various forms of fade, rotate,
flip, and zoom.
jQuery FocusPoint
jQuery FocusPoint
offers up intelligent cropping of images for flexible containers. It
lets you specify a point of focus for the image to be cropped around,
resulting in better adaptive images.
Userium Usability Checklist
The
Userium Usability Checklist is a great way to catch common usability issues before you proceed to user testing, saving you time and money.
Adorable Avatars
Adorable Avatars is an avatar creation service that creates consistent avatars based on a unique identifier you (or your users) provide.
One Hundred Patterns
One Hundred Patterns is a Tumblr blog and growing collection of patterns, with more than a dozen so far.
Flynn
Flynn
includes components for solving ops, with a low-level resource
framework making up one level and a set of higher-level components that
make it easy to deploy, maintain, and scale apps and databasees.
Bowery
Bowery
gives you a full dev environment in less than 30 seconds, without
expensive staging servers, virtual machines, or local installations.
Just define your app, connect to Bowery, and then share and collaborate.
Mailpile
Mailpile
is a self-hosted webmail client that has user-friendly encryption and
privacy features. It’s fast and responsive, with powerful search and
tagging features.
Aerobatic
Aerobatic
is a cloud hosting service built specifically for front-end devs. It
makes it easy to build feature-rich HTML5 single page apps in the cloud,
with enhanced integration, performance, and security.
Slack
Slack
is an all-in-one communication platform for teams. It integrates with
everything from Dropbox to Google Drive to GitHub, and much more.
92Five App
92Five App
is a self-hosted project management web app that includes all the
features of a basic project management app, including projects, tasks,
timesheets, a calendar, to-dos, reports, user profiles, and more.
DesignCrit.io
DesignCrit.io
is a design feedback app that lets you create and annotate on websites
in just a few clicks, with screenshots taken directly from any
accessible website.
Briefbox
Want some inspiration for practice projects to hone your design chops?
Briefbox offers up practice briefs for designers, complete with inspiration for each.
Dude Hank Pro (Pay what you want)
Dude Hank Pro
is a new addition to the Dude family that comes with three fonts: Hank
Sr., Hank Jr., and Hank III. It also includes a Catchwords font with 30+
catchwords and 14 Manicules.
Rasmus ($10)
Rasmus
comes with four styles (regular, bold, italic, and bold italic), and is
inspired by classic serifs but with contemporary details.
Ballpoint Script ($25)
Ballpoint Script
is an informal script font with single-weight lines and charming
variations. It’s meant to feel like a handwritten note, with a balance
of humanity and clarity.
Hardy ($10)
Hardy is a display typeface that includes circular cutouts replacing each angled intersection.
Show Stopper ($20)
Show Stopper is a display typeface inspired by the sign painting industry, that captures the humor, charm, and humanity of the originals.
Reidfork ($17)
Reidfork
is a vintage style typeface that comes in three styles: regular,
handdrawn, and rough. It also comes with bonus vectors and vintage
textpress.
Say Less ($12)
Say Less is a vintage style custom serif font with a handwritten style.
Olive ($15)
Olive is a handdrawn romantic font. It comes in three styles: thin, regular, and decorations.
Factoria ($129)
Factoria is an industrial-inspired font that’s a geometric, square slab. It comes in eight weights, with corresponding italics.
Timber ($10)
Timber is a handdrawn rustic font with a vintage feel to it.
ConversionConversion EmoticonEmoticon