суббота, 16 ноября 2013 г.

Design with Inkscape


Используем для дизайна сайта документ с размерами 960 х 2000 рх (для изменения размеров: File » Document Properties или Ctrl + Shift + D.

Создание экспортируемого слоя:
Нет функции, как в Photoshop, разрезания документа на частички (slice), поэтому создадим слой для экспорта: CTRL + SHIFT + N. Потом поднимите палитру слоев, если она еще не готова, нажав CTRL + SHIFT + L.

Включить сетку: SHIFT +3.

Чтобы импортировать изображения нажимаем Ctrl + I и переходим к SVG или растровому файлу. Если Вы импортируете растровое изображение, то выберите его и нажмите CTRL + A , чтобы конвертировать этот объект в паттерн. Это позволит сохранить файл без потери растровости и можна будет его редактировать как SVG объект.

Вставить заготовленный текст: Extensions » Text » Lorem Ipsum. Просто выберите свои настройки и нажмите кнопку "Generate".

Завершение - Пакетный экспорт:

Начнем с экспорта фонового рисунка. Для этого спрячем все слои за исключением фона и созданного впредь (на первых шагах этого урока) экспортированного слоя.
Потом экспортируем хедер. Чтобы вызвать диалоговое окно экспорта нажмите CTRL + SHIFT + E. С нажатым инструментом выбора объекта именно на изображении хедера, сохраните рисунок в нужную вам папку. 
Повторите этот шаг для основы контента на сайте (body).
А теперь выберите все: CTRL + A, a потом спрячьте слой. С до сих пор выбранными объектами, вызовите диалоговое окно экспорта и выберите  пакетный экспорт (batch export) для экспортирования сразу нескольких объектов.

http://www.slideshare.net/kattekrab/inkscape-for-web-and-ui-mockups -  презентация про Inkscape: его прерогативы и возможности.

http://tucsonlabs.com/2009/01/21/sarburst-background-with-inkscape/ - урок по созданию эффекта вспышки в Inkscape.

http://www.youtube.com/watch?v=PlMl_3kyrx4  - урок о работе с инструментами Inkscape.

http://www.youtube.com/watch?v=Y4CMyZiu6Yk - урок о работе с различными фильтрами в Inkscape.

http://www.youtube.com/watch?v=KZ-ECm2lK50   - bug.