Hoe pagina's koppelen in Figma

Leer hoe je pagina's in Figma koppelt met behulp van prototypingfuncties. Deze stapsgewijze handleiding laat zien hoe je interactieve navigatie tussen frames of pagina's maakt.

Maak indrukwekkende productvideo’s en documentatie met AI

Deze tutorial is gemaakt met Trupeer in minder dan 5 minuten

Gratis creëren

Koppelen naar een andere pagina in Figma:

Selecteer het element: Kies het object (tekst, vorm, enz.) dat je als link wilt laten fungeren.
Open het tabblad Prototype: Schakel in de rechterzijbalk over van het tabblad Ontwerp naar het tabblad Prototype.
Maak de interactie: Klik en sleep de cirkelvormige node (interactiehandgreep) van je geselecteerde element naar het doelframe op de gewenste pagina.
Configureer de interactiedetails: Stel in het kleine instellingenvenster de interactie "Bij klikken" in op "Navigeren naar" en selecteer de doelpagina.
Test je link: Klik op het pictogram "Presenteren" om de prototypemodus te openen en de link te testen.

Stapsgewijze handleiding: hoe je pagina's koppelt in Figma

Stap 1

In het menu aan de linkerkant zie je de optie Pagina's. Daaronder zie je de ontwerpnaam.

From the left side menu, you will see the Pages option. Under that, you will see the design name.

Stap 2

Selecteer vervolgens de tekst,

Stap 3

Klik in het menu aan de rechterkant op de linkoptie.

From the right side menu, Click on the link option.

Stap 4

Voer vervolgens de tekst of link in.

Stap 5

Zodra je klaar bent, tik je gewoon op het betreffende schuifregelaarsjabloon.

Once done, just tap on the particular slider template.

Stap 6

Nu zie je dat de tekst is gekoppeld.

Pro-tips voor het koppelen van pagina’s in Figma

Open je ontwerpbestand
Begin met het openen van Figma en het bestand waarin je pagina’s of frames wilt koppelen voor navigatie.
Maak je frames aan of identificeer ze
Elke schermweergave of pagina die je wilt koppelen, moet in een eigen frame staan. Zorg ervoor dat frames duidelijk benoemd zijn, zodat je ze tijdens het koppelen gemakkelijk kunt selecteren.
Selecteer het element waaraan je een link wilt toevoegen
Klik op een knop, tekst of een ander interactief element dat je als trigger voor de link wilt gebruiken.
Ga naar de prototypemodus
Rechtsboven schakel je over van het tabblad “Design” naar het tabblad “Prototype”. Hiermee kun je interactieve links maken.
Sleep de node naar het doelframe
Je ziet een ronde node aan de rechterrand van het geselecteerde element. Sleep deze naar het frame waarnaar je wilt linken. Hiermee wordt een verbindingslijn gemaakt.

Veelvoorkomende valkuilen en hoe je ze voorkomt

Link naar de verkeerde laag slepen
Zorg ervoor dat je naar een frame linkt, niet naar een groep of een vorm. Alleen frames kunnen als bestemming dienen in prototypes.
Kan niet tussen pagina’s linken
Figma ondersteunt geen directe koppelingen tussen verschillende pagina’s. Verplaats frames tijdelijk naar dezelfde pagina, koppel ze en zet ze daarna indien nodig terug.
Verwarrende navigatiestroom
Als je te veel overlappende links hebt, gebruik dan pijlen, annotaties of een stroomdiagram om medewerkers te helpen de navigatie te volgen.
Ontbrekende prototypeverbindingen in exports
Prototype-links verschijnen niet in PDF- of afbeeldings-exports. Gebruik de modus “Present” van Figma of deel een live link voor interactieve voorvertoningen.
Wijzigingen worden niet weergegeven
Als links niet werken in presentatiemodus, vernieuw dan het voorbeeldtabblad of controleer nogmaals of frames per ongeluk zijn ontkoppeld.

Veelgestelde vragen over het koppelen van pagina's in Figma

Kan ik in Figma het ene frame koppelen aan het andere?
Ja, gebruik de prototypemodus om interactieve elementen te verbinden met doelframes voor soepele navigatie.
Hoe koppel ik tussen verschillende pagina's in Figma?
Je moet het bestemmingsframe tijdelijk naar dezelfde pagina verplaatsen, het koppelen en het daarna terug verplaatsen.
Kan ik overgangen toevoegen tussen gekoppelde pagina's?
Ja, kies bij het koppelen een animatie zoals “Dissolve”, “Smart Animate” of “Move In” om vloeiende overgangen te maken.
Hoe bekijk ik een voorbeeld van links?
Klik op de knop “Present” in de rechterbovenhoek om je interactieve ontwerp te bekijken en alle navigatielinks te testen.
Is het mogelijk om terug te linken naar een eerder frame?
Ja, maak een aparte interactie aan op een ander element en koppel die terug naar het eerdere frame met dezelfde prototypingtools.
Werkt onderstrepen voor tekst binnen componenten?
Ja, onderstrepen werkt op dezelfde manier binnen componenten. Zorg er alleen voor dat je de juiste tekstlaag bewerkt.
Hoe neem ik een schermopname op een Mac?
Om scherm op te nemen op een Mac, kun je Trupeer AI gebruiken. Het stelt je in staat het volledige scherm vast te leggen en biedt AI-mogelijkheden zoals het toevoegen van AI-avatars, voice-over en in- en uitzoomen in de video. Met de AI-videotranslatiefunctie van Trupeer kun je de video vertalen naar meer dan 30 talen.
Hoe voeg ik een AI-avatar toe aan een schermopname?
Om een AI-avatar toe te voegen aan een schermopname, moet je een AI-schermopnametool. gebruiken. Trupeer AI is een AI-schermopnametool die je helpt video's met meerdere avatars te maken en je ook helpt bij het creëren van je eigen avatar voor de video.
Hoe neem ik een schermopname op in Windows?
Om een schermopname op te nemen in Windows, kun je de ingebouwde Game Bar (Windows + G) gebruiken of een geavanceerde AI-tool zoals Trupeer AI voor meer geavanceerde functies zoals AI-avatars, voice-over, vertaling enz.
Hoe voeg ik voice-over toe aan een video?
Om voice-over aan video's toe te voegen, download je de Chrome-extensie van Trupeer AI. Zodra je je hebt aangemeld, upload je je video met geluid, kies je de gewenste voice-over van Trupeer en exporteer je je bewerkte video.
Hoe zoom ik in op een schermopname?
Om in te zoomen tijdens een schermopname, gebruik je de zoomeffecten in Trupeer AI, waarmee je op specifieke momenten in en uit kunt zoomen en zo de visuele impact van je videoinhoud vergroot.