Nell’articolo sulle migliori alternative a Canva ti ho spiegato cosa non amo dell’unicorno australiano, proponendoti quattro valide alternative. PixTeller è una di queste, e nell’articolo di oggi farò una panoramica su questo fantastico design tool, mostrandoti le sue potenzialità e cos’è che lo rende davvero unico. Pronto a scoprire uno degli attuali migliori strumenti per creare grafiche online?
Quando provai PixTeller tempo fa, me ne innamorai all’istante. Mi accorsi subito che aveva qualcosa in più rispetto agli altri editors provati fino a quel momento.
Fu per questo motivo che scelsi di inserirlo nell’articolo delle alternative a Canva, come ultima opzione. Ultima si, ma non in termini di qualità.
Se con Designbold e Desygner posso avere accesso ad una moltitudine di elementi grafici, Snappa mi consente di creare grafiche online con una velocità a dir poco sorprendente.
PixTeller dal canto suo unisce una buona velocità a delle features estremamente interessanti che con ogni probabilità farai fatica a trovare in giro.
La varietà di modelli è ottima, seppur limitata rispetto ad altri concorrenti. Non è infatti questo il punto di forza dell’editor, ma lo scopriremo insieme man mano.
Tuttavia non credere di avere a disposizione pochi templates. PixTeller spazia infatti dal lato social a quello marketing, offrendoti basi di partenza per copertine, volantini, banners pubblicitari, collages e altro ancora.
La vera delizia però è rappresentata dalle animazioni, di cui ti parlerò fra poco.
Come creare grafiche online con PixTeller
Adesso voglio mostrarti una semplice storia Instagram realizzata per l’occasione, in modo da guidarti passo passo nella creazione dei tuoi progetti.
Perdersi nella selezione del template giusto è impossibile, visto che sono suddivisi per categoria in modo chiaro e ordinato.
Ti basta scegliere un preset fra gli oltre 134.000 disponibili, oppure iniziare a creare grafiche online da zero.
Fatto questo verrai catapultato nell’editor del sito, dotato di un’interfaccia scura (un’oasi per gli occhi) ed estremamente intuitiva.
A giudicare dall’aspetto non si direbbe un editor così potente, eppure PixTeller nasconde delle caratteristiche praticamente assenti in tutti i design tools finora provati. Scopriamole insieme!
Prima di proseguire voglio ricordarti che tutto ciò che l’editor ci mette a disposizione è completamente gratis. Questo significa che qualsiasi fotografia o elemento grafico è rilasciato sotto la licenza CC0, rendendoti libero di utilizzare i tuoi lavori come meglio credi, anche per fini commerciali.
Immagini e maschere
Puoi ricercare le immagini che ti occorrono dall’apposito menu, caricarle dal PC (anche tramite drag and drop), ed eventualmente salvarle nella tua galleria personale. In tal modo le avrai sempre a portata di click, qualsiasi grafica tu scelga di realizzare.
Sapevi che è anche possibile copincollare un’immagine direttamente dal web?
La mia foto di sfondo infatti proviene da Pexels, uno dei siti di cui ti ho parlato nell’articolo sulle immagini gratis per uso commerciale. Mi è bastato fare click col tasto destro sulla fotografia, scegliere Copia immagine, e premere CTRL + V nell’editor di PixTeller. Comodo vero?
Naturalmente potrai ritagliare la tua immagine e applicare filtri ed effetti.
Come ti dicevo prima, PixTeller è uno strumento di design davvero unico nel suo genere, ed è per questo che troverai degli effetti che non ti aspetti. Tra quelli degni di nota voglio segnalarti l’inclinazione, la sfocatura, il rumore e l’effetto pixel.
La cosa bella è che per rimuovere un effetto non dovrai far altro che cliccare sulla X del pannello, senza bisogno di riportare i parametri ai loro valori originali.
Utilissima e per niente scontata l’opzione Replace image, per rimpiazzare un’immagine mantenendone le caratteristiche. Ciò significa che sostituendo una foto del mio design con un’altra, questa risulterebbe delle stesse dimensioni e con gli stessi eventuali filtri ed effetti applicati.
Ma non finisce qui!
Ricordi la maschera di ritaglio di Photoshop? Bene, una delle features più appetitose di PixTeller è proprio la funzione maschera, che ti consentirà di scegliere una forma dalla libreria dell’editor e usarla in quel modo. Fantastico!
Forme
Per inserire una forma nel tuo progetto ti basta cliccare sull’apposita icona e fare una ricerca. Ce ne sono più di 100.000 a tua disposizione!
Sarà inoltre possibile applicare alle forme gli stessi effetti disponibili per le immagini, come ombre, sfocature e quant’altro.
Infine ti farà sicuramente piacere sapere che il discorso del rimpiazzo delle immagini vale anche per le forme. Colore, dimensioni, effetti… tutto verrà mantenuto intatto dopo la sostituzione.
Testi e sfondi
Passiamo ora al testo.
I fonts sono ordinati per categoria, e quelli utilizzati nel progetto appariranno proprio sotto la lista, in modo da essere rapidamente a portata di click.
A seconda del tipo di account inoltre, potrai caricare i tuoi caratteri personali cliccando su My fonts.
Ti piacerebbe creare delle scritte multicolore? Bè, sappi che con PixTeller è possibile, al contrario della maggior parte dei tools di design che girano sul web.
Per scegliere il colore del testo basta cliccare sul quadrato accanto a Text Color. Da lì potrai decidere di applicare una tinta unita oppure un gradiente.
Fantastica tra le altre cose la possibilità di scegliere un colore prelevandolo direttamente dal design. Il color picker è attivo fin da subito.
Ci tengo a precisare che le sfumature possono essere applicate non solo ai testi, ma anche a sfondi e forme. Il procedimento è identico a quello descritto sopra, con la differenza che in questo caso potrai scegliere tra sfumatura lineare e radiale.
Nell’esempio che segue ho applicato allo sfondo del mio documento un gradiente radiale. Naturalmente nel mio caso non serve, poiché verrà coperto dalla foto della spiaggia.
Anche i testi beneficiano di effetti più unici che rari. Ti basti pensare a quelli concavo, convesso, circolare e distorto. Davvero tanta roba ragazzi!
Disegno
Infine, non manca l’opportunità di disegnare, sia a mano libera che avvalendoci dello strumento linea, di cui potremo scegliere il tipo di traccia da un menu a tendina.
Area di lavoro
Durante la fase di progettazione avrai accesso al pannello livelli, per gestire e ordinare gli elementi grafici. Un livello può essere bloccato ma anche reso invisibile, cosa che trovo estremamente utile.
Comodissima inoltre la possibilità di spostare i livelli tramite drag and drop, invece che cambiarne la posizione di click in click con i pulsanti sulla destra.
Il design può essere duplicato per crearne una copia, oppure puoi semplicemente generare una nuova tela bianca delle stesse dimensioni del progetto.
In più voglio assolutamente ricordarti la funzione dello Smart resize, per ridimensionare in un click i nostri lavori adattandoli al formato desiderato.
Le opzioni in alto ti consentono di assegnare un titolo al lavoro e settarne la privacy scegliendo fra pubblico o privato, e una volta terminata l’opera potrai salvare l’immagine cliccando su Save image in alto a destra. La ritroverai nella sezione My designs, di cui parlerò a fine articolo.
Come creare grafiche online animate con PixTeller
Ora la mia grafica è ultimata, ma il pezzo forte deve ancora arrivare.
PixTeller offre infatti la straordinaria opportunità di animare le tue creazioni, per un impatto visivo ancora più coinvolgente. Gli effetti riproducibili sono davvero sorprendenti, in modo da generare delle eccellenti call to actions.
Dall’editor clicca quindi su Animate per accedere all’animation maker, che ti permetterà di generare la tua animazione.
Se non sei abituato a questo tipo di lavori ciò che ti ritroverai davanti potrebbe disorientarti, ma niente paura, tutto è molto più semplice di quanto immagini.
Proseguiamo con un semplicissimo esempio, in modo da farti capire come funziona il meccanismo. Pronto a creare grafiche online animate?
La lettura ti pesa? Creare grafiche animate ti sembra troppo complicato? Non preoccuparti, ho preparato una semplicissima video guida apposta per te. Prendi il tuo smartphone/tablet, mettiti comodo e impara subito come realizzare un’animazione con PixTeller!
Frames e istanze
Prima però, hai bisogno di capire il concetto di frames e istanze.
L’animazione si genera fra due istanze con proprietà diverse, ma cosa sono e come si creano?
Le istanze sono i rettangolini che dovrai inserire nella timeline e corrispondono a dei frames ben precisi.
Poniamo il caso che la mia grafica animata sia un semplice cerchio che cambia colore nell’arco di due secondi.
Se osservi bene la timeline, noterai che ogni secondo è composto da dieci frames. A rigor di logica quindi, la mia animazione di due secondi sarà composta da venti frames.
Un’animazione necessita di istanze per potersi generare.
Oltre ai frames puoi vedere che esistono già due istanze di default: una è posizionata all’inizio dell’animazione (0.0s) e l’altra alla fine (2.0s).
Ricordi quello che ti ho detto prima? L’animazione si genera fra due istanze. Di conseguenza le due che hai visto qui sopra pongono già le basi per una grafica animata.
Come modificare le proprietà di un’istanza
Cliccando su Play in alto a sinistra della timeline, però, non succede nulla. Naturale, perché devo ancora impostare le proprietà della mia animazione.
Per farlo devo cliccare sull’istanza in questione e definire le sue proprietà.
Nel mio caso voglio che il cerchio passi dal rosso all’azzurro.
L’istanza iniziale è a posto, poiché la mia forma è già rossa di per sé.
Mi limito quindi a modificare quella finale, cliccandoci sopra e modificando il colore del cerchio.
Ora l’animazione è pronta e posso visualizzarne un’anteprima cliccando su Play.
Come spostare e creare istanze
Torniamo ora all’esempio del mio design.
Anche in questo caso creerò un’animazione molto semplice della durata di quattro secondi.
Innanzitutto, visto che l’animazione durerà quattro secondi, trascino le istanze finali di ciascun livello sino al frame 4.0s con un semplice drag and drop.
Voglio che le scritte end of summer e party spuntino da sinistra per poi avanzare fino al centro della composizione, ovvero la loro posizione originaria.
Per farlo devo cliccare sulle istanze iniziali dei testi e modificarne la posizione.
Le istanze finali invece vanno bene così come sono, poiché i testi risultano già centrati.
La prima animazione è terminata e volendo posso anche modificarne il tipo. Mi basta selezionarne le istanze e scegliere una delle quattro opzioni in alto a destra della timeline.
Abbiamo quattro voci a disposizione: linear, ease in, ease out e ease in out.
Niente paura se non ne comprendi il significato. Cliccandoci sopra infatti una simpatica animazione con una macchinina ci mostrerà il tipo di velocità di ciascuna di esse.
Passiamo ora alla seconda e ultima.
Ho scelto di animare il cerchio facendolo prima ingrandire e poi deformare.
Siccome la forma deve ingrandirsi a un certo punto dell’animazione, ho creato un’istanza.
Per creare un’istanza devi cliccare sul frame desiderato e scegliere Add instance in alto a sinistra.
Poi, dopo averci cliccato sopra, ho modificato le dimensioni del cerchio.
In seguito, come puoi vedere negli screens qui sopra, ne ho create altre tre dove ho applicato l’effetto inclinazione per distorcere la forma.
Il procedimento è sempre lo stesso: cliccare sul frame desiderato, creare un’istanza e modificarne le proprietà.
Anche in questo caso l’istanza finale è a posto, perché il cerchio tornerà com’era in origine, e a me sta bene così.
Se qualcosa dovesse andare storto puoi sempre resettare la timeline cliccando su Reset timeline to default. In tal modo ripartirai da zero e perderai le istanze create fino a quel momento.
Per il resto puoi anche resettare le singole istanze, copiarle e cancellarle. Basta cliccarci sopra e visualizzare le opzioni in alto a sinistra della timeline.
Finita l’animazione avrai due possibilità: salvare il progetto (Save) oppure salvarlo e in più effettuare il rendering per il download (Render & Save).
La prima opzione è utile nel caso in cui il lavoro sia ancora work in progress, in modo da tornare a lavorarci sopra quando vuoi. Cliccando su Save & Render invece verrà avviato il rendering dell’animazione, al termine del quale sarai libero di scaricarla.
Tieni a mente che il tempo di elaborazione dipende da molteplici fattori, come la complessità dell’animazione, la sua lunghezza e la tua connessione internet.
Clicca qui per vedere il mio risultato.
Crea gratis le tue grafiche animate!
Gestione dei progetti su PixTeller
Che si tratti di un’immagine statica o di un’animazione, i progetti salvati verranno conservati nel tuo account e potrai accedervi dalla sezione My Designs.
Da qui potrai svolgere ogni sorta di attività. Ti basta selezionare il file desiderato e controllare le opzioni in alto.
Comoda la possibilità di filtrare la visualizzazione dei progetti in base al tipo.
Inoltre voglio ricordarti l’utilità del tasto Use. Dopo aver salvato un’immagine potrai infatti scaricarla (Download), modificarla (Edit), ma anche utilizzarla (Use) per generare una copia del design e creare grafiche online a partire da quest’ultima, siano esse immagini o animazioni.
Ad esempio, una volta creato un banner statico potrei usufruire della funzione Use per generarne una copia e realizzarne una versione animata. In tal modo avrei sempre a disposizione sia il download dell’immagine che dell’animazione.
Le immagini possono essere esportate in quattro formati: PNG, JPG, WEBP e PDF.
Le animazioni invece verranno scaricate in MP4, GIF o WEBP.
Molto utile il fatto di poter modificare le dimensioni del file appena prima il download, ma soprattutto cambiare lunghezza e velocità nel caso di una grafica animata.
Come in ogni buon editor che si rispetti, non mancano l’organizzazione dei contenuti tramite cartelle e la possibilità di condividere i progetti con i nostri collaboratori.
Piani di PixTeller messi a confronto
Prima di tirare le somme, diamo un’occhiata ai piani di PixTeller mettendoli a paragone.
| Caratteristiche del piano | Free | Pro | Diamond |
|---|---|---|---|
| Caratteristiche del pianoCosto | Free– | Pro9$ (mensile) o 84$ (annuale) | Diamond19$ (mensile) o 144$ (annuale) |
| Caratteristiche del pianoPhoto editor | FreeSì | ProSì | DiamondSì |
| Caratteristiche del pianoAnimation maker | FreeSì | ProSì | DiamondSì |
| Caratteristiche del pianoFoto, forme e icone | FreeSì (limitate) | Pro1.500.000 foto + 100.000 forme e icone | Diamond1.500.000 foto + 100.000 forme e icone |
| Caratteristiche del pianoSalvataggi privati | FreeNo | ProSì | DiamondSì |
| Caratteristiche del pianoCartelle | Free3 | ProIllimitate | DiamondIllimitate |
| Caratteristiche del pianoPNG trasparenti | FreeNo | ProSì | DiamondSì |
| Caratteristiche del pianoFont personali | FreeNo | ProSì | DiamondSì |
| Caratteristiche del pianoFunzione team | FreeSì | ProSì | DiamondSì |
| Caratteristiche del pianoProgetti | Free5 al mese | ProIllimitati (3 animati al mese) | DiamondIllimitati |
| Caratteristiche del pianoDownload | FreePNG, MP4 | ProPNG, JPG, PDF, MP4 | DiamondPNG, JPG, PDF, MP4, GIF |
Conclusioni
PixTeller è davvero uno strumento di design unico nel suo genere, e scrivere questa panoramica è stato un vero piacere.
Per quello che offre, penso che chiunque abbia a che fare quotidianamente con la grafica debba regalargli una chance.
Le sue caratteristiche lo rendono un editor di spicco in un mercato ormai sempre più saturo, e le animazioni rappresentano la ciliegina sulla torta.
Quella che hai visto nell’articolo è soltanto un piccolo esempio che quasi non rende giustizia alle enormi potenzialità dell’animation maker. Del resto non ho quasi mai a che fare con lavori di questo tipo, e di conseguenza non è facile per me realizzare animazioni complesse.
Ecco perché esistono i templates! PixTeller è pieno di splendidi modelli da personalizzare in totale libertà, rendendo il lavoro decisamente più facile e veloce. Io ho voluto complicarmi la vita partendo da zero, ma questa è una mia caratteristica innata… divertente vero?
Sciocchezze a parte, la possibilità di animare le grafiche non è solo un immenso divertimento, ma anche e soprattutto una miniera d’oro per attirare maggiormente l’attenzione ed aumentare le entrate della tua attività. Immagino che gli online marketers non possano che innamorarsi perdutamente di questa funzione.
Ti ricordo che sei libero di registrarti gratuitamente ed esplorare e testare questa meraviglia, per poi effettuare, se e quando lo vorrai, l’upgrade ad un piano premium.
Prima di concludere, passiamo in rassegna i pro e i contro di questo interessantissimo design tool.
Pro
- Interfaccia rilassante e super intuitiva
- Sfumature di colore
- Effetti unici sia per i testi che per le immagini
- Grafiche animate sorprendenti
Contro
- Smart resize da migliorare
- Animation maker non sempre fluidissimo in fase di progettazione
Con questo è tutto. Spero di averti fatto scoprire uno strumento di design che possa interessarti e stimolarti a creare grafiche online.
E tu? Che ne pensi di PixTeller? Conosci altri editors in grado di tenergli testa? Lasciami un commento! Ciao e alla prossima!
Credits
Un ringraziamento speciale ad Alex per avermi dato la fantastica opportunità di testare l’account Diamond.
