KINETIC IMPULSE BLOCK

TIPOGRAFIA CINETICA CHE SI MUOVE

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.

PERCHÉ KINETIC

Un titolo fermo è un tempo sprecato

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.

FALLO ARRIVARE

La tipografia cinetica, chiamata anche testo animato o tipografia animata, è un titolo che si muove in posizione invece di caricarsi tutto in una volta. Questo effetto a cascata porta ogni riga a modo suo, poi si stabilizza. Altrove un effetto simile significa un template di After Effects, un'animazione CSS con keyframe o un generatore di testo animato da incollare in una pagina. Nel page builder di Instinctor è semplicemente un'impostazione: scrivi il titolo, scegli una composizione e va in scena dal vivo. Nessun rendering da esportare, nessun keyframe da mantenere e nessun plugin da installare.

Testo animato che appare in dissolvenza

Una dissolvenza spotlight è uno degli effetti di testo animato più tranquilli, quelli che di solito si scrivono a mano in CSS o si costruiscono in After Effects. Le parole emergono da una sfocatura, così un titolo hero attira lo sguardo senza urlare. In Instinctor è uno stile di titolo animato già pronto, non uno script: imposti colore, peso, carattere e ritmo in un pannello, e il testo animato gira sulla pagina dal vivo. Nessun keyframe CSS, nessun video esportato e nessun generatore di testo animato attaccato al sito.

Lettere che arrivano in volo su una curva

Animare un titolo lettera per lettera, invece che come blocco, di solito significa un template di After Effects o un'animazione di testo scritta a mano. Qui ogni carattere arriva ad arco dalla telecamera e si posa, un esempio di tipografia cinetica generata nel browser come testo vero e leggibile. Dato che è testo animato e non un video, i motori di ricerca leggono comunque le parole e la pagina resta veloce. Nell'editor di Instinctor l'intero effetto è una sola scelta di composizione, senza esportare video e senza scrivere codice.

Un effetto testo stile lettera anonima

Un effetto di testo animato grezzo, come carta strappata, di quelli che si cercano come esempio di tipografia cinetica su codepen o nelle gallerie di After Effects. È adatto a un lancio, a una promozione o a un brand grintoso, dove un titolo animato morbido sembrerebbe troppo educato. Impostato una volta nell'editor di Instinctor, è un titolo animato vero e indicizzabile, fatto di testo reale, non una GIF, uno screenshot o una clip esportata. Le tue parole restano selezionabili e indicizzabili mentre le lettere si animano.

Un'animazione di testo al neon tremolante

Un'animazione di testo con sfarfallio al neon e un bordo glitch cromatico, per un'atmosfera da locale notturno, sala giochi o retrò. Nella maggior parte degli strumenti è un template di testo animato da scaricare, o un effetto di testo CSS da copiare da codepen e mantenere a mano. Nel page builder di Instinctor è uno stile di titolo che attivi: il testo animato viene visualizzato dal vivo, senza CSS da mantenere, senza progetti After Effects e senza plugin. Cambia le parole, il colore e il ritmo quando vuoi e l'animazione riparte.

Testo su un cubo 3D rotante

Testo animato in tre dimensioni, il tipo di tipografia cinetica che di solito vive in After Effects o in una demo WebGL su codepen. Qui il titolo corre su un cubo rotante, tagliato a pezzi e riassemblato, visualizzato dal vivo nel browser invece di essere inserito come video. Dato che è tipografia animata fatta di testo vero, viene letta come titolo sia dalle persone sia dai motori di ricerca. Nell'editor di Instinctor l'effetto 3D è un'opzione in un pannello, senza niente da programmare.

Testo che si avvolge in una spirale

Uno stile di tipografia animata che avvolge il testo su una spirale che gira lentamente, il tipo di animazione elaborata che altrimenti costruiresti con CSS o JavaScript su misura. Sembra un effetto codepen fatto su misura, ma nel page builder di Instinctor è una sola scelta, senza plugin, senza librerie e senza keyframe da scrivere a mano. Il titolo resta testo vivo e modificabile, così il testo animato piace ai motori di ricerca e la pagina resta leggera mentre la spirale gira.

