I en verden af brugergrænseflade- og brugeroplevelsesdesign var Sketch i årevis den ubestridte konge. Det var den foretrukne platform for webstedsdesignere, der ønskede at designe grænseflader på næste niveau. Dens unikke funktioner (fleksibel vektorredigering, nemme gitter, smarte guides osv.) bragte UI-designbranchen til et helt nyt niveau.

Men efterhånden som branchen udviklede sig, kom Figma, et webbaseret samarbejdssystem med flere platforme – et nyt Sketch-alternativ. Men det rejser spørgsmålet: Hvilket værktøj er bedst i et opgør mellem Figma og Sketch?

Der er mange vigtige forskelle, som kan være afgørende for, om du skal vælge Sketch eller Figma til dine behov for UI-design.

I denne artikel vil vi sammenligne og kontrastere Figma vs. Sketch, så du kan træffe en informeret beslutning mellem de to, når du skal vælge hvilket værktøj der er bedst til dit næste responsive webdesignprojekt.

Hvad er Figma?

Figma blev af mange set som en revolutionerende udvikling i verden af UI-designværktøjer. Det var det første store alternativ til Sketch og blev udgivet i 2016. Dens oprettelse gjorde det meget lettere for webdesignere at tjene deres løn.

Figma hjemmeside
Figma hjemmeside

I modsætning til Sketch, som er et lokalt designprogram, som du skal downloade, er Figma et onlineværktøj, der fungerer via en browser. Det er også langt mere alsidigt, når det kommer til dit operativsystem; det kan bruges på Windows- eller Mac-systemer, mens Sketch kun er tilgængeligt på Mac.

Figma har en funktion til kollaborativt design, der giver dig mulighed for at dele designs med medlemmer af dit team, som kan arbejde sammen med dig i realtid. Det gør det langt mere attraktivt for designteams og kunder, der gerne vil have en hånd med i processen.

Der er heller ingen rodet softwareinstallation med Figma. Da du får adgang til tjenesten via en browser, skal du ikke bekymre dig om, at den optager hukommelse på din enhed eller skal igennem en kompliceret installationsproces. Med Figmas online-natur er du naturligvis afhængig af internettet og kan ikke arbejde på dine designs, hvis du befinder dig i et område uden forbindelse.

Hvis du nogensinde har brugt Sketch tidligere, er der en ting, du hurtigt vil indse, når du tjekker værktøjets brugergrænseflade, at den minder utroligt meget om Sketch med hensyn til design. Dette var et bevidst træk fra udviklernes side. Ved at modellere deres brugergrænseflade ud fra en, der har været branchestandard i årevis, sikres en nem overgang for alle, der skifter over.

Hvad er Sketch?

Sketch er et system, som de fleste UI-designere er fortrolige med. Det satte i årevis standarden inden for UI-design og åbnede op for et nyt univers af funktionalitet.

Sketch's hjemmeside
Sketch’s hjemmeside

Før Sketch blev en populær UI-designplatform, brugte designere typisk Adobe Photoshop til at give deres kreationer liv. Alle, der har brugt Photoshop, kan dog fortælle dig, at det ikke blev skabt til at designe et kundevenligt websted og var helt utilstrækkeligt til opgaven. Det er måske godt til foto- eller e-mail-design, men det var ikke beregnet til webdesignere.

Sketch er en native desktop-app; det betyder, at den skal være installeret lokalt på din computer. Den kræver ikke en internetforbindelse, men den kan heller ikke tilgås fra et hvilket som helst sted, i modsætning til et webbaseret værktøj som Figma.

Sketch er en vektorgrafikeditor, der først blev frigivet til offentligheden i 2010. Det gjorde en forskel i designverdenen, fordi det blev skabt specifikt til digitale designs og ikke til printdesigns, som Photoshop.

Mens softwaren stadig skal installeres lokalt, er der også en synkroniseret webapp tilgængelig til samarbejde med designteams.

Vigtigste funktioner i Figma

