Способов организации и управления слоями в Photoshop много, и каждая графика с опытом работы не менее нескольких лет имеет свои привычки и разработанные методы. Любой способ, который приносит наш файл в состояние, когда другой человек может сесть и управлять им, является хорошим решением. В этой статье я решил собрать ваши методы управления файлами PSD и некоторые советы, которые я нашел в Интернете интересными. Я надеюсь, что этот текст поможет вам лучше упорядочить ваши собственные проекты.
Группировка слоев
Группировка слоев доступна в Photoshop в течение очень долгого времени и, безусловно, является основой для хорошо упорядоченного PSD-файла. В принципе, мы должны сгруппировать все элементы, составляющие логические целые страницы — веб-страницы, тематические плакаты, верхние и нижние колонтитулы — как страницу, так и ее раздел. Если у вас есть опыт кодирования HTML-страниц, вы должны создать такие группы, как вы бы создали DIVy и все те теги HTML. Такой подход к теме значительно облегчит работу не только вас, но и коллеги с вами, и, кстати, логично и легко создать проект, который ночью не будет мечтать о кодере (если вам нужно сломать один элемент на две группы, кодер вероятно, придется делать то же самое). Если структура HTML является черной магией для вас — группируйте ее так, чтобы она помогла вам, например, легко перемещать элементы проекта в другое место.
При создании веб-страниц я всегда стараюсь группировать слои так, чтобы элементы, относящиеся к иерархии, были раздельными. И поэтому, во-первых, я создаю те, в которых находятся заголовок, содержание страницы и нижний колонтитул, а затем — внутри них я отправляю другой. Я пишу записи в верхнем регистре, имена в верхнем регистре и отдельные элементы, такие как кнопки и заголовки, — от маленьких (если только они не являются ярлыками, а я рефлексивно пишу их большими, как CTA). Это позволяет мне быстро и достаточно интуитивно оценить, где находится мой проект, и как я туда попал, что я ищу.
Меньшие элементы, такие как кнопки, элементы галереи или разделы раздела, также должны быть сгруппированы.
Как вы можете видеть — в группе, содержащей слайдер, я разместил подгруппу, в которой один из слайдов появится на странице. В нем раздел навигации (nav) и содержимое всего слайда, который я просто называю контентом (к имени, которое я верну). Кроме того, их собственная группа также получила кнопки (CTA) в обычной версии и после зависания с мышью. Остальное больше не группируется, потому что сложность содержимого недостаточно велика, чтобы иметь больше смысла и не облегчает редактирование проекта — вы можете собрать все фоновые изображения в одну группу; Чтобы воспроизвести его, мне пришлось бы создать не менее 3 групп, мне разумнее оставить его таким, какой он есть. Имейте в виду, что группировка призвана помочь нам и людям, которые используют наш проект, а не искусство. Поэтому не рекомендуется отказываться от возможности фотографирования или цвета фона и заменять его только группой, если только это не оправдано.
При создании невидимых групп в первый момент всегда размещайте их над видимыми элементами, чтобы при отображении элемента наведения пользователь сразу обнаруживал эффект (и не должен был скрывать другой элемент).
Слишком сильные кластеры файлов могут дать нам немного проблем — поиск будет более сложным, более сухим, прежде чем мы найдем то, что нам нужно, и чрезмерное преувеличение может даже затруднить людей, у которых нет последней версии программного обеспечения Adobe. Когда вы сохраняете файл с группами до уровня 4, вы получите сообщение о возможных осложнениях. Последняя версия Photoshop (CC 2015.5) позволяет создавать группы до 8 уровней.
Правильное именование
Помимо группировки, а может быть, и раньше, вы должны выбрать способ, которым вы хотите называть слои и группы в ваших проектах. Я, пользуясь русской версией программного обеспечения, пользуюсь русским языком в именовании. Если вы работаете в международной группе или планируете поделиться файлом с более широкой аудиторией, используйте английский язык. Однако следует помнить о том, чтобы быть последовательным — если мы применяем конкретный язык, мы должны применять его последовательно.
Как и на нашем языке, и особенно в индустрии веб-разработки, есть много слов, которые уже широко используются (и без значимого перевода), я признаю, что нарушаю принцип следствия, но я делаю это последовательно. В моем случае элементы конструкции, такие как нижний колонтитул, заголовок, навигация, обычно пишутся на английском (или слегка полированном английском), а также те, которые связаны с конкретным проектом содержанием на русском языке. Это не идеальное решение, но в то же время — не имеет никакого смысла препятствовать вашей жизни и, в случае очень специфических фраз, связанных с индустрией клиента, искать переводы в словаре или, что еще хуже, — только сохранить их на русском языке, а все остальное на английском языке (тратить наше время и время лица, которому придется найти этот предмет позже). Следуя тому же принципу — я не изменяю все имена слоев только для этого. Если мне нужен прямоугольник, который должен обрезать мою фотографию или сделать незначительную роль, я оставляю ее неизменной. Нет смысла переименовывать фотографии, значки или другие элементы, которые передаются нашему проекту извне — если мы сохраним имя источника, нам будет легче найти их позже. Конечно, если мы хотим отметить значительную картинку, или у нас их очень много, и нам нужно разобраться в них, именование слоев, скорее всего, будет на месте.
Если несколько элементов повторяются несколько раз, и мы намерены переместить их, а затем вернуться к ним, не забудьте изменить их имена перед копированием. Как вы можете, имена отдельных графических объектов были изменены до их дублирования, таким образом сохраняя рабочие нагрузки и поиск элементов для изменения позже — имена дублируют нас вместе со слоем, добавляя только в конце информацию о количестве уже созданных копий. Правильное именование также неоценимо, когда нам нужно скрыть или изменить группу слоев, которые не сгруппированы, потому что по какой-то причине они не могут быть рядом друг с другом. В этом случае просто в меню фильтров на панели слоев выберите опцию имени и введите интересующую нас фразу.
Одна из интересных техник, о котором я читал, но у меня не было достаточного желания и самоотречения, чтобы попытаться обозначить разные типы слоев правильными символами. В этом случае, например, элементам, представляющим декорации, будут предшествовать символы **, @ actions и разделы //. Это позволяет визуальному элементу легко назначать элемент соответствующей группе. Но добавляет немного работы.
Возвращаясь к тому же наименованию, важно помнить, что имена отдельных групп максимально просты и логичны. Они также должны быть быстро экономить (поэтому мы не теряем время) и избегаем русских символов — набрав в другом поле, чем текст вызывает сочетания клавиш, что может смутить нас.
Иерархия, соответствующая действительности
Собственные имена и разумно построенные группы не будут нам пользы, если мы не поместим их в иерархию. Группы и слои проекта (если это не требуется по его специфике) всегда должны быть сгруппированы по содержанию и расположению. Элементы группы слоев должны идти от самого высокого до самого низкого, а внутри — слева направо.
Просто посмотрите, чтобы увидеть, что тот, который слева, гораздо удобнее просматривать справа. В этом случае это не большая проблема, потому что имена являются конкретными и общеизвестными. Однако, если мы испортим порядок разделов, которые не имеют четкого названия или расположены линейным образом, мы можем усложнить дальнейшую работу.
Особенно легко путать в голове, когда мы копируем элементы, которые должны стать основой для шаблона галереи или другого, основанного на аналогичной компоновке. В этом случае порядок может быть отменен и даже полностью изменен. Кроме того, имена не отражают ни порядок, ни содержание элементов (при условии, что все изображения будут включены). Я не ожидаю, что кто-нибудь (потому что я не сделал бы это сам), чтобы переименовать каждый элемент по очереди и пронумеруйте их, особенно если мы скажем их … 25, и мы не предполагаем, что это когда-либо придется обрабатывать. Однако стоит овладеть иерархией и заложить их в том порядке, в котором они физически происходят в проекте. Это позволит вам попасть в важный элемент всего за несколько кликов. Такая же проблема возникает при создании списка, разделенного тегами, строками. В этом случае она намного больше, иногда бывает трудно выделить тонкую линию, ее легче выбрать в списке слоев.
Красящие группы
Еще одна особенность Photoshop, которая может помочь нам в упорядочении слоев, — это группы раскраски. Для этой темы мы можем обращаться визуально или чисто функционально. Группировка заголовков, нижних колонтитулов и содержимого с цветами — это классно и может даже немного улучшиться, но гораздо лучше создавать элементы и разделы, которые имеют одни и те же элементы (одни и те же имена).
Возвращаясь к моменту моего проекта слайдера (я сгруппировал фотографии в него, чтобы соответствовать моему скринкасту, я до сих пор не думаю, что это необходимо). Как вы можете видеть — каждый слайд имеет точно такие же элементы, их немного, но, если бы это было так: поиск того, что принадлежность к соответствующему разделу и перенос его в другой будет сложным (потому что мы не знали бы, в каком разделе мы находимся и что мы вставляем элементы). Благодаря цветам мы можем видеть, на какой цвет была отмечена группа, и легче перемещаться между ними. Чтобы назначить цвет группе или слою, просто щелкните его правой кнопкой мыши и выберите нужный цвет.
Этот метод можно успешно использовать везде, где в списке слоев есть элементы, которые стоит отделить, но изменение их имен по какой-то причине слишком обременительно или бессмысленно.
Сглаживание ненужных предметов
Последний способ организовать файлы PSD — это сгладить нерелевантные элементы. Я был в сети немного сглаживать картинки или даже целые коробки (оставляя одно редактируемое, а остальные сплющивались до растра), но я далек от того, чтобы хвалить такой метод.
Хранение графики с перекрывающимися элементами, фильтрами или масками может быть неудобно, как в случае с ящиками того же содержимого, которые повторяются несколько раз. В этом случае, однако, гораздо лучше превратить их в интеллектуальные объекты — при этом для них неограниченный доступ в будущем — мы никогда не знаем, к чему может привести нас клиент, и перераспределение может закончиться большим разочарованием. Если вы работаете над проектом, который содержит повторяющиеся элементы в нескольких файлах PSD, рекомендуется делать ставки на комбинированные интеллектуальные объекты. Благодаря им мы не только создадим слои в файле, но и упростим нашу работу. Это решение идеально, особенно при создании заголовков, нижних колонтитулов и повторяющихся веб-страниц. Лично я создаю каждый дизайн веб-страницы таким образом — хотя я не всегда использую возможность быстрого редактирования во всех PSD, но если что-то подобное происходит, это занимает несколько секунд, а не несколько минут, и гораздо труднее пропустить или пропустить что-то.
Если вам не нравится иметь слишком много слоев, также стоит добавить возможности редактирования Photoshop в создании и редактировании абзацев. Вместо того, чтобы создавать отдельные текстовые блоки для отдельных пунктов меню, навигации или текстовых блоков, попробуйте форматировать их на вкладках «Типография» и «Абзац». Они позволяют не только изменять макет текста, но также добавлять отступы, поля, верхний и нижний интервал и даже положение определенного символа относительно других.
Такая система уменьшает хаос в списке слоев и в то же время упрощает редактирование, поэтому гораздо проще добавить позицию в середине или изменить существующую.
Аналогично, вы можете использовать возможности, предлагаемые на вкладке «Типография». Я показал вам, как использовать три разных стиля на одном текстовом слое. 100 символов размером 48 пикселей, аналогично $, но я уменьшил его пропорционально до 50%, поэтому, если вы увеличите размер текста и количество букв будет сохранено — мне не придется менять их отдельно. Помните, однако, что проценты не относятся к проектам, которые вы хотите кодировать, — вы можете вызвать множество проблем с кодировщиком (всегда помните, что им не нужно знать столько, сколько мы о возможностях Photoshop). Группировка текстов на одном уровне всегда стоит того места, где из-за необходимости дополнительных эффектов нам не нужно их разделять.
Игра должна стоить свечи
Этого было бы достаточно для моих способов справиться с беспорядком на панели слоев Photoshop. Наконец, просто небольшое предупреждение — помните, что игра должна стоить свечи, а время, затрачиваемое на упорядочение слоев, не должно превышать того, что тратится на создание и уточнение интерфейса или самого графического дизайна. И каковы ваши лучшие способы организовать ваши слои? Какой из них вы используете на практике? Или вы считаете их ненужной тратой времени?