KINETIC IMPULSE BLOCK

KINETISK TYPOGRAFI DER BEVÆGER SIG

Kinetic typography is text that moves: a headline with a designed entrance instead of a flat line. Instinctor builds animated text right in the page editor, with no After Effects and no code. Choose an animation, set the color and pace, and publish. The words arrive, they do not just appear.

HVORFOR KINETISK

En stillestående titel er et spildt slag

A reader gives the top of a page about a second before deciding whether to stay. A static headline spends that second sitting there. A headline that moves spends it earning attention: the eye is pulled to motion before it reads a word, so the first thing your visitor does is watch your most important line. Kinetic is the difference between a headline that is seen and one that is skimmed.

FÅ DET TIL AT LANDE

Kinetisk typografi, også kaldet animeret tekst eller animeret typografi, er en overskrift, der bevæger sig på plads i stedet for at indlæses på én gang. Denne kaskade bringer hver linje på sin egen måde, og falder så til ro. Andetsteds betyder en effekt som denne en After Effects-skabelon, en CSS keyframe-animation eller en animeret tekstgenerator, du indsætter på en side. I Instinctors sidebygger er det blot en indstilling: skriv overskriften, vælg en komposition, og den afspilles live. Der er ingen rendering at eksportere, ingen keyframes at vedligeholde, og intet plugin at installere.

Animeret tekst der toner frem

En spotlight fade er en af de mere rolige animerede teksteffekter, den slags du normalt ville håndkode med CSS eller bygge i After Effects. Ordene træder frem af en uskarphed, så en hero-overskrift fanger øjet uden at råbe. I Instinctor er det en klar animeret overskriftsstil snarere end et script: du indstiller din egen farve, vægt, skrifttype og tempo i et panel, og den animerede tekst kører på den live side. Ingen CSS keyframes, ingen eksporteret video, og ingen animeret tekstgenerator fastboltet på siden.

Bogstaver der flyver ind i en bue

At animere en overskrift bogstav for bogstav i stedet for som en blok betyder normalt en After Effects-skabelon eller en håndskrevet tekstanimation. Denne lader hvert tegn bue ind fra kameraet og falde til ro, et stykke kinetisk typografi genereret i browseren som ægte, læsbar tekst. Fordi det er animeret tekst og ikke en video, læser søgemaskiner stadig ordene, og siden forbliver hurtig. I Instinctor-editoren er hele effekten et enkelt kompositionsvalg uden videoeksport og uden kode at skrive.

En teksteffekt som et løsesumsbrev

En rå animeret teksteffekt i revet papir, den slags folk slår op som et eksempel på kinetisk typografi på codepen eller i After Effects-gallerier. Det passer til en lancering, en kampagne eller et brand med kant, hvor en glat animeret overskrift ville føles for høflig. Indstillet én gang i Instinctor-editoren er det en ægte, søgbar animeret overskrift bygget fra live tekst, ikke en GIF, et screenshot eller et eksporteret klip. Dine ord forbliver markerbare og indeksérbare, mens bogstaverne animeres.

En tekstanimation der flimrer som neon

En neonflimrende tekstanimation med en kromatisk glitch-kant, for en natteliv-, arkade- eller retro-følelse. I de fleste værktøjer er dette en animeret tekstskabelon, du downloader, eller en CSS-teksteffekt, du kopierer fra codepen og vedligeholder manuelt. I Instinctors sidebygger er det en overskriftsstil, du slår til: den animerede tekst renderes live, uden CSS at vedligeholde, uden After Effects-projekt og uden plugin. Skift ord, farve og tempo, når du vil, og den animeres igen.

Tekst på en roterende 3D-terning

Animeret tekst i tre dimensioner, den slags kinetisk typografi, der normalt bor i After Effects eller en WebGL codepen demo. Her rider overskriften en roterende terning, skåret fra hinanden og samlet igen, renderet live i browseren i stedet for at blive droppet ind som en video. Fordi det er animeret typografi bygget fra ægte tekst, læses det som en overskrift for både mennesker og søgemaskiner. I Instinctor-editoren er 3D-effekten ét valg i et panel, uden noget at kode.

Tekst der snor sig ind i en spiral

