Graph Paper

Made for web designers

This graph paper is made for visual designers, interaction designers, and information architects. You'll find styles for wireframing user interfaces, story boarding interaction, and plotting values on a two by two grid. Plus you'll get a basic grid for drafting sitemaps or anything else that might come up.

Made to scan

These pages are great for sketching, but also work well when producing high fidelity drawings. The title bar and grid lines are non-photo blue, so you can easily remove them when scanned. The thick black lines for boxes will show in scans and are 2px wide to match the weight of Pentel Sign Pens.

Download all for free

These PDF documents are formatted for 8.5" x 11" paper in landscape orientation. (A4 versions coming soon!) They are free to use, but may not be distributed for commercial purposes without permission.
Download all of the PDF files.

Wireframe with Notes

This is a wireframe grid divided into 24 columns with gutters between each column. The grid is especially useful to designers who are working within a CSS framework such as Blueprint, which also divides its grid into 24 units, so setting up common divisions is easy (1/4 + 3/4, 1/3 x 3, 1/3 + 2/3, 1/2 x 2, etc.). The column units are numbered along the top of the grid. To the right of the grid is a ruled column for adding labels and annotations.

Download wireframe and notes paper

Wireframe (Landscape)

The grid in this graph paper is identical to the wireframe with notes, but the notes section is removed to make room for a wider page schematic.

Download wireframe paper

Wireframe (Portrait)

The grid in this graph paper is identical to the wireframe with notes, but the notes section is removed to make room for a wider page schematic.

Download wireframe paper

Storyboard

This is a storyboard with 4 cells. Each cell provides a simple grid.

Download storyboard paper

Storyboard with Notes

This is a storyboard with 4 cells. Each cell provides a simple grid. The area beneath each cell is ruled for notes.

Download storyboard paper

Two-by-Two

This is a two by two grid with 4 cells divided by an x-y axis.

Download two-by-two paper

Basic

This is a basic grid box. Use it for concept diagrams, sitemaps, spectrums, tables, and whatever else you might sketch.

Download basic paper

Comments

01 juanjo
06/29/08 @ 09:07

This is excellent, thank you!

02 Cameron Senior
07/03/08 @ 05:27

Great - thanks for this!

03 Anonymous
07/03/08 @ 05:28

Brilliant! These are great!

04 Vocescuola - Graph Paper
07/03/08 @ 08:21

[...] Per chi progetta interfacce utente per siti web o cd-rom, sviluppa contenuti per il web o in generale necessita di una base di partenza per la realizzazione di storyboard potrebbe essere utile l’utilizzo dei paper realizzati da Konigi. [...]

[...] Graph Paper [konigi] EXCERPT: “This graph paper is made for visual designers, interaction designers, and information architects. You’ll find styles for wireframing user interfaces, story boarding interaction, and plotting values on a two by two grid. Plus you’ll get a basic grid for drafting sitemaps or anything else that might come up.” [...]

Advertisement
06 gaston monescu
07/04/08 @ 23:47

reminds me of how thomas pynchon wrote gravitys rainbow on graph paper with a mechanical pencil

[...] Graph Paper | Made for web designers This graph paper is made for visual designers, interaction designers, and information architects. (tags: layout paper pdf print webdesign) [...]

[...] Graph Paper | Konigi Carta millimetrata… si sa mai… (tags: layout webdesign webmaster) [...]

09 Wireframes | Isopixel
07/05/08 @ 13:31

[...] Graph Paper (Plantillas para descargar) - Konigi [...]

10 links for 2008-07-06
07/06/08 @ 00:31

[...] Graph Paper | Konigi (tags: download resource templates ui design pdf) [...]

[...] come i geometri e gli architetti la usano, ecco delle griglie preparate da Konigi e che a mio parere sono molto utili.  Tutto questo per suggerire, a chi non lo [...]

[...] Carta millimetrata per webdesigner [...]

13 4h30 » Graph Paper
07/06/08 @ 23:38

[...] Graph Paper This entry was written by Mkl and posted on 6 juillet 2008 at 19:36 and filed under Url. Bookmark the permalink. Follow any comments here with the RSS feed for this post. Post a comment or leave a trackback: Trackback URL. « Hoist the Colors [...]

14 Chris Johnson
07/07/08 @ 16:02

Great layout tool! Much appreciated!

15 giuseppe
07/07/08 @ 18:05

Very useful.Thansk!

Advertisement

[...] Graph Paper | Konigi (tags: templates design paper webdesign wireframes pdf blueprint) [...]

[...] Grids for printing - pdf - Konigi [...]

18 Napolux
07/08/08 @ 20:57

Really useful, thank you!

[...] free to browse the archives, but what I liked best was these graph paper templates, because hey, you can never stop using pencil and paper in UI [...]

[...] Por si se saltean los comentarios, JDiick ha colaborado con un excelente enlace de grillas gráficas para bocetado. [...]

[...] Graph Paper | Konigi This graph paper is made for visual designers, interaction designers, and information architects. You’ll find styles for wireframing user interfaces, story boarding interaction, and plotting values on a two by two grid. (tags: design paper webdesign wireframes blueprint) Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages. [...]

[...] Graph Paper | Konigi for grids based design (tags: css design paper templates webdesign) [...]

23 A Graphic Designer
07/14/08 @ 05:06

This is great, I'm sure to use it!

24 Pittsburgh News
07/15/08 @ 14:41

Awesome, thanks for the grids!! you rock!

25 denise
07/16/08 @ 12:42

Sehr nützlich - vielen Dank!

Advertisement

[...] Link: Graph Paper [...]

[...] collezione di fogli di carta millimetrata e suddivisa in griglie messa a disposizione sul sito di Konigi. Troverete diversi stili per la creazione delle interfacce utente, per gli storyboard [...]

28 DagoGrenet
07/26/08 @ 21:04

Esto es un superpost"!"!!

[...] Graph Paper | Konigi. Posted in Design | Leave a Comment [...]

[...] Printable Graph Paper: This is probably my favorite resource to date. The paper is made for visual designers, interaction designers, and information architects who do wire framing and design sketch ups. [...]

[...] Graph paper For someone with several online notes repositories and TiddlyWikis, I’m still a [...]

32 Anonymous
08/09/08 @ 15:31

A4 version please!!!!

[...] Graph Paper | Konigi [...]

[...] en anglais, mais très simple à comprendre, le site KONIGI propose aux designers 7 “graphiques” de mise en forme à imprimer (format PDF), afin de [...]

35 Anonymous
08/15/08 @ 21:11

210 mm x 297 mm - old DIN A4 would be nice, too.
Thank you anyway!

[...] en anglais, mais très simple à comprendre, le site KONIGI propose aux designers 7 “graphiques” de mise en forme à imprimer (format PDF), afin de [...]

[...] Graph Paper | Konigi Several graph paper designs suitble for your next storyboard or "on paper" design session. (tags: resources tools layout) SHARETHIS.addEntry({ title: "links for 2008-08-19", url: "http://michaelwender.com/2008/08/19/links-for-2008-08-19/" }); This entry was written by Michael, posted on August 19, 2008 at 2:58 pm, filed under Links. Bookmark the permalink. Follow any comments here with the RSS feed for this post. Post a comment or leave a trackback: Trackback URL. « links for 2008-08-18 [...]

38 Web Design
08/30/08 @ 07:29

I never fail to be amazed by people like you that give so much back to the community. Thank you very much.

Post new comment

The content of this field is kept private and will not be shown publicly.