Die 8 besten Google Chrome-Erweiterungen für Designer

Google Chrome-Erweiterungen für Designer

Egal, ob Sie etwas benötigen, um Schriftarten vorzuschauen oder Ihre Arbeitsabläufe zu verwalten, in diesem umfassenden Leitfaden finden Sie die besten Google Chrome-Erweiterungen für Designer. Diese Plugins sind ideal, egal ob Sie ein ernsthafter Hobbyist oder ein Profi sind.

Inhaltsverzeichnis

    1. Figma
    1. Adobe Express
    1. Google Font Previewer
    1. HTML zu Design
    1. ColorZilla
    1. Miro Chrome-Such-Erweiterung
    1. Designer-Tools
    1. PerfectPixel

1. Figma

Preis: Kostenlos mit Premium-Optionen

Figma ist bei UX-Designern und Grafikdesignern gleichermaßen beliebt, und seine Chrome-Erweiterung hilft Ihnen, die Ereignisse, die Sie in Google Kalender erstellen, besser anzupassen.

Figma Chrome-Erweiterung

Sie können Ihre FigJam-Boards direkt teilen, wenn Sie die Chrome-Erweiterung von Figma verwenden. Diese Funktion kann verwendet werden, um eine Präsentation durchzuführen oder zusätzlichen Kontext vor einem Meeting hinzuzufügen.

Die Figma Chrome-Erweiterung ermöglicht es Ihnen auch, eine beliebige Ihrer Figma-Dateien zu einem Google Kalenderereignis hinzuzufügen. Neben dem Hinzufügen vorhandener Dateien können Sie auch neue erstellen und FigJam-Boards über Ihren Kalender anlegen. Darüber hinaus funktioniert das Plugin als schneller Zugriff auf die Website von Figma.

2. Adobe Express

Preis: Kostenlos mit Premium-Optionen

Während ich immer noch empfehle, fortgeschrittenere Tools wie Adobe InDesign und Adobe Illustrator für komplexe Designs zu verwenden, ist Adobe Express großartig für grundlegende Prototypen und Social-Media-Beiträge. Sie können Bilder schnell zuschneiden und die Größe ändern sowie Hintergründe entfernen.

Verwendung des Adobe Express-Plugins für Google Chrome

Die Adobe Express Chrome-Erweiterung ermöglicht es Ihnen, schnell neue Designs zu erstellen, ohne zur Website navigieren zu müssen. Nach dem Klicken auf Erstellen haben Sie Zugriff auf die gesamte Bibliothek.

Bei der Verwendung dieser Erweiterung können Sie auch Bilder von Ihrem Computer oder Ihrer Festplatte in PNG oder JPEG konvertieren. Es funktioniert jedoch nicht zum Speichern und Konvertieren von WEBP-Dateien in JPEG.

3. Google Font Previewer

Preis: Kostenlos

Zu verstehen, wie Schriftarten zusammenarbeiten, ist einer der entscheidendsten Aspekte des Designs, aber zu wissen, wie sie aussehen werden, ist manchmal herausfordernd. Google Font Previewer ermöglicht es Ihnen, eine Vorschau zu sehen, wie Seiten mit zahlreichen angewendeten Schriftarten aussehen werden.

Google Fonts Previewer Plugin

Um die Schriftarten auszuwählen, die Sie hinzufügen möchten, finden Sie auf der rechten Seite eine umfassende Liste. Sie können auch wählen, ob Sie nicht-lateinische Symbole wie Arabisch und Koreanisch verwenden möchten.

Sehen Sie, wie Ihre Schriftarten mit verschiedenen Teilen der Seite interagieren, indem Sie die Groß- und Kleinschreibung ändern. Darüber hinaus können Sie zwischen normal und fett wählen. Sobald Sie wissen, wie Sie Ihre Schriftarten ändern möchten, können Sie sie in einem WordPress-Theme oder Website-Builder, den Sie verwenden, anpassen.

4. HTML zu Design

Preis: Kostenlos mit Premium-Optionen

Sie benötigen das Figma-Plugin, um HTML zu Design zu verwenden, aber es ist eine sehr leistungsstarke Chrome-Erweiterung für Designer, sobald Sie beide installiert haben. Sie können die Chrome-Seiten, die Sie durchsuchen, in Figma-Designs umwandeln.

Die HTML zu Design-Erweiterung in Google Chrome

HTML zu Design ermöglicht es Ihnen, die Breite Ihres Designs anzupassen. Ich empfehle, mit der Breite des Browsers zu beginnen, wenn Sie eine Webseite entwerfen, aber Sie können immer die mobile Option wählen, wenn Sie eine App oder eine mobile Seite erstellen.

