Browse By

14 Free UI and Web Design Wireframing Kits, Resources and Source Files for WebDesigners

Planning and communication are two key elements in the development of any successful website or application. And that is exactly what the wireframing process offers: a quick and simple method to plan the layout and a cost-effective, time-saving tool to easily communicate your ideas to others.

WEB UI Treasure Chest
This PSD layered file, most of whose files are fully editable, contains more than 100 elements for website design.


Webdesigner kit
This Photoshop download contains registration fields, menus, checkboxes, radio buttons and cursors.


Printable Sketching Paper

A4 and A3 Sketching Grid Paper
This downloadable and printable 960-pixel-wide grid makes it easy to create a three-column (320 pixel), four-column (240 pixel), five-0column (192 pixel) or six-column (160 pixel) grid on a single sheet of paper. You have two sizes to choose from, A4 and A3.


Print and Sketch Wireframe Template


iPhone Application Sketch Template
The grid squares for this sketching paper are equal to 10 pixels. The tick marks indicate the height of the status bar, nav bar, keyboard, tab bar and toolbar. For best results, print on A4 borderless paper.


iPhone Wireframe Templates for Sketching
Two layouts are available, both in PDF and Visio (VSD) formats for quick iPhone mockups.


iPhone App Wireframe Template
Two versions are available, one in landscape and the other in portrait. Each version includes three pages: page 1 has a vertical screen and notes column; page 2 has a horizontal screen and notes column; page 3 has a three-screen layout that is great for drafting designs.


Wireframe Magnets (DIY Kit)

These DIY magnet template are based on the Konigi wireframe stencils and includes three sheets of elements that would be useful for whiteboard prototyping. Simply download and print the PDFs onto magnet sheets, and cut them out.

Form Elements


Tabs, Buttons and Bars


Windows and Dialogs


Further Resources And Some Wireframing Inspiration

A visual playground where designers take popular sites and reconstruct them in a wireframe.


Graffletopia is a huge resource of free stencils for OmniGraffle (Mac-only, sadly). With OmniGraffle, you can quickly create high-quality wireframes, flowcharts and other diagrams.


Mockups To Go
Mockups To Go is a user-contributed collection of ready-to-use UI components and design patterns that were built using Balsamiq Mockups. You can download all of the components and design patterns to use in your mockups.


Wireframes Magazine
Wireframes Magazine is dedicated to all things wireframing and prototyping. It has a huge library of downloadable templates, samples and UI tools, and even a section for inspiration.


I {heart} wireframes
I {heart} wireframes is a great source of wireframing inspiration and resources. And yes, we all love wireframes!


Originally posted 2015-02-28 06:47:09.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.