Motion graphics-eksempler: AI-assisterte videoer sortert etter hva de gjør
Av Potto AI Team·
Motion graphics-eksempler sortert etter oppgave: lanseringsfilmer, produktskjermer, kinetisk typografi, datahistorier, forklaringsvideoer og logoavsløringer, hver fra en kreditert skaper.
De nyttigste motion graphics-eksemplene er sortert etter jobben videoen gjør, ikke etter visuell stil: en lanseringsfilm, en animert produktskjerm, en kinetic type-reel, en datahistorie, en forklaringsvideo eller en logoavsløring. Hver jobb har sin egen lengde, sitt eget sideforhold og sin egen rekkefølge av ideer, så et «godt eksempel» hjelper bare når det er riktig type eksempel. Denne guiden plukker 21 motion graphics-eksempler fra biblioteket av AI motion graphics-videoer på Potto, sorterer dem i de seks jobbene og oppgir for hvert verk forfatter, lengde, sideforhold og hva du bør se etter.
Én ting først: ingen av disse videoene er laget av Potto. De er laget og publisert av uavhengige skapere, som krediteres med X-håndtakene sine nedenfor. Potto samler dem slik at du kan se dem, lese prompten der forfatteren har delt en, og starte din egen video ut fra ideen. Beskrivelsene bruker bare tittelen på hver video og detaljene på siden (forfatter, kategori, lengde, sideforhold, verktøy), fordi målet er å hjelpe deg å velge hva du skal studere, ikke å anmelde andres arbeid. Alt om Pottos eget verktøy kommer fra produktet slik det fungerer i dag.
Hva som regnes som motion graphics
Motion graphics er grafisk design satt i bevegelse: tekst, former, ikoner, diagrammer og bilder som beveger seg for å forklare noe, kunngjøre noe eller gi et merke et uttrykk. Adobes guide til motion graphics definerer dem som «graphics with movement» og kaller dem «shorter pieces of animation that entertain or impart information», i motsetning til helaftens animasjonsfilmer med figurer og et plott. Wikipedia-artikkelen om sier at motion design vanligvis knyttes til å sette abstrakte objekter, tekst og andre elementer fra grafisk design i bevegelse.
Til sammen nevner de to kildene stedene arbeidet dukker opp: åpningssekvenser for film og tv, grafikk for kringkasting og nyheter, reklame og merkevarebygging, animert typografi, design av brukergrensesnitt, og forklarings- og promoteringsvideoer. Den listen er ordnet etter bransje. Denne guiden ordner etter oppgave i stedet, fordi spørsmålet når du lager en video er «hva prøver jeg å få fram?», ikke «hvilken bransje er dette?». De seks jobbene nedenfor følger kategoriene biblioteket bruker, og dekker det meste en bedrift eller en skaper faktisk trenger.
Jobb
Hva den gjør
Typisk spørsmål den svarer på
Lansering
Kunngjør et produkt eller en utgivelse
Hva er nytt, og hvorfor bør jeg bry meg?
Produktskjermer
Animerer et grensesnitt
Hvordan ser dette produktet ut, og hvordan fungerer det?
Kinetic type
Flytter ord som hovedbildet
Hvilken setning skal jeg huske?
Datahistorie
Får et tall eller en trend til å feste seg
Hva endret seg, og med hvor mye?
Forklaring
Lærer bort en idé i steg
Hvordan fungerer dette?
Logoanimasjon
Avslører et merke
Hvem har laget dette?
Slik ble de 21 eksemplene valgt
Biblioteket er stort og vokser stadig, så denne guiden siterer ikke totaler; siden viser alltid de gjeldende tallene. For å velge eksempler brukte guiden fire filtre. Hvert verk må ha en kreditert forfatter, en registrert lengde og et sideforhold, en video som kan spilles av, og en tittel som sier hva videoen handler om. Innen hver jobb ble verk foretrukket som varierer i lengde, sideforhold og verktøy, slik at du ser spennet i stedet for ett gjentatt mønster.
To fakta om hele biblioteket er verdt å kjenne før eksemplene. De kommer fra bibliotekets registre slik de ble sjekket 2026-10-12, og de vil flytte seg etter hvert som verk legges til:
De fleste verkene er 16:9. Omtrent fire av fem verk er 16:9, omtrent ett av åtte er 9:16, og resten er 1:1. Hver jobb nedenfor følger den samme skjevheten, som stemmer med hvor folk ser: nettsteder, presentasjoner og X.
Lengden avhenger av jobben. Medianlengden er omtrent 9 sekunder for logoanimasjon, 15 for kinetic type, 30 for lansering, 35 for datahistorie, 36 for produktskjermer og 60 for forklaring. Medianene per jobb står i hver seksjon.
De 21 verkene står i egne seksjoner nedenfor, hvert med lenke til sin side, der du kan spille det av. For hvert verk oppgir guiden forfatterens X-håndtak, lengden, sideforholdet, verktøyene der siden lister dem, og om forfatteren delte prompten. «Prompt delt» betyr at forfatteren publiserte prompten på verkets side, slik at du kan lese den før du bestemmer deg for å bruke den på nytt.
Eksempler på lanseringsfilm
En lanseringsfilm kunngjør noe og ber seeren huske én ting: navnet. Blant bibliotekets lanseringsvideoer er medianlengden 30 sekunder, og omtrent halvparten er 30 sekunder eller kortere. Kategorien er også den med størst spredning i sideforhold, med omtrent ett av fem i 9:16 for telefoner.
Reddit marketing tool launch video av @anthonyriera varer 52,8 sekunder i 16:9. Siden lister Remotion som verktøy, den samme rendereren Potto bruker, noe som gjør den til en nyttig referanse for hva en kodebygd lanseringsfilm kan romme på nesten ett minutt.
TypingMind showreel announces team features av @ann_nnng er 15,0 sekunder i 16:9, bygd på canvas, og forfatteren delte prompten. Tittelen navngir innholdet, teamfunksjoner, og formen, en showreel.
CodePilot promo floats 17 model-provider logos av @op7418 varer 50,0 sekunder i 16:9. Tittelen er i seg selv en presis brief: ett gjentatt visuelt grep, 17 logoer, på en klokke på 50 sekunder.
Hva du bør se etter. Spill en lanseringsfilm én gang uten lyd, og noter sekundet der produktnavnet først vises. Tell deretter hvor mange separate påstander filmen kommer med. Eksemplene over peker mot en regel som holder på tvers av kategorien: jo kortere filmen er, desto færre påstander. En film på 15 sekunder bærer én idé og et navn; en film på 50 sekunder har plass til et problem, noen funksjoner og en avslutningslinje.
Lån det med Potto. Pottos verktøy for produktvideo bygger lanseringsfilmer ut fra en beskrivelse eller en lenke. En brief som fungerer godt, navngir publikum, lengden og taktene:
Lanseringsfilm for en oppdiktet budsjettapp som heter Ledgerly, 30 sekunder, 16:9. Åpne med problemet med å følge forbruk i regneark, vis tre funksjoner, avslutt med appnavnet og en oppfordring til handling.
Eksempler på produktskjermer
Animasjon av produktskjermer viser et grensesnitt som gjør noe: en liste sorterer seg selv, et dashbord fylles, en telefon går gjennom en flyt. Medianlengden i kategorien er 36 sekunder, men den midtre halvdelen av verkene går fra omtrent 24 til omtrent 67 sekunder, så den er den mest varierte av de seks. Det er også her eksemplene i 9:16 og 1:1 er mest nyttige, siden appflyter ofte vises på telefoner.
Hva du bør se etter. Sett på pause på det første bildet som viser grensesnittet, og spør hva seeren er ment å se på. Se deretter hvor lenge hver tilstand blir stående på skjermen. Animasjon av produktskjermer svikter når skjermen endrer seg før øyet har funnet endringen, og derfor viser de korteste eksemplene her én forvandling, mens de lengre grupperer tilstandene sine i steg.
Lån det med Potto. En produktdemovideo starter fra skjermbilder du laster opp, opptil åtte bilder, dokumenter eller lydfiler per prosjekt. Skjermbildescener zoomer inn og følger en markørbane, og hver scene kan bære en bildetekst, så den vanlige briefen er en liste med steg:
Produktdemo for en oppdiktet fakturaapp, 30 sekunder, 16:9. Bruk mine tre skjermbilder: opprett en faktura, send den, se at den er betalt. Én kort bildetekst per skjermbilde, og avslutt med appnavnet.
Eksempler på kinetic type
Kinetic type setter ord i bevegelse som hovedbildet. Det er den korteste av jobbene som ledes av tekst: medianen er omtrent 15 sekunder, og omtrent sju av ti verk varer 30 sekunder eller mindre. Fordi det ikke finnes et grensesnitt eller et diagram som bærer meningen, må teksten gjøre det.
Slanted credit names glide over an orange grid av @goodside varer 75,0 sekunder i 16:9, med en delt prompt. I den lengden er det gjentatte grepet en liste med navn som beveger seg over én bakgrunn.
Hva du bør se etter. Skru av lyden og les videoen. Kinetic type bør fungere som tekst: hvis setningene er svake, redder ikke bevegelsen dem. Slå deretter på lyden og sjekk om timingen av hvert ord følger lyden. De to eksemplene på 15 sekunder knytter bevegelsen til et tittelkort eller et tempo, mens de to eksemplene på 75 sekunder støtter seg på struktur, en rulletekst og kapitteltitler, for å holde på oppmerksomheten.
Lån det med Potto. Pottos tekstscener bygger seg opp på cue, og scenene for sitat, tittel og liste bærer korte linjer. Det tilbyr ikke fri bokstavanimasjon, så en 128 BPM-bølge ligger utenfor det det renderer. Det det håndterer godt, er et kort manus der hver linje får sitt eget bilde:
Kinetic text-video, 15 sekunder, 16:9, stil Bold Pop. Fem korte linjer, én per bilde, om et team som shipper hver fredag. Avslutt med linjen «Ship it.»
Eksempler på datahistorie
En datahistorie får ett tall eller én trend til å feste seg. Blant bibliotekets datahistorie-videoer er medianen omtrent 35 sekunder, og spredningen er vid, fra 15 sekunder til godt over ett minutt. Kategorien er blant de minste, noe som gjør disse til et godt sted å studere hvert eksempel.
LLM release timeline tracks 2026 models month by month av @nummanali er 62,1 sekunder i 16:9, bygd på canvas, med prompten delt. Siden beskriver en canvas-animasjon som går gjennom 2026 måned for måned, så tiden er aksen.
Hva du bør se etter. Finn det ene tallet videoen vil at du skal huske, og sjekk deretter hvordan videoen gjør seg fortjent til det: hva som kommer før, og hva som vises etter. De tre eksemplene bruker tre ulike grep til den samme oppgaven. Ett oppgir et resultat, ett går langs en tidslinje, og ett parer et tall med et bilde av det det måler.
Lån det med Potto. Statistikkscener viser ett stort tall, og diagramscener tegner stolpe- eller smultringdiagrammer med tre til seks verdier som teller opp. Hvis du skriver tallene inn i briefen, bruker videoen dem slik de er skrevet, så sjekk hvert tall mot kilden din før du eksporterer. Siden for animert diagram samler flere av disse:
Datahistorie, 30 sekunder, 16:9. En oppdiktet kafé fikk gjennomsnittlige kopper per dag til å stige fra 120 i juni til 190 i september. Åpne med spørsmålet, vis de fire månedene som et stolpediagram, og avslutt med stigningen på 58 %.
Eksempler på forklaringsvideo
En forklaringsvideo lærer bort en idé i steg. Den er den lengste av de seks: medianlengden er 60 sekunder, og bare omtrent ett av fem verk varer 30 sekunder eller mindre. Bibliotekets forklaringsvideoer har også det bredeste spennet av uttrykk, fra pikselkunst til håndtegnede tavler.
Kinetic word cloud pitches an AI inference startup av @deedydas er 26,0 sekunder i 16:9, bygd med SVG og GSAP, med prompten delt. Det er den korteste forklaringsvideoen her, og den presser en pitch inn i ett bevegelig grep.
Hva du bør se etter. En forklaringsvideo bør bestå setningstesten: etter én visning, kan du formulere ideen i én setning? Se etter øyeblikket der problemet blir til løsningen, og tell stegene mellom det øyeblikket og slutten. To av de tre eksemplene griper etter ett lite, konkret emne (et siffer, en onboarding-flyt) og lar det bære hele leksjonen.
Lån det med Potto. Strukturen bak de fleste forklaringsvideoer er problem, løsning, hvordan det fungerer og neste steg, som guiden om hva en forklaringsvideo er går gjennom i detalj, og 12 eksempler på forklaringsvideo bryter ned etter scenerekkefølge.
Pottos verktøy for forklaringsvideo kan starte fra et tema, en lenke eller et dokument, for eksempel en PDF. Det har ingen håndtegnet stil eller tavlestil: de tolv innebygde stilene er Clean Modern, Midnight Tech, Editorial Paper, Bold Pop, Blueprint, Warm Organic, Neon Night, Soft Pastel, Mono Minimal, Sunset Gradient, Studio Noir og Fresh Mint.
Eksempler på logoanimasjon
En logoavsløring er den korteste jobben: medianlengden i biblioteket er under 9 sekunder, og eksemplene her går fra 8,7 til 21,0 sekunder. Det er én ting å se på, så videoen handler mest om timing og formen på bevegelsen.
TypingMind logo reveal av @tdinh_me varer 21,0 sekunder i 16:9, med prompten delt. Siden beskriver en langsom avsløring der merket settes sammen gradvis.
Hva du bør se etter. Se på det siste bildet. En logoavsløring lykkes hvis det ferdige merket er rent, sentrert og lesbart lenge nok til å feste seg, og bevegelsen før det er det som gir merket personlighet. Eksempelet på 8,7 sekunder viser hvor mye én enkelt bevegelse, én form som endrer seg til en annen, kan gjøre.
Lån det med Potto. Pottos avsluttende oppfordringsscene kan avslutte en video på logoen din, og kategorien logoanimasjon i biblioteket er stedet for å studere frittstående avsløringer. Potto renderer fra et fast sett med scenetyper og stiler, uten egendefinert animasjonskode, så en bestemt easing-kurve som den elastiske forvandlingen over er noe å studere, ikke noe å kopiere nøyaktig.
Lag din egen versjon
Du har tre veier til en video som disse. Skriv koden selv, be en kodeagent skrive den, eller beskriv videoen for et verktøy som renderer den for deg.
Mange skapere i biblioteket bygger med kode. Remotion, rendereren Potto bruker, beskriver seg selv som en måte å lage videoer og motion graphics med React på, og det publiserer agentferdigheter slik at kodeagenter kan jobbe med det. Pottos side for skills samler gratis agentferdigheter fra tredjepartsforfattere som du kan installere i en agent som leser SKILL.md-filer; de kjører i din egen agent med din egen modell.
Anthropics Claude Motion, kunngjort 8. oktober 2026 og i beta på planene Team og Enterprise per 2026-10-12, animerer tekst, diagrammer, former og bilder ut fra en prompt og eksporterer en MP4. Potto er ikke Claude Motion og har ingen offisiell relasjon til Anthropic. Innlegget om alternativer til Claude Motion sammenligner veiene ut fra fakta du kan sjekke.
Beskrivelsesveien er Pottos verktøy for AI motion graphics. Du gir det en prompt, en offentlig lenke eller et dokument. Claude Opus 5.5 skriver briefen, manuset og storyboardet, og Remotion renderer scenene til en MP4 med voiceover, undertekster og musikk, i 16:9, 9:16 eller 1:1. Du kan redigere storyboardet skjerm for skjerm, eller be i chatten om en endring. På biblioteksidene har en video med delt prompt en knapp, Use this prompt, som sender den til Pottos videoskaper. Resultatet er Pottos egen versjon, med egne scenetyper og stiler, så det vil ikke matche originalen; behandle originalen som en referanse for ideen, tempoet og uttrykket.
Forhåndsvisninger og storyboards koster ingenting; credits belastes når du eksporterer, og totalen vises før du bekrefter (se priser). Potto genererer ikke live-action-opptak, avatarer eller personer, og det redigerer ikke video du allerede har.
Vanlige spørsmål
Hva er typene motion graphics?
Typene motion graphics grupperes vanligvis etter hvor de vises: tittelsekvenser for film og tv, grafikk for kringkasting og nyheter, reklame og merkevarebygging, kinetisk typografi, animasjon av brukergrensesnitt, og forklarings- eller promoteringsvideoer. Denne guiden sorterer dem etter jobb i stedet: lanseringsfilmer, produktskjermer, kinetic type, datahistorier, forklaringsvideoer og logoanimasjoner. Wikipedias artikkel om motion graphic design skiller også mellom forklarende, emosjonell og promoterende grafikk, etter om målet er å klargjøre, å vekke en følelse eller å øke bevisstheten.
Hva regnes som motion graphics?
Motion graphics er animert grafisk design: tekst, former, ikoner, diagrammer og bilder satt i bevegelse for å informere, promotere eller bygge merkevare. Adobe definerer dem som «graphics with movement» og beskriver dem som kortere animasjonsstykker som underholder eller formidler informasjon. En video som animerer et skjermbilde av et produkt, et stolpediagram eller en logo, er motion graphics. En helaftens animasjonsfilm med figurer og et plott kalles vanligvis animasjon i stedet.
Hva er forskjellen mellom motion graphics og animasjon?
Motion graphics beveger elementer fra grafisk design, som typografi, former og diagrammer, vanligvis for å formidle informasjon i et kort stykke, mens animasjon i videre forstand forteller historier med figurer og plott. De to overlapper, så skillet er mer et spørsmål om formål og skala enn om teknikk. Adobes guide trekker skillet etter lengde og formål: motion graphics er kortere stykker som underholder eller formidler informasjon.
Hvor lang bør en motion graphics-video være?
Det avhenger av jobben. I Potto-biblioteket per 2026-10-12 er medianlengden omtrent 9 sekunder for logoanimasjon, 15 for kinetic type, 30 for lanseringsvideoer, 35 for datahistorier, 36 for produktskjermer og 60 for forklaringsvideoer. Tilpass lengden til antallet ideer: én idé får plass på 15 sekunder, og et problem, tre funksjoner og en avslutningslinje får plass på 30 til 45. Pottos lengdevalg er 15, 30, 45, 60 og 90 sekunder.
Ble videoene i denne guiden laget med Potto?
Nei. De er laget av uavhengige skapere, og hvert verk krediteres forfatteren med X-håndtaket. Potto gjør ikke krav på dem som eget arbeid. De er tatt med som referanser, og siden for hvert verk lenker til det opprinnelige innlegget der ett er tilgjengelig.
Kan jeg lage motion graphics som disse med Potto?
Ja, for de typene motion graphics Potto tilbyr: lanseringsfilmer, produktskjermer, tekstledede videoer, datahistorier og forklaringsvideoer bygd fra de elleve scenetypene, de tolv stilene og dine egne merkefarger. Potto renderer sin egen versjon ut fra prompten din, så resultatet kopierer ikke en original, og det støtter ikke egendefinert animasjonskode, håndtegnede stiler eller fri bokstavanimasjon.
Remotion, dokumentasjon for agent skills (hva ferdighetene dekker og hvordan de installeres): https://www.remotion.dev/docs/ai/skills (slått opp 2026-10-12)
Remotion, forsiden («Create videos and motion graphics with React»): https://www.remotion.dev/ (slått opp 2026-10-12)
Potto AI-sider for de 21 verkene, forfatterne, lengdene, sideforholdene og delte prompter, og for bibliotekets medianer per kategori (sjekket 2026-10-12)
Potto AI
Lag din neste lanseringsvideo.
Ta det som vekket interessen din og gjør det om til din egen video eller ditt eget bilde. Ta med skjermbilder, et tema eller en prompt.