Dit artikel is beschikbaar voor zowel de vorige Figma UI als de nieuwe Figma UI. Gebruik de schakelaar linksonderin de pagina om je huidige UI te selecteren. Ontdek UI3: Figma's herontwerp →
Voordat je begint
Wie kan deze functie gebruiken?
Gebruikers van elk team of abonnement kunnen de werkbalk in Figma Design-bestanden openen.
Gebruikers hebben toegangsrechten kan bewerken nodig om elke tool in de werkbalk te gebruiken. Gebruikers met toegangsrechten kan bekijken kunnen enkele functies in de werkbalk gebruiken.
De werkbalk is je centrale punt voor interactie met en het toevoegen van objecten aan het canvas. Hier is een overzicht van de verschillende tools op de werkbalk.
Verplaatsen, hand en scale
Wanneer je een ontwerpbestand opent, selecteert Figma standaard de verplaatsingstool. Klik op de pijl rechts van de verplaatsingstool om toegang te krijgen tot de tools hand en scale.
- Verplaatsen: Selecteer en verplaats objecten op het canvas
- Hand: Klik rond in een bestand zonder objecten te selecteren of te verplaatsen
- Scale: Wijzig het formaat van volledige objecten of lagen
Als je Figma gebruikt op een apparaat met een aanraakscherm, kun je met de hand-tool met je vingers door een bestand pannen.
Tip: Je kunt de spatiebalk ingedrukt houden om de hand-tool tijdelijk te activeren.
Frame, section en slice
De frame-tool is standaard geselecteerd. Klik op de pijl om toegang te krijgen tot de section- en slice-tools.
- Frame: Frames zijn de belangrijkste bouwstenen van Figma. Een frame is een container die ontwerpelementen zoals vormen, tekst en afbeeldingen bevat. Je kunt ze gebruiken om ontwerpelementen op het canvas te organiseren en te structureren. Maak een frame met je eigen afmetingen in het canvas, of selecteer een framegrootte uit Figma's voorinstellingen in het paneel-eigenschappen aan de rechterkant van het scherm.
- Sectie: Secties stellen je in staat om bestanden te organiseren voor eenvoudigere navigatie, anderen te koppelen aan een verzameling ontwerpen, of inhoud te markeren als 'Ready for Dev' om de overdracht naar de ontwikkelaar te vergemakkelijken.
- Slice: Met de Slice-tool kun je een gedeelte van het scherm opgeven dat je wilt exporten.
Vorm
De vorm-tool geeft een aantal standaard vormen die je kunt gebruiken. De rechthoek-tool is standaard geselecteerd. Klik op de pijl om te kiezen uit:
- Rechthoek
- Lijn
- Pijl
- Ellips
- Polygon
- Ster
- Afbeelding plaatsen
Tip: Met Afbeelding plaatsen kun je een of meer afbeeldingen op je computer selecteren en op het canvas invoegen. In Figma wordt een afbeelding geïmporteerd als vulling op een vorm, daarom bevindt Afbeelding plaatsen zich in de vorm-tool.
Pen en potlood
- Pen: Maak vectorvormen en iconen aan. Je kunt complexe Vector-netwerken bouwen met vectorpaden, ankerpunten en béziercurven.
- Potlood: Voeg vrijehandtekeningen of aantekeningen toe aan je ontwerpbestanden. Figma past basisafvlakking toe op alle paden die je maakt met de potlood-tool. Selecteer een tekening en druk op de Enter-/Return-toets om de tekening te bewerken in de modus "Vector bewerken".
Tekst
Tekst is een van de essentiële onderdelen van interfaceontwerp. Alles, van het plaatsen en rangschikken van tekst tot de keuze van het lettertype, speelt een rol.
Selecteer de tekst-tool of druk op de T -toets om tekstlagen aan je bestand toe te voegen.
- Klik één keer op het canvas om een tekstlaag toe te voegen die horizontaal uitbreidt
- Klik en sleep om een tekstlaag met een stabiele grootte te maken
Lees verder over het maken van tekstlagen →
Reageer
Met de reactie-tool kun je je gedachten, ideeën en feedback als aantekeningen toevoegen aan het canvas. Gebruik reacties om feedback te geven of erop te reageren, pas je ontwerpen aan en itereer sneller—allemaal zonder het ontwerpbestand te verlaten. Opmerkingen zijn toegankelijk voor iedereen met toegangsrechten "kan bekijken" of "kan bewerken" tot het bestand.
Actiemenu
Het menu Acties is een verzameling productiviteitstools in ontwerpbestanden om je te helpen in de flow te blijven. Vanaf hier heb je toegang tot:
- AI-tools, zoals het genereren van een ontwerp, het vervangen van inhoud of het maken van afbeeldingen
- Een zoektool om op naam of beschrijving bibliotheekhulpmiddelen te vinden
- Plug-ins en widgets
- Opdrachten voor veelvoorkomende acties in Figma, zoals het samenvouwen van alle lagen in het navigatiepaneel of het in- en uitschakelen van linialen
Dev Mode inschakelen
Dev Mode is een interface gericht op ontwikkelaars voor het inspecteren en navigeren van ontwerpen. Om Dev Mode te activeren, klik je op de Dev Mode-schakelaar of gebruik je de sneltoets Shift D.
Voordat je begint
Wie kan deze functie gebruiken?
Gebruikers van elk team of abonnement kunnen de werkbalk in Figma Design-bestanden openen.
Gebruikers hebben toegangsrechten kan bewerken nodig om elke tool in de werkbalk te gebruiken. Gebruikers met toegangsrechten kan bekijken kunnen enkele functies in de werkbalk gebruiken.
De werkbalk bevat een verscheidenheid aan tools en functies. Wat er in de werkbalk verschijnt, hangt af van wat je op het canvas hebt geselecteerd.
Open de werkbalk bovenaan je scherm in Figma.
Menu
Klik op het menu-pictogram om toegang te krijgen tot het hoofdmenu. Het menu bevat de zoekfunctie van Figma en diverse andere functies die in het menu zijn georganiseerd.
Zoek op naam of blader door algemene secties (zoals bestand, bewerken, bekijken, enzovoort). Als er een sneltoets is voor de functie die je probeert uit te voeren, geeft Figma deze naast de instelling weer.
- Terug naar bestanden: Open de bestandsbrowser op de huidige locatie.
- Bestand: Voer machtigingen op bestandsniveau uit, inclusief importeren en exporteren.
- Bewerken: toegang tot ongedaan maken/herhalen, kopiëren/plakken en geavanceerde selectiefuncties.
- Bekijken: Beheer weergave-instellingen voor lay-outraster en linialen, voer zoomfuncties uit en navigeer binnen een bestand.
- Object: Pas objectfuncties toe zoals groeperen, kadreren, roteren en meer.
- Tekst: Formatteer tekst met vet of cursief, en stel grootte, hoogte en spatiëring in.
- Schikken: Ruim objecten op met uitlijning- en verdeelfuncties.
- Plugins: Bekijk, beheer en voer plugins die je hebt geïnstalleerd uit.
- Integraties: Bekijk, beheer en gebruik alle applicaties die je hebt verbonden.
- Voorkeuren: Pas je voorkeuren aan.
- Bibliotheken: Open het bibliotheekmodaal.
Tools
Tools voor verplaatsen en schalen
Wanneer je een ontwerpbestand opent, selecteert Figma standaard de verplaatsingstoolV.
Met de verplaatsingstool kun je lagen selecteren en herschikken in het lagenpaneel, of objecten op het canvas verplaatsen.
Klik op de pijl rechts van de Verplaatsingstool om de Schaal-tool K te openen. Hiermee kun je het formaat van gehele objecten of lagen wijzigen.
Frame- en slice-tools
Als je eerder ontwerptools hebt gebruikt, ben je vast bekend met Artboards. Net als bij Artboards kun je met frames een gebied van het canvas kiezen om je ontwerpen te maken.
Gebruik de sneltoetsen A of F om de frame-tool te selecteren. Maak een frame met je eigen dimensies in het canvas, of kies een framegrootte uit de voorinstellingen van Figma in het rechterpaneel.
Klik op de pijl naast de frame-tool om de slice-tool te openen. Met de slice-tool kun je een gebied van het scherm opgeven dat je wilt exporten.
Gebruik de sneltoets S om de slice-tool te selecteren.
Vormtools
Naast het tekenen van je eigen vormen met de pen-tool, zijn er een aantal standaardvormen die je in Figma kunt gebruiken. Klik op het keuzemenu om te kiezen uit:
- Rechthoek R
- Lijn L
- Pijl Shift L
- Ellips O
- Polygon
- Ster
- Afbeelding plaatsen ⌥ Option ⌘ Command K
Pen- en potlood-tools
Met de pen-tool P kun je aangepaste vormen en pictogrammen maken. Bouw complexe Vectornetwerken met vectorpaden, ankerpunten en Bézier-curven.
Met de potlood-tool kun je vrijehandtekeningen of aantekeningen toevoegen aan je ontwerpbestanden.
Figma zal enige basisafvlakking toepassen op alle paden die je maakt met de potlood-tool. Druk op de Enter / Return toets om het pad en eventuele ankerpunten in de vectorbewerkingsmodus te bewerken.
MacOS: ⌥ Option P
Windows: Shift P
Teksttool
Tekst is een van de essentiële onderdelen van interfaceontwerp. Alles, van het plaatsen en rangschikken van tekst tot de keuze van het lettertype, speelt een rol.
Selecteer de teksttool op de werkbalk of druk op de T -toets om tekstlagen aan je bestand toe te voegen.
- Klik één keer op het canvas om een tekstlaag toe te voegen die horizontaal uitbreidt
- Klik en sleep om een tekstlaag te maken met een vaste grootte
Lees verder over het aanmaken van tekstlagen.
Handgereedschap
Met de hand-tool kun je binnen een bestand klikken zonder per ongeluk zwevende omtrekken te activeren, selecties te maken of objecten te verplaatsen.
Als je Figma gebruikt op een apparaat met een aanraakscherm, kun je met de hand-tool met je vingers door een bestand navigeren.
Tip! Houd de spatiebalk ingedrukt om de hand-tool te activeren.
Reactietool
De Reactie-tool stelt je in staat om snel ideeën uit te wisselen met medewerkers. Gebruik reacties om op feedback te reageren, je ontwerpen aan te passen en ze sneller te verbeteren, allemaal vanuit het originele ontwerpbestand.
Opmerkingen zijn toegankelijk voor iedereen met toegangsrechten "kan bekijken" of "kan bewerken".
Hulpbronnenmodaal
In het Hulpbronnenvenster kun je componenten uit alle bibliotheken bekijken die aan het bestand zijn toegevoegd, evenals het bekijken, uitproberen en installeren van plug-ins en widgets. Ook kun je via het Hulpbronnenvenster de Figma Community bereiken. Meer informatie over widgets en plug-ins in de Figma Community →
Contextuele tools
Wanneer je een laag of object hebt geselecteerd, zie je de contextuele tools in het midden van de werkbalk. Welke tools je hier ziet, is afhankelijk van je specifieke selectie.
Object bewerken
Klik op het pictogram Object bewerken om de Vectorbewerkingsmodus in te schakelen. Hiermee kun je individuele ankerpunten binnen een vectorpad toevoegen, verwijderen of aanpassen.
Deze optie is alleen beschikbaar wanneer je een enkel vectorpad selecteert. Meer te weten komen over werken met Vectornetwerken.
Of klik op de Enter- / Return-toets om de Vectorbewerkingsmodus te openen.
Exemplaar opnieuw instellen
Je ziet deze optie wanneer je selectie een componentexemplaar met overschrijvingen bevat. Klik op het pictogram Exemplaar opnieuw instellen om eventuele overschrijvingen te resetten en de hoofdcomponent te herstellen.
Componenten aanmaken
Componenten zijn elementen die je kunt hergebruiken in je ontwerpen. Ze helpen bij het creëren en beheren van consistente ontwerpen in verschillende projecten. Klik op het pictogram Component aanmaken om een component aan te maken op basis van je selectie.
Als je meer dan één laag of frame selecteert, gebruik dan de pijl naast het pictogram om te kiezen hoe je je componenten wilt aanmaken:
- Component aanmaken: Maak een enkelvoudige component van je selectie.
- Meerdere componenten aanmaken: Maak een component voor elke laag of frame in je selectie.
MacOS: Control Command K
Windows: Ctrl Alt K
Als masker gebruiken
Maskers stellen je in staat om specifieke delen van een laag of object te tonen of te verbergen. Klik op het Masker-pictogram om een masker te maken van de huidige selectie.
Wanneer je een masker maakt, plaatst Figma elke laag binnen die selectie in een Maskergroep. Figma gebruikt de omtrek van de huidige laag om te bepalen wat je van de lagen eronder kunt zien.
MacOS: Control Command M
Windows: Ctrl Alt M
Booleaanse bewerkingen en selectie afvlakken
Combineer vormlagen met Booleaanse bewerkingen of door de selectie af te vlakken:
-
Selectie combineren: Combineer overlappende vectorpaden tot één enkel pad.
-
Selectie aftrekken: Verwijder alle overlappende paden van de basislaag.
-
Selectie kruisen: Maak een enkel pad van alle overlappende paden.
-
Selectie uitsluiten: Maak een enkel pad van het deel van de lagen dat niet overlapt.
-
Selectie afvlakken: Maak een enkele laag van de selectie.
MacOS: Commando E
Windows: Ctrl E
Opmerking: Deze optie is alleen beschikbaar wanneer je meer dan één laag hebt geselecteerd.
Wanneer je geen lagen geselecteerd hebt, toont Figma het project en de bestandsnaam in het midden van de werkbalk. Hiermee krijg je toegang tot de volgende acties op bestandsniveau:
- Stijlen & componenten publiceren: Open het bibliotheekmodaal
- Versiegeschiedenis weergeven: Open de Versiegeschiedenis in het rechterpaneel
- Exporteren: Open de Exportlijst
- Dupliceren: Maak een kopie van het bestand op de huidige locatie
- Hernoemen: Geef het bestand een andere naam
- Verwijderen: Verwijder het bestand voor jou en eventuele medewerkers
- Verplaatsen naar project: Wijzig de locatie van het bestand
Instellingen delen en bekijken
Multiplayer en observatiemodus
Bekijk wie er nog meer actief is in het bestand. Dit betreft iedereen die momenteel het bestand bekijkt of bewerkt.
Klik op de avatar van een gebruiker om naar de observatiemodus te gaan en hun acties in real-time te bekijken. Dit is geweldig voor presentaties en ontwerpevaluaties.
Delen
Klik op de knop delen om het deelvenster te openen. Hiermee kun je beheren wie toegang heeft tot je bestand. Vanuit het modale venster "delen" kun je:
- Bestanden en prototypes delen
- Bestanden delen met anderen via Link Sharing
- Eigendom van een bestand overdragen
- Machtigingen van een bestand aanpassen
- Een medewerker uit een bestand verwijderen
- Voorkom dat personen met toegangsrechten "alleen kijken" bestanden kopiëren, delen of vanuit bestanden exporteren
Presenteren en voorbeeldweergave
Speel en interacteer met de prototypes die je hebt gemaakt:
- Voorbeeld: Speel het prototype direct af in het bestand, met een inline voorbeeld. Gebruik de voorbeeldweergave om te zien hoe het prototype werkt terwijl je het bouwt—allemaal in hetzelfde tabblad.
- Presenteren: Speel het prototype af in de presentatieweergave, in een apart tabblad. Gebruik Presenteren om het prototype met anderen te delen of te zien hoe het eruitziet op een specifiek apparaat.
Meer informatie over prototypes afspelen →
Weergave-instellingen
Pas je instellingen voor het bekijken van je bestand aan, inclusief:
- Zoom-instellingen
- Pixelvoorbeeld
- Pixelraster
- Lay-outrasters
- Multiplayer cursors
Als je deze instellingen bijwerkt, zijn ze alleen van toepassing op jouw weergave van het huidige bestand.