Entwerfen einer Lightbox für Ihre Microsoft Teams-App

Die Lightbox ist eine Anzeigekomponente, die wichtige Informationen betont, indem das dahinter liegende Seitenlayout deaktiviert wird. Informationen in der Lightbox sind nicht teilbar und nicht interaktiv. Die Lightbox-Ansicht ermöglicht Benutzern die Vorschau von Medieninhalten, einschließlich Bildern, Videos und Audiodateien auf einer großen Oberfläche über das Standard Teams-Fenster.

Die Lightbox-Komponente ist für schnelle Überprüfungen, Verständnis oder Überprüfung konzipiert. Aktionen zum Bearbeiten oder Zusammenarbeit werden nicht unterstützt. Benutzer können die Lightbox in einem neuen Teams-Fenster initiieren oder direkt in einer nativen App oder in einem nativen Browser öffnen.

Anatomie

Die Lightbox-Ansicht enthält eine Kopfzeile, eine Mittelstufe und ein Karussell.

Entwerfen Sie die Anatomie der Lightbox-Ansicht in Teams.

Leistungsindikator Beschreibung
1 Zurück: Schaltfläche zum Navigieren zum Previoius-Bildschirm
2 Öffnen in: Schaltfläche (basic oder split), um zum externen Fenster zu navigieren
3 Schaltflächen mit Inhaltsaktionen: Vergrößern oder Verkleinern, Freigeben, Herunterladen oder Öffnen des Chatbereichs
4 Chevrons für Bildschirmpräsentationen
Ein Lightbox-Header: Aktionen erforderlich
B Mittlere Phase: Hauptinhaltscontainer
C Karussell: Umsetzbar

Größenanpassung der Komponenten

Es folgt die Standarddimensionierung für den Container mit dem Standard Inhalt:

Das Beispiel zeigt ein Bild, das mit der Lightbox-Ansicht in Teams dimensioniert wird.

Bewährte Methoden

Empfohlene bewährte Methoden für Lightbox

Do: Verwenden Sie eine Lightbox-Komponente, um Dateien in der Vorschau anzuzeigen, die Medien wie Bild, Video und Audio in einer Vollbildansicht darstellen

Hilfe zum Sparen von Zeit beim Öffnen von Dateien. Öffnen über dem Standard Inhalt. Mit einfacher Navigation durch die Dateien und schnellem soften Schließen.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente zum Anzeigen einer Vorschau von Dateien.

Nicht: Verwenden einer Lightbox für die Inhaltsbearbeitung oder -interaktion

Informationen in der Lightbox sind nicht teilbar und nicht interaktiv. Stellen Sie klare Optionen im Menü Öffnen in bereit, in dem Benutzer mit der Interaktion mit Inhalten beginnen können.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente für die Inhaltsbearbeitung.

Do: Verwenden einer Lightbox-Komponente zum Anzeigen einer Vorschau von Dokumenten

Dokumente, die nur für die Vorschauoption vorgesehen sind oder über die Option Vorschau aus der Option Mehr verfügen.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente für die Vorschau von Dokumenten.

Nicht: Verwenden Sie eine Lightbox in Zusammenarbeitsumgebungen, in denen es hilfreich ist, Livepräsenzen zu sehen.

Benutzer können nicht sehen, wer sich sonst noch in der Datei befindet und Änderungen an der Lightbox vornehmen.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente in Umgebungen für die Zusammenarbeit.

Do: Die Schaltfläche "Zurück" in der Kopfzeile wechselt zum vorherigen Bildschirm und schließt das Lightboxfeld oder klickt auf die Seiten aus dem Standard Inhalt.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente mit der Schaltfläche

Die Schaltfläche "Weitere" nicht verwenden, um die Lightbox zu schließen

Sie können die Lightbox beenden, indem Sie entweder zum vorherigen Bildschirm zurückkehren oder außerhalb des Bildschirms tippen.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente mit weiteren Zurück-Schaltflächen.

Do: Markieren Sie den Chatbereich, um über die Vorschaudatei zu kommunizieren.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente mit hervorgehobenem Chatbereich.

Nicht: Weitere Informationen finden Sie unter Kommentieren in einer Lightbox-Benutzeroberfläche.

Benutzer können lightbox-Dateien nicht kommentieren.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente mit Kommentaren im Chatbereich.

Do: Öffnen Sie die Datei in einem neuen Fenster, wenn die Datei mehr Zeit zum Fokussieren benötigt und bearbeitbar ist.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente zum Öffnen der Datei in einem neuen Fenster.

Nicht: Verwenden Sie lightbox für Dateien als Word, Excel, PowerPoint und PDF. Lightbox ist eine gute Komponente für die Inhaltsvorschau.

Das Beispiel zeigt die Verwendung einer Lightbox-Komponente für Dateien als Word, Excel, PowerPoint und PDF.