Moderne Benutzeroberfläche verwenden

Mit modernen Visualisierungsdesigns und Dashboardstilen können Sie übersichtliche, professionelle Diagramme und optimierte Dashboards mit verbesserter Datendichte erstellen. Durch die Verwendung aktualisierter Typografie, einer gezielten Farbhierarchie und adaptiver Layouts verbessert das moderne Design die Lesbarkeit von Daten und bietet eine einheitliche Ansichts- und Bearbeitungserfahrung.

Damit diese Designoptionen verwendet werden können, muss ein Administrator die Funktion in der Vorabversion Modern User Interface auf der Seite Vorabversion im Admin-Bereich aktivieren. Diese Funktion in der Vorabversion wird für alle Looker-Bereitstellungstypen unterstützt, einschließlich Looker (Original) und Looker (Google Cloud Core).

Wenn die Funktion in der Vorabversion Modern User Interface aktiviert ist, werden die folgenden Einstellungen und Aktualisierungen eingeführt:

  • Moderne Visualisierungen: Mit der Einstellung Visualisierungsdesign für Looker-Diagramme können Nutzer ein neues modernes Visualisierungsdesign für Looker-Diagramme auswählen.
  • Moderne Dashboards: Mit der Einstellung Dashboardstil für Dashboards können Nutzer einen neuen modernen Stil für Looker-Dashboards auswählen.

Moderne Visualisierungen

Wenn die Funktion in der Vorabversion Modern User Interface aktiviert ist, können Sie mit der Einstellung Visualisierungsdesign moderne oder klassische Visualisierungsdesigns für Ihre Looker-Diagramme auswählen. Wenn Sie das Visualisierungsdesign Modern auswählen, können Sie übersichtliche, lesbare und professionelle Diagramme mit einem klaren und modernen Erscheinungsbild erstellen.

Die folgende Abbildung zeigt einen Vergleich zwischen den modernen und klassischen Visualisierungsdesigns.

Unterstützte Diagrammtypen

Während der Vorabversion unterstützt das moderne Visualisierungsdesign die beliebtesten integrierten Diagrammtypen von Looker:

Alle anderen Diagrammtypen (z. B. Boxplot-, Trichter-, Karten-, Streudiagramme, Tabellen (Legacy), Zeitachsen- und Wasserfalldiagramme) werden vom modernen Visualisierungsdesign nicht unterstützt. Wenn in einem Look oder einem Explore ein nicht unterstützter Diagrammtyp verwendet wird, wird die Einstellung Visualisierungsdesign im Bearbeitungsmenü nicht angezeigt.

Unterschiede zwischen modernen und klassischen Visualisierungsdesigns

Das moderne Visualisierungsdesign wurde entwickelt, um das Diagrammlayout, die Typografie, die Farben und die interaktiven Verhaltensweisen zu optimieren.

In der folgenden Tabelle wird beschrieben, wie sich Visualisierungen, die das moderne Design verwenden, von Visualisierungen unterscheiden, die den klassischen Stil verwenden.

Visuelles Element Klassisches Visualisierungsdesign Modernes Visualisierungsdesign
Typografie
  • Verwendet eine einheitliche Schriftart (z. B. Roboto Regular) für alle Diagrammelemente.
  • Der gesamte Diagrammtext, einschließlich Titel und Werte, hat dieselbe dunkle Farbe.
  • Achsenbeschriftungen werden häufig diagonal gedreht oder mit Auslassungspunkten (...) angezeigt, um in den verfügbaren Platz zu passen.
  • Google Sans:Wird auf Titel, Überschriften und Legenden angewendet, wobei eine gezielte Gewichtung und Farbabstufung für eine klare Hierarchie verwendet wird.
  • Google Sans Text:Wird auf kleinere Beschriftungen und Achsen angewendet, um die Lesbarkeit zu verbessern.
  • Monospaced-Werte:Zahlen entlang der Diagrammachsen verwenden eine Schriftart mit fester Breite, um eine saubere vertikale Ausrichtung beizubehalten.
  • Adaptive Skalierung:Beschriftungen werden dynamisch angepasst und diagonale oder vertikale Drehungen werden nach Möglichkeit vermieden.