Das HTML zu Design-Plugin ermöglicht es Ihnen, die gesamte Seite oder einen bestimmten Teil davon sowie den Licht- oder Dunkelmodus auszuwählen.

5. ColorZilla

Preis: Kostenlos

Die genauen RGB-Zahlen zu kennen, ist eine der größten Herausforderungen, aber die ColorZilla Chrome-Erweiterung erleichtert diese Aufgabe für Designer. Das Plugin zeigt Ihnen die genauen Zahlen, die für jede Farbe auf Ihrer Webseite benötigt werden, egal ob es sich um ein Logo, ein Foto oder etwas anderes handelt.

Die ColorZilla Google Chrome-Erweiterung

Neben der Auswahl einer Farbe von einer bestimmten Webseite ermöglicht es ColorZilla auch, eine von außerhalb Ihres Browsers auszuwählen. Das Plugin führt auch eine Historie Ihrer Auswahl, sodass Sie jederzeit darauf zurückgreifen können.

Dieser Farbwähler hat auch einen Farbpaletten-Browser, der es Ihnen ermöglicht, die RGB-Zahlen für häufig verwendete Farben zu sehen.

Der ColorZilla RGB-Auswähler

6. Miro Chrome-Such-Erweiterung

Preis: Kostenlos mit Premium-Optionen

Wenn Sie schnellen Zugriff auf Ihre Miro-Projekte wünschen, sollten Sie die Miro Chrome-Such-Erweiterung herunterladen. Nach der Integration dieses Plugins können Sie alle Ihre Dokumente direkt aus dem Chrome-URL-Feld suchen.

Die Chrome-Such-Erweiterung für Miro

Um Ihre Ergebnisse zu finden, geben Sie “miro” gefolgt von Ihrem Dateinamen ein. Sie werden bemerken, dass sich die URL in Miro-Suche ändert.

Nachdem Sie die Eingabetaste gedrückt haben, werden Sie zu Ihrem Miro-Dashboard weitergeleitet.

7. Designer-Tools

Preis: Kostenlos mit Premium-Optionen

Designer-Tools ist eine großartige Chrome-Erweiterung, die es Ihnen ermöglicht, Maße zu lernen, wenn Sie Ihre Apps und Webseiten entwerfen. Erfahren Sie, wie viele Pixel jeder Aspekt einer von Ihnen besuchten Seite hat, wie z.B. die Textfelder und Grafiken.

Sie können auch Pixel für verschiedene Abschnitte vergleichen, indem Sie auf einen klicken und den Cursor über den nächsten bewegen, den Sie messen möchten.

Die Design-Tools-Erweiterung für Google Chrome

Designer-Tools ermöglicht es Ihnen, Aspekte zu speichern und Raster hinzuzufügen, um genauere Messungen zu erhalten. Lernen Sie auch über die Pixel-Skalierung, um die Nutzung dieses Tools zu maximieren.

8. PerfectPixel

Preis: Kostenlos mit Premium-Optionen

PerfectPixel ermöglicht es Ihnen, mehrere Ebenen hinzuzufügen, indem Sie visuelle Assets von Ihrem Computer hochladen. Sie können auch von Ihrer Zwischenablage kopieren und einfügen. Wenn Sie Ihr Projekt später abschließen möchten, ist es einfach, Ihren Fortschritt zu speichern.

Die PerfectPixel-Erweiterung für Google Chrome

Um Verwirrung zu vermeiden, fügen Sie für jede Webseite unterschiedliche Layouts hinzu. Sie können auch Ihre hochgeladenen Ebenen per Drag & Drop genau dorthin ziehen, wo Sie sie haben möchten.

PerfectPixel ermöglicht es Ihnen, Elemente mit einem Klick links, in der Mitte oder rechts zu platzieren. Sie finden auch mehrere Shortcuts, um Ihren Arbeitsablauf zu optimieren.

Egal, ob Sie nach bestimmten Farben suchen oder neue Elemente auf einer Webseite entwerfen möchten, die besten Chrome-Erweiterungen für Designer können Ihnen helfen. Sie finden auch viele Tools, um Software effektiver zu durchsuchen. Sie sollten in Betracht ziehen, diese mit Chrome-Erweiterungen zu kombinieren, die Ihr Sucherlebnis verbessern, um die Produktivität noch weiter zu steigern.

Bildnachweis: DALL-E. Alle Screenshots von Danny Maiorca.