Im Dev Mode können Entwickler*innen sehen, wann ein Rahmen oder eine Komponente zuletzt geändert wurde, und die Änderungen vergleichen, die zu einem bestimmten Zeitpunkt im Verlauf gemacht wurden. Da die Übergabe zwischen Design und Entwicklung iterativ sein kann, wird der Prozess klarer, wenn Änderungen und Versionsverlauf verglichen werden können. Mit „Änderungen vergleichen“ kannst du immer die letzten Aktualisierungen verfolgen und den Produktionscode präzise halten.

Änderungen vergleichen

Wenn ein Rahmen oder eine Komponente seit deiner letzten Ansicht aktualisiert wurde, kannst du den Versionsverlauf jeweils vergleichen. Du kannst auch abgelöste Komponenten vergleichen, oder Fälle, bei denen Designs gegenüber der Grundkomponente überschrieben wurden. 

1. Wähle einen Rahmen der obersten Ebene oder eine Komponente.

   Tipp: Halte die Umschalttaste gedrückt und klicke, um zwei Komponenten auf der Arbeitsfläche auszuwählen und sie miteinander zu vergleichen.

2. Klicke auf der Registerkarte Inspect (Prüfen) der rechten Seitenleiste auf Compare changes (Änderungen vergleichen).

• A

  Versionsverlauf

  Sieh dir eine Zeitleiste des Dateiverlaufs an, darunter gespeicherte und automatisch gespeicherte Versionen. Klicke auf eine vorherige Version, um sie mit der aktuellen Version zu vergleichen. Der Versionsverlauf wird nur angezeigt, wenn ein Rahmen der obersten Ebene über einen längeren Zeitraum verglichen wird.

• B

  Bearbeitete Ebenen ansehen

  Unter Layers (Ebenen) kannst du einsehen, wie die einzelnen Ebenen eines Elements sich im Laufe der Zeit verändert haben. Die Änderungen von Ebenen werden folgendermaßen bezeichnet:

  • Edited (Bearbeitet): Die Ebene wurde zwischen der aktuellen und ausgewählten Version bearbeitet.
  • Added (Hinzugefügt): Die Ebene wurde zwischen der aktuellen und ausgewählten Version hinzugefügt.
  • Deleted (Gelöscht): Die Ebene wurde zwischen der aktuellen und ausgewählten Version gelöscht.

  Durch Klicken auf eine Ebene in der Liste wird die ausgewählte Ebene vergrößert, und zwar in einer nebeneinanderliegenden oder in einer Overlay-Ansicht.

• C

  Nebeneinander

  Nebeneinanderliegende Ansichten der ausgewählten und aktuellen Version eines Elements. Du kannst die Zoomeinstellungen der Ansicht einstellen, indem du die Schaltflächen rechts zum Vergrößern und Verkleinern verwendest.

• D

  Overlay

  Bei einer Overlay-Ansicht der aktuellen Rahmenversion über der ausgewählten Version besteht der Vorteil darin, dass kleinere Bearbeitungen hervorgehoben werden. Verwende den Schieberegler rechts, um die Transparenz des aktuellen Rahmens anzupassen oder klicke auf zum Ein- und Ausblenden. Du kannst die Zoomeinstellungen der Ansicht verwenden, indem du die Schaltflächen rechts zum Vergrößern und Verkleinern verwendest.

• E

  Code vergleichen

  Wenn du eine bearbeitete Ebene auswählst, kannst du den aktualisierten Code der vorherigen Version gegenüber der aktuellen ansehen. Das ist hilfreich, um sicherzustellen, dass deine Codebasis mit den aktuellsten Designs übereinstimmt.

  Wähle deine bevorzugte Sprache für das Codepanel im Drop-down-Menü aus und klicke auf zum Auswählen deiner bevorzugten Einheit.

  Weitere Informationen zur Verwendung von Codeauszügen in Dev Mode →

• F

  Eigenschaften vergleichen

  Wenn du eine bearbeitete Ebene auswählst, werden die aktualisierten Eigenschaften sowie die zugewiesenen Werte aus der vorherigen und der aktuellen Version angezeigt.

Änderungen in der Fokusansicht vergleichen

Wenn du dich im Dev Mode auf ein Design konzentrierst, kannst du den Versionsverlauf in der Fokusansicht nutzen, um Änderungen zu vergleichen. Beim Vergleichen von Änderungen ist die Benutzeroberfläche dieselbe wie unter Änderungen vergleichen beschrieben.

Zum Vergleichen von Änderungen in der Fokusansicht:

1. Öffne eine Figma-Design-Datei.
2. Klicke auf der Arbeitsfläche auf den Dev-Status des Designs, auf dem dein Fokus liegt, und wähle In der Fokusansicht anzeigen aus.
   Während nichts ausgewählt ist, zeigt die Fokusansicht den Versionsverlauf auf der rechten Seite der Ansicht an.
3. Klicke für die Version, die du mit der neuesten Version vergleichen möchtest, auf ... und wähle Mit aktueller Version vergleichen aus.
   
4. Um optional einen Link zur Fokusansicht zu erhalten, den du mit anderen Personen teilen kannst, klicke auf Link kopieren.

Erfahre mehr über die Fokusansicht →