Als Ersteller von Inhalten auf YouTube, der sich hauptsächlich auf Desktop-Kreativsoftware konzentriert, habe ich im Laufe der Jahre unzählige Benutzeroberflächen gesehen.

Es gibt sicherlich viele Ersteller, Entwickler, Benutzer usw., die viel mehr Softwareschnittstellen erlebt oder getestet haben als ich. Ich habe jedoch ein respektables Füllhorn an Software in verschiedenen Phasen ihrer Entwicklung sowohl für die Forschung als auch getestet und damit gearbeitet Zwecke der Inhaltserstellung.

Ich habe solche wie verwendet GIMP, Premiere Pro, Photoshop, After Effects, Illustrator, Affinity Photo, Affinity Designer, Affinity Publisher, InDesign, Scribus, LibreOffice, Blender, dunkler Tisch, RawTherapee, OBS, Krita, DaVinci Resolve, Final Cut, Olive und mehr. Diese Programme umfassen verschiedene Kategorien kreativer Software, und sie alle haben Dinge, die ich an ihnen mag, und Dinge, die ich nicht mag – in unterschiedlichem Maße.

Die Benutzeroberfläche (was für „Benutzerschnittstelle“) in jedem dieser Programme kann stark variieren, da diese Liste verschiedene kreative Kategorien umfasst und sowohl kostenlose als auch kostenpflichtige Software enthält.

Es gibt jedoch ein Programm, das sich kürzlich von der oben genannten Software – kostenlos und kostenpflichtig – abhebt, dank einer kürzlich erschienenen Hauptversion, die wichtige Updates für seine Benutzeroberfläche eingeführt hat. Dieses Programm ist Inkscape.

Hier ist der Grund.

Vor kurzem hat Inkscape eine Beta-Version für die bevorstehende stabile Version 1.2 veröffentlicht. Wenn Sie mit Inkscape nicht vertraut sind, es ist ein kostenloser und quelloffener Vektorgrafik-Editor. Es ist am ehesten mit Illustrator vergleichbar – obwohl es wahrscheinlich besser ist, es in Bezug auf ein Dr. Strange-Multiversum zu betrachten, in dem Illustrator in einem Universum und Inkscape in dem anderen existiert.

Inkscape 1.2: Eine sehr kurze Geschichte

Inkscape hatte meiner Meinung nach schon immer eine Menge Potenzial, war aber auch schrullig. Es „skurril“ zu nennen, ist schön ausgedrückt – „buggy“ ist vielleicht ein besserer Begriff. Es genügt zu sagen, dass es dafür bekannt ist, dass es häufig abstürzt und viele Einschränkungen hat.

Dies gilt insbesondere, da Inkscape 1.0 wurde 2020 veröffentlicht – was das Programm in Bezug auf Features und Funktionalität auf ein ganz neues Niveau brachte, aber das Programm viel instabiler machte. Inkscape 1.0 zeigte uns auch, dass das Programm in Bezug auf das UI-Design in eine bessere Richtung ging, aber im Vergleich zu anderer moderner Kreativsoftware nichts Besonderes war.

Im Frühjahr 2021, Das Inkscape-Team hat Inkscape 1.1 veröffentlicht, und es wurde deutlich, dass die Gemeinschaft der freiwilligen Inkscape-Entwickler begann, den Fokus auf die Verbesserung der Benutzererfahrung durch eine bessere Benutzeroberfläche zu verlagern.

Mit dieser Version hat Inkscape einen „Willkommensbildschirm“ eingeführt, der in kostenpflichtiger Software ziemlich üblich ist, aber in kostenloser und Open-Source-Software kaum zu finden ist. Andere bemerkenswerte UI-Ergänzungen oder -Änderungen, die in Inkscape 1.1 eingeführt wurden, umfassen eine „Befehlspalette“, die Benutzern hilft, Dinge wie Filter oder Aktionen, andockbare Dialoge (was bedeutet, dass Dialoge an neue Positionen auf der Leinwand verschoben werden können) und verbesserte Exportfunktionen einfach zu suchen und anzuwenden und Unterstützung für den Export in neue Dateiformate.

Diese UI-Verbesserungen in Inkscape 1.0 und Inskcape 1.1 sind großartig und haben dazu beigetragen, dass Inkscape inkrementelle Fortschritte auf dem Weg zu besserer Software gemacht hat. So hilfreich und aufregend diese Funktionen auch sind, sie haben lediglich die Grundlage für das geschaffen, was noch kommen sollte.

