20 бесплатных и полезных плагинов Photoshop для веб-дизайнеров

Adobe Photoshop является мощной платформой для креативщиков, которые могут освежить свою работу, но иногда ей не хватает многих функций, которые могут помочь повысить производительность, рабочий процесс и сделать жизнь намного проще. К счастью для нас, Photoshop поддерживает расширения или плагины, которые помогают расширить их возможности. И, к счастью для вас, мы собрали одни из лучших и обязательных плагинов для Photoshop.

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

клетка
Как вы управляете несколькими умными объектами в Photoshop? Было бы здорово иметь возможность создавать или разбивать несколько смарт-объектов одним щелчком мыши. Cell позволяет вам это сделать. Это плагин, который может сжимать несколько выбранных слоев и групп в несколько смарт-объектов, а также возможность распаковывать, что позволит разбить несколько смарт-объектов на группы слоев одним щелчком мыши.
Действие Сохранить также очень полезно: теперь вы можете сохранить несколько смарт-объектов в один файл PSD или PNG. Это умный способ сохранить несколько смарт-объектов непосредственно в виде активов PNG!

Скачать Cell

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

Совместимость: Photoshop CC, CC2015 – Скачать

Инструменты интерфейса
Навигация по Photoshop, чтобы найти необходимые инструменты, раздражает. Требуется время, чтобы перейти от инструмента к инструменту. Центрирование элементов также является проблемой, если вы не использовали правильный инструмент. Чтобы избавиться от всего этого раздражения, вы можете использовать этот маленький бесплатный плагин Interface Tools. Этот плагин размещает все необходимые инструменты и быстрые ярлыки, к которым можно получить доступ, на одном месте.
Очень хорошо делает много простых вещей. Включите и выключите привязку, горизонтальное или вертикальное центрирование, обрежьте документ или «сохраните для Интернета» одним щелчком мыши. Это значительно экономит время и настоятельно рекомендуется использовать как плагин, когда вы хотите объединить все свои инструменты.

Совместимость: Photoshop CC – Скачать

Flaticon
Как часто вам нужно выходить из рабочей среды только для поиска нужного значка? Почему бы не использовать плагин FlatIcon, чтобы быстро находить нужные вам иконки. Доступно более 40 000 значков, и база данных всегда синхронизирована – ручное обновление не требуется. Этот бесплатный плагин поместит новую панель в Photoshop, которая позволит вам искать любые значки и непосредственно размещать их в вашем документе.
Поскольку они представляют собой векторные фигуры, вы можете изменять их размер и редактировать без потери качества. Наличие коллекции стрелок и типичных веб-элементов стоит установки в одиночку. Также вы можете скачать иконки по отдельности с сайта.

Совместимость: Photoshop CC, CS5, CS6 – Скачать

Layrs Control2
Layrs Control 2 – это набор из семи скриптов, которые значительно облегчают работу с слоями в Photoshop. Это практичное решение для управления слоями, и оно будет особенно полезно при работе над сложными проектными проектами с тоннами слоев, с которыми приходится иметь дело.
Он предоставляет семь основных функций, в том числе переименование слоев и папок, удаление неиспользуемых эффектов для оптимизации вашего проекта, выравнивание всех эффектов слоев, удаление пустых слоев и растеризация смарт-объектов. Кроме того, вы также можете конвертировать слои в отдельные смарт-объекты и находить файлы и папки с одинаковыми именами.

Совместимость: Photoshop CC, CC2014 – Скачать

Генератор случайных пользователей
При создании макета мы тратим время на поиски случайных фотографий людей, которые можно положить в макет. Еще одно бесполезное событие – создание правдоподобного имени пользователя. Если эти проблемы мешают вам, теперь вы можете пропустить хлопот с плагином Photoshop Generator для случайных пользователей, который делает это быстро и легко для вас.
Вы можете перетаскивать случайные мужские или женские, пользовательские изображения и генерировать имена образцов непосредственно в свои PSD. Затем просто нажмите и перетащите фотографию профиля в документ Photoshop или скопируйте и вставьте нужное изображение и имя. Чтобы продолжить процесс и создать нового случайного пользователя, нажмите кнопку «Новый случайный пользователь».

Совместимость: Photoshop CS6, CC2014, CC2015 – Скачать

