36 Photoshop-Plugins für Webdesigner, die Sie ausprobieren müssen

WordPress ist nicht die einzige Software, die nützliche Erweiterungen zu ihrem Kernprodukt bietet. Photoshop, eines der beliebtesten Tools für Webdesigner auf der ganzen Welt, unterstützt diese Möglichkeit ebenfalls. Und wie ihre WordPress-Pendants können auch Photoshop-Plugins alle möglichen neuen Funktionen hinzufügen.

Da wir wissen, dass viele unserer Leser Photoshop regelmäßig verwenden, hielten wir es für eine gute Idee, diesmal eine andere Art von Plugin-Liste anzubieten. Unten finden Sie die besten Photoshop-Plugins, die wir im Internet finden konnten.

Sie bereichern das Programm mit allen möglichen Verbesserungen. Von kleinen Skripten und Shortcuts bis hin zu ganz neuen Modulen, die Ihren Workflow dramatisch verbessern und die Arbeit mit Photoshop noch einfacher machen.

Bereit? Dann lass uns beginnen.

Photoshop-Plugins, die kein Webdesigner ignorieren sollte

Unten finden Sie eine Liste von Plugins für Photoshop aus verschiedenen Kategorien, die Ihre Lieblingssoftware weiter verbessern können.

Retinize It

• Preis: Kostenlos
• Verfügbar für: CC 2015

An erster Stelle haben wir ein kostenloses Plugin zum schnellen Erstellen von Assets für Retina-Displays. Retinize It fügt Photoshop eine neue Aktion hinzu, mit der Sie Bilder in ihren ursprünglichen Abmessungen exportieren oder auf die doppelte und dreifache Größe skalieren können.

Nach der Installation finden Sie die neue Option unter Fenster > Aktionen. Wählen Sie einfach eine Ebene oder eine Gruppe von Ebenen aus, führen Sie die Aktion aus, benennen Sie Ihre Dateien und erhalten Sie die aufgeteilten Assets. Ideal für die Erstellung von Netzhaut-fähigen Websites.

Schneide und schneide mich

• Preis: Kostenlos
• Verfügbar für: CS6

Ein weiteres Plugin zum direkten Exportieren von Assets aus Ebenen. Cut&Slice me schneidet Ihre Bilder automatisch zu und exportiert sie als PNG-Dateien. Es kann mit überlappenden Slices, mehreren Schaltflächenzuständen und mehreren Auflösungen umgehen. Leider ist es nicht ganz aktuell, funktioniert aber noch mit älteren Photoshop-Versionen.

CSS3Ps

• Preis: Kostenlos
• Verfügbar für: CS3 und höher

Wie der Name schon sagt, kann dieser Dienst Photoshop-Ebenen in CSS3 konvertieren. Das Besondere daran ist, dass es sich um einen Cloud-basierten Dienst handelt und die Nutzung kostenlos ist.

Das Plugin unterstützt mehrere Ebenen (einschließlich Text), Schlagschatten, Farbverläufe, Randradius und mehr. Darüber hinaus kann es auch mit SCSS und SASS umgehen.

Ecken-Editor

• Preis: Kostenlos
• Verfügbar für: CC 2015

Wenn Sie jemals abgerundete Ecken produzieren müssen, ist dieses Skript für Sie. Es verbessert die Fähigkeiten von Photoshop, runde Ecken zu erstellen, arbeitet mit jeder polygonalen Form, enthält mehrere Eckenstile und ermöglicht es Ihnen, mehrere Ebenen gleichzeitig und mehr zu bearbeiten.

HTML-Block

• Preis: Kostenlos
• Verfügbar für: CC 2015 (nur Mac OS)

Unser nächster Anwärter ermöglicht es Ihnen, HTML und CSS direkt in Photoshop-Dokumenten zu platzieren. Auf diese Weise können Sie Web-Assets direkt in der Software erstellen und Online-Assets in Ihrer PSD-Datei verwenden. Letzteres umfasst Webfonts, externes CSS und mehr.