Testo animato che pulsa

Un'animazione di testo cinetico in loop in cui le lettere si gonfiano e si ricompattano a tempo, ideale per musica, eventi o qualsiasi cosa che voglia farsi sentire. È il tipo di testo animato che si cerca su codepen o come preset di After Effects. Nell'editor di Instinctor è integrato: niente HTML o CSS da mantenere, nessun plugin da aggiornare e nessun video esportato. Scrivi le parole, scegli la composizione e il titolo animato va in loop dal vivo sulla pagina.

Testo animato in un gradiente

Una sfumatura di testo animato che viaggia lungo le lettere mentre si animano. Unisce la tipografia cinetica con un effetto di testo sfumato in un singolo titolo, qualcosa che altrimenti dovresti assemblare da una sfumatura CSS più un'animazione di testo separata, o un plugin e un'esportazione di After Effects. Nel page builder Instinctor entrambi sono un'unica impostazione: scegli due colori, scegli come si muove la sfumatura, e il testo animato viene riprodotto in diretta. Nessun generatore separato, nessun CSS da scrivere a mano, e nulla da renderizzare.

Un lungo titolo animato in movimento

Il testo animato non è solo per titoli di due parole. Un titolo animato completo su più righe può essere riprodotto come un movimento composto, quindi anche un lungo titolo di tipografia cinetica arriva progettato piuttosto che come una pila di animazioni CSS separate. Dove un effetto costruito a mano diventa fragile su più righe, Instinctor tratta l'intera intestazione come un'unica animazione. Rimane testo reale e indicizzabile per i motori di ricerca, impostato dall'editor senza keyframe e senza After Effects, e si ridispone e si riannima quando cambi le parole.

MESCOLA i pesi E IL COLORE

Mescola pesi, dimensioni e colori all'interno di un titolo animato: un'animazione di testo cinetico a due toni, per riga, che altrimenti costruiresti manualmente con CSS o assembleresti in After Effects. Una riga può essere pesante e una leggera, una nel colore del tuo brand e una in un colore di accento, tutto all'interno di un'unica intestazione animata. Nell'editor di Instinctor ogni riga è impostata in un pannello, quindi la tipografia animata rimane un'intestazione coerente piuttosto che una fila di effetti non correlati, e rimane testo reale e indicizzabile sulla pagina.

COLORE E CONTROLLO

Il tuo colore il tuo ritmo

Un solo colore suona come una sola voce; attiva un gradiente e due colori viaggiano, ruotano o scorrono sul testo mentre si anima.
La velocità è un singolo cursore, impostato di default a un ritmo tranquillo di tre quarti, e il blocco adatta automaticamente il testo allo schermo in modo che un titolo non trabocchi mai. 

UN SOLO MOVIMENTO

Progettato, non programmato

La trappola del testo animato è scriptare ogni parola per conto suo finché il titolo diventa una pila di trucchetti scollegati. Instinctor lavora al contrario: scegli una composizione e l'intera riga si muove come un unico gesto progettato. Il controllo riga per riga c'è quando lo vuoi, ma il comportamento predefinito è un solo movimento pulito, a un ritmo voluto, con le entrate a effetto lasciate sullo scaffale.

Il movimento è la prima parola

Nessuno legge un titolo e pensa all'animazione, così come nessuno entra in una stanza fatta bene e ammira gli incastri del legno. Sente solo che è stata fatta con cura. Una riga che arriva con intenzione dà il tono a tutto quello che sta sotto: dice che questa pagina è stata progettata, non assemblata. Quell'impressione si forma nel primo secondo, ed è la cosa più difficile da fingere con un modello statico.

Che cos'è la tipografia cinetica?

Scopri cos'altro sa fare

Il testo cinetico è uno dei quaranta blocchi di Impulse, e ognuno è costruito per muoversi.