Figma har mange nøglefunktioner, der gør det til en klar populær tjeneste i hele UI-designbranchen. Til at starte med er det et samarbejdssystem, der giver designere mulighed for at dele deres arbejde med medlemmer af deres teams og kunder.

Designteams kan nemt arbejde sammen for at redigere projekter eller lave noter om forskellige designelementer i realtid. Denne funktion er utrolig nyttig i den moderne forretningsverden, hvor mange designteams arbejder eksternt og er spredt ud over hele verden.

Figmas samarbejdsfunktion under udvikling
Figmas samarbejdsfunktion under udvikling

Funktionen til deling i samarbejde, som gør det muligt for samarbejdspartnere at efterlade kommentarer, hvor der skal laves noter, er indbygget i systemet og kommer uden ekstra omkostninger.

Denne funktion kan være nyttig, når man har med kunder at gøre, da de kan vejlede dig gennem hele designforløbet. Hvis du starter på noget som kunden ikke bryder sig om, kan kunden opdage problemet tidligt og lave en note, før du kommer for langt ind i processen og spilder tid.

Du kan også invitere udviklere til at udforske dine prototyper og eksportere aktiver ved hjælp af et enkelt link.

En af Figmas største fordele er, at systemet ikke behøver at blive downloadet direkte til en enhed. Det er et webbaseret program, som man får adgang til via en browser. Download af software kan ofte være kompliceret og opbruge værdifuld plads på harddisken. Ved at bruge programmet online sparer du en masse plads, hvilket i sidste ende er bedre for enhedens hastighed og ydeevne.

Det er også ret nemt at lære at bruge Figma takket være flere særlige tutorials, der er specielt udviklet til nye brugere. Dette tager gætteriet ud af indlæringsprocessen og hjælper dig med at udnytte Figmas fulde funktionalitet lige fra starten.

Der findes et plugin-bibliotek til Figma, selv om det endnu ikke er omfattende. Denne funktion blev gjort tilgængelig i 2019, så udviklerfællesskabet er stadig i vækst.

Fleksibel vektormanipulation er en enormt fordelagtig funktion i Figma. Når man bruger dette system, kaldes vektoreditoren for vektornetværk. Du kan bruge vektornetværk til at forbinde flere linjer til et enkelt punkt. Dette øger i sidste ende produktionshastighederne for vektortegning og hjælper dig med at få dit projekt hurtigere færdigt.

Komponentfunktionen er Figmas version af Sketch’s signalfunktion. Disse respektive funktioner er elementer, der kan gentages på tværs af sider og redigeres sammen. Figma har en masterkomponent, der forbliver på plads. Denne kan også ændres ved at kopiere masterkomponenten og redigere den. Ved at gøre dette opdateres hver forekomst af komponenten i hele dit arbejde.

Hovedfunktioner i Sketch

Sketch er heller ikke sløve i funktionsafdelingen, og det har stærke elementer, som har gjort det til en grundpille i branchen i årevis.

Sketch's real-time samarbejdsapp
Sketch’s real-time samarbejdsapp

Virksomheden lancerede en app til samarbejde i realtid tilbage i 2021. Denne forholdsvis nye funktion duplikerer i det væsentlige Figmas samarbejdsfunktion. Alle samarbejdspartnere skal dog have betalte abonnementer på Sketch og Mac-appen installeret på deres enheder for at kunne bruge realtidssamarbejde.

Sketch har en versionshistorik der kan gennemses for designs, så brugerne kan gå tilbage til tidligere versioner, hvis de ændrer mening og beslutter, at de skal gå tilbage og starte fra et tidligere punkt.

Sketch giver dig mulighed for at gendanne tidligere versioner af dit arbejde
Sketch giver dig mulighed for at gendanne tidligere versioner af dit arbejde

Når du bruger Sketch, kan du invitere seere til systemet for at teste dine prototyper for brugervenlighed. Dette er nyttigt, da dine testere kan påpege mangler eller designfejl, som du slet ikke har bemærket.

Sketch-brugere har den luksus af et stort udvalg af integrationsplugins fra tredjeparter, som er blevet kurateret gennem årene. Det giver Sketch et kæmpe forspring i forhold til Figma, som først åbnede sin platform for integrationsudvikling i 2019.