Standardfarben
  • Standardmäßig wird die Shoreline Farbsammlung für neue Diagramme verwendet.
  • Wenn die Admin-Einstellung Standardfarben für Visualisierungen auf eine andere Farbsammlung als die Standardeinstellung festgelegt ist (d. h. auf eine andere Farbsammlung als „Shoreline“), überschreibt diese Einstellung die Farbsammlung „Shoreline“ in neuen Diagrammen.
  • Die moderne Farbsammlung ist für Diagramme nicht verfügbar, wenn das klassische Visualisierungsdesign ausgewählt ist.
  • Standardmäßig wird die FarbsammlungModern für neue Diagramme verwendet.
  • Wenn die Admin-Einstellung Standardfarben für Visualisierungen auf eine andere Farbsammlung als die Standardeinstellung festgelegt ist (d. h. auf eine andere Farbsammlung als „Shoreline“), überschreibt diese Einstellung die moderne Farbsammlung in neuen Diagrammen.
  • Löst automatisch den optimalen Palettentyp (kategorisch, sequenziell oder divergierend) auf und wendet ihn basierend auf den Daten Ihrer Abfrage an.
Kartesische Diagramme (Balken-, Säulen-, Linien-, Flächendiagramme)
  • Gitternetzlinien und Achsenlinien sind gut sichtbar (dunkelgrau).
  • Säulen und Balken werden mit scharfen 90-Grad-Ecken gerendert.
  • Gitternetzlinien und Achsenlinien werden mit einer helleren, weicheren Farbe gedämpft, um die Aufmerksamkeit auf die Daten zu lenken.
  • Säulen und Balken werden mit abgerundeten Außenkanten (Eckenradius von 4 Pixeln) gerendert.
  • Der Abstand zwischen Säulen und Balken wird vergrößert, um eine klare Trennung zwischen den Segmenten zu gewährleisten.
Kreis- und Ringdiagramme
  • Segmente werden mit scharfen Ecken gerendert und liegen direkt nebeneinander.
  • Segmente haben abgerundete Außenkanten und einen geringen Abstand zueinander.
  • In den Legendenbeschriftungen werden Werte, Prozentsätze oder beides nebeneinander angezeigt.
Diagramme mit einem einzelnen Wert
  • Standardisierter Abstand, der unerwartet skaliert werden kann.
  • Großzügiger Abstand und angepasste Zeilenhöhen sorgen dafür, dass Titel, Werte und Vergleichsbeschriftungen getrennt und leicht zu lesen sind.
Interaktionen und Tooltips
  • Einfache Hover-Aktionen ohne dynamische Bewegung.
  • Tooltips haben scharfe Ecken und einen grauen Standardhintergrund.
  • Wenn Sie den Mauszeiger auf Kreisdiagrammsegmente bewegen oder sie auswählen, werden sie leicht vergrößert und vom Diagramm getrennt.
  • Wenn Sie den Mauszeiger auf ein Liniendiagramm bewegen, wird die entsprechende Linie leicht dicker, während die anderen Linien gedämpft werden.
  • Tooltips haben abgerundete Ecken, einen optimierten Abstand und einen dunkleren Hintergrund für einen hohen Kontrast. Unterstützt Touchscreens und Mobilgeräte.
  • Die Logik für die Dashboard-Kreuzfilterung und das Drill-down-Verhalten bleiben unverändert.

Die moderne Farbsammlung

Wenn die Funktion in der Vorabversion Modern User Interface aktiviert ist, wird die moderne Farbsammlung als Option für die Einstellung Standardfarben für Visualisierungen angezeigt. Auch wenn Sie die moderne Farbsammlung für diese Einstellung nicht auswählen, wird sie standardmäßig verwendet, wenn Sie das moderne Visualisierungsdesign für eine Visualisierung auswählen.

Die moderne Farbsammlung wurde mit den folgenden Zielen entwickelt:

  • Für ausreichenden Kontrast zwischen Diagrammelementen und Hintergründen sorgen, um die Sichtbarkeit und Barrierefreiheit zu gewährleisten.
  • Eine Farbfolge verwenden, die für Personen mit Farbblindheit unterscheidbar ist (mit deutlichem visuellen Kontrast).
  • Ablenkungen vermeiden und den Fokus auf die Daten richten, indem die Intensität der Farbpalette reduziert wird.

Modernes Visualisierungsdesign aktivieren (für Administratoren)

Damit das moderne Visualisierungsdesign in einer Instanz verfügbar ist, muss ein Looker-Administrator die Funktion in der Vorabversion Modern User Interface auf der Seite Vorabversion im Admin-Bereich aktivieren. Die Funktion in der Vorabversion ist standardmäßig deaktiviert.

Wenn die Funktion Modern User Interface aktiviert ist, wird das moderne Design zum Standarddesign für neue Abfragediagramme. Diagramme, die vor der Aktivierung der Funktion Modern User Interface erstellt wurden, übernehmen das moderne Design jedoch nicht automatisch.

