Eine Kurzanleitung zu Bildfüllungseinstellungen von Figma
German (Deutsch) translation by Rebecca Priscilla (you can also view the original English article)
In diesem Tutorial erfahren Sie alles über die Bildfüllungseinstellungen von Figma. Insgesamt gibt es 4, und mit jeder können Sie die Bildfüllung eines Objekts unterschiedlich bearbeiten. Schauen wir uns das an!
Einstellungen für die Bildfüllung in Figma
Hier ist eine vollständige Videoversion dieses kurzen Tutorials. Folgen Sie uns auf unserem Envato Tuts+ YouTube-Kanal:
Es begann mit einer Füllung
Beginnen Sie, indem Sie ein Objekt auf der Zeichenfläche erstellen, dann füllen (im Eigenschafteninspektor rechts) und Bildfüllung als Typ auswählen.



Sie können dann ein Bild Ihrer Wahl hochladen und erhalten die folgenden 4 Optionen für den Fülltyp:



1. Füllen
Standardmäßig ist Füllen ausgewählt. Dies stellt sicher, dass das gesamte Objekt mit dem Bild gefüllt ist. Wenn das Objekt breiter oder höher als das Bild ist, wird das Bild entsprechend gestreckt und beschnitten. Aber das Bild wird immer zentriert und es wird so viel wie möglich des Bildes angezeigt:



2. Einpassen
Wenn wir den Fülltyp an dieser Stelle in Einpassen ändern, wird das gesamte Bild im Containerobjekt angezeigt, auch wenn dies bedeutet, dass ein Teil des Objekts nicht gefüllt ist.



3. Freistellen
Der Füllart Freistellen verhält sich ähnlich wie die Standardfüllung, gibt Ihnen jedoch Positionierungswerkzeuge, um das Freistellen selbst anzugeben. Wie Sie unten sehen können, können Sie das Objekt wie ein Fenster auf dem Bild skalieren und verschieben:



Ein weiterer Unterschied im Verhalten besteht darin, dass beim Ändern der Größe eines Objekts nach dem Anwenden des Freistellenfüllungstyps das Bild mit dem Objekt entlang beider Achsen skaliert wird (wodurch das Bild effektiv gequetscht und gedehnt wird).



4. Kacheleffekt
Der letzte Fülltyp ist Kacheleffekt, der das Bild immer wieder wiederholt. Dies lässt sich am besten mit einem wiederholbaren Kachelbild wie folgt demonstrieren:



Sie können sehen, dass es sich unendlich wiederholt, wenn die Größe des Objekts geändert wird. In den Optionen können Sie auch den Maßstab des wiederholbaren Abschnitts bestimmen.
Das ist alles für die Fülleinstellungen von Figma
Auf diese Weise können Sie die Füllung eines Objekts in Figma bestimmen! Ich hoffe, Ihnen hat diese Kurzanleitung gefallen, und vergessen Sie nicht, unsere anderen unten aufgeführten Figma-Ressourcen zu lesen.
Weitere Figma Quick Tips
Erfahren Sie mehr über Figma mit unseren schriftlichen Tutorials und Videoanleitungen:
- FigmaKurztipp: Wie Sie Adobe Illustrator-Dateien in Figma verwendenKezz Bracey
- FigmaTop 5 Figma Plugins für das FarbmanagementKezz Bracey
- Adobe XDFigma vs. Adobe XD im Jahr 2020Kezz Bracey
- Figma4 Möglichkeiten zur Größenänderung von Elementen in FigmaAdi Purdila
Figma Ressourcen und Assets (kostenlos und Premium)
Lassen Sie sich von diesen Zusammenfassungen von UI- und UX-Kits für Figma, Grafiken, Icon-Kits und mehr inspirieren!
- Figma21+ Beste Premium UI Kits für Adobe XD und FigmaPaula Borowska
- Wireframing17 unverzichtbare Wireframe-Vorlagen und UI-Kits für Ihre DesignbibliothekBretagne Jezouit
- WireframingUX/UI-Kits zur Beschleunigung Ihres DesignprozessesEric Karkovack
- UI-DesignMeistverkaufte UX- und UI-Kits für Sketch, Photoshop, Illustrator, XD und FigmaIan Yates
- FigmaDie besten kostenlosen Figma-Ressourcen: Vorlagen, Icons, UI-Kits und mehrTomas Laurinavicius
Nützliche Links
- Im Tutorial verwendete Muster