Cut & Slice Me
Cut & Slice Me – это плагин, который будет экспортировать нужные вам ресурсы в виде файлов PNG, а все прозрачные пиксели будут обрезаны. Все, что вам нужно сделать, это добавить @ в конец названия вашего слоя, и он сделает все остальное. Плагин также организует и группирует слои, как если бы они были объектами. Если вы хотите, чтобы ваш файл экспортировался в фиксированный размер, вы можете создать прямоугольный вектор в качестве первого слоя, а затем назвать его #.
Последняя группа будет экспортирована в нужном вам размере. Это также прекрасно работает с состояниями кнопок. Если у вас возникли какие-либо проблемы с этим, просто просмотрите раздел часто задаваемых вопросов и наслаждайтесь чувством юмора создателя, когда отвечаете на общие вопросы, с которыми сталкиваются пользователи плагина.

Совместимость: Photoshop CS6, CC – Скачать

Guideguide
Плагин GuideGuide Photoshop позволяет легко получать пиксельные столбцы, строки, средние точки и базовые линии на основе вашего документа или выбора. Это позволяет вам часто сохранять использованные наборы руководств, которые могут вам понадобиться в будущем. Вы также можете использовать несколько типов измерений.
С помощью плагина вы можете точно измерить, насколько широким должен быть элемент навигации, чтобы он равномерно соответствовал ширине сайта, а также создать сетку базовой линии и заполнение элементов. Вы можете попробовать его бесплатно или купить для Photoshop CC или новее всего за 10 долларов.

Совместимость: Photoshop CS5, CS6 и CC – Скачать

Преобразовать каждый
Команда «Преобразовать каждого» – хорошая функция от Illustrator, отсутствующая в Photoshop. Это позволяет преобразовывать группы слоев, так как это было преобразовано индивидуально. Приятно, когда вы можете изменять размер, вращать и перемещать несколько элементов без необходимости каждый раз менять положение элементов.
Он также имеет возможность масштабировать стили и ограничивать пропорции. Не забывайте всегда использовать кнопку «Просмотр», чтобы просмотреть конечный результат, прежде чем нажимать кнопку «ОК».

Совместимость: Photoshop CS5, CS6, CC2014, CC2015 – Скачать

Генератор Длинных Теней 2
Создание эффекта «Длинная тень» выглядит легко даже для пользователя Photoshop начального уровня. Но редактировать будет кошмаром, если вашему клиенту не нравится конечный результат. Чтобы предотвратить это, попробуйте расширение для Photoshop под названием Long Shadow Generator 2.
Как видно из названия, этот плагин способен создавать длинные тени одним кликом. В настройках панели можно настроить длину тени, непрозрачность тени, сглаживание или градиент тени, черные или белые тени и углы тени.

Совместимость: Photoshop CC, CC2014, CS6 – Скачать

то же самое
Если вы хотите, чтобы Photoshop разрешал использование переменных для таких атрибутов, как цвета, текст, размеры шрифта и видимость, попробуйте Ditto. Он поддерживает переменные цвета заливки, строки текста, включая специальные символы, видимость, размеры шрифта, семейство шрифтов, цвета шрифта, высоту строки, положение X и положение Y. Каждая переменная требует, чтобы вы указали ее тип, имя и значение.
Для тех, у кого нет плагина, они увидят группу на панели слоев, которая называется dittoVariables, но в противном случае она не будет затронута. Слой может иметь несколько переменных, и они вообще не определяют названия слоев.

Совместимость: Photoshop CC2015 – Скачать

CSS3Ps
CSS3Ps – это плагин Photoshop, который преобразует слои в стиль CSS3. Вам просто нужно выбрать слои и затем нажать кнопку CSS3Ps. Плагин направляет вас на веб-страницу CSS3P, где генерируется вывод. Плагин CSS3Ps поддерживает несколько слоев, префиксы поставщиков для кросс-браузерной совместимости, SASS и SCSS.
Он также поддерживает такие стили, как радиус границы, наложение градиента, скос и тиснение, обводка, тень и свечение, атлас и многое другое. Стоит отметить, что для того, чтобы плагин конвертировался должным образом, вам нужно использовать правильные эффекты Photoshop.

Совместимость: CS3 и выше, CC, CC2014, CC2015 – Скачать

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

Совместимость: Photoshop CS5 и выше – Скачать

Pixel2Vector
Pixel2Vector – очень впечатляющий инструмент, который может преобразовать любую пиксельную графику в полностью масштабируемую векторную форму одним щелчком мыши! Функция Vector Shape преобразует каждый выбранный слой или группу слоев в векторную форму. Когда это будет сделано, вы можете редактировать вектор как любую другую векторную фигуру, масштабироваться без потерь или легко перекрашивать.
Другой функцией является инструмент Custom Shape Tool, который преобразует каждый выбранный слой или группу слоев в инструмент Custom Shape Tool. Вы можете найти форму, выбрав Custom Shape Tool в нижней части палитры форм.