Im Mai 2022 wurde Inkscape 1.2 Beta veröffentlicht und hat meiner Meinung nach die Messlatte für das UI-Design höher gelegt.

Die Messlatte wurde höher gelegt, weil die Benutzeroberfläche von Inkscape 1.2 nicht nur gut aussieht, sondern Sie auch mehr als jedes andere Programm (das ich persönlich erlebt habe) anpassen können. Und wie es aussieht und wie es angepasst werden kann das Ergebnis von Benutzerfeedback, Entwickler, die das Feedback anerkennen und diskutieren, Entwickler, die die optimalsten Manifestationen dieses Feedbacks implementieren, und Benutzer, die die Implementierungen testen und die Feedback-Schleife von vorne beginnen.

Es ist Softwareentwicklung, demokratisiert. Es ist eine wunderbare Fallstudie darüber, warum es freie und Open-Source-Software gibt und wie großartige Dinge durch Community-Entwicklung erreicht werden können.

Warum die Benutzeroberfläche von Inkscape 1.2 heraussticht

Also, was gefällt mir besonders an der neuen Benutzeroberfläche von Inkscape 1.2?

Der Begrüßungsbildschirm wird aktualisiert

Auf Anhieb war der Begrüßungsbildschirm (der wiederum war erstmals in Inkscape 1.1 eingeführt) ermöglicht es dem Benutzer, die Benutzeroberfläche mit der Registerkarte „Schnelleinrichtung“ (in der obigen Abbildung grün umrandet) anzupassen. Hier kann der Benutzer:

  • wählen Sie ihre Leinwandkonfiguration,
  • Tastaturkürzel festlegen,
  • Legen Sie Symbolstile und -farben fest (in der Dropdown-Liste Aussehen) und
  • Schalten Sie die UI-Farben um, um zwischen hellem oder dunklem Modus zu wählen

Der Begrüßungsbildschirm reagiert, sodass die von Ihnen ausgewählten Symbole automatisch die Symbolvorschau am unteren Rand des Fensters aktualisieren (gelber Pfeil im Bild oben). Außerdem ändert sich die Farbe des Begrüßungsbildschirms beim Umschalten zwischen Hell- und Dunkelmodus (roter Pfeil).

Sie können dann zur Registerkarte „Zeit zum Zeichnen“ navigieren (im Bild oben grün umrandet) und entweder ein zuletzt verwendetes Dokument öffnen, eine Vorlage aus einer der Vorlagenkategorien auswählen (hellblau umrandet) oder ein neues Dokument laden von Ihrem Computer (über die Schaltfläche „Laden“, die angezeigt wird, wenn Sie sich auf der Registerkarte „Vorhandene Dateien“ befinden – im Bild oben rot umrandet). Die letzte Option wurde in Inkscape 1.2 eingeführt – was dazu beitrug, den Funktionsumfang für die Dokumentenerstellung im Begrüßungsbildschirm abzurunden.

Ich öffne eine 1920×1080 px große Seite, indem ich auf die entsprechende Vorlagendatei (roter Pfeil) unter der Registerkarte „Bildschirm“ klicke.

Die neue Leinwand

Beim Öffnen eines neuen Dokuments in Inkscape werden Benutzer früherer Versionen von Inkscape einen überarbeiteten und sauberer aussehenden Leinwandbereich bemerken. Für Inkscape 1.2 haben die Entwickler den Rand um die Seite aktualisiert, die Farbe des „Schreibtischs“ (oder der grauen Grenze um die Seite – roter Pfeil im obigen Bild) geändert und das Aussehen des Schlagschattens unter der Seite verbessert ( grüner Pfeil). Diese subtilen, aber wichtigen Änderungen tragen dazu bei, dass sich Inkscape wohler und vertrauter anfühlt (insbesondere beim Wechsel von Illustrator).

Das brandneue Seiten-Tool (mehrseitige Kompositionen)

Apropos Leinwandbereich – Inkscape 1.2 unterstützt jetzt mehrseitige Dokumente.

Für diejenigen unter Ihnen, die von Illustrator kommen, lassen Sie mich übersetzen: Inkscape unterstützt jetzt mehrere Zeichenflächen.

