# Animeret Instagram-story: sådan fastholder du opmærksomheden [Canonical HTML page](https://gradiently.design/da/guide/animated-instagram-story) En story får et sekund eller to, før tommelfingeren går videre. Den rigtige slags bevægelse fortjener resten af billedet. Den forkerte gør bare ordene sværere at læse. ## The short version - En animeret Instagram-story er en video i 1080×1920, som regel et kort loop, brugt i stedet for en stillestående story. - De mest læselige animerede stories holder baggrunden i langsom bevægelse og lader ordene komme ind én gang og så stå stille. - Det første sekund betyder mest, så overskriften bør være fuldt på skærmen inden for omkring et sekund efter, at storyen åbner. - Upload animerede stories som MP4-video i 1080×1920 frem for som GIF, så gradienter forbliver bløde. - Hold tekst og logoer væk fra toppen og bunden af billedet, hvor Instagram tegner sin egen brugerflade. En **animeret Instagram-story** virker, når én ting bevæger sig med et formål, og alt andet forbliver læseligt. I praksis betyder det en baggrund, der driver langsomt, en overskrift, der kommer ind én gang med en kort animation og så bliver stående, og intet vigtigt i toppen eller bunden af billedet på 1080×1920. Eksportér den som MP4, ikke GIF, og sørg for, at allerførste billede allerede læses som et færdigt design, for nogle vil kun nogensinde se det billede. ## Hvad der skal bevæge sig i en animeret story En story ses et øjeblik, i strakt arm, ofte med lyden slukket. Bevægelse trækker øjet, så alt, der bevæger sig, konkurrerer med dine ord. De stories, der fastholder opmærksomheden, vælger ét bevægeligt lag og gør det roligt og lader så skriften gøre sit arbejde. Urolige stories føles energiske i editoren og udmattende på en telefon. ### Trættende at se - Hver tekstlinje animeres på sin egen måde - Ordene bliver ved med at bevæge sig, efter de er kommet - En hurtig baggrund med høj kontrast bag lille tekst - Stickers, GIF’er og effekter stablet på ét billede - Overskriften dukker op efter tre sekunder ### Fastholder opmærksomheden - Én tekstanimationsstil i hele storyen - Ordene kommer ind og bliver så helt stille - En langsom baggrund med et roligt område bag ordene - Ét bevægeligt element, valgt med vilje - Overskriften kan læses inden for et sekund Det samme princip går igen i alt godt bevægelsesarbejde, fra logoer til websites. Vil du have teorien bag, dækker [principper for motion design](https://gradiently.design/da/guide/motion-design-principles) timing, easing og hierarki mere i dybden. ## Fire tekstanimationer, der virker i stories Tekstanimation er den mest nyttige bevægelse i en story, fordi den fortæller øjet, hvor det skal begynde. Hold den kort. En indtoning, der tager længere end et halvt sekund, begynder at føles som ventetid, og folk trykker sig videre fra ventetid. | Animation | Hvad den gør | Brug den til | | --- | --- | --- | | Rise | Ord glider en kort afstand op og lander | Rolige meddelelser, citater, redaktionelle stories | | Pop | Ord skalerer ind med et let overskud | Tilbud, lanceringer, legende brands | | Wipe | En linje afsløres fra den ene side | Overskrifter med en stærk læseretning | | Skrivemaskine | Bogstaver dukker op et efter et | Spørgsmål, teasere, korte kroge på få ord | Vælg én pr. story. Skrivemaskinen er langsomst, så hold dens linje kort, ellers skriver den stadig, når folk trykker videre. Stagger linjer frem for ord: overskriften først, den understøttende linje et øjeblik senere, linkopfordringen sidst. Den rækkefølge matcher, hvordan folk læser, og den betyder, at storyen giver mening, selv hvis nogen går midtvejs. Flere mønstre, blandt andet kinetisk skrift, finder du i [idéer til tekstanimation](https://gradiently.design/da/guide/text-animation-ideas). En lodret story med en bevægelig gradientbaggrund, der annoncerer, at et nyt studie åbner fredag Overskriften stiger ind først, så detaljen. Begge sidder i det midterste bånd, væk fra brugerfladen. En lodret nedtællingsstory med teksten to dage tilbage til en forårskollektion på en blød animeret gradient En nedtælling, der popper ind én gang. Baggrunden bliver ved med at bevæge sig, så storyen stadig føles levende, mens ordene står stille. ## Timing af en animeret Instagram-story En stillestående story bliver på skærmen i omkring fem sekunder, før Instagram går videre. En videostory afspilles, så længe klippet kører, men opmærksomheden er forhåndsbelastet: hvis det første sekund er tomt, bliver resten sjældent set. Planlæg tidslinjen baglæns ud fra det. 1. **0 til 1 sekund: overskriften** Baggrunden bevæger sig allerede i første billede. Overskriften er færdig med sin indtoning ved udgangen af første sekund. 2. **1 til 2 sekunder: støtten** Den anden linje eller produktet kommer ind. Brug samme animation som overskriften, med lidt mindre bevægelse. 3. **2 til 3 sekunder: handlingen** Linkopfordringen, datoen eller koden dukker op. Det er den linje, folk handler på, så den skal have tid til at blive læst. 4. **Resten: hold** Intet nyt kommer ind. Baggrunden bliver ved med at drive, så storyen looper uden synlig genstart. Seks til ti sekunder er en behagelig længde til en designet story med et kort budskab. Længere klip passer til tale eller demonstration, ikke en overskrift. Hvis storyen skal loope, skal baggrunden slutte, hvor den begyndte, hvilket gennemgås trin for trin i [sømløs loopvideo](https://gradiently.design/da/guide/seamless-loop-video). > **Gør første billede til et færdigt design** Miniaturer, forhåndsvisninger og langsomme forbindelser kan vise første billede alene. Hvis dine ord animeres ind fra ingenting, er det billede en tom baggrund. Lad overskriften starte delvist synlig, eller design første billede som et komplet stillbillede. ## Størrelse, sikre zoner og eksportindstillinger En animeret story bruger den samme ramme som en stillestående: 1080×1920 pixels, 9:16. Instagrams brugerflade ligger over toppen og bunden, så hold ord og logoer i det midterste bånd. En almindelig arbejdsregel er at lade cirka de øverste og nederste 250 pixels være fri for tekst. Den fulde gennemgang står i [størrelse på Instagram-story](https://gradiently.design/da/guide/instagram-story-size). - Story og Reel 9:16: 1080 × 1920 - Feed-opslag 4:5: 1080 × 1350 - Kvadrat 1:1: 1080 × 1080 Storyens ramme ved siden af feed-formaterne. Design storyen i fuld højde i stedet for at strække et feed-opslag, så det passer. | Indstilling | Anbefaling | Hvorfor | | --- | --- | --- | | Format | MP4 | Instagram afspiller video direkte og holder gradienter bløde | | Størrelse | 1080×1920 px | Intet bliver skaleret om eller får sorte bjælker | | Billedhastighed | 30 fps | Jævn nok til langsom bevægelse, små filer | | Lyd | Valgfri | Mange ser uden lyd, så ordene må bære budskabet | | Undgå | GIF-uploads | 256 farver pr. billede får gradienter til at vise bånd | Eksportindstillinger til en designet animeret story. GIF er det ene format, du bør undgå her. Dens grænse på 256 farver forvandler bløde gradienter til striber, og en bevægelig story er en video, så langt Instagram er bekymret, så giv den en. Sammenligningen står i [GIF eller MP4](https://gradiently.design/da/guide/gif-vs-mp4). ## Sådan laver du animerede stories, der ikke ligner alle andres De fleste skabeloner til animerede stories bruger de samme få bevægelige baggrunde, så et feed fuld af dem flyder sammen. Baggrunden er der, hvor dit brand kan genkendes, før nogen har læst et ord. Et bevægeligt farvefelt, der tilhører dig, gør mere end et stockloop nogensinde vil. I Gradiently begynder en story på en **Mark**: en levende gradient- og materialebaggrund, der bevæger sig af sig selv og er unik. Tilføj din overskrift, vælg rise, pop, wipe eller skrivemaskine, og Marken holder sit roligste område bag ordene, mens auto ink vælger lys eller mørk skrift linje for linje. Det samme design kan så tilpasses til et feed-opslag eller en [Reels-baggrund](https://gradiently.design/da/guide/reels-tiktok-backgrounds) uden at blive bygget forfra. Videoeksport er en del af Pro og gemmer MP4, hvor din browser understøtter det. En enkel lodret story med én linje om en ny menu over en langsomt bevægelig gradient En langsom Mark bag én stillestående linje. Baggrunden bevæger sig, men ordene gør aldrig. ## FAQ ### Hvordan laver jeg en animeret Instagram-story? Design en ramme på 1080×1920 med en bevægelig baggrund og én tekstanimation, hold ordene i det midterste bånd, eksportér den som MP4, og upload den som en story. De fleste designværktøjer med videoeksport kan gøre det. ### Hvilket format skal en animeret Instagram-story have? MP4 i 1080×1920 pixels. Undgå GIF: dens grænse på 256 farver får gradienter til at vise bånd, og Instagram behandler en bevægelig story som video alligevel. ### Hvor lang bør en animeret Instagram-story være? Til en designet story med et kort budskab er seks til ti sekunder behageligt. Få overskriften på skærmen inden for første sekund, for opmærksomheden falder hurtigt derefter. ### Hvorfor ser min animerede story sløret eller stribet ud? Som regel blev den eksporteret som GIF, i den forkerte størrelse eller med lav bitrate. Eksportér MP4 i præcis 1080×1920, så Instagram ikke har noget at skalere om. ### Skal teksten bevæge sig hele tiden? Nej. Lad ord animere ind én gang og så stå stille. Bevægelig tekst er sværere at læse, og en langsomt bevægelig baggrund holder allerede storyen i live.