Эмуляция многостраничности в Photoshop

Согласно статистике 86% пользователей используют Photoshop для дизайна пользовательских интерфейсов. Изначально Photoshop никогда не предназначался для этих целей, сама корпорация Adobe позиционирует данную программу для работы с фотографиями, рисования и ретуши.
Почему 86% пользователей это не останавливает мне не известно, видимо они подвержены магическим чарам :)


Один из первых и главных камней предковения почему создавать интерфейсы в Photoshop неудобно - это отсутствие многостраничности.
Интерфейсы состоят из множества экранов, поэтому при проектировке приходится создавать множество файлов со страницами для конкретной функциональности. Поддерживать несколько страниц не составляет большой проблемы, а что делать с сотней а то и тысячей страниц. Это реальность на больших проектах. Дело усугубляется когда на одном проекте работают несколько дизайнеров. Богадство функциональности проекта выливается в конечном итоге в сотни файлов, которые необходимо быстро находить и поддерживать в актуальном состоянии.


Поэтому многостраничность это первый "инструмент" для дизайнера интерфейсов который необходим по умолчанию. Photoshop не поддерживает многостраничность вообще, но есть несколько способов которые могут в той или иной степени облегчить вам жизнь.


1. Layer Comps - первый способ основан на использовании функций панели Layer Comps.




Layer Comps - это слой который всего лишь запоминает положение, видимость и стили объектов. Поэтому для имитации многостраничности мы можем запоминать в Layer Comps видимость папок. В папки именуемые например Pаge 1, Page 2 и т.д. мы рассовываем объекты как бы разных страниц, в итоге получаем видимость многостраничности. Затем переключаясь с одного Layer Comps на другой мы будем управлять видимостью папок, отчего будет казаться что мы переключаемся между страницами. На деле это не так удобно как кажется, так как для того чтобы сохранить информацию о видимости папок в панели с Layer Comps необходимо вручную нажимать маленькую кнопочку для обновления информации о слоях. Это отнимает время, отвлекает, и самое главное не всегда можно вспомнить что это необходимо сделать. Это может вам стоить потерей актуального стостояния "страницы".

За рассовыванием объектов по папкам нужно четко следить. Так как при удалении объекта который задействован в нескольких Lаyer Comps мы теряем его, о чем сигнализирует значок предупреждения.
В общем на деле это не многостраничность а сплошная головная боль.

Для чего сохранять видимость папок в Layer Comps, если можно всего лишь манипулировать папками которые бы эмитировали многостраничность? У Layer Comps есть единственная полезная функция которая обосновывает использование данного метода. Каждый Layer Comps можно экспортировать в виде отдельных страниц в формате JPEG или PNG. На практике это очень удобно, когда вам быстро нужно задокументировать конкретную функциональность интерфейса. Для этого достаточно экспортировать все Layer Comps "страницы" в виде JPEG и загрузить их в табличный документ в Google Docs.
Для экспорта Layer Comps необходимо вызвать скрипт в меню File > Scripts > Layer Comps to Files.

2. Smart Objects
Второй способ основан на возможности фотошопа "запекать" объекты в Smart Object. Изначально эта функция предназначена для того чтобы иметь возможность редактировать оригинал без потерь. То что слой является Smart Object сигнализирует маленькая иконка в виде квадратика с документом.




В итоге это работает так -  мы помещаем слой в  Smart Object редактируем его, применяем фильтры, но всегда имеем возможность вернуть наш оригинал, который хранится в  Smart Object. Никто не мешает вам помещать в  Smart Object целые папки или импортировать целые PSD документы в виде Smart Object.
Для помещения папки в  Smart Object достаточно вызвать из контекстного меню функцию Convert to Smart Object.




 В итоге мы можем иметь документ состоящий из 5  Smart Object, каждый из которых сожержит отдельные страницы. Чтобы отредактировать такие страницы необходимо дважды кликнуть по смарт объекту после чего он откроется в отдельном окне, где вы спокойно сможете отредактировать свой дизайн, так как все объекты, слои и эффекты примененные к слоям в смарт объекте сохраняются.




У этого способа так же есть несколько недостатков. Во первых, размер файла документа со Smart Objects увеличивается примерно в 5 раз. Во вторых, нет возможности переключатся между страницами на лету и вносить в них правки, так как для редактирования страниц нужно предварительно открывать  Smart Object в новом окне. Так же, нет способа для экспортирования  Smart Object в отдельные JPEG страницы, что крайне необходимо для документирования интерфейсов и общении с заказчиком. В итоге вам все равно придется собирать отдельные Smart Objects в Layer Comps что по большому счету уменьшает ценность данного способа практически до нуля.


P.S. Так как в реальности оба способа являются всего лишь хаками, они не решают проблему с многостраничностью в Photoshop полностью. Невозможно иметь страницы различных размеров. Нет возможности  экспортировать документ в многостраничный PDF без дополнительной работы. Невозможно иметь отдельные сетки с Guides для каждой страницы, отчего дизайнить в фотошопе действительно невыносимо.
P.P.S.Хорошо что все эти функции прекрасно реализованы в Fireworks, поэтому фотошоп зависимых дизайнеров приглашаю ознакомится с этой замечательной программой.