Diese Funktion wird mit dem „Seitenwerkzeug“ (roter Pfeil im Bild oben) gesteuert, das im Wesentlichen mit dem „Zeichenflächenwerkzeug“ von Illustrator identisch ist. Mit diesem neuen Werkzeug können Sie entweder schnell neue Seiten freihändig zeichnen oder die Steuerleiste (grün umrandet) verwenden, um neue Seiten basierend auf Dokumentvorgaben präziser zu erstellen.

Sie können auch jede Seite auswählen und ihre Größe ändern, die Seite durch Klicken und Ziehen verschieben oder die Seitengröße an eine beliebige Auswahl oder Grafik auf der Seite anpassen. Schließlich können Sie Ihre mehreren Seiten als mehrseitiges PDF exportieren.

Diese mehrseitige Funktion mit einem begleitenden Seitenwerkzeug ist eine lang erwartete Funktion, die Designern helfen sollte, komplexere, professionellere Projekte zu übernehmen.

Wahnsinnige Anpassungsmöglichkeiten

Wenn Sie mit dem Aussehen der gesamten Benutzeroberfläche basierend auf den Entscheidungen, die Sie auf dem Willkommensbildschirm getroffen haben, nicht zufrieden sind, können Sie die Farben und Größen aller Bildschirmelemente ändern, indem Sie zu Bearbeiten> Einstellungen> Oberfläche> Themen gehen (roter Pfeil im Bild oben).

Unter der Überschrift „Design“ (im obigen Bild grün umrandet) können Sie unter „GTK-Design ändern“ durch die GTK-Designs scrollen und Live-Vorschauen der verschiedenen Designstile sehen, wenn Sie auf die einzelnen Optionen klicken. Sie können auch Schieberegler verwenden, um die Schriftgröße der Benutzeroberfläche oder den Kontrast zwischen der Hintergrundfarbe der Benutzeroberfläche und dem Text und den Symbolen (grüner Pfeil) anzupassen. Wo haben Sie schon einen Kontrastschieber gesehen?

Unter der Überschrift „Symbole“ (in der obigen Abbildung gelb umrandet) können Sie mithilfe der Dropdown-Liste „Symboldesign ändern“ aus einem von vier Symboldesigns auswählen. Wenn Sie entweder die Option „mehrfarbig“ oder „hi color“ auswählen, erhalten Sie zusätzliche Optionen, wie z. B. die Auswahl der „symbolischen“ Version der Symbole (gelber Pfeil) oder die Auswahl der für die symbolischen Symbole verwendeten Farben (hell blauer Pfeil) – einschließlich der „Symbol-Farbbasis“ und drei „Symbol-Farbhervorhebungen“. Diese Farben können beliebig sein und können aus einem Farbrad, aus den Schiebereglern für den von Ihnen gewählten Farbmodus oder durch Verwendung eines HEX-Codes ausgewählt werden.

Wenn ich zu Interface>Toolbars (roter Pfeil in der Abbildung oben) navigiere, während ich mich noch im Dialogfeld "Einstellungen" befinde, sehen Sie Anpassungen für die Symbolleiste und die Symbole, die in der gesamten Benutzeroberfläche verwendet werden. Alle Werkzeuge, die hier im Abschnitt „Symbolleisten“ (gelb umrandet) angezeigt werden, sind standardmäßig aktiviert und werden daher in der Symbolleiste angezeigt. Durch Klicken auf eines der Symbole (hellblauer Pfeil) wird dieses Werkzeug „aus“ geschaltet und in der Symbolleiste ausgeblendet.

Unter den Symbolleistensymbolen befinden sich zwei Schieberegler. Mit dem oberen Schieberegler (roter Pfeil auf dem Foto oben) können Sie die Größe der Symbolleistensymbole (rot umrandet) anpassen, und mit dem unteren Schieberegler (leicht verschwommener Pfeil) können Sie die Größe der Steuerleistensymbole (in hellblau). Sie werden feststellen, dass beide bei 100 % beginnen und auf 300 % ansteigen. Dies bedeutet, dass Sie die Symbolgröße auf das Dreifache ihrer ursprünglichen Größe erhöhen können. Die Inkremente zwischen diesen Werten sind ebenfalls ziemlich klein (irgendwo in Schritten von etwa 5 %), was ein beispielloses Maß an Granularität für Anpassungen an den UI-Symbolen demonstriert.

Dies ist nur eines von vielen Beispielen für ein hohes Maß an Kontrolle über das Erscheinungsbild des Programms, das Sie in dieser neuen Version sehen werden. Lassen Sie uns den Einstellungsdialog verlassen, um einige andere erstaunliche UI-Funktionen in Inkscape 1.2 zu präsentieren.

