Design better experiences Get started free
InVision Enterprise Learn more
The world's smartest companies use InVision

The world's smartest companies use InVision Enterprise Edition

View all posts

The big list: 40 rock solid design and prototyping resources for mobile, Photoshop, and Sketch

hero

Seeing your ideas come to life quickly is a really rewarding experience. Which is why prototyping can be so much fun.

But Finding the right resources for your prototyping project can be a huge pain. Below is a list of some of our favorite icons, design kits, apps, and resources to put to use as you’re bringing your mobile prototypes, Sketch prototypes, or Photoshop prototypes to life.


FREE Photoshop Design Kits

tethr

TETHR by InVision
8 PSD Files, 100 Templates, and over 500 Components—All FREE. We partnered with the talented folks over at UI8 to create the most beautiful iOS design kit ever.

resources-images_0022_designernaut

Designer-naut UI Kit
A neat UI Kit ready for the best astronaut designers and developers. This kit contains over 40 widgets built with vector shapes only. It’s retina ready and based on 960gs grid with 16 columns. Free for limited time.

resources-images_0021_wirekit

Wire Kit
840 x 8600 pixels of retina-friendly-made-to-measure-scalable goodness presented in two unique styles, each with over 60 of the most common UI elements.

resources-images_0020_photoshop-wireframes

iPhone Wireframe Kit
A handy and colorful low fidelity UI kit, perfect for that project that needs a little more of a designed look, while keeping things simple.


FREE Sketch Design Kits

resources-images_0027_yosemite sketch

Yosemite UI Kit
A comprehensive UI kit for Apple’s upcoming OS—Completely Free!

resources-images_0026_android sketch

Sketch Android UI Kit
If you’re designing for Android, this kit will give you all the Android components you need to support your designs.

resources-images_0025_bootstrap sketch

Bootstrap 3 UI for Sketch
A very helpful and robust UI Kit featuring all the standard components for Twitter Bootstrap 3.


Premium Sketch Design Kits

resources-images_0024_bolt-sketch

Bolt Kit
A super slick and modern-looking kit—Bolt let’s you grab the components you need to put together your ideas quickly and beautifully.

resources-images_0023_flatuisketch

Flat UI Kit for Sketch
Designed to help you kick start your UI design projects, these elements are simple enough for wireframing, and pretty enough for production! This kit contains over 50 unique individual elements for web, mobile, and responsive design.

wireframe-kit-v2

Wireframe Kit V2
175 templates and over 500 UI elements for web, tablet and mobile devices to help speed up your UX workflow. Delivered in .AI vector format. Now for Sketch!


Illustrator Design Kits

resources-images_0019_crowe

Wireframe & UI Kit by C. Rowe
After becoming frustrated with the lack of vision traditional wireframes provided, Christopher Rowe designed a better looking wireframe kit—get it free!

resources-images_0018_awesome

Awesome Kit
Awesome Kit is a free set of 26 Adobe Illustrator wireframe templates and two custom brushes, designed by George Vasyagin. “Awesome UX kit” is totally FREE and comes for iOS7 (iPhone) version only.


iPad Apps


You’re probably not going to create final designs with any of these apps, but they’re great for getting your initial ideas and sketches out quickly, in a digital format.

resources-images_0017_sketch

Adobe Sketch
Sketch, Adobe’s new mobile drawing app, gives you the tools you need to express yourself, plus a connected community of other creatives to inspire you.

resources-images_0015_paper

Paper by FiftyThree
Paper was designed from the ground up for touch and creating on the go. It keeps you in the flow with no fussy buttons, settings or other distractions.

resources-images_0016_ideas

Adobe Ideas
Capture and explore your design ideas on the go using vectors, layers, and color themes in the perfect tablet companion to Illustrator.


FREE Icons

resources-images_0032_noun

The Noun Project
A must have in your toolkit. Chock full of thousands of glyph icons from different artists. Some icons are free and some for a fee.

resources-images_0031_80mini

80 mini icons
A simple, crisp, minimal icon set, perfect for your next project.

resources-images_0030_social

144 Social Icons
Social Brands, 4 shape types, color and monochrome. Each icon is built with Photoshop vector shapes so you can easily edit color and resize it as you need.


