Dedika är en plattform där du lär dig genom att göra: till exempel skapa ett affärsförslag, bli nagelteknolog eller lära dig ett nytt verktyg. Oavsett mål finns det redan bra innehåll om ämnet. Men ofta är det på ett annat språk, dyrt, utspritt, saknar övningar eller är för långt för dig som har en hektisk vardag. Därför har Dedika en egen metod: vi letar upp materialet där det finns, organiserar det utifrån dina mål, granskar det tillsammans med experter som kan svara på frågor och skapar praktiska övningar så att du lär dig genom att göra. Du är den viktigaste personen i din läranderesa och ingen känner dig bättre: välj innehåll och kurslängd, om du vill studera online eller offline och i vilket format. Det kan vara video, text, ljud eller sammanfattning. På ditt sätt, bara med det som passar dig. Här är varje stund av engagemang värdefull och du når snabbare det som är viktigt för dig.

Ja, alla våra kurser har en gratisversion. De gratis kurserna har samma högkvalitativa innehåll som Pro-versionen, men inkluderar inte handledare eller AI-betygsättning (det skulle vara för dyrt att erbjuda gratis), har ingen offlineåtkomst eller möjlighet att skriva ut sammanfattningar, har en gräns på en timmes studier per dag och tillgång i 90 dagar (tillräckligt med tid för att slutföra kursen). Om du är fokuserad på att lära dig kommer vår gratiskurs att räcka för att du ska få all kunskap du behöver. Men om du vill ha fler fördelar är det bättre att välja Pro. Pengarna vi får in från Pro-kurser är avgörande för att vi ska kunna fortsätta erbjuda gratis kurser. På detta sätt försöker vi balansera vårt uppdrag med projektets hållbarhet.

Kurserna består av det bästa innehållet i världen inom ämnet: videor, ljud, artiklar och böcker. Allt detta innehåll kommer med sammanfattningar, poddar (för böcker och artiklar) och transkriptioner (för videor och ljud). Du väljer själv hur du vill ta del av innehållet. Varje material har specifika frågor för att förstärka kunskapen. Dessutom består kursen av de kapitel du själv väljer, vilket gör att du kan studera bara det som är relevant för dig. I slutet av varje kapitel finns ett praktiskt projekt kopplat till ditt yrke för att öva på det du lärt dig.

Dedika-kurser finns i två format: gratis och Pro. Pro-kurser innehåller högkvalitativt innehåll, en handledare, AI-bedömning, intyg, offlineåtkomst, tillgång till sammanfattningar, inga dagliga gränser för innehållskonsumtion och livstidsåtkomst. Intäkterna från dessa kurser är avgörande för att vi ska kunna fortsätta erbjuda gratiskurser. Och även för dem som tycker att det kan vara högt erbjuder vi rabatter under kursens gång. Gratiskurser har samma högkvalitativa innehåll men inkluderar inte handledare eller AI-bedömning (det skulle vara för dyrt att erbjuda gratis), har inte offlineåtkomst eller möjlighet att skriva ut sammanfattningar, har en gräns på en timmes studier per dag och åtkomst i 90 dagar (tillräckligt med tid för att slutföra kursen).

Våra kurser innehåller en sammanfattning i slutet av varje kapitel, från vilken du kan ladda ner en PDF och skriva ut den.

Över 2 miljoner studenter världen över

Kursen finns i över 180 länder

Officiellt giltigt intyg som är erkänt i ditt land

Startsida

...

Kurs i prototyping med Figma från grunden

Alla kurser

Konst, design och kommunikation

Design

Kurs i prototyping med Figma från grunden

För alla nivåer

Kurs i prototyping med Figma från grunden

Gå från en tom duk till en fullt interaktiv prototyp med flera skärmar med hjälp av Figmas mest kraftfulla verktyg. Den här kursen täcker allt från grundläggande layout och typografi till avancerade variabler, komponenter och användbarhetstestning. Oavsett om du är på väg in i UX-design eller vill ta ditt arbetsflöde till nästa nivå, bygger du verkliga färdigheter som direkt kan tillämpas i professionella projekt.

