When starting a new web design project, it’s always a good idea to begin with a wireframe. The purpose of a wireframe is to communicate the layout of a page without getting caught up in color and design elements. Wireframes can be a big time saver as they help all parties involved come to an agreement on placement of major page elements such as headers, content areas, navigation menus, and footers. The key is to get the layout nailed down so major layout changes won’t take place once detailed design elements are in place. To help you in this, we’ve gathered 10 Free UI Wireframe Kits that will make your life easier.
Over 70 templates and 300 UI elements for web, tablet and mobile devices to help speed up your UX workflow. Delivered in .AI vector format.
A bunch of Photoshop shape layers to make wireframing your next iPhone app just a little easier.
Webpage Wireframe Stencil
Our webpage wireframe stencil kit is comprised of all the vector wireframing elements you might need to create your website wireframe or UI wireframe.
Mini Wireframing Kit
The kit includes: A four-character pixel font; A PSD template you can use for your own mini wireframes; A readme file with some notes.
Free Photoshop Wireframe Kit
Rafal Tomal shares with us a very simple wireframe kit he created a couple of years ago and updated it many times since then. Here is a quick preview of what this wireframe kit includes: Notes; Images & video; Form fields; Headings, paragraphs and bullet lists; Navigations; Ad banners; Common website elements like: search box, email sign up form, etc.
iPad Sketch Elements AI
This collection of common iPad elements in a sketch – like style allows us to easily and quickly mock up flows of custom wireframe screens.
The Ultimate Wireframe UI Kit
If you like to wireframe and mock-up your designs in Photoshop, or refine your hand-sketched drawings on screen before showing to clients, then this kit will be ideal for you.
Sqetch, an Illustrator Wireframe Toolkit
Sqetch is a little Illustrator-toolkit I (Dirk Weber) built over time, consisting of several templates and elements: Browser; iPad upright; iPad landscape; Smartphone; GUI-Elements; Form-Elements.
Wireframe / Blueprint Kit
How To Wireframe An iPhone App In Sketch
Sketch is the perfect wireframing tool for designers obsessed with pixel perfection.
I prefer InDesign. Drag, drop, do!
I’m loving Squetch, can’t believe they are giving it away for free.
Thanks! Appreciate the hard work and effort to make us all look so good 🙂
Officially glad I’ve signed up for your newsletter. Been on the hunt for some good Wireframe kits for a while, but haven’t been to happy with what I’ve found. These look promising!
Very resourceful information !!!
Just what I have been looking for, thanks for sharing.
I have used wireframe from pixaden. It is an amazing resource, thanks for pointing it out. Cheers.
I just do not understand that ninjamock.com is not on this list.:) I have tried many tools but for me Ninjamock is best. It is fast, vector based, full HTML5, online in coud, has cool collaboration functions and superb comment funcionality.
It is kind of super cool tool, and usability is top.
Just my opinion.
Balsamiq was the first tool I fell in love with but in the end I found its UI Control library to be too limited.
The next tool I fell in love with is PowerWireframe from http://www.power-story.com which is a simple plugin for PowerPoint that provides a library of I think over 700 UI Controls. But what I really like is that I can create my own UI Controls and share them within my team. I frankly prefer the fact that it is based on PowerPoint because my clients are not afraid of powerpoint so they seem to get more involved in the reviews, adding comments etc.
I don’t like the tools out there that try to make a working interactive website as I have found them to be too involved and thus take away from my creative and iterative time. In some rare cases where I feel an actual working prototype is worth the effort, I have found it better to use the development stack that will be used for that project so the prototype work can be reused in the actual project.f
Thank you for sharing. Good collection of resources.