Wireframe Templates

An Adobe Illustrator template for making wireframes.

Table of Contents

Templates Includes

Browsers & Layouts

  • IE 6, 8, and 8 @ 1024x768
  • 960.gs grids, 12 col, 16 col, and 24 col

Form Elements

All form elements include no label, top label, left label, and both enabled and disabled variants.

  • Textbox
  • Combobox/Dropbox
  • Multi-select box
  • Multi-check box
  • Radio button
  • Checkbox
  • Multiline textbox
  • Submit button
  • Error summary

Form Fields

  • Street address form
  • Date picker calendar
  • Social security number
  • Date and Date-range
  • Phone number
  • Fax number

Data Elements

  • Grid view, empty and with sample data, big and small
  • Data pagination
  • Lorem Ipsum sample text

Icons & Graphics

  • Basic icons for error, success, and Error
  • Set of various arrows
  • Calendar icon
  • Expand/collapse icon
  • Default and link cursor
  • Tooltips
  • Image symbol
  • Large arrow to show screen transitions
  • Cutout to show a partial wireframe
  • Scrollbars, both large and small, enabled and disabled

Graphic Styles

Found in Window > Graphic Styles (⇧F5)

  • Grey dotted line
  • White dotted line
  • Textbox styles: default, error, and disabled
  • Thick striped background
  • Error striped background
  • Alert striped background

Character Styles

Found in Window > Type > Character Styles

  • Hyperlink, enabled and disabled
  • Label, enabled and disabled

How to Use

  • Create a new document by double-clicking the *.ait Illustrator Template file
  • Open the Symbols palette (⌘⇧F11 or ⌃⇧F11)
  • Drag the needed symbol into the art board, arrange, repeat

Edit Individual Symbols

You can right-click on individual symbols when they’re on the art board and click Break Link to Symbol. Once you do this, this instance of the symbol will no longer be linked to it’s original symbol.

Edit Global Symbol

Double-click on the symbol in the palette or when on the art board to edit. Once you save your edits, all symbol instances will update. However, if you change the over-all size of the shape, the placement of each symbol instance might change in relation to the size-change.

Download

Download the Illustrator templates (zip, 1.5mb)