Dedika för företag

Vad du kommer att lära dig:

Bygg en komplett, navigerbar prototyp med flera skärmar med hjälp av Figmas prototyp- och interaktionsverktyg.
Designa ett skalbart komponentbibliotek med varianter, egenskaper och återanvändbara delade stilar.
Tillämpa auto layout och begränsningar för att skapa responsiva UI-mönster över olika skärmstorlekar.
Konfigurera Figma-variabler och villkorslogik för att simulera realistiskt applikationsbeteende.
Förbered produktionsklara designdokument med korrekta annoteringar och standarder för utvecklaröverlämning.
Genomför användbarhetstestningssessioner och prioritera designiterationer baserat på strukturerad återkoppling.

Hur du studerar praktiskt Kurs i prototyping med Figma från grunden

Hur du övar Kurs i prototyping med Figma från grunden

För dig som är företag och vill utbilda ditt team

På Dedika för företag anpassas kursen med övningar och exempel från just din verksamhet, på det sätt som ditt företag behöver.

Klicka här

Kursinnehåll

8 Kapitlen • 39 LektionerVaraktighet mellan 4 och 360 timmar (du bestämmer)

Kapitel 1Se detaljer

Komma igång med Figma

Lektion 1 • Figmas ekosystem och kontokonfiguration
Behandlar Figmas webb- och skrivbordsappar, abonnemangstyper och kontokonfiguration. Här etableras den tekniska grunden innan något designarbete påbörjas.
Lektion 2 • Viktiga kortkommandon och inställningar
Behandlar de mest effektfulla kortkommandona och inställningarna för ett effektivt arbetsflöde. Den snabbhet och precision du får här ger avkastning i alla efterföljande kapitel.
Lektion 3 • Filer, sidor och projektorganisation
Lär ut hur man skapar, duplicerar och organiserar filer och sidor inom projekt. Rätt struktur förhindrar förvirring i det senare arbetet med prototyper för flera skärmar.
Lektion 4 • Navigera i Figmas gränssnitt
Introducerar verktygsfältet, lagerpanelen, egenskapspanelen och arbetsytan. Orienterar studenterna kring alla bestående gränssnittselement som de kommer att använda under hela kursen.

Kapitel 2Se detaljer

Former, ramar och layoutens grunder

Lektion 1 • Rita och redigera grundläggande former
Behandlar rektanglar, ellipser, polygoner och stjärnverktyget med deras egenskaper. Dessa primitiver utgör byggstenarna för varje gränssnittselement som skapas senare.
Lektion 2 • Vektorpenna och banredigering
Introducerar pennverktyget för anpassade vektorbannor och manipulering av ankarpunkter. Anpassade ikoner och illustrationer som byggs här förekommer i senare prototypskärmar.
Lektion 3 • Justering, distribution och avstånd
Behandlar justeringsverktyg, smart distribuering och prydliga avståndskontroller. Exakta avstånd är avgörande innan automatisk layout introduceras i nästa kapitel.
Lektion 4 • Förstå ramar jämfört med grupper
Förklarar den strukturella skillnaden mellan ramar och grupper och när de ska användas. Ramar är grunden för skärmar, komponenter och automatisk layout.
Lektion 5 • Layoutnät och hjälplinjer
Lär ut kolumn-, rad- och nätsystemöverlägg för konsekvent spatial justering. Nätverktyg tvingar fram designkonsistens över alla skärmar i en prototyp.

Kapitel 3Se detaljer

Typografi och färgsystem

