fbpx

Design Resources

I spend all day on the internet, and like to bookmark good resources I find. I try to cull out the dumb stuff and only include links to things I’ve actually used, to make this resource as solid as possible. This list is ever-evolving, so let me know if you want to add something!

+300 Awesome Free Things

Photography:

CameraSim — Play with camera settings in real time to learn what the different settings do. Take a picture with the simulator, and get immediate feedback.

Freelance:

How Much Should I Charge? — Very awesome starter website for freelance designers. Asks you your hourly rate, how much time you’ll spend on the project, and a couple questions to gauge how much you care on it before presenting you with a real number.

Tactile Design Kit — Print out web items to cut and rearrange physically. Great for working with people who don’t code.

Mailjoy — MailChimp for physical mail. Full color direct mail postcard campaign that you can AB test and back up with data.

Freebies:

Psddd — Aggregates downloadable free Photoshop files from users on Dribbble.

Infographics:

Infogr.am — Build infographics within a predetermined template. Good if you’re not a trained designer but need something simple and easy. Allows you to embed their graphics in your own content.

Sprites — Build animated infographics. Pretty flashy and fun, there’s a paid and a free version.

Datawrapper — Simple infographic tool. Not very flashy or trendy, but very professional looking, probably good for news outlets.

Canva — Another infographic tool that also allows you to build Facebook cover photos, Instagram and Twitter posts (sizing is crucial with those). Check out their stream to see previous examples and get inspiration, and their Design School has great information for new designers.

Data Visualization:

7 Most Common Data Vis Mistakes (from TNW News)

Data Visualization Tips from Information is Beautiful (From Journalism.co.uk)

The Quick and Dirty on Data Visualization (from HBR)

Mockups:

80+ from Creativenauts.me — has plenty of digital interfaces, but also fun stuff like cups, stationary, business cards, and posters.

PSD Covers — Free actions to convert almost any flat artwork into a beautiful mockup, all completely free. I could sing about this site from the rooftops!

Placeit.net — Mockups you can make within a browser, no Photoshop required. Prices range from free (tiny image), $8 or $59.

Maps:

Map Stack — Make your own maps with Stamen

Mapbox — I really love this service, honestly much more than Google Maps. It’s easy to use and easy to customize.

(also, another goodie from Mapbox — use their studio to print large format maps for your walls)

Screen Shot 2014-09-26 at 11.45.41 AM (2)

Design Blogs:

Awwwards — Highlights good design and creativity, specifically on the internet.

Typographica — Type reviews, books, commentary. For the true type nerd.

Inspiration:

Hey Nishi — Nishi is on a mission to showcase & celebrate websites that aren’t plagued with business jargon, and talk to you like they’re a human.

Compfight — Search visual inspiration usually in the form of images. Good for reference photos, technical poses.

Designspiration — Robust collection of all kinds of design pieces, from typography to photography.

Baubauhaus — Design, illustration, photography, etc. Updated daily!

FFFFound! — Based on found submissions. A little more random, but that makes it more fun.

Fonts + Typography:

Butterick’s Practical Typography — This experiment in online publishing also doubles as one of the best abbreviated educational tools on typography.

Find a Font — A flowchart to help you identify and locate specific fonts for projects

Typester — Compare screen fonts, great tool for web design.

Lost Type co-op:  Amazing site that serves fonts on a pay-what-you-want model. This means you can put in $0 and get them for free, but I recommend spending some money, since it goes back to the designer who worked on it.

My Fonts — Massive selection of fonts, they have basically everything and a good search function to boot.

BeauCoup’s Font Guide for All Occasions — If you’re on that font guide hype train and want to dig a little deeper, BeauCoup has an excellent round up of information on fonts, how they’re made, and how they exist in other languages (something I honestly think about quite a bit).

Optimizing Text Readability for Web — Seriously, so important. Kerning and letterspacing on the internet!

Beautiful Web Type — If you look at Google Fonts, you’ll quickly realize there are so many and you’ll never be able to look at them all. These guys catalog their favorites.

Colors:

Colourlovers — Thousands of user-submitted color palettes. You can search by keyword or pick a specific color and look for palettes that contain it.

Adobe Kuler — Organize colors by rule, or pull color palettes from photographs. I really love this website, it’s one of my most trusted tools.

Screen Shot 2014-09-26 at 11.45.28 AM (2)

The Daily Color — A daily color digest, complete with palette and the song that inspired it.

Color.Hailpixel — This website is really fun! Move your mouse around the hex code changes, pretty random color picker with fun outcomes

Pltts.me — This website is ColourLovers without the clutter. Just palettes, simple.

Risotto’s Print Simulator – This is sort of color, sort of type, sort of everything. This web app simulates what you print will look like when produced on a Risograph machine. Endlessly fun and educational to play with.

Jobs:

Authentic Jobs — I think this website is for digitally-based designers only

We Work Remotely — Don’t like people? Don’t want to move? Try a remote position.

Smashing Jobs — Hosted by Smashing Magazine, a popular source for creative content

UX Switch — A job board specifically for UX (User Experience) professionals

Coworks — Another site for working creative jobs remotely

D S G N J B S — Jobs for designers, managed by Tom Cavill

Stock Photos:

Stocksy — A paid stock photo website that operates on an artist co-op model. Beautiful and trendy pictures.

Gratisography — Free, and regularly updated high-res stock photos. They’re pretty distinct, so I’d use them sparingly.

Unsplash — Free high-resolution stock photos. They have a great subscription feature, allowing you to get these pictures in your sleep.

Remove.bg – Okay, so you got a stock photo but don’t want to spend time cutting the person out? Try this tool – it’s not perfect, but it’s pretty damn near close.

Social Media:

#Tagboard — Search hashtags on social media

Icons:

The Noun Project — Massive resource of designer-submitted icons. You can use them for free if you attribute, or pay very little money for a license.

X-Icon Editor — Make favicons for websites!

Tutorials:

How to Make a Repeat Pattern (Design*Sponge)

The difference between Fonts and Typefaces (FastCompany)

Using Shades Correctly (TypeKit)

UX Apprentice — Free web course to discover the world of UX design!

How to Make Double Exposure Photographs

Learning Games:

Shape Type — teaches you to make letters using the pen tool

Bezier Method — learn the pen tool in general. I’ve been using Illustrator for years and this taught even me a thing or two!

Kern.Me — learn to kern letters like a pro

Hex Invaders — Learn hex codes (#000000 and #ffffff, for example) by shooting down pixelated opponents

Type Connection — A typographic dating game that teaches you to pair typefaces

Font Memory Game – Learn to identify and memorize typefaces!

Other:

Really Good Emails — A collection of, well, really good email design.

Screen Shot 2014-09-26 at 11.45.56 AM (2)

Graphic Burger — A link to their collection of blank mock-ups for various projects.

Template Hierarchy for WordPress — A good, albeit clunky visualization of WordPress’ inner structure.

RedPen.io — My favorite site for sending quick mockups to clients and around the office. You don’t need to sign in, just click and type.

Screen Sizes — Designing for web? Mobile? What type of operating system or browser? All of those dimensions are here.

Photoshop Etiquette — For some designers, Photoshop is like the wild west, no rules! But if you’re sending a file to someone else to work with, it needs to make sense. Here are some ways to do just that.

Public Speaking Tips—Some notes on strategically using pauses, telling stories, and more.