Schriftart Super PS

• Preis: Kostenlos
• Verfügbar für: CC

Font Awesome ist eine Symbolschrift, die an Popularität und Verwendung gewinnt. Aus diesem Grund ist es nur sinnvoll, in Photoshop-Dateien einzubinden. Zum Glück macht dieses Plugin das kinderleicht. Einfach kostenlos herunterladen und installieren und schon kann es losgehen.

Ebenenkontrolle 2

• Preis: Kostenlos
• Verfügbar für: CC, CC 2014

Dieses Plugin ist eine Sammlung von sieben Skripten, die einige der ärgerlicheren Aspekte von Photoshop erleichtern. Es enthält einen Ebenennamen-Editor, die Option zum Entfernen nicht verwendeter Effekte, kann leere Ebenen automatisch löschen, Smart-Objekte rastern, ähnliche Dateien finden und vieles mehr. Kostenlos herunterzuladen und nach Belieben zu verwenden.

CSS-Hut 2

• Preis: 39,99 $
• Verfügbar für: CC 2014-2017

CSS Hat übersetzt Ebenenstile automatisch in CSS3. Auf diese Weise können Sie es einfach kopieren und einfügen, anstatt herauszufinden, wie Sie die Grafiken vor Ort implementieren.

Das Plugin kann gleichzeitig mit mehreren Ebenen, Schriftarten und verschiedenen Schriftarten arbeiten und kann LESS, SASS, Stylus und mehr ausspucken. Es verfügt auch über viele Funktionen, die Sie in Code-Editoren finden, z. B. Syntaxhervorhebung. CSS Hat ist auch für ältere Photoshop-Versionen verfügbar.

Seitenebenen

• Preis: $35
• Verfügbar für: Nur Mac OS X

Viele Plugins auf dieser Liste haben das Ziel, Photoshop-Dateien einfacher in Websites umzuwandeln. Umgekehrt ist es jedoch genauso notwendig. Dafür gibt es Page Layers.

Das Plugin konvertiert Websites automatisch in PSD-Dateien und speichert jedes Seitenelement als einzelne Ebene. Öffnen Sie eine beliebige Seite im eingebetteten Browser und speichern Sie sie einfach in Photoshop. Das Plugin ist nicht kostenlos, klingt aber so, als ob es den Preis wert ist.

PNG-Hut

• Preis: 27,99 $
• Verfügbar für: CS5, CS6, CC, CC 2014.1+, CC 2015

Dieses Plugin wurde von denselben Leuten wie CSS Hat entwickelt und verbessert die Fähigkeit von Photoshop, PNG-Dateien zu exportieren. Es kommt beispielsweise mit einer besseren Komprimierung und kann CSS-Regeln exportieren. PNG Hat kommt auch mit einer großzügigen Geld-zurück-Richtlinie, wenn Sie nicht zufrieden sind.

Schriftselbst

• Preis: 49€
• Verfügbar für: CC 2015, CC 2017

Als nächstes kommt ein Plugin, mit dem Sie per Drag & Drop Ihre eigene Schriftart erstellen können. In einer Zeit, in der Typografie im Web immer wichtiger wird, ist das wirklich gut zu hören. Wandeln Sie (farbige) Bilder und Vektoren einfach in OpenType-Schriften um. Kontrollieren Sie Kerning, Ligaturen und mehr. Fontself ist auch ein aktiv gepflegtes Plugin, sodass Besitzer neue Funktionen kostenlos erhalten.

Getty Images Photoshop-Plug-in

• Preis: Kostenlos
• Verfügbar für: CC 2016 und höher

Getty Images verfügt über eine riesige Sammlung von Archivbildern und ein Plugin, mit dem Sie sie direkt in Photoshop importieren können. Durchsuchen und filtern Sie Tausende von hochauflösenden Bildern und synchronisieren Sie Ihre Einkäufe mit einem Getty-Konto.