Aktualisierte Farbpalette für mehr Kontrolle und Anpassung

Unterhalb des Leinwandbereichs befindet sich die Farbpalette – der Bereich, in dem Sie Farben für Dinge wie Objekte und Text auswählen (im obigen Foto grün umrandet). In früheren Versionen verwendete diese Palette eine eigene dedizierte Bildlaufleiste und die Farbkacheln hatten eine feste Größe.

Die Bildlaufleiste der Farbpalette war wegen der Leinwand problematisch ebenfalls verwendet eine Bildlaufleiste (rote Pfeile im Bild oben), um horizontal auf der Seite zu navigieren. Mit anderen Worten, es gab zwei Bildlaufleisten in der gleichen Umgebung, was es für neue Benutzer verwirrend machte, eine Leiste von der anderen zu unterscheiden. Noch verwirrender für neue Benutzer war, dass die Bildlaufleiste für die Farbpalette nur beim Bewegen der Maus angezeigt wurde – so dass sie leicht übersehen werden konnte, wenn Sie nicht wussten, dass sie vorhanden war.

In Inkscape 1.2 wurde die Bildlaufleiste durch Aufwärts- und Abwärtspfeile auf der rechten Seite der Farbpalette ersetzt (gekennzeichnet durch den roten Pfeil und im Bild oben rot umrandet), um Benutzern das Suchen oder Scrollen durch die verschiedenen verfügbaren zu erleichtern Farben.

Direkt rechts neben den Aufwärts- und Abwärtspfeilen befindet sich das Menü zum Anzeigen und Auswählen anderer verfügbarer Farbpaletten (roter Pfeil im Bild). Diese Funktion wurde aktualisiert und enthält jetzt kleine Farbvorschauen der verschiedenen Farbfelder, die in jeder Farbpalette verfügbar sind (grün hervorgehobener Bereich – Sie können die kleinen Farbvorschauen unter dem Namen jeder Farbpalette sehen).

Außerdem befindet sich ganz unten in diesem Menü ein Link „Konfigurieren“ (hellblauer Pfeil).

Hier kann der Benutzer nun Anpassungen am Erscheinungsbild der Farbpalette vornehmen. Anpassbar sind die Größe der Farbkacheln mit dem Schieberegler „Kachelgröße“ (roter Pfeil), das Seitenverhältnis (grüner Pfeil – Verhältnis der Breite zur Höhe, wobei 0 auf dem Schieberegler ein Quadrat ist) der Farbe Kacheln, die Rahmengröße um jede Kachel (hellblauer Pfeil) und die Anzahl der Musterreihen, die in der Farbleiste angezeigt werden (gelber Pfeil). Sie können auf dem Foto sehen, dass ich mehrere Anpassungen vorgenommen habe, darunter das Vergrößern der Kachelgrößen, das Zusammendrücken der Kacheln durch Erhöhen des Seitenverhältnisses, das Hinzufügen eines dickeren Rahmens um jede Kachel und das Erhöhen der Anzahl der angezeigten Kachelreihen auf 3.

Auch hier geben diese granularen Einstellungen den Benutzern die ultimative Kontrolle über das Erscheinungsbild der Farbpalette und der Benutzeroberfläche von Inkscape 1.2. Dies gilt insbesondere angesichts der Tatsache, dass die Größe und das Styling der Elemente durch benutzerfreundliche Schieberegler und nicht durch klobigere Alternativen gesteuert werden und die Schieberegler einen breiten Wertebereich haben.

Lassen Sie uns durch einen Vergleich demonstrieren, wie unglaublich das ist.

Der Schieberegler „Kachelgröße“, der in diesem Konfigurationsdialog für die Farbpalette (roter Pfeil im obigen Bild) angezeigt wird, enthält Werte von 4 bis 32 in Schritten von 1 (was bedeutet, dass es insgesamt 19 Werte gibt, einschließlich sowohl 4 als auch 32). Alternativ bietet das Bedienfeld „Farbfelder“ von Adobe Illustrator nur 3 Werte für Kachelgrößen – „klein“, „mittel“ und „groß“. Illustrator, eine kostenpflichtige Software, bietet viel weniger Kontrolle oder Anpassbarkeit als das neue Inkscape 1.2 – das völlig kostenlos ist.