På grund af disse integrationer vil du opdage, at Sketch er en platform, der kan tilpasses i høj grad. Dens plugins omfatter oversættelser, prototyping, udvikleroverdragelse og animationer.

Sketch tillader vektormanipulation gennem forbundne punkter kaldet knuder. Den har også webinspektorfunktioner, der giver udviklere mulighed for at inspicere og eksportere aktiver.

Sketch giver dig mulighed for at oprette uafhængige stilarter. Dette omfatter personalisering gennem forskellige farver, tekst og et bibliotek med effekter.

Systemet bruger også en drag-and-drop-grænseflade, der gør det muligt at klikke på og trække elementer rundt på siden. Dette gør det meget nemt at lære.

Fordele og ulemper ved at bruge Figma

Figma Fordele

Figma har flere fordele, der gør det til et af de mest eftertragtede Sketch-alternativer på markedet.

Til at starte med har det stor tilgængelighed og kan tilgås på flere platforme. Det har også fleksibel vektormanipulation og samarbejde i realtid, hvilket gør det nemt at arbejde med et fjernteam og skabe nogle virkelig mesterlige UI-designs.

Det har også nem udvikleroverdragelse, så du kan flytte hvert projekt til det næste trin med kun få klik.

Det er også utrolig nemt at lære at bruge Figma takket være de mange uddannelsesressourcer for både nye og erfarne brugere.

Figma ulemper

På trods af de mange fordele er der stadig et par ulemper ved Figma, som ikke kan ignoreres, når du leder efter en UI-designplatform.

Figma er en meget nyere tjeneste end Sketch, og den begyndte først at rulle integrationer og apps ud i 2019. Det betyder, at den har et lille integrationsbibliotek, der blegner i forhold til det, som konkurrenterne tilbyder. Men med tiden vil det sandsynligvis vokse, og dette negative vil blive vendt til et positivt aspekt.

Selv om det er ideelt at bruge Figma via internettet, skal du have en internetforbindelse for at få adgang til dets funktioner. Der er ingen offlinetilstand tilgængelig.

Fordele og ulemper ved at bruge Sketch

Fordele ved Sketch

Der er mange fordele ved at bruge Sketch. Der er flere grunde til, at det har været et go-to produkt i hele designverdenen i over et årti.

Dens lang levetid er en af dens fordele. Fordi det har eksisteret i så lang tid, er mange mennesker vant til det. Det betyder, at der er en masse vejledning derude. Det er et system, som mange hjemmesidedesignere har lært på, så der er ressourcer til alle, der ønsker at bruge Sketch fuldt ud.

Sketch har et stort bibliotek af integrationer
Sketch har et stort bibliotek af integrationer

Sketch har også et utroligt antal integrationer fra tredjeparter, der er udviklet over tid for at give den bedst mulige, personlige Sketch-oplevelse.

Fordi det er et lokalt installeret program, kan det også fungere offline. Dette er en stor fordel for alle med sparsom internetforbindelse eller for nogen, der skal arbejde på farten, hvor WiFi ikke altid er tilgængeligt.

Ulemper ved Sketch

Sketch har også flere ulemper, som måske kan give håbefulde brugere en pause, før de køber programmet.

For eksempel er Sketch kun tilgængelig på en Mac computer. Så hvis du er vant til at designe på en pc eller simpelthen ikke har råd til en dyr bærbar fra Mac, så vil dette system ikke være tilgængeligt for dig.

Selv om det er godt, at virksomheden har skabt en web-app til samarbejde i realtid, er tjenesten stadig ny og begrænset. Med tiden vil det blive en stor fordel, men indtil videre er det langt nemmere at samarbejde ved hjælp af Figma.

Du skal installere Sketch-softwaren lokalt på din computer. Dette optager plads på harddisken og kan have en negativ indvirkning på din Macs hastighed.

Figma vs. Sketch: En direkte sammenligning

Nu hvor vi har forstået de grundlæggende fordele og ulemper ved Figma og Sketch, kan vi sammenligne de to i flere kategorier.