PSD-Reiniger

• Preis: 19,99 $
• Verfügbar für: CC 2014.1+

Ein weiteres Plugin von Source, das das Ebenenbedienfeld von Photoshop auflädt. PSD Cleaner scannt automatisch Ihre Schichtstruktur und zeigt Verbesserungsmöglichkeiten auf. Es hilft Ihnen, unbenannte Ebenen zu finden, leere Ebenen zu löschen, Ebenen zu finden, die sich über die Leinwand hinaus erstrecken und vieles mehr. Kurz gesagt, es hält Sie organisiert.

WebZap

• Preis: $19
• Verfügbar für: CS5 und höher

Es mag überraschen, aber Photoshop ist nicht wirklich für Webdesign gemacht. Das Programm begann als Fotobearbeitungswerkzeug und fügte erst später Fähigkeiten zum Erstellen von Layouts hinzu.

Dafür gibt es WebZap. Das Plugin bietet vorgefertigte Elemente zum Erstellen von Weblayout-Mockups im Handumdrehen. Es basiert auf dem 960-Raster, kann formatierten Lorem ipsum-Text, Navigation, Schaltflächen und mehr erstellen.

Subtile Muster

• Preis: 17,99 $
• Erhältlich für: CC und aufwärts

Subtle Patterns ist eine Bibliothek mit freien, kachelbaren Texturmustern. Das gleichnamige Plugin bringt sie in Ihr Photoshop-Dashboard. Das ist es.

ScreenSnap

• Preis: 9,99 $
• Verfügbar für: CC 2014 oder neuer

Als nächstes auf unserer Liste der Photoshop-Plugins steht ScreenSnap. Mit dem Programm können Sie Screenshots aus PSD-Dateien erstellen, entweder des gesamten Dokuments oder aus einem ausgewählten Bereich. Kein manuelles Zuschneiden oder Speichern erforderlich, wählen Sie einfach einen Ordner aus, klicken Sie auf eine Schaltfläche und Sie sind gut. Ideal, um Ihre Arbeit mit anderen zu teilen, sogar in Netzhautgröße.

Duplikator

• Preis: Kostenlos
• Verfügbar für: CC, CC2014

Hier haben wir eine Erweiterung zum schnellen Klonen von Ebenen und Ebenengruppen, wenn Sie mehrere des gleichen Objekts benötigen. Wählen Sie einfach aus, wie viele Kopien Sie benötigen und wie Sie sie voneinander beabstanden möchten.

Perspektivenmodelle

• Preis: $19
• Verfügbar für: CC 2017

Wie Sie dem Screenshot entnehmen können, enthält die Plugin-Homepage viele Schimpfwörter. Abgesehen davon erstellt dieses Plugin perspektivische Modelle Ihres Designs. Auf diese Weise können Sie besser verstehen, wie sie von außen auf einem Telefon oder Tablet aussehen. Das Plugin hat viele Voreinstellungen, ist aber auch vollständig editierbar.

Größenmarkierungen PS

• Preis: Kostenlos
• Verfügbar für: CC 2014

Mit Größenmarkierungen können Sie mit dem Auswahlwerkzeug Beschriftungen für die Größe eines Objekts oder den Abstand zwischen Objekten hinzufügen. Jedes Etikett wird in einer neuen Ebene gespeichert und ist vollständig anpassbar. Dies ist sehr hilfreich, wenn Sie Spezifikationen für die Person hinzufügen, die die PSD in eine Website umwandelt.

Fontea

• Preis: Kostenlos
• Verfügbar für: CC 2014, CC 2015