Premium Icons

resources-images_0029_streamline

Streamline
Definitely one of the largest, and most robust icon packs available—Streamline won’t leave you hunting for that one icon they forgot to include.

resources-images_0028_symbolicons

Symbolicons- Icon Font
With SS Symbolicons, it’s easy to update size, styling and colors on the fly, and since they’re a font, you don’t have to go hunting through other documents to grab the icon you’re looking for.


Free Photo Resources

resources-images_0014_unsplash

Unsplash
Free (do whatever you want) hi-resolution photos. 10 new photos every 10 days.

resources-images_0013_NOS

New Old Stock
A great collection of vintage photos from the public archives.

resources-images_0012_deathtostock

Death to the stock photo: Free & Premium Options
Great photos for commercial use, blog posts, social accounts, and mockups delivered right to your inbox. Free and Pro options available.

resources-images_0011_public

Public Domain Archive
New 100% Free Stock Photos Every Week. Everything you need for your creative projects, all public domain images.


Even more great photo resources over at @Dustin’s Medium post: Stock Photos that Don’t Suck.


Free Device Mockups

resources-images_0009_invision

3 Free Flat Device Mockups from InVision!
We took the device skins you’ll find used here inside InVision when viewing your mobile prototypes, and offered them up as a free download.

mockuuuups

iPhone 5s Template from Mockuuups
Download for free a beautiful custom templates package of iPhone 5s with adjustable screen & background.

resources-images_0008_iphone hand

iPhone 5s & 5c Mockups
Talk about a great free resource! 8 Different iPhone mockups, ready for your designs.

resources-images_0007_3 free

3 Free Presentation Mock Ups
With these Adobe Photoshop mockup templates you can create realistic presentations in seconds.

resources-images_0006_photorealistic

Photorealistic Macbook Mockups
A diverse set of four macbook mockups built from professional photographs.

resources-images_0005_iphone-ipad

Free iPhone & iPad Mock Ups
This is a set of four high resolution mockups on real photographs. Each mockup contains smart objects that you can use to add your own screenshots. PSD also includes 5 photo filters for the backgrounds.

resources-images_0004_placeit

Placeit.net
Placeit is a free mockup & design comp producer. Give them an image and they’ll process your screenshot or URL and place it within their stages for a beautifully rendered final photo.


PSD Grids

resources-images_0001_iphone5 grid

iPhone 5 Grid
A 10 column grid designed by Eddie Lobanovskiy to keep your iOS designs clean, cohesive, and aligned just right.

resources-images_0003_bootstrap grid

Bootstrap 3 Grid System
A Free PSD Grid directly from the Bootstrap 3 Grid System, available as Free Download. Create your own layout using Photoshop.

resources-images_0002_1000pxgrid

A better Photoshop grid for responsive web design
Elliot Jay Stocks from Typekit took a stab at simplifying responsive grids, by rounding up to 1,000 pixels. Click through for his blog post, or grab the PSD template here.


Free Ideas


Last but not least—It can be tempting to jump right into the design phase when you’ve got a fresh concept in mind, but thinking your project through using the right mental framework can save you tons of time. Here are a few techniques and processes to help facilitate your design planning process.

resources-images_0000_flows

A shorthand for designing UI flows
An oldie but a goodie, Ryan Singer from Basecamp quickly outlines an easy way of fleshing out UI flows that you can start implementing 5 minutes from right now.

Comparisons

Storyboards
Here at InVision, we use low-to-medium fidelity storyboards to walk through flows with the rest of the design team. We’ve found it bridges the gap between the conceptual and the visual, and even let’s you discuss potential UI decisions without spending a lot of time polishing pixels.


Jobs to be done
Check out the above video for a great example of the Jobs to be Done framework. After that, add these articles to your reading list.

Jobs to be done overview

Replacing the user story with the job story

Asking Why is Not Always the Best Strategy


Have something good to add to the list?

Let us know on Twitter at @InVisionApp

Author

Andy Orsow
Designer and product marketer at InVision, resident GIF-ologist and video maker.

Join over 1 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 1 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 1 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 1 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 1 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.