Lektion 1 • Fyllningar, gradienter och bilder
Behandlar enfärgade fyllningar, linjära och radiella gradienter samt bildfyllningslägen. Dessa tekniker skapar polerade bakgrunder och gränssnittsytor genom hela projektet.
Lektion 2 • Bygga en typsnittsskala
Lär ut hur man definierar en modulär typsnittsskala för rubriker, brödtext och bildtexter. En definierad skala säkerställer visuell hierarki över varje skärm i prototypen.
Lektion 3 • Textstilar och stilhantering
Behandlar hur man skapar, namnger och applicerar delade textstilar över filen. Stilhantering minskar inkonsekvens innan komponenter introduceras.
Lektion 4 • Skapa ett lokalt färgsystem
Lär ut hur man definierar primära, sekundära, neutrala och semantiska färgtokens som lokala stilar. Centraliserade färger gör globala uppdateringar omedelbara över alla ramar.
Lektion 5 • Textverktyg och typografiska egenskaper
Behandlar val av typsnitt, storlek, vikt, radhöjd och bokstavsavstånd. Att bemästra dessa egenskaper möjliggör läsbar, professionell gränssnittstext från början.

Kapitel 4Se detaljer

Automatisk layout och responsiv design

Lektion 1 • Begränsningar och responsiva ramar
Behandlar begränsningsinställningar som styr hur lager beter sig när en ram ändrar storlek. Begränsningar i kombination med automatisk layout skapar verkligt responsiva skärmdesigner.
Lektion 2 • Nästla ramar med automatisk layout
Lär ut hur man nästlar ramar med automatisk layout för att bygga komplexa, adaptiva gränssnittsstrukturer. Nästlade layouter är stommen för kortnät, navigeringsfält och formulärlayouter.
Lektion 3 • Introduktion till automatisk layout
Förklarar automatisk layouts grundkoncept för riktning, avstånd och utfyllnad. Att förstå denna modell är nödvändigt innan man bygger en responsiv komponent.
Lektion 4 • Bygga responsiva gränssnittsmönster
Tillämpar automatisk layout och begränsningar för att bygga ett navigeringsfält, ett kortnät och ett formulär. Dessa mönster återanvänds direkt i prototypskärmar i senare kapitel.
Lektion 5 • Storlekslägen i automatisk layout
Behandlar fast, anpassa efter innehåll och fyll storlekssättning för både bredd- och höjddimensioner. Korrekta storlekslägen avgör hur komponenter svarar på innehåll och överordnade behållare.

Kapitel 5Se detaljer

Komponenter, varianter och designsystem

Lektion 1 • Bygga ett centralt gränssnittskomponentbibliotek
Tillämpar komponenter och varianter för att bygga knappar, inmatningsfält, ikoner och kort. Detta bibliotek är den direkta källan för alla skärmar som byggs i prototypkapitlet.
Lektion 2 • Komponentegenskaper
Behandlar booleska, text-, instansbyte- och nästlade instansegenskaper på komponenter. Egenskaper exponerar kontrollerad anpassning utan att bryta komponentstrukturen.
Lektion 3 • Komponentvarianter
Lär ut hur man grupperar relaterade komponenttillstånd i en variantuppsättning med namngivna egenskaper. Varianter driver interaktiva tillståndsändringar i prototyper utan att duplicera komponenter.
Lektion 4 • Skapa och använda komponenter
Behandlar att konvertera ramar till huvudkomponenter och placera instanser över filen. Komponenter säkerställer att en enskild redigering sprids till varje skärm omedelbart.
Lektion 5 • Delade bibliotek och teampublicering
Lär ut hur man publicerar ett komponentbibliotek och konsumerar det över teamfiler. Delade bibliotek är grunden för skalbara arbetsflöden med flera designers.

Kapitel 6Se detaljer

Bygga prototyper för flera skärmar

Lektion 1 • Prototypkopplingar och interaktioner
Lär ut hur man lägger till prototypkopplingar, utlösare och destinationer mellan ramar. Kopplingar omvandlar statiska skärmar till en klickbar, navigerbar prototyp.
Lektion 2 • Designa viktiga applikationsskärmar
Tillämpar komponentbiblioteket för att bygga onboarding-, dashboard- och detaljskärmar. Varje skärm använder automatisk layout och delade stilar som etablerats i tidigare kapitel.
Lektion 3 • Planera skärmar och användarflöden
Behandlar kartläggning av användarflöden, skärminventering och namnkonventioner innan design påbörjas. Planering förhindrar strukturell omarbetning när skärmar länkas i senare avsnitt.
Lektion 4 • Övergångar och animationsinställningar
Behandlar omedelbara, upplösnings-, glid-, push- och smart animera-övergångar. Lämpliga övergångar kommunicerar navigationsriktning och gränssnittsbeteende tydligt.
Lektion 5 • Förhandsgranska och dela prototypen
Lär ut hur man förhandsgranskar i Figma-visaren och genererar delbara prototyplänkar. Delning möjliggör intressentgranskning och användbarhetstestning som behandlas i senare kapitel.