Vereinfachtes Einrasten und intelligente Hilfslinien

Ein letztes Beispiel, das ich in diesem Artikel behandeln werde, das die erstaunliche neue Benutzeroberfläche von Inkscape demonstriert, ist die neu überarbeitete „Snap Controls Bar“. In früheren Versionen von Inkscape befand sich diese Leiste entlang der gesamten rechten Seite der Leinwand und zeigte alle Symbole für die Fangsteuerung gleichzeitig an. Dies überschwemmte neue Benutzer verständlicherweise mit Auswahlmöglichkeiten und machte die Verwendung dieser Steuerelemente verwirrend und herausfordernd.

In Inkscape 1.2 wurde die Snap Controls-Leiste auf ein einzelnes Symbol und ein Strudelmenü oder „Popover-Menü“, wie Inkscape es gerne nennt (rot umrandet und durch den Pfeil im Bild gekennzeichnet). Durch Klicken auf das Symbol wird die Fangsteuerung aktiviert, während durch erneutes Klicken das Fangen deaktiviert wird. Wenn ein Benutzer mehr Kontrolle wünscht, kann er auf das Popover-Menü (das Symbol mit dem Dreieck) klicken, wo er ein Kontrollkästchen sieht, das Sie einfach darüber informiert, ob das Einrasten derzeit aktiviert ist oder nicht, und drei neue Symbole.

Die ersten beiden Symbole sind ziemlich standardmäßig: Fangen Sie an Begrenzungsrahmen (roter Pfeil) und aktivieren Sie das Fangen für Knoten (grüner Pfeil). Das dritte Symbol ist eine sehr aufregende und mit Spannung erwartete Funktion: On-Canvas-Ausrichtung, den Benutzern auch als „intelligente Hilfslinien“ bekannt (hellblauer Pfeil).

Wenn aktiviert (normalerweise standardmäßig deaktiviert, klicken Sie also auf das Symbol, um es zu aktivieren), sehen Benutzer jetzt Hilfslinien direkt auf ihrer Leinwand, während sie Objekte verschieben (roter Pfeil im Bild). Wie in anderer Software, einschließlich Adobe Illustrator oder Affinity Designer, helfen diese Hilfslinien den Benutzern, Objekte an der Mitte ihrer Seiten auszurichten, an der Mitte anderer Objekte auszurichten, Objekte gleichmäßig voneinander zu trennen oder sogar schnell Raster aus gleichmäßig verteilten Objekten zu erstellen.

Wenn Sie schließlich zum „Popover-Menü“ zurückkehren, gibt es am unteren Rand des Fensters einen Link mit der Bezeichnung „Erweiterter Modus“.

Dieser Link führt Sie zu zusätzlichen Fangsteuerungen, mit denen Sie einzelne Fangfunktionen aktivieren oder deaktivieren können. Dies sind alle Fangsteuerelemente, die in früheren Versionen entlang der gesamten rechten Seite des Inkscape-Leinwandfensters angezeigt wurden. Sie sind jetzt ordentlich in diesem Menü versteckt. Um zum einfacheren Setup zurückzukehren, klicken Sie auf „Auf einfachen Fangmodus zurücksetzen“ (roter Pfeil im Bild).

Inkscape, der kostenlose Vektorgrafik-Editor, hat sein UI-Spiel mit dieser beeindruckenden Version von Inkscape 1.2 ernsthaft verbessert. Es bietet nicht nur eine granulare (Wort des Tages) Kontrolle über UI-Einstellungen auf mehreren Ebenen, es vereinfacht auch viele Kontrollen, um die Benutzererfahrung zu verbessern, während diese Kontrollen immer noch in leicht zugänglichen Menüs für fortgeschrittene Benutzer verfügbar sind.

Weitere Informationen zu den Neuerungen in Inkscape 1.2 finden Sie in meinem Video-Tutorial, in dem ALLE neuesten Funktionen dieser Mega-Release-Version (demnächst verfügbar!) behandelt werden. Und wie immer können Sie die neueste Version von Inkscape KOSTENLOS von herunterladen Inkscape.org.

Abonnieren Sie den DMD Newsletter

Abonnieren Sie den DMD Newsletter

Melden Sie sich an, um neue Tutorials, Kursaktualisierungen und die neuesten Nachrichten zu Ihrer bevorzugten Open Source-Software zu erhalten!

Sie haben erfolgreich abonniert!

Pin It auf Pinterest

Teilen Sie es