Die 11 besten Chrome-Erweiterungen für Designer

Niemand weiß besser als UX-Designer, wie scheinbar kleine Änderungen an Benutzerfreundlichkeit und Effizienz tatsächlich einen großen Unterschied für die Erfahrung eines Benutzers machen können.

Und obwohl nur wenige mehr Zeit damit verbringen, im Internet zu surfen als Designer, können selbst die Klügsten unter uns die Qualität dieser Erfahrung möglicherweise nicht maximieren.

Vor diesem Hintergrund haben wir 11 der besten Chrome-Erweiterungen für Designer zusammengestellt.

Webstuhl

Wahrscheinlich verbringen Sie ziemlich viel Zeit damit, mit anderen Teamkollegen über Probleme im Zusammenhang mit Benutzerabläufen, Designproblemen oder anderen Fehlern zu kommunizieren. Loom kann Ihr Leben viel einfacher machen.

Mit der Erweiterung können Sie ein Video von dem, was Sie auf Ihrem Bildschirm sehen – sowie von Ihrer Frontkamera – aufnehmen und kommentieren, bevor Sie es mit einem einfachen Link teilen.

Wenn Sie auf Loom verkauft werden, ziehen Sie den kostenpflichtigen Premium-Service in Betracht, der 4K-Videos, unbegrenzten Videospeicher, Zeichenwerkzeuge, Mausklick-Hervorhebung und eine Reihe von Bearbeitungsoptionen einschließlich Call-to-Action-Schaltflächen und benutzerdefinierten Miniaturansichten ermöglicht.

Fenster-Resizer

Designer müssen wissen, wie jeder ihre Webangebote erleben wird, und ein Layout, das auf Ihrem Bildschirm schön aussieht – was, seien wir ehrlich, wahrscheinlich erstklassig ist – könnte auf einem alternden iPhone floppen.

Window Resizer hilft dabei, diesen blinden Fleck zu beseitigen, indem die Größe des Browserfensters angepasst wird, um eine Reihe von Bildschirmauflösungen zu reproduzieren. Sie können Ihre Auflösungsliste anpassen, Sie können mit der Größe und Position des Fensters herumspielen, und für zusätzliche Effizienz können Sie mit der Erweiterung auch globale Tastenkombinationen erstellen.

Muzli

Wenn Sie in Ihrem Tag ein wenig zusätzliche Designinspiration gebrauchen könnten – und wer könnte das nicht? – Muzli ist für Sie und kuratiert fesselnde visuelle Designs aus dem ganzen Web, durch die Sie blättern können, während Sie Ihren Morgenkaffee schlürfen.

Mit mehr als 150 Quellen aus dem Internet, darunter Dribbble, Mashable und Product Hunt, bringt Muzli Ihnen jedes Mal, wenn Sie einen neuen Tab öffnen, die neuesten Designideen, Projekte und Neuigkeiten.

Sehen Sie etwas, das Sie interessiert? Klicken Sie sich durch und erfahren Sie mehr in einem neuen Browserfenster.

Seitenlineal

UX-Designer neigen dazu, eine einfache, aber effektive Idee zu schätzen, und das fasst Page Ruler zusammen.

Anstatt Zeit damit zu verschwenden, die Größe von Objekten auf einer Webseite mit dem Screenshot-Tool sorgfältig zu messen, lassen Sie Page Ruler schnell ein Lineal ziehen und Pixelabmessungen und -positionen sowie alle Elemente auf einer Seite vergrößern.

ColorZilla

Wahrscheinlich haben Sie oft Gelegenheit, schnell herauszufinden, welche Farbe auf einer Webseite verwendet wird – und ColorZilla kann Ihnen dabei helfen, so viel schneller dorthin zu gelangen.

ColorZilla war lange Zeit eine der beliebtesten Firefox-Erweiterungen, bevor es schließlich zu Chrome kam. Es verfügt über eine fortschrittliche Pipette, um die Farbe jedes Pixels auf jeder Seite zu bestimmen, einen CSS-Verlaufsgenerator und einen Farbwähler.

Wenn Sie eine Farbe sehen, die Ihnen gefällt, macht es ColorZilla zum Kinderspiel, die Hex- und RGB-Werte zu nehmen und sie in Ihre Zwischenablage einzufügen.

Schriftart Ninja