Für alle, die mit dem Standardangebot an Schriftarten von Photoshop unzufrieden sind, bietet Fontea alle bei Google Fonts verfügbaren Webfonts (derzeit 800+). Das Plugin hält auch mit dem Online-Repository auf dem Laufenden und ermöglicht es Ihnen, Sammlungen Ihrer Lieblingsschriftarten einzurichten.

Pixabay

• Preis: 4,99 $
• Verfügbar für: CC 2015 und höher

Dieses Plugin ist wie das bereits erwähnte Getty-Bild-Plugin, jedoch für die Pixabay-Bildbibliothek. Es enthält Hunderttausende von kostenlosen Archivbildern, die Sie jetzt mit einem einzigen Klick hinzufügen können. Das Plugin enthält auch leistungsstarke Suchoptionen und alle Bilder sind CC0-lizensiert. Außerdem ist es sehr günstig.

Es gibt mehr solcher Plugins für andere Stock-Fotobibliotheken wie Shutterstock und Pexels.

LayerCraft

• Preis: Kostenlos
• Verfügbar für: CC, CC 2014

Ein weiteres Plugin zum Exportieren von UI-Assets aus Photoshop-Ebenen. LayerCraft kann Ihre Bilder beim Export skalieren, transparente Pixel trimmen und in verschiedenen Größen für die Retina-Anzeige exportieren.

Lorem Ipsum Generator

• Preis: Kostenlos
• Verfügbar für: CS 5/6, CC

Wie der Name schon sagt, ist dies ein Plugin zum Erstellen von Lorem ipsum-Platzhaltertext. Auf diese Weise müssen Sie es nicht mehr von externen Quellen kopieren. Der Generator bietet eine anpassbare Ausgabe, die Möglichkeit, mit einem Klick in Ihre Zwischenablage zu kopieren und wird aktiv gewartet.

LoremPicsum

• Preis: Kostenlos
• Verfügbar für: CS, CC

Diese ähnelt der Lorem ipsum-Version, erstellt jedoch zufällige Bilder anstelle von Text. Wählen Sie einen Bereich aus, wählen Sie einen Cartoon und Sie haben ein Platzhalterbild. Lustiges Gimmick: Bilder stammen aus beliebten Fernsehsendungen und Filmen wie Futurama, Die Simpsons, Finding Nemo und Up.

Social Kit Pro

• Preis: 9,99 $
• Verfügbar für: CC 2015+

Und noch ein Source-Plugin. Dieser zielt darauf ab, alles in den sozialen Medien zu verbessern. Es enthält Vorlagen zum Erstellen von Anzeigen auf Mobilgeräten und Desktops, Titelbildern und Profilbildern. Sie können die Ergebnisse sogar in Photoshop in einer Live-Vorschau anzeigen.

Ebenenführungen

• Preis: Kostenlos
• Verfügbar für: Unbekannt

Hilfslinien sind ein wichtiges Werkzeug in Photoshop, um alles strukturiert zu halten. Die Handhabung kann jedoch nervig sein.

Dieses Plugin hofft, das zu lindern. Es fügt neue Schaltflächen hinzu, um Hilfslinien an den Seiten von Ebenen sowie durch deren horizontale und vertikale Mitte hinzuzufügen. Kein Ziehen mehr nötig, klicken Sie einfach und Sie sind gut.

Generator für lange Schatten

• Preis: Kostenlos
• Verfügbar für: CS6, CC

Der Plugin-Name sagt im Grunde alles. Der Long Shadow Generator hilft Ihnen, lange Schatten in Photoshop zu erstellen. Sie können Schattenlänge und Deckkraft, Farbe, Farbverlauf und Winkel steuern. Dann fügen Sie sie einfach mit einem Klick hinzu.

TinyPNG

• Preis: $50
• Verfügbar für: CS5, CS6, CC und aufwärts

TinyPNG ist ein Online-Dienst, den ich oft empfehle, um Bilder vor dem Hochladen in WordPress zu optimieren. Es komprimiert JPG- und PNG-Dateien, um sie so klein wie möglich zu machen.