Kapitel 7Se detaljer

Avancerade prototyptekniker

Lektion 1 • Interaktiva komponenter och tillståndsändringar
Behandlar att använda komponentvarianter med prototypkopplingar för att simulera tillståndsändringar. Interaktiva komponenter minskar antalet ramar som behövs för komplexa flöden.
Lektion 2 • Rullning, översvämning och fixerade element
Lär ut vertikal och horisontell rullning, översvämningsmaskning och fästa fixerade lager. Dessa inställningar replikerar naturligt rullningsbeteende i mobil- och webbprototyper.
Lektion 3 • Villkorlig logik och åtgärder
Lär ut om-villkor och flerstegs-åtgärdssekvenser på prototypinteraktioner. Villkorlig logik möjliggör förgrenade flöden som speglar verkliga beslutspunkter i appar.
Lektion 4 • Introduktion till Figma-variabler
Behandlar att skapa samlingar med nummer-, sträng-, booleska och färgvariabler. Variabler möjliggör dynamisk data och tillståndshantering som inte är tillgänglig i grundläggande prototypskapande.
Lektion 5 • Skapa prototyper för komplexa flöden
Tillämpar alla avancerade tekniker för att bygga ett kassa- eller onboardingflöde med verklig logik. Detta avslutande avsnitt integrerar variabler, villkor och rullning i ett flöde.

Kapitel 8Se detaljer

Testning, överlämning och iteration

Lektion 1 • Användbarhetstestning med prototyper
Behandlar att planera testuppgifter, rekrytera deltagare och genomföra modererade sessioner. Strukturerad testning genererar användbar återkoppling för iterationscykeln.
Lektion 2 • Tillgångsexport
Lär utvecklare hur man använder Figmas inspektionspanel och hur designers exporterar designelement. Korrekta exportinställningar säkerställer pixelperfekta designelement över alla målupplösningar.
Lektion 3 • Versionshistorik och filunderhåll
Behandlar att spara namngivna versioner, återställa tidigare tillstånd och underhålla en ren fil över tid. Versionskontroll skyddar arbete och stöder iterativ design över sprintar.
Lektion 4 • Analysera återkoppling och prioritera ändringar
Lär ut affinitetsdiagram, allvarlighetsgradering och ändringsprioritering från testresultat. Prioritering säkerställer att problemen med högst påverkan åtgärdas före överlämning.
Lektion 5 • Förbereda filer för utvecklaröverlämning
Behandlar lagernamn, annotering och filstädningsstandarder för utvecklarfärdiga filer. Rena filer minskar utvecklarfrågor och implementeringsfel avsevärt.

Certifiering

Ditt giltiga slutförandecertifikat

Den här kursen är för dig:

Blivande UX-designers som är redo att gå från teori till praktisk övning.
Grafiska designers som vill överföra sina färdigheter till digital produktdesign.
Produktchefer som vill prototypa idéer utan att förlita sig på en designer.
Karriärbytare på väg in i teknikbranschen som behöver ett portföljredo branschstandardverktyg.
Utvecklare som är nyfikna på designsidan av produktutvecklingsprocessen.
Frilansare som vill erbjuda komplett design och prototypframställning till kunder.

Vad våra elever säger

Era lektioner är perfekta. Jag köpte årspaketet och har äntligen möjlighet att följa olika ämnen som intresserar mig utan att behöva byta plattform... tack för allt ni gör, jag har redan rekommenderat er till andra...