Frames — lerretet ditt

En frame er lerretet med mål — «skjermen» designet ditt skjer på. Frames er også den viktigste skillelinjen i Figma: skjønner du forskjellen på frame og gruppe, har du forstått hvordan Figma tenker.

Frame-verktøyet og presetene

Trykk F (eller velg frame-ikonet i verktøylinjen). Høyre panel fyller seg med presets — ferdige mål for telefoner, nettbrett og desktop. Klikk iPhone 14/15, og en ramme på 390 × 844 piksler legger seg på lerretet. Navnet du gir rammen nede i venstre panel («Forside»), følger den gjennom hele kurset — prototyper og overlevering leser navnene dine.

• iPhone 14/15 — 390 × 844. Standarden vi bruker i dette kurset.
• iPhone SE/8/7/6 — 375 × 667. Den lille skjermen: fungerer designet her, fungerer det stort sett overalt.
• Android Large — 412 × 892. Den vanlige Android-størrelsen.
• Desktop — 1440 × 900. Nettet på stor skjerm.

Frame mot gruppe

Markér to lag og trykk Ctrl+G: det blir en gruppe — en pose som tilpasser seg innholdet. Lag en frame i stedet, og du får en boks med *eget* mål og egen vilje. I praksis:

• Gruppen har bare den størrelsen innholdet gir den — flytter du et lag ut, krymper posen. Grei til å rydde laglisten, ellers lite.
• Framen bestemmer selv: den kan klippe innhold som stikker ut (Clip content i høyre panel), ha egen bakgrunnsfarge og holde fast mål selv om innholdet flytter seg.
• Kun frames kan brukes som skjermer i prototyper (fig-06) og som auto layout-bokser (fig-03). Gruppen klarer verken.
• Angret du på en gruppe? Markér den og trykk Ctrl+Alt+G — «Frame selection» gjør gruppen om til frame.

Zoom og navigering

Lerretet er uendelig, så navigasjon er en ferdighet: hold Space og dra for å panorere, Ctrl+0 for 100 %, Shift+1 for å passe alt i vinduet og Shift+2 for å zoome til det du har valgt. Zoomer du langt ut, ser du frames som små kart — en fin oversikt når filen vokser.

1F            Frame-verktøyet (presets vises i høyre panel)2Ctrl+G       Lag en gruppe av valget3Ctrl+Alt+G   Gjør valget om til frame («Frame selection»)4Ctrl+D       Dupliser valget5Alt + dra    Dra-kopier — den raske duplikaten6Space + dra  Panorer lerretet7Ctrl+0 / Shift+1 / Shift+2   100 % / pass alt / pass valget

Gjør dette nå: lag to frames fra presetene, navngi dem Forside og Meny, og gi begge en lys bakgrunnsfarge (Fill i høyre panel). De to rammene blir skjermene vi kobler sammen i prototyp-leksjonen.