Wenn Sie die Farbsammlung des modernen Designs als Standardpalette für alle neuen Visualisierungen in Looker festlegen möchten, einschließlich Visualisierungen, die keine Visualisierungsdesigns unterstützen, können Sie sie in der Einstellung Standardfarben für Visualisierungen auf der Seite Einstellungen im Admin-Bereich auswählen, sobald die Funktion in der Vorabversion Modern User Interface aktiviert ist. Mit dieser Einstellung werden nur die Farbpaletten aktiviert, nicht die anderen Funktionen des modernen Designs. Wenn Sie die Funktion Modern User Interface aktivieren und möchten, dass für neue Visualisierungen aller Diagrammtypen dieselben Standardfarben für Visualisierungen verwendet werden, wählen Sie für diese Einstellung Modern aus.

Designs für einzelne Diagramme auswählen

Wenn Sie ein Visualisierungsdesign für ein Diagramm festlegen möchten, benötigen Sie die entsprechenden Berechtigungen und müssen die Diagrammeinstellungen verwenden.

Nutzerberechtigungen

Wenn Sie Visualisierungen mit dem modernen Visualisierungsdesign verwenden und speichern möchten, benötigen Sie die folgenden Looker-Berechtigungen:

  • Moderne Stile in Explores konfigurieren: Nutzer benötigen die explore Berechtigung für die entsprechenden Modelle.
  • Moderne Visualisierungsstile in einzelnen Looks speichern: Nutzer benötigen die Berechtigungen explore, save_content und save_looks. Außerdem müssen Nutzer die Zugriffsebene Zugriff verwalten, Bearbeiten für alle Looks haben, die sie bearbeiten möchten.

Diagrammeinstellungen

Wenn die Funktion Modern User Interface aktiviert ist, können Sie das Visualisierungsdesign mit den folgenden Schritten ändern:

Tabellendiagramme

Für Tabellendiagramme können Sie im Feld Tabellendesign auswählen, welches Visualisierungsdesign angewendet werden soll.

  1. Wenn Sie einen Look ansehen, klicken Sie auf die Schaltfläche Bearbeiten , um den Look zu bearbeiten.
  2. Klicken Sie in einem Look oder einem Explore auf dem Tab Visualisierung auf Bearbeiten , um das Bearbeitungsmenü zu öffnen.
  3. Gehen Sie im Bearbeitungsmenü zum Tab Diagramm.
  4. Wählen Sie im Drop-down-Feld Tabellendesign die Option Modern oder eines der anderen Tabellendesigns aus. Die Visualisierung wird aktualisiert und das ausgewählte Design wird angezeigt.
  5. Nachdem Sie das gewünschte Design ausgewählt haben, können Sie die Visualisierung als Look speichern oder einem Dashboard hinzufügen. Ihre Designauswahl wird als Teil der Konfiguration der Visualisierung gespeichert.

Weitere Diagramme

Für Säulen-, Balken-, Linien-, Flächen-, Kreis-, Ring- oder Einzelwertdiagramme können Sie im Feld Visualisierungsdesign auswählen, welches Visualisierungsdesign angewendet werden soll.

  1. Wenn Sie einen Look ansehen, klicken Sie auf die Schaltfläche Bearbeiten , um den Look zu bearbeiten.
  2. Klicken Sie in einem Look oder einem Explore auf dem Tab Visualisierung auf Bearbeiten , um das Bearbeitungsmenü zu öffnen.
  3. Gehen Sie im Bearbeitungsmenü zum Tab Diagramm.
  4. Wählen Sie im Drop-down-Feld Visualisierungsdesign die Option Modern oder Klassisch aus. Die Visualisierung wird aktualisiert und das ausgewählte Design wird angezeigt.
  5. Nachdem Sie das gewünschte Design ausgewählt haben, können Sie die Visualisierung als Look speichern oder einem Dashboard hinzufügen. Ihre Designauswahl wird als Teil der Konfiguration der Visualisierung gespeichert.

Dashboard-Tiles

  1. Versetzen Sie das Dashboard in den Bearbeitungsmodus.
  2. Öffnen Sie das Fenster Tile bearbeiten für das Tile.
  3. Klicken Sie auf dem Tab Visualisierung auf Bearbeiten, um das Bearbeitungsmenü zu öffnen.
  4. Gehen Sie im Bearbeitungsmenü zum Tab Diagramm.
  5. Wählen Sie im Drop-down-Feld Visualisierungsdesign die Option Modern oder Klassisch aus. Die Visualisierung wird aktualisiert und das ausgewählte Design wird angezeigt.
  6. Nachdem Sie das gewünschte Design ausgewählt haben, können Sie die Änderung speichern, indem Sie im Fenster Tile bearbeiten auf Speichern und dann im Dashboard auf Speichern klicken.

