Уеб уроци и ресурси по HTML,
CSS, CSS3, JavaScript и други

Обичаш ли да скицираш идеите си преди да преминеш към изпълнението им? В повечето случаи, бързото нахвърляне върху обикновен лист хартия ще ти помогне да придобиеш по-добра представа за възможностите на самата идея. Предварителното скициране на уеб сайт върху хартия е доста популярен метод, който е лесен за изпълнение, евтин и не отнема много време.

В тази колекция ще намериш повече от 15 безплатни, готови за принтиране шаблона, които можеш да използваш за планиране на твоя следващ уеб сайт.

ZURB Responsive Sketches

Тук ще намериш голямо разнообразие от шаблони събрани в един общ пакет. Тъй като все повече хора използват телефона си за достъп до интернет, трябва да започнеш да мислиш как да им предложиш добро изживяване, независимо от устройството, което имат. Точно тук се вписват шаблоните предоставени от ZURB. Те ще ти помогнат да скицираш т.нар. responsive уеб сайт в различните му състояния.

Линк към сайта

Sneakpeekit Wireframe Sketch Sheets

Колекция от разнообразни шаблони подходящи за планиране на всякакъв тип уеб сайт - мобилен, таблетен или традиционен с фиксирани размери. Шаблоните са с различни размери и са подходящи както за дизайнери, така и за разработчици.

Линк към сайта

Paper Browser

В този сайт ще откриеш 2 различни шаблона, които можеш да използваш за създаване на бърза (Quick) или детайлна (Detailed) скица на твоя сайт. Шаблонът за бърза скица е по-обикновен, което ще ти позволи набързо да нахвърлиш идеите, които имаш. Шаблонът за детайлна скица е разделен на фина мрежа, което ще ти даде по-добър контрол върху подравняването на елементите. Мястото за дизайн и при двата шаблона е с резолюция 1024х768, което до голяма степен симулира начина, по който сайта ти ще изглежда онлайн.

Линк към сайта

A4 Sketching Paper

Тук ще откриеш само 1 шаблон, но в 2 различни размера – А4 и А3. Мястото за скициране е разделено от множество вертикални линии условно разположени на 16px една от друга.

Линк към сайта

960 Grid System Sketch Sheets

Тези шаблони са базирани на популярната 960 Grid System. Всеки от тях е разделен на 12, 16 или 24 колони, което ти дава подходящ контрол върху бързото нахвърляне на дизайна и структурата на твоя сайт.

Линк към сайта

Konigi Graph Paper

Тези шаблони са доста обикновени, но пък вършат перфектна работа. Целта им е доста ясна – бързо скициране на сайт, без да разсейва с излишни неща. Доста интересен е Dot Grid шаблона, който е направен от мрежа от точки. Можеш да го използваш за създаване на някои елементи от потребителския интерфейс.

Линк към сайта

Web Sketching Template – 6 pages

Документа е разделен на 6 малки браузърни прозореца. Тук целта е по-скоро да се фокусираш върху структурата на сайта, отколкото върху детайлите. Това ти дава възможност да скицираш набързо 6 различни страници или 6 отделни варианта на една и съща страница.

Линк към сайта

Web Sketching Template – 1 page

Този шаблон е идентичен с предишния с единствената разлика, че има само 1 браузърен прозорец. Това предполага, че фокуса ти ще бъде насочен само върху 1 страница от твоя сайт.

Линк към сайта

Какво мислиш за тези шаблони? Ще подобрят ли процеса ти на работа? Би ли използвал някой от тях за предварително скициране на следващата ти идея? Сподели коментара си по-долу.

Използвани снимки

Снимка към урока: Wireframe