Sind Sie der Typ, der das Internet nach frischen Schriftideen durchsucht? Designer – und Schriftfanatiker im Allgemeinen – werden diese elegante Erweiterung installieren wollen, mit der Sie Schriftarten identifizieren können, die auf jeder Website verwendet werden, und sie schnell in Ihre Designsoftware einfügen können.

Die „Fonts DNA Engine“ von Fontface Ninja zeigt nicht nur den CSS-Namen, sondern den echten Namen jeder angezeigten Schriftart an und lässt Sie diese dann legal ausprobieren. Wenn es Ihnen gefällt, stellt Fontface Ninja auch einen Link bereit, um die entsprechende Lizenz zu kaufen.

Spektrum

Es wird geschätzt, dass Farbsehstörungen – auch als Farbenblindheit bekannt – Millionen Menschen auf der ganzen Welt betreffen. Um sicherzustellen, dass diese Personen eine positive Erfahrung mit Ihren Webseiten machen, probieren Sie Spectrum aus, das Websites schnell testet, um zu sehen, wie sie für Menschen mit verschiedenen Arten von Farbenblindheit aussehen.

Die Erweiterung soll vor allem für Websites mit Datenvisualisierungen hilfreich sein, da einige Farben in den Diagrammen nicht voneinander zu unterscheiden sein könnten.

Checkbot

Sicherzustellen, dass alle Ihre Links tatsächlich funktionieren, dass Ihre Formulare sicher sind und dass Ihre Website schnell und einfach zu navigieren ist, sind alles wichtige Usability-Anliegen für einen UX-Designer. Checkbot hält Ihnen den Rücken frei und deckt alle Probleme auf, die Sie nicht bemerkt haben.

Durch das gleichzeitige Testen von Hunderten von Seiten kann Checkbot defekte Links, HTML-/JavaScript-/CSS-Fehler, doppelte Titel, Sicherheitsprobleme, Weiterleitungsketten und gemischte Inhaltsfehler entdecken.

Tatsächlich testet Checkbot Ihre Website auf über 50 Best Practices für SEO, Geschwindigkeit und Sicherheit.

SVG-Grabber

Müssen Sie häufig Logos, Symbole, Illustrationen oder andere Grafiken von anderen Websites abrufen? Dann könnte Ihnen SVG Grabber viel Zeit und Mühe ersparen.

Es ist ein Tool, mit dem Sie schnell alle SVG-Assets von einer Website in der Vorschau anzeigen und abrufen können. Mit nur einem Klick wickelt die Erweiterung automatisch alle SVGs auf einer Seite ein, bevor Sie die benötigten SVGs durchsuchen und schnell herunterladen können.

UX-Check

Einfach ausgedrückt macht UX Check heuristische Auswertungen zum Kinderspiel.

Mit der Erweiterung können Sie Ihre Website auf Usability-Probleme scannen, damit Sie sie testen können, ohne echte Benutzer zu haben. UX Check markiert alle Bereiche Ihrer Website, die verbessert werden müssen, basierend auf den 10 allgemeinen Prinzipien der Nielsen Norman Group für das Interaktionsdesign – zu denen die Sichtbarkeit des Systemstatus, Fehlervermeidung sowie Konsistenz und Standards gehören – und speichert einen Screenshot des Problems.

Wenn Sie fertig sind, können Sie alles in eine Dokumentdatei exportieren, um es einfach mit Teamkollegen zu teilen.

Unternehmens-Ipsum

Wenn Sie ein neues Design testen – insbesondere eines, das besonders textlastig ist – haben Sie vielleicht den üblichen ersten Absatz von Lorem Ipsum satt. Für die Latein-Müdigen unter uns ist Corporate Ipsum eine unterhaltsame Erweiterung, die willkürlich Unternehmensdoppelsprache zur Verwendung als Fülltext heraufbeschwört.

Anstelle der langen Kette von Blindtexten, die Sie gewohnt sind, werden Sie möglicherweise stattdessen mit – zum Beispiel – Unternehmensjargon wie diesem begrüßt: „Integrierte Vortals mit installierten Basismethoden effizient nutzen“.

Lediglich englische statt lateinische Wörter lassen das Design viel natürlicher wirken, und dass der willkürlich zusammengesetzte Text oft überhaupt keinen Sinn ergibt, macht einfach den Charme der Erweiterung aus.

Erfahren Sie mehr über die UX-Design-Kurse von BrainStation.