LookML-Dashboardelemente

Die modernen und klassischen Designs können in LookML-Dashboardelementen für die unterstützten Diagrammtypen verwendet werden.

Verwenden Sie den Parameter modern2026 und legen Sie ihn für das moderne Design auf true oder für das klassische Design auf false fest.

Wenn Sie die moderne Farbsammlung auf ein Dashboard-Element anwenden möchten, verwenden Sie den Parameter collection_id und legen Sie ihn auf looker_2026 fest.

Benutzerdefinierte Stile beibehalten

Wenn Sie das moderne Visualisierungsdesign auf einen vorhandenen Explore oder Look anwenden, aktualisiert Looker die zugrunde liegenden Stile Ihrer Visualisierung, ohne Ihre benutzerdefinierten Konfigurationen zu verwerfen. Alle benutzerdefinierten Formatierungsoptionen, die Sie explizit gespeichert haben, haben Vorrang vor den neuen Standardeinstellungen des Designs.

  • Benutzerdefinierte Stile (beibehalten): Wenn Sie bestimmte Formatierungseigenschaften manuell angepasst haben (z. B. benutzerdefinierte Farbcodes eingegeben, Achsenbegrenzungen auf bestimmte Zahlen festgelegt oder Diagrammreihennamen manuell definiert haben), behält Looker diese Überschreibungen genau so bei. Ihre benutzerdefinierten Optionen werden nicht durch das moderne Design überschrieben.
  • Unveränderte Eigenschaften (aktualisiert): Alle Stileinstellungen, die Sie nicht geändert haben (Eigenschaften, die in ihrem Standardzustand belassen wurden), werden automatisch auf das moderne Design aktualisiert, z. B. die neuen Schriftarten, gedämpften Gitternetzlinien und abgerundeten Ecken.

Wenn Sie beispielsweise ein Säulendiagramm mit klassischem Design haben, in dem Sie die Säulenfarben an die Marke Ihres Unternehmens angepasst haben, bleiben diese spezifischen Markenfarben beim Wechsel zum modernen Design erhalten. Die Schriftarten, die Formatierung der Gitternetzlinien und die Säulenecken des Diagramms werden jedoch automatisch auf den modernen Stil aktualisiert.

Auf Standardeinstellungen zurücksetzen

Wenn Sie das moderne Design vollständig auf eine Visualisierung anwenden möchten, die benutzerdefinierte Stile enthält, können Sie benutzerdefinierte Eigenschaften auf ihren Standardzustand zurücksetzen:

  1. Rufen Sie in einem Look oder Dashboard den Bearbeitungsmodus für die Visualisierung auf.
  2. Suchen Sie im Menü Bearbeiten die Eigenschaften, die Sie zurücksetzen möchten (z. B. benutzerdefinierte Farbauswahlen oder Schriftgrößen).
  3. Entfernen Sie die benutzerdefinierten Werte oder wählen Sie die Standardeinstellungen aus, um die Überschreibung zu entfernen. Die Eigenschaften übernehmen sofort die Standardeinstellungen des modernen Designs.

Bekannte Einschränkungen

Während sich das moderne Visualisierungsdesign in der Vorabversion befindet, gelten die folgenden Einschränkungen:

  • Das moderne Design ist nur für die Diagrammtypen verfügbar, die im Abschnitt Unterstützte Diagrammtypen aufgeführt sind. Alle anderen integrierten Looker-Visualisierungen, einschließlich Karten, werden mit dem klassischen Design gerendert.
  • Das moderne Visualisierungsdesign gilt nur für integrierte Looker-Visualisierungen. Benutzerdefinierte Visualisierungen, die über das Looker Extension Framework entwickelt oder aus dem Looker Marketplace installiert wurden, sind davon nicht betroffen.
  • Visualisierungsdesigns können nicht programmatisch über die Looker API oder das Embed SDK bearbeitet werden.

Moderne Dashboards

Wenn die Funktion in der Vorabversion Modern User Interface aktiviert ist, wird für neue Dashboards standardmäßig der moderne Dashboardstil verwendet. Mit dem modernen Dashboardstil werden Dashboards mit einem modernen, optimierten Erscheinungsbild und einem Schwerpunkt auf Datendichte erstellt. Alternativ können Sie den bereits vorhandenen klassischen Dashboardstil von Looker verwenden. Verwenden Sie die Einstellung Dashboardstil , um moderne oder klassische Dashboardstile für Ihre Dashboards auszuwählen.

