Zum Hauptinhalt springen

ToolsSidePanel

ToolsSidePanel in Storybook

Verwendung​

Überblick​

Der Tool-Seitenbereich ist ein reduzierbarer Bereich auf der rechten Seite des Fensters. Er bietet Benutzern zusätzliche Tools, Einstellungen oder Kontextinformationen, ohne dass der primäre Workflow unterbrochen wird. Dieser Bereich soll durch schnellen Zugriff auf wichtige Aktionen und Ressourcen die Produktivität steigern.

Zu verwenden​

  • Benutzer benötigen schnellen Zugriff auf Steuerelemente, ohne den Hauptinhaltsbereich zu verlassen.
  • Der Bereich enthält anpassbare Einstellungen, die sich auf die aktuelle Ansicht auswirken.
  • Der Bereich fungiert als kontextbezogener Assistent und bietet relevante Optionen basierend auf der Benutzerauswahl.

Nicht zu verwenden​

  • Die enthaltenen Aktionen sind primäre Aktionen und müssen Teil der Hauptbenutzeroberfläche sein.
  • Der Bereich enthält zu viele komplexe Optionen und ist daher für Benutzer zu unübersichtlich.
  • Benutzer müssen Aktionen mit mehreren Schritten ausführen, die volle Aufmerksamkeit erfordern (stattdessen können Sie ein Modal verwenden).
  • Der Bereich steht in Konflikt mit anderen Benutzeroberflächenelementen, was zu einer schlechten Benutzerfreundlichkeit führt.

Aufbau​

Beispiel für Seitenbereich mit Tool-Elementen und reduzierbarer Symbolschaltfläche

  1. Bereichscontainer: Die Hauptstruktur, die alle Komponenten des Seitenbereichs enthält.
  2. Tool-Elemente: Der Bereich besteht aus Symbolen ohne Textbeschriftungen.
  3. Reduzierbare Symbolschaltfläche: Eine Pfeilschaltfläche, mit der Benutzer den Bereich erweitern oder reduzieren können.

Nicht alle Elemente sind erforderlich. Fügen Sie nur das hinzu, was für Ihren spezifischen Anwendungsfall notwendig ist. Der Tool-Seitenbereich ist ein offener und flexibler Bereich, der je nach Anwendungsfall verschiedene Elemente enthalten kann. Teams können sie anpassen, indem sie bei Bedarf verschiedene Komponenten, Tools und Funktionen hinzufügen und gleichzeitig für optimale Bedienerfreundlichkeit sorgen.

Verhalten​

  • Wird auf der rechten Seite des Fensters angezeigt und erstreckt sich von der Kopfzeile bis zum unteren Rand der Seite.
  • Kann je nach den Anforderungen der Anwendung reduzierbar oder persistent sein.
  • Pusht den Inhalt, anstatt ihn zu überlagern, und sorgt so für ein klares und strukturiertes Layout.
  • Bietet schnellen Zugriff auf Tools oder kontextbezogene Aktionen, ohne den Hauptarbeitsablauf zu unterbrechen.