Wer kann das tun: Alle Nutzer
Welche Preispläne: Alle Preispläne
Welche Plattformen: Browser, Desktop, Mobil
Nutze die Prototyping-Bibliothek, um Prototyp-Layouts direkt auf dem Miro-Canvas zu erstellen. Die Bibliothek enthält Screens, UI-Komponenten und Symbole, die dir helfen, Flows zu visualisieren und Ideen frühzeitig zu strukturieren.
Du kannst die Prototyping-Bibliothek verwenden, um statische Prototypen zu erstellen. Funktionen wie erweiterte Komponenten, Connector-Linien und interaktive Vorschau erfordern einen Business-Preisplan oder die Accelerate-Lizenz für Enterprise-Pläne.
Die Prototypen-Bibliothek bietet alles, was du brauchst, um in Miro einzelne und mehrbildschirmige Flows manuell zu erstellen.
Prototypen-Bibliothek öffnen
- Auf dem Canvas, in der Erstellungsleiste klicke auf Tools, Medien und Integrationen (
).
- Suche nach Prototyping, klicke dann auf Prototypen-Bibliothek.
- Das Prototypen-Bibliothek Feld öffnet sich.
Was die Prototypen-Bibliothek enthält
Die Prototypen-Bibliothek ist in Tabs organisiert. Alle Nutzer können die Bibliothek verwenden, um statische Prototypen-Layouts mit Screens, UI-Komponenten und Symbolen zusammenzustellen.
💡 Für KI-erstellte Prototypen und interaktive Flows verwende die Prototyping library zusammen mit Miro Prototypes.
Bildschirme
Bildschirme sind vorgefertigte Rahmen für das Prototyping von Flows. Du kannst Mobil, Tablet oder Desktop-Bildschirme auf dein Canvas hinzufügen und Layouts erstellen, indem du UI-Elemente per Drag & Drop darauf ziehst.
Mit Bildschirmen arbeiten
- Bildschirm‑Chrome ein- oder ausblenden (damit er wie ein Geräte‑Rahmen oder ein einfacher Rahmen aussehen kann)
- Bildschirm drehen
- Größe ändern eines Bildschirms durch Ziehen, um die Höhe zu vergrößern (nur vertikal)
UI-Komponenten
UI‑Komponenten sind gängige Interface‑Elemente, die du auf Bildschirme ziehen kannst, z. B. Schaltflächen, Eingabefelder, Navigationsleisten und Formularelemente.
Du kannst:
- Komponenten auf einen Bildschirm ziehen
- Größe ändern und neu positionieren
- Text und grundlegende Formatierung über das Kontextmenü bearbeiten
✏️ Die Optionen im Kontextmenü variieren je nachdem, welches Element du auswählst.
Mit Miro Prototypes werden einige UI-Komponenten im Vorschau-Modus interaktiv. Zum Beispiel reagieren Schaltflächen, Schieberegler, Eingabefelder und Dropdown-Menüs auf Nutzeraktionen, basierend auf den von dir definierten Connector-Linien.
Einige Komponentensets, wie z. B. Erweiterte Komponenten, sind nur mit Miro Prototypes verfügbar. Wenn du keinen Zugriff hast, können diese Komponenten in der Bibliothek mit einem Hinweis angezeigt werden.
Symbole
Der Symbole Tab enthält eine durchsuchbare Symbolbibliothek, die du in Prototypen verwenden kannst.
Symbol hinzufügen oder ersetzen
- Ziehe ein Symbol aus der Bibliothek auf das Canvas.
- Wähle das Symbol aus, um seine Farbe im Kontextmenü zu ändern.
- Wähle Symbol ersetzen, um es durch ein anderes Symbol zu tauschen, ohne seine Position oder Größe zu ändern.
Wireframes (veraltet)
Der Tab Wireframes enthält veraltete Wireframe-Elemente. Diese Elemente bleiben für bestehende Boards verfügbar und bearbeitbar, aber für neue Prototypen sollten Screens und UI-Komponenten aus der Prototyping-Bibliothek verwendet werden.
Verbindungslinien und Interaktivität (Miro Prototypes)
Verbindungslinien ermöglichen dir, die Navigation zwischen Screens in einem Prototyp zu definieren. Mit Miro Prototypes kannst du Verbindungslinien zwischen Elementen und Screens erstellen, um mehrschrittige Flows zu bauen.
Verbindungslinien ermöglichen außerdem die interaktive Vorschau. Im Vorschau-Modus verhalten sich verbundene Screens wie ein anklickbarer Flow, und Screens scrollen vertikal, wenn sie über den Ansichtsbereich hinausragen. Ohne Miro Prototypes sind Verbindungslinien und interaktive Funktionen nicht verfügbar.
💡 Einige UI-Elemente zeigen beim Hinzufügen zu einem Screen ein Blitzsymbol. Bei Flows mit mehreren Screens ziehe das Blitzsymbol, um eine Verbindungslinie zwischen den Screens zu erstellen.