En animeret typografi-stil, der vikler typen på en langsomt drejende spiral, den slags udførlig tekstanimation, du ellers ville bygge med brugerdefineret CSS eller JavaScript. Det læses som en skræddersyet codepen-effekt, men i Instinctor page builder er det et enkelt valg, uden plugin, uden bibliotek og uden keyframes at håndskrive. Overskriften forbliver live, redigerbar tekst, så den animerede tekst er søgemaskinevenlig, og siden forbliver let, mens spiralen drejer.

Pulserende animeret skrift

En loopende kinetisk tekstanimation, hvor bogstaverne svulmer og pakkes igen til et beat, godt til musik, begivenheder eller alt, der gerne vil føles højt. Det er den slags animeret tekst, folk søger efter på codepen eller som en After Effects-preset. I Instinctor-editoren er det bygget ind: ingen HTML eller CSS at vedligeholde, intet plugin at opdatere, og ingen eksporteret video. Du skriver ordene, vælger komposition, og den animerede overskrift kører i loop live på siden.

Animeret tekst i en gradient

En animeret tekstgradient, der bevæger sig langs bogstaverne, mens de animeres. Det parrer kinetisk typografi med en gradientteksteffekt i en enkelt overskrift, noget du ellers ville samle fra en CSS-gradient plus en separat tekstanimation, eller et plugin og en After Effects-eksport. I Instinctors sidebygger er begge ét valg: vælg to farver, vælg hvordan gradienten bevæger sig, og den animerede tekst afspilles live. Ingen separat generator, ingen CSS at håndskrive, og intet at rendere.

En lang animeret overskrift i bevægelse

Animeret tekst er ikke kun til titler med to ord. En fuld animeret overskrift på flere linjer kan afspilles som én sammensat bevægelse, så selv en lang kinetisk typografi-titel kommer designet frem i stedet for som en stak separate CSS-animationer. Hvor en håndbygget effekt bliver skrøbelig over flere linjer, behandler Instinctor hele overskriften som én animation. Den forbliver live, søgbar tekst til søgemaskiner, indstillet fra editoren uden keyframes og uden After Effects, og den omformes og genanimeres, når du ændrer ordene.

BLAND vægtene OG FARVEN

Bland vægte, størrelser og farver i én animeret titel: en tofarvet, linje-for-linje kinetisk tekstanimation, som du ellers ville bygge med CSS eller samle i After Effects. En linje kan være tung og en let, en i din brand-farve og en i en accent, alt inden for en enkelt animeret overskrift. I Instinctor-editoren indstilles hver linje i et panel, så den animerede typografi forbliver én sammenhængende overskrift i stedet for en række uafhængige effekter, og den forbliver rigtig, indeksérbar tekst på siden.

FARVE OG KONTROL

Din farve dit tempo

En farve læses som én stemme; tænd for en gradient, og to farver bevæger sig, spinner eller fejer hen over typen, mens den animeres.
Hastighed er en enkelt skyder, indstillet som standard til et roligt tre-fjerdedels tempo, og blokken tilpasser automatisk sin type til skærmen, så en overskrift aldrig løber over. 

ÉN BEVÆGELSE

Designet, ikke scriptet

Fælden ved animeret tekst er at scripte hvert ord for sig, indtil overskriften bliver en bunke urelaterede tricks. Instinctor gør det modsatte: du vælger én komposition, og hele linjen bevæger sig som ét designet greb. Kontrol linje for linje er der, når du vil have den, men standarden er én ren bevægelse, i et bevidst tempo, med de billige entréer ladt tilbage på hylden.

Bevægelsen er det første ord

Ingen læser en overskrift og tænker på animationen, på samme måde som ingen går ind i et velbygget rum og beundrer snedkerarbejdet. De mærker bare, at det er lavet med omhu. En linje, der ankommer med mening, sætter tonen for alt under den: den siger, at denne side blev designet, ikke samlet. Det indtryk dannes i det første sekund, og det er det sværeste at efterligne med en statisk skabelon.

Hvad er kinetisk typografi?

Se hvad den ellers kan

Kinetisk tekst er en af fyrre blokke i Impulse, og de er alle bygget til at bevæge sig.