As designers, we often recycle the same fundamental elements when wireframing or mocking up a design. However, by utilizing a library of reusable web UI elements, we can make the design process on each project more efficient, and cut down on research and design time.
This post covers 10 of the best free web UI kits, resources and stencils from around the web to kick-start the early stages of your next project.
If you’re partial to any particular free web UI kits or resources, let us know about them in the comments below.
Each vector element can easily be customized to suit your needs by resizing, coloring and tweaking its appearance, all neatly contained within organized Illustrator panels.
The individual elements in the set include control buttons, info and text boxes, navigation elements, drop-down and collapsible box styles, speech bubbles, search forms and loading elements.
The kit comes in two vector formats, one for Adobe Illustrator and the other in SVG vector format, which can be easily modified. It can also be downloaded in PDF and EPS formats.
Each form element package includes pull-down menus, input fields, radio buttons, check boxes, buttons, text fields and scroll bars, all within an easily editable PSD file.
Having every element editable means you can recreate anything you need that is not included in the file, just by using existing items as your base.
Included within the package are shape objects, which in some cases have been converted into SmartObjects, so they’re completely scalable.
It’s a well-designed, clean collection that provides a good base to use when beginning any type of UI design, wireframe or mockup.
8. UI Library
To install this library, just drag and drop the file named “Wireframe Symbols.ai” into your Adobe Illustrator Symbols directory. Once you are in Illustrator, go to your Symbols Palette and load the library.
Each text field is fully editable, with easily customizable colors. Also included is a “How To” help file with information on how best to use the files.
An OmniGraffle UX template is also available (free), which includes shared layers for basic UX document needs, including title page, wireframes, and storyboards. The UX Form stencil is also an excellent resource for OmniGraffle, which provides different button layouts, a progress indicator, captcha code input field, labels, and more.
Are there any other free UI resources you would recommend? If so, let us know in the comments below.
0 comments to "Best UI Design Tools for Web Developer"