Samarbejde

Når det kommer til kollaborativt design, lancerede Sketch først denne mulighed i 2021 ved hjælp af en web-app. Alle dine samarbejdspartnere skal også have et betalt Sketch-abonnement, og funktionen er, ligesom selve softwaren, kun tilgængelig på en Mac.

Denne cloud-baserede samarbejdsfunktion fungerer mere som et Dropbox-filudvekslingssystem.

Figma giver mulighed for samarbejde i realtid på alle platforme. Systemet fungerer på samme måde som Google Docs, hvor brugerne kan arbejde sammen på det samme projekt og foretage synlige ændringer og kommentarer i realtid. Du kan endda se de andre brugeres musebevægelser uden problemer med synkronisering eller forsinkelse.

Omkostningseffektivitet

Sketch’s software er opdelt i to forskellige prisplaner.

Sketch prisplaner
Sketch har to forskellige prisplaner

Sketch Standard-planen koster 9 USD per redaktør per måned. Det kommer også med ubegrænset gratis seere. Forretningsplanens pris er 20 USD pr. redaktør pr. måned.

Dette kommer kun med årlig prisfastsættelse – der er ingen måned-til-måned-valgmulighed. Det betyder, at det vil være en stor forhåndsinvestering.

Sketch Business-planen omfatter single sign-on, ubegrænset lagerplads i skyen, fakturering, teknisk support via live chat, en dedikeret kundeservicemanager og tilpassede sikkerhedsvurderinger og vilkår.

Figma har mange forskellige prismuligheder
Figma har mange forskellige prismuligheder

Figmas prissætning er langt mere gennemsigtig og findes i forskellige prisplaner.

Figmas Starter-plan er gratis, men den har nogle begrænsninger. Du kan kun arbejde med tre Figma-filer og tre FigJam-filer.

Den kommer dog også med ubegrænset antal personlige filer og samarbejdspartnere. Du kan bruge plugins, skabeloner og widgets uden omkostninger. Det gratis abonnement omfatter endda brug af Figma-mobilappen.

Professional-planen på Figma koster 12 dollars pr. redaktør pr. måned, når den faktureres årligt. Hvis du vil have en måned-til-måned løsning, skal du betale 15 dollars pr. redaktør pr. måned.

Når du bruger Professional-planen, får du ubegrænsede Figma-filer, en ubegrænset versionshistorik og delingstilladelse. Du kan endda gøre visse projekter private, hvis du ønsker at begrænse adgangen. Desuden kan du få holdbiblioteker og mulighed for at optage lydsamtaler med samarbejdspartnere.

Organization-planen koster 45 dollars pr. redaktør pr. måned og kommer kun med årlig fakturering.

Med dette abonnement kan du oprette biblioteker på tværs af hele organisationen. Du kan også designe systemanalyser og foretage forgrening og sammenlægning.

Centraliseret filhåndtering og single sign-on er inkluderet i Organization-planen, og administration og fakturering er forenet. Du kan også bruge private widgets og plugins.

Figmas dyreste plan er Enterprise-planen. Den koster 75 dollars pr. redaktør pr. måned og 5 dollars pr. FigJam-redaktør pr. måned. Denne plan tilbyder kun årlig fakturering og giver mulighed for mere fleksible kontroller og avanceret sikkerhed.

Brugervenlighed/kom godt i gang

De to tjenester har ens grænseflader, hvilket betyder, at når du først har lært at bruge den ene, er det meget nemt at skifte mellem dem.

Figma tilbyder vejledninger og instruktionsvideoer, så nye brugere hurtigt kan komme i gang med at bruge dem. Sketch har begrænsede informationsguides tilgængelige via officielle kanaler, men systemet har eksisteret i lang tid, og der er masser af information derude.

Udvidelighed (plugins og integrationer)

Sketch har et stort antal plugins og integrationer til rådighed. Dette enorme app-bibliotek svarer til WordPress’ imponerende bibliotek af temaer og plugins. Det er ansvarlig for den forbedrede personalisering, som du kan bruge i hele Sketch-oplevelsen.

