Topp 11 Figma tangentbordsgenvägar för Windows och Mac

Figma har fått fäste i designutrymmet. Sketch-mjukvara dominerar mestadels UI/UX-designbranschen. Men de senaste erbjudandena från Adobe (Adobe XD) och Figma med flexibel prissättning, sömlös delning och tillgänglighet över plattformar förändrar ekvationen för UI/UX-designerna där ute.

Figmas tillgänglighet på webben, Windows och macOS, tillsammans med dess utmärkta startplan (3 projekt och 2 redaktörer), gör det till ett idealiskt val för att designa, prototyper och behärska UI-designfärdigheter. Företaget introducerade nyligen efterlängtat Plugins-stöd för det. Om du är ny på UI/UX-designutrymme och börjar din resa med Figma, kanske du vill memorera ett gäng viktiga Figma-tangentbordsgenvägar för Windows och Mac.

I det här inlägget kommer vi att täcka elva bästa Figma-kortkommandon som du kan använda på en Windows PC och Mac. Låt oss börja.

Besök Figma

1. Master Zoom-funktioner

Du kan inte använda Figma eller någon UI/UX-designprogramvara utan att bemästra Zoom-tangentbordsgenvägarna. Dessa kommer att vara de mest använda tangentbordsgenvägarna under ditt arbetsflöde.

För Windows och Mac kan du använda Skift + 1 för att anpassa lagren till skärmen. Skift + 2 för att zooma in den valda ramen (min mest använda tangentbordsgenväg eftersom den låter mig snabbt se detaljerna för den valda komponenten), och Shift + 0 för att zooma 100 %.

2. Visa/Dölj linjaler och Visa/Göm layoutrutnät

Jag använder vanligtvis inte linjaler i Figma, men om du planerar att använda dem under UI-designen kan du använda tangentbordsgenvägen Shift + R på PC eller Mac för att visa/dölja linjaler.

Jag använder Layout Grids hela tiden. Det låter dig ordna komponenterna, ikoner med samma avstånd, låter dig organisera texten och andra element. Använd Ctrl + G kortkommando på Mac för att visa/dölja layoutrutnät.

3. Penna, Flytta och Textverktyg

Figma erbjuder ett kraftfullt och anpassningsbart pennverktyg. Du kommer att förstå vad jag menar när du har spelat med den i några minuter. Under ditt designarbetsflöde kommer du att använda dessa tre verktyg ganska mycket.

Du kan alltid välja dem från toppmenyn eller använda P-tangenten för Penna, V för Flytta och T för textverktyget på Windows och Mac.

4. Flytta mellan lager och komponenter

Dessa två kortkommandon är ganska praktiska när du arbetar med ett designprojekt med för många lager och komponenter. Du kan behöva flytta mellan dem hela tiden. Du kan använda Alternativ + 1 för Mac eller Alt + 1 för Windows för att flytta till lagerpanelen. Använd sedan Alternativ + 2 för Mac eller Alt + 2 för Windows för att gå till menyn Komponenter.

5. Öppna Färgväljaren

Denna funktion är användbar när du vill extrahera färg från en bild eller ikon eller någon annan komponent. Du kan använda kortkommandot ”I” på Mac eller Windows för att öppna färgväljaren. Håll färgväljaren över en bild eller ikon och kopiera färgkoden från färgväljarmenyn.

6. Kopiera/klistra in aktuell stil

Den här är en verklig tidsbesparare. Vill du snabbt kopiera den aktuella färgen/designen för en komponent till annan text eller ikon? Du kan välja det aktuella elementet och använda Alternativ + Kommando + C för Mac eller Ctrl + Skift + C för Windows för att kopiera dess stil. Välj nu det andra elementet och använd Alternativ + Kommando + V för Mac eller Ctrl + Skift + V för Windows för att klistra in stilen.

7. Gruppera/Avgruppera val

Gruppering och avgruppering är en av de viktigaste delarna av alla designprogram. När du har lagt till former, ikoner, text kanske du vill gruppera dem för att enkelt flytta eller ändra dem. Du kan välja elementen och använda Kommando + G för Mac eller Ctrl + G för Windows för att skapa en grupp.

För att avgruppera dem, använd Kommando + Skift + G för Mac eller Ctrl + Skift + G för Windows.

8. Växla mellan Lås och Lås upp

När du skapar en design med för många lager och komponenter kan Figma-duken bli ganska upptagen för dig. I dessa scenarier vill du inte flytta någon ikon, text eller komponent av misstag. I sådana fall kan du välja elementet och använda Kommando + Skift + L för Mac eller Ctrl + Skift + L för Windows för att låsa dem.

Den representeras av en liten låsikon i menyn Lager. För att låsa upp, använd samma kortkommando.

9. Skapa komponenter

Komponenter är hjärtat och själen i Figma-upplevelsen. Du kanske vill återanvända samma element i hela designgränssnittet. Några exempel kan vara en hamburgermeny, bottenmenyn, knappar etc. som du vill återanvända för andra skärmar också.

Du kan gruppera ikonerna och texten med hjälp av gruppverktyget och sedan använda Alternativ + Kommando + K för Mac eller Ctrl + Alt + K för Windows för att skapa en komponent. Gå nu till dem från menyn Komponenter (kontroll #4).

10. Visa lagbibliotek

Vet du att Figma också kallas designbranschens Google Docs? Programvaran kommer med sömlösa delningsalternativ som låter dig lägga till redaktörer till teamet.

För stora projekt får varje gruppmedlem en separat uppgift för design. När du skapar designen i en grupp kanske du vill besöka Team-biblioteket, som består av vanliga komponenter och ikoner bland medlemmarna. Du kan öppna menyn genom att använda Kommando + Alternativ + O på Mac eller Ctrl + Alt + O på Windows för att öppna teambiblioteksmenyn.

11. Exportdesign

När du är klar med designen kanske du vill använda exportalternativet för att extrahera ikoner och bilder från designen så att du kan skicka dem till utvecklare för att implementera dem. Du kan välja lagret och använda Kommando + Skift + E för Mac eller Control + Skift + E för Windows för att exportera detaljerna.

Använd Figma som ett proffs

Figma är ett utmärkt verktyg för UI/UX-designers. Det är gratis för nybörjare, tillåter delning och kommer med massor av kortkommandon för att möjliggöra ett smidigt arbetsflöde. Implementera dessa kortkommandon i ditt arbetsflöde och skapa vackra UI-designer som ett proffs.

Nästa upp: Canva och Crello är två av de bästa designverktygen för att skapa affischer och flygblad. Läs jämförelsen nedan för att hitta det bättre valet för dig.