Совместимость: CS5, CS6, CC, CC2014 и Photoshop CS3 + (в качестве набора действий) – Скачать

Font Awesome
Еще один надежный инструмент поиска значков, плагин Font Awesome, поможет вам найти и вставить значок прямо в Photoshop. Этот бесплатный плагин добавляет новую панель, которая позволит нам искать любую иконку, набрав нужное ключевое слово.
Найдите значок и нажмите, чтобы создать новую форму слоя, которую вы можете легко редактировать. Настоятельно рекомендуется экономить время, если ваша повседневная жизнь связана с работой с иконками.

Совместимость: Photoshop CC – Скачать

Renderly
Render.ly будет экспортировать экраны, активы и подробные спецификации дизайна для вас. Только элементы, которые были изменены, экспортируются. Вам просто нужно использовать правильный префикс, и Render.ly справится со всей тяжелой работой. Render.ly позволяет добавлять варианты на экраны, управлять активами, подробными спецификациями дизайна и, в конце концов, автоматически экспортировать все из них одним щелчком мыши.
Чтобы сохранить ваши значки в качестве векторов, добавьте ICO приставка; назовите группу с “btn”; создать состояние, добавив, например, «: hover» в конце имени внутри этой группы; для экспорта изображений добавьте «img» в качестве префикса; изображение будет экспортировано как растровое изображение.

Совместимость: Photoshop CC2014, CC2015 – Скачать

Griddify
Благодаря Griddify мы теперь можем создавать собственные системы сетки, вертикальный ритм и делать больше с помощью направляющих в Photoshop. Griddify добавляет в Photoshop интуитивно понятную панель, которая включает в себя три простых, но разнообразных параметра: Griddify, Divide и Wrap.
Введите значение в пикселях и нажмите «Griddify», и руководство будет добавлено через введенные вами интервалы. Вы можете поиграть с ним для большего количества столбцов и желобов или изменить ориентацию для создания базовой линии. Опция «Разделить» отлично подходит для адаптивных сайтов, разбивая выбранную область на количество разделов, которые вы хотите. Опция «Обтекание» добавляет направляющие к краям вашего выделения.

Совместимость: Photoshop CS6, CC – Скачать

Сохранить панель
Save Panel – это плагин для сохранения файлов Photoshop, который позволяет вам настроить параметры сохранения с вашими любимыми настройками. Например, вам может понадобиться сохранить иллюстрацию с разными размерами для разных целей. С помощью панели сохранения вы можете выбрать папку назначения (абсолютную или относительную), размеры изображения, тип файла и имя файла.
Количество кнопок, которые вы можете создавать и настраивать с помощью панели сохранения, не ограничено. Чтобы настроить его, просто сохраните пресеты, созданные в диалоге настроек. Каждая предустановка будет представлена ​​кнопкой на панели, что обеспечит вам быстрый доступ к вашим любимым настройкам. Вы даже можете обмениваться изображениями в Photoshop с помощью облачных сервисов хранения, таких как Dropbox.

Совместимость: Photoshop CS5, CS6, CC, CC2014 – Скачать

UberColumn
В Photoshop очень неприятно, когда вы макетируете веб-сайт, когда вам нужно установить два отдельных текстовых слоя и выровнять их, если вы хотите несколько столбцов текста. В этом случае UberColumns – это плагин Photoshop, который может помочь. Это позволяет вам преобразовывать один блок текста на слое в указанную разметку столбца, а также настраивать ширину желоба.
Чтобы использовать этот плагин, просто перетащите текстовое поле с помощью инструмента «Текст» и введите текст в обычном режиме. После фиксации текста откройте панель «Столбцы» в меню «Окно»> «Расширения»> «Столбцы». Установите количество столбцов и пространство желоба и нажмите ОК. Ваш текст теперь должен быть преобразован в столбцы.

Совместимость: Photoshop CC, CC2014, CC2015 – Скачать

С помощью этого бесплатного плагина вы можете легко экспортировать выбранные слои непосредственно в iOS или Android с возможностью масштабирования до 200%, уменьшения до 50%, дублирования, обрезки и удаления пустых пикселей для файлов PNG. Плагин CC2014 также позволяет вам устанавливать выходную папку и превращать ваши живые фигуры в обычные контуры.

Когда у вас есть несколько слоев композиции, иногда вещи могут легко перепутать. Composer дает вам полный контроль над внесением изменений, изменением позиций и видимости слоев одновременно. Просто выберите композиции слоев, к которым вы хотите применить изменения, затем выберите любую из четырех команд: Обновить стиль слоя, Обновить положение, Обновить видимость или Обновить все.