Figma-plug-ins helpen uw werkoutput te vergroten en zorgen ervoor dat u binnen Figma blijft om uw ontwerpwerk te voltooien. Met de oneindige bibliotheek met plug-ins van Figma is er bijna niets dat u niet kunt doen met uw favoriete ontwerptool.
Met deze zeer behulpzame gratis Figma-plug-ins zijn we nog maar aan het begin van wat er beschikbaar is.
Hoe Figma-plug-ins te downloaden
Voordat we ingaan op de lijst met goederen, moet u weten hoe u een Figma-plug-in kunt vinden en downloaden. Je weet misschien hoe Figma te gebruiken, maar als je dat niet doet, kun je als volgt eenvoudig de plug-inbibliotheek vinden. Sommige plug-ins werken mogelijk beter vanuit de Figma-desktopapp dan vanuit de browserversie.
Ga naar de Community-pagina, die je kunt vinden op de homepage of op een bestandspagina onder je accountnaam. De Community-pagina bevat meer dan alleen plug-ins, maar selecteert vanuit een Figma-bestand de
Hoofdmenu > Plug-ins toont u onlangs gebruikte plug-ins en opgeslagen plug-ins, en laat u nieuwe plug-ins vinden.Selecteren Vind nieuwe plug-ins brengt je naar de Bronnen tabblad waar u naar elke plug-in kunt zoeken. Zodra je een plug-in hebt gevonden die je wilt downloaden, selecteer je deze op de Community-pagina Probeer het om te downloaden, of selecteer in het zoekvak Bronnen Loop om de plug-in te downloaden.
Elke plug-in zou zijn eigen gebruiksinstructies moeten geven, dus lees de blurb wanneer daarom wordt gevraagd.
Gautham's Mesh Gradient-plug-in biedt een snelle en gemakkelijke manier om aangepaste verlopen toe te voegen aan uw Figma-ontwerpen. Voer de plug-in uit en maak een verloopvierkant. De kleuren kun je zelf aanpassen of raken Randomiseren om automatisch een verloopontwerp te genereren.
Deze plug-in maakt een afbeelding van uw verloop, dus deze kan niet worden bewerkt nadat deze is gegenereerd. U kunt echter oude verlopen bewerken of nieuwe verlopen maken in de plug-in.
Webflow Labs bieden een geweldige manier om uw Figma-ontwerp om te zetten in HTML of CSS, klaar voor Webflow en het maken van websites. U kunt Webflow-interacties integreren in uw Figma-ontwerpen voor naadloze integratie met Webflow Labs. Deze plug-in is geweldig als u een Webflow Labs-gebruiker bent of met een webontwikkelaarsteam werkt.
Het bevat responsieve componenten, behoudt al uw stijlen, lettertypen en afbeeldingen en stelt u zelfs in staat HTML-tags rechtstreeks in Figma te bewerken. Jij kan maak hoofdsjabloonstijlen in Figma en gebruik Figma naar Webflow om ze te exporteren voor toekomstige websiteprojecten.
De officiële Figma-plug-in van Unsplash betekent dat je afbeeldingen rechtstreeks in je ontwerpen kunt invoegen zonder je Figma-venster te verlaten. Alle dezelfde Unsplash-licenties zijn beschikbaar, maar met deze plug-in bespaart u tijd en klikken bij het toevoegen van afbeeldingen aan uw werk.
Als u een ontwerper van afbeeldingen bent, vindt u het misschien moeilijk om plaatsaanduidingstekst te vinden voor de ruimte in uw ontwerpen. De Lorem Ipsum-plug-in voor tijdelijke aanduidingen doet het allemaal voor u. Met traditionele Latijnse tekst geef je je ontwerp gewoon aan je copywriter om de placeholder-tekst om te zetten in het echte werk, zodat je je alleen nog hoeft te concentreren op de beelden.
Als u een copy-deck met copywriting nodig heeft voor uw ontwerp, helpt Text Porter uw kopie eenvoudig van Excel naar Figma te verplaatsen. Voer gewoon de Text Porter-plug-in uit en verplaats uw tekst. Bewerk vervolgens de tekst rechtstreeks in uw Excel-bestand om uw Figma-ontwerp in de toekomst bij te werken. Dit is handig als uw copywriter geen toegang heeft tot of kennis heeft van Figma.
Voor een vlottere workflow samen met het gebruik van plug-ins, kunt u dat ook gebruik Figma-snelkoppelingen voor een snellere workflow.
Het verwijderen van achtergronden is een gangbare praktijk bij het gebruik van afbeeldingen in veel ontwerpaspecten. In plaats van te zwoegen op Photoshop, Canva of andere bewerkingsprogramma's, versnelt het gebruik van de Icons8 Background Remover-plug-in het proces en houdt het allemaal in Figma.
De tool voor het verwijderen van de achtergrond kan op meer dan één afbeelding tegelijk worden toegepast, waardoor uw werkproces met één klik op de knop wordt versneld.
De Image Tracer-plug-in maakt een vectorafbeelding van de afbeeldingen en afbeeldingslagen waarop u deze wilt toepassen. Een schaalbare vector is als goudstof voor digitaal ontwerpwerk, en deze plug-in maakt het gemakkelijk om van elke afbeelding een vector te maken.
De plug-in Html.to.design kan u helpen bestaande website-ontwerpen om te zetten in Figma-ontwerpen. Dit dient vele doelen, zoals u helpen bij het oefenen van het ontwerpen van websites, of voor u om oude websites te herstellen die u heeft ontworpen en waartoe u geen toegang meer had.
Zie onze gedetailleerde handleiding voor het omzetten van een website naar een Figma-ontwerp deze plug-in gebruiken.
De plug-in Vectorize werkt op dezelfde manier als Image Tracer, maar dit is beter als je maar één afbeelding en één kleur hebt om te vectoriseren. Het converteren van bitmapafbeeldingen naar vectoren is eenvoudig met deze plug-in.
Uw nieuwe vectoren zullen een vectorpad zijn, gemakkelijk te bewerken en te gebruiken voor al uw ontwerpbehoeften. Vooral goed als uw klant u hun logo stuurt als een gepixelde afbeelding die is gekopieerd uit een Word-document. U kunt eenvoudig logo's en andere eenkleurige pictogrammen in Figma nieuw leven inblazen.
Ontwerpen voor een specifieke beeldverhouding? Wilt u op- of afschalen? Gebruik de Aspects-plug-in. Met deze plug-in kunt u snel het aspect van verschillende lagen in uw ontwerp wijzigen, met name afbeeldingen. Aspects is een handig hulpmiddel voor elke snelle schaal die u moet uitvoeren.
Als je voor UX/UI ontwerpt, voeg je waarschijnlijk knoppen toe aan je ontwerpen. Button Buddy is een geweldige plug-in die veel knopcomponentontwerpen biedt, waardoor u tijd bespaart bij het ontwerpen, zodat u zich kunt concentreren op geweldige lay-outontwerpen.
Gebruik de Handy Components-plug-in om meer componenten dan knoppen toe te voegen. Deze plug-in biedt meer dan 60 verschillende UX/UI-ontwerpelementen. Handy Components maakt ook gebruik van slim ontwerp om de stijlen in uw ontwerp te repliceren en deze rechtstreeks toe te passen op de toegevoegde componenten van de plug-in. U hoeft niet te bewerken om bij uw stijl te passen.
Beschikbare componenten zijn knoppen, functiekaarten, lijstitems, tabellen, voortgangsbalken, waarschuwingsstickers, kalenders en vele andere nuttige elementen.
Heeft u een kaart nodig voor uw webdesign? U kunt er eenvoudig een opnemen met de Map Maker-plug-in. Met de plug-in kunt u een aangepaste kaart toevoegen die in een vorm is ingevoegd.
Selecteer de gewenste vorm (rechthoek, ellips of polygoon) en voer Map Maker uit. Typ vervolgens het adres dat u wilt delen. Zo eenvoudig is het om een kaart toe te voegen aan uw webdesign.
Pictogrammen maken UX/UI-ontwerpen universeel en toegankelijk. De Iconify-plug-in bevat een bibliotheek met meer dan 1000.000 pictogrammen voor bijna elk gebruik. Iconify's open source, SVG-pictogrammen kunnen in veel ontwikkelingssoftware worden gebruikt om uw Figma-ontwerpen gemakkelijk van prototype naar live producten te brengen.
Door mockups aan uw Figma-ontwerpen toe te voegen, kunt u de realiteit integreren in potentiële productideeën. Of u nu mockups toevoegt aan uw Figma presentatie ontwerp of ze in een website opnemen, ze zijn handig om te hebben.
Clay Mockups 3D is een van de vele geweldige mockup-plug-ins. Zie onze gids over mockups van Figma-smartphones om te zien wat er nog meer beschikbaar is. U kunt mockups voor telefoons, computers en andere apparaten invoegen, evenals handen om ze vast te houden.
Met deze eenvoudige plug-in kunt u uw kaders uitlijnen, opruimen en uw illustraties georganiseerd houden. Selecteer gewoon uw elementen, voer de plug-in uit en uw Figma-venster zal super netjes zijn.
Het bestelt niet alleen een rommelig tekengebied, maar het nummert zelfs frames opnieuw als de volgorde wordt gewijzigd. Nooit meer zoeken naar frame 5 nadat het is verplaatst, je vindt het genesteld naast 4 en 6.
Houd uw werk stromend met Figma-plug-ins
Met deze 16 geweldige tools kunt u uw werkstroom eenvoudig transformeren. Met plug-ins kunt u meer doen zonder het Figma-ontwerpvenster te verlaten.
Deze plug-ins zijn de handigste die er zijn, en als je ze allemaal gebruikt, kun je afbeeldingen vectoriseren, afbeeldingen toevoegen van Unsplash, voeg HTML-ontwerpen toe aan Figma en weer terug met Webflow Labs, voeg aangepaste kaarten toe en pas de grootte van uw ontwerpen. Allemaal met plug-ins.