Die Site bietet auch ein Photoshop-Plugin, um dasselbe in der Bildbearbeitungssoftware zu tun. Sie können eine Vorschau anzeigen und direkt speichern, skalieren, eine Teilauswahl verwenden und mehr. Wenn ihre Website ein Hinweis ist, ist das Plugin das Geld wert.

Glifo

• Preis: $19
• Verfügbar für: CS5, CC

Glifo fügt die Option hinzu, Vektorsymbole aus Photoshop als Symbol-Webfonts zu exportieren. Klingt nach einer großartigen Ergänzung zum Font Awesome-Plugin.

spezKing

• Preis: $19
• Verfügbar für: CS5, CS6, CC 2014 und aufwärts

Ein weiteres Plugin zum Hinzufügen von Messungen und Designspezifikationen zu Photoshop-Dateien, diesmal jedoch als Premium-Version. Messen Sie Größen, Ränder und Schriftarten und erstellen Sie automatisch Spezifikationen in bearbeitbaren Overlays. Sieht super einfach und bequem zu bedienen aus.

Export-Kit

• Preis: 19,33 $/Monat
• Verfügbar für: CS6 und aufwärts

Mit diesem Photoshop-Plugin können Sie PSD-Dateien in HTML, CSS, WordPress, iOS, Android und mehr konvertieren. Es enthält auch Kollaborationsfunktionen. Sieht sehr mächtig aus, wird jedoch mit einer monatlichen Lizenz geliefert und ist nicht ganz billig.

Photoshop Social Share-Plugin

• Preis: Kostenlos
• Verfügbar für: Unbekannt (nur Mac OS)

Der nächste Punkt auf unserer Liste fügt Photoshop wichtige Freigabefunktionen hinzu. Es ermöglicht Ihnen, Dateien direkt aus dem Programm heraus über E-Mail, soziale Netzwerke und andere Plattformen zu teilen und zu veröffentlichen. Wählen Sie einfach ein Format und Sie können loslegen.

Transformieren Sie jeden

• Preis: Kostenlos
• Verfügbar für: CS5, CS6, CC

Transform Each ist ein Skript, mit dem Sie mehrere Objekte gleichzeitig transformieren können, ohne ihre Position zu ändern. Was das bedeutet, wird am besten durch das folgende GIF veranschaulicht. Wählen Sie Ihre Ankerpunkte, die Transformation, die Sie erreichen möchten, und Sie gelangen mit einem Klick dorthin.

ToonIt!

• Preis: $129
• Verfügbar für: Photoshop CS und höher

Ein Spaß am Ende. Falls Sie jemals daran denken, eine Online-Graphic Novel zu erstellen, wird dieser Service eine große Hilfe sein. Es verwandelt normale Fotos in Cartoons, verfügt über viele Voreinstellungen und ausgereifte Technologie. Allerdings etwas teuer.

Photoshop-Plugins in Kürze…

Photoshop ist ein wunderbares Werkzeug für Webdesigner. Es ist leistungsstark, vollgepackt mit Funktionen und wird ständig aktualisiert.

Manchmal wünschen wir uns jedoch einige zusätzliche Funktionen oder einfachere Möglichkeiten, Aufgaben zu erledigen. Hier kommen Photoshop-Plugins ins Spiel.

Wie Sie aus der obigen Liste gesehen haben, können Plugins viele verschiedene Funktionen hinzufügen. Von Shortcuts bis hin zu völlig neuen Funktionen.

Und das sind nur die, die für das Webdesign nützlich sind. Es gibt noch viel mehr, insbesondere für die Bildretusche. Haben Sie etwas hinzuzufügen?

Kennen Sie zusätzliche Photoshop-Plugins, die Sie mögen und empfehlen? Bitte in den Kommentaren unten teilen!

Miniaturansicht des Artikels von VectorsMarket / shutterstock.com