Figma tilføjede integrationer tilbage i 2019, men desværre er der stadig få muligheder til rådighed.

Almindelige integrationsfunktioner omfatter, men er ikke begrænset til:

  • Prototypefremstilling
  • Oversættelser
  • Animationer
  • Overdragelse af udviklere

Funktioner

Figma er fantastisk til fjernteams på grund af dets funktioner til samarbejde i realtid. Derudover er dens gitter og begrænsninger er fleksible, så du kan skabe responsive layouts, der kan ændres i størrelse.

Sketch bruger en funktion til at ændre størrelsen på grupper, men den begrænser dig til kun fire muligheder.

Figma bruger vektornetværk til at skabe en bedre stimodel
Figma bruger vektornetværk til at skabe en bedre stimodel

Figmas vektornetværk forbedrer stimodellen. Linjer og kurver behøver ikke længere at danne en enkelt kæde. I stedet kan de gå mellem to vilkårlige punkter.

Figma har også fremragende funktioner til udvikleroverdragelse, når det er tid til at give UI’et til udvikleren, så han kan blive klar til at udgive.

Sketch kan bruge sine integrationer til at kompensere for mange af sine funktionsmangler. Zeplin er f.eks. en app, der kan bruges til developer handoff.

Ydelse og hastighed

Din hastighed kan påvirkes af mange ting, lige fra pladsen på din harddisk til det WordPress-tema, du vælger til dit websted. Figma har ingen rapporterede hastigheds- eller forsinkelsesproblemer, og kollaborative designsessioner kan finde sted i realtid.

Sketch er lokalt installeret software på en Mac, så internethastighederne påvirker ikke dens ydeevne. Som følge heraf kan det prale af høj ydeevne og hastigheder og kan fungere, selv når din enhed er offline.

Prototyping

Figma tilbyder flere UI-triggere, når du laver prototyper. Disse triggere omfatter:

  • Ved klik
  • Ved svævende bevægelse
  • Ved træk

Figma indeholder også et stabilt prototype preview, der er bedre end det, der tilbydes i Sketch. Du kan gøre brug af standardovergange mellem prototypeskærme. Dette omfatter at flytte ind eller ud efter behag.

Figma bruger endda en Smart Animate-funktion, som lader dig oprette avancerede animationer med få klik. Figma indeholder dog ikke linking mellem siderne for at forbinde dine frameworks.

Sketch har prototyping plugins, der gør hele processen mere smidig. Disse omfatter Mockplus Cloud, InVision Craft og Flinto.

Opsummering

Figma og Sketch er populære UI-designplatforme, som du kan udvikle mange stjerneagtige, kundevenlige hjemmesider på. Hvad angår hvilken du bør bruge, afhænger det mest af, hvad du leder efter. Dette gælder lige så meget for valget af dit UI-designværktøj som for dit e-mail-program.

Hvis du primært arbejder på en Mac og foretrækker at arbejde offline og dermed udnytte et stort bibliotek af integrationer til at hjælpe med at skabe en mere personlig oplevelse, så er Sketch det rette for dig.

Hvis du ønsker en gratis løsning, arbejder på en pc, har brug for fleksibelt samarbejde og ønsker at bruge fleksibel vektormanipulation, så er Figma måske svaret, du leder efter.

Hvis du leder efter kvalitetshosting til de WordPress-websteder, som du bruger disse systemer til at skabe, skal du ikke lede længere end Kinsta. Planlæg en demo i dag for at se, hvordan Kinstas bureaufokuserede administrerede hostingplan kan arbejde hånd i hånd med din UI-designplatform for at skabe en problemfri oplevelse fra start til slut.

Har du brug for hjælp til et designprojekt? Tjek vores bureaufortegnelse for at få en komplet liste over pålidelige bureauer. Søg efter projektpris, frameworks og meget mere.

Matteo Duò Kinsta

Head of Content at Kinsta and Content Marketing Consultant for WordPress plugin developers. Connect with Matteo on Twitter.