Wenn Sie den modernen Dashboardstil verwenden, werden die Diagramme im Dashboard nicht automatisch auf das moderne Visualisierungsdesign aktualisiert. Wenn Sie das moderne Visualisierungsdesign in Dashboard-Tiles verwenden möchten, müssen Sie den Bearbeitungsmodus für das Dashboard aufrufen und jedes Tile bearbeiten, das einen unterstützten Diagrammtyp verwendet, so bearbeiten, dass das moderne Visualisierungsdesign verwendet wird.

Die folgende Abbildung zeigt ein Beispiel für ein Dashboard, das den modernen Dashboardstil mit Tiles verwendet, die das moderne Visualisierungsdesign verwenden.

Der klassische Dashboardstil wird in der Dokumentation Dashboards ansehen gezeigt.

Unterschiede zwischen modernen und klassischen Dashboardstilen

Der moderne Dashboardstil wurde entwickelt, um die Datendichte zu verbessern und eine präzisere, einheitliche Bearbeitungserfahrung zu bieten.

In der folgenden Tabelle wird beschrieben, wie sich Dashboards, die den modernen Stil verwenden, vom klassischen Stil unterscheiden.

Element Klassischer Dashboardstil Moderner Dashboardstil
Layout und Dichte
  • Verwendet ein Standard-Rasterlayout mit größerem Abstand zwischen den Tiles.
  • Design mit hoher Dichte:Optimierte Benutzeroberfläche, die visuelle Unordnung reduziert und sich auf Daten konzentriert.
Erscheinungsbild
  • Enthält Legacy-Looker-UI-Elemente und Navigationsstile.
  • Moderne Ästhetik:Übersichtlich gestaltet, entsprechend den Designstandards von Google.
  • Aktualisierte Navigation: Aktualisierte obere und linke Navigationsleisten für eine einheitliche Erfahrung mit der neuen Explore-Oberfläche.

Modernen Dashboardstil aktivieren (für Administratoren)

Damit der moderne Dashboardstil in einer Instanz verfügbar ist, muss ein Looker-Administrator die Funktion in der Vorabversion Modern User Interface auf der Seite Vorabversion im Admin-Bereich aktivieren.

Für Dashboards, die vor der Aktivierung der Funktion Modern User Interface erstellt wurden, wird der klassische Dashboardstil beibehalten. Sie können jedoch mit der Einstellung Dashboardstil auf den modernen Stil aktualisiert werden. Für Dashboards, die nach der Aktivierung der Funktion Modern User Interface erstellt wurden, wird standardmäßig der moderne Dashboardstil verwendet.

Stil für einzelne Dashboards festlegen

Wenn Sie einen Dashboardstil festlegen möchten, benötigen Sie die entsprechenden Berechtigungen und müssen das Menü Einstellungen des Dashboards verwenden.

Nutzerberechtigungen

Wenn Nutzer Dashboards mit dem modernen Stil verwenden und speichern möchten, benötigen sie die Looker-Berechtigung save_dashboards. Außerdem müssen Nutzer die Zugriffsebene Zugriff verwalten, Bearbeiten für alle Dashboards haben, die sie bearbeiten möchten.

Die Einstellung „Dashboardstil“

Wenn die Funktion Modern User Interface aktiviert ist, ist der moderne Dashboardstil die Standardeinstellung für neue Dashboards. Sie können den Dashboardstil für neue oder bereits vorhandene Dashboards mit den folgenden Schritten festlegen:

Benutzerdefiniertes Dashboard

  1. Versetzen Sie das Dashboard in den Bearbeitungsmodus.
  2. Öffnen Sie das Menü Einstellungen des Dashboards.
  3. Wählen Sie auf dem Tab Allgemein des Menüs Einstellungen mit der Einstellung Dashboardstil den Dashboardstil Modern oder Klassisch aus den Drop-down-Optionen aus. Das Dashboard wird aktualisiert und der ausgewählte Stil wird angezeigt.
  4. Klicken Sie im Menü Einstellungen auf Speichern.
  5. Klicken Sie im Dashboard auf Speichern , um den ausgewählten Stil anzuwenden.

LookML-Dashboard

Wenn Sie den modernen Dashboardstil verwenden möchten, legen Sie den Dashboardparameter style auf modern fest. Wenn Sie den klassischen Dashboardstil verwenden möchten, legen Sie den Dashboardparameter style auf classic fest.

Eingebettete Dashboards

Bei eingebetteten Dashboards, die eingebettete Designs verwenden, sieht das moderne Design anders aus als bei nicht eingebetteten Dashboards. Wir empfehlen, für eingebettete Dashboards, die eingebettete Designs verwenden, den klassischen Dashboardstil zu verwenden.

Wie geht es weiter?