Non riuscite a trasformare i vostri bellissimi progetti Figma in un sito web WordPress in corso di elaborazione?
Lo capiamo: dare vita ai vostri progetti Figma può essere un vero grattacapo. Infatti, i nostri lettori ci chiedono spesso consigli su come superare questo ostacolo (al punto che di recente abbiamo lanciato i nostri servizi di progettazione WordPress).
Ecco perché siamo entusiasti di dare un’occhiata a UiChemy. Questo plugin promette di convertire i vostri progetti Figma in layout di WordPress. È quindi possibile modificare questi layout e pubblicarli, proprio come normali pagine create nell’editor a blocchi di WordPress.
Preferite invece utilizzare un builder di pagine? UiChemy può anche convertire i vostri progetti Figma in template Elementor o Bricks Builder, facendo solo qualche clic.
UiChemy potrebbe essere lo strumento salva-tempo che stavate cercando? Scopriamolo in questa dettagliata recensione di UiChemy.
Recensione di UiChemy: Perché usarlo in WordPress?
UiChemy promette di farvi risparmiare tempo e di snellire il processo di progettazione web, convertendo i vostri progetti Figma in siti web WordPress.
A differenza di altri plugin per Figma, questo non è un convertitore di codice da Figma a HTML, quindi non aggiunge codice HTML ai vostri progetti.
Invece, si integra direttamente con Figma, con l’editor a blocchi o con il vostro builder di pagine preferito. A questo punto, è possibile inviare il file Figma direttamente al sito web di WordPress. Infine, è possibile perfezionare il design utilizzando Elementor, Bricks Builder o l’editor a blocchi integrato di WordPress.
Come si può vedere, UiChemy funziona perfettamente con tutte queste piattaforme, quindi non è necessario scrivere alcun codice o assumere uno sviluppatore WordPress per convertire i vostri progetti.
Se siete agli inizi o avete un budget limitato, potete esportare fino a 10 progetti Figma al mese utilizzando il plugin gratuito UiChemy.
Questo plugin viene fornito con 10 template di partenza Figma, progettati per funzionare perfettamente con WordPress. Inoltre, è dotato di alcuni strumenti essenziali per aiutarvi a creare siti web “mobile friendly”, tra cui una versione lite del Responsive Manager di UiChemy.
Se si desidera esportare più di 10 progetti al mese, è necessario effettuare un upgrade. I piani premium di UiChemy includono anche template aggiuntivi, tag avanzati e una versione più avanzata del Responsive Manager.
Recensione di UiChemy: Il convertitore da Figma a WordPress giusto per voi?
Immaginate di aver trascorso innumerevoli ore a creare un design straordinario in Figma. Siete soddisfatti di ogni dettaglio, ma ora è il momento di tradurre questa visione in un blog WordPress funzionante.
UiChemy si propone di colmare questo divario tra progettazione e sviluppo. Promette di farvi risparmiare tempo, assicurandovi che il sito web finito rifletta perfettamente il vostro progetto originale.
UiChemy mantiene queste affermazioni? Scopriamolo.
1. Facile da usare
UiChemy è stato progettato all’insegna della semplicità d’uso. Per iniziare, è possibile installarlo e attivarlo come qualsiasi altro plugin per WordPress, quindi seguire le istruzioni a video per collegare WordPress al proprio account Figma.
Fatto questo, UiChemy agisce come un connettore che recupera i progetti da Figma. In effetti, è possibile inserire i progetti Figma direttamente in WordPress utilizzando il plugin UiChemy.
In alternativa, UiChemy può esportare manualmente i template in un file JSON, pronto per essere importato in WordPress in un secondo momento. Se avete creato più layout, UiChemy può anche scaricarli tutti-in-uno in un file ZIP per una facile organizzazione.
2. Convertire i progetti con un’accuratezza del 95%.
Ricreare manualmente i progetti in WordPress può essere una sfida. Troppo spesso ci sono differenze tra il progetto originale e il prodotto finito.
UiChemy, invece, promette di convertire i vostri progetti con una precisione del 90%-95%. Per ottenere i migliori risultati, è necessario seguire alcune best practice di progettazione, come la creazione di un design flessibile e mobile-friendly.
3. Impostazioni flessibili di importazione e visualizzazione
Potete controllare esattamente il modo in cui UiChemy importa i progetti nel vostro sito web.
A seconda dei plugin e delle estensioni di WordPress installati, è possibile importare il progetto come una nuova pagina di WordPress, un nuovo template di Elementor o un nuovo template di NexterWP.
In alternativa, è possibile sostituire o aggiornare un template o una pagina esistente con il design importato. Infine, è possibile aggiungere il design Figma a qualsiasi pagina o template esistente.
In questo modo, potete controllare esattamente come il design viene utilizzato sul vostro sito web, blog o negozio online.
4. Si integra con Elementor
UiChemy si integra sia con la versione gratuita che con quella pro di Elementor. Tuttavia, se il vostro progetto utilizza widget di Elementor, come il modulo di contatto, dovrete acquistare un piano UiChemy premium.
Come già detto, UiChemy non è un convertitore di codice da Figma a HTML. Invece di aggiungere codice HTML, converte i vostri progetti Figma utilizzando il set di widget di Elementor.
UiChemy supporta oltre 30 widget di Elementor, più 30 widget forniti da Plus Add-on per Elementor. Con queste premesse, non dovreste avere problemi a convertire il vostro progetto Figma in un template compatibile con Elementor.
5. Tag dei widget di Elementor
Quando si esporta un progetto in Elementor, UiChemy converte gli elementi del progetto in widget comuni come head, immagini e icone.
Tuttavia, UiChemy supporta una gamma più ampia di widget di Elementor che si possono utilizzare al loro posto. Per questo motivo, è possibile assegnare manualmente uno specifico elemento di design Figma a uno specifico widget Elementor. Questo processo è noto come tag manuale.
In questo modo, è possibile controllare esattamente il modo in cui UiChemy converte i progetti in widget e layout di Elementor.
6. Design compatibile con i dispositivi mobili
Quando si tratta di creare un sito web responsive in Figma, importa usare il layout automatico piuttosto che la posizione assoluta.
Per aiutarvi, UiChemy dispone di uno strumento di ottimizzazione dei frame che rileva tutti i frame che non utilizzano il layout automatico. È quindi possibile applicare il layout automatico facendo pochi clic.
7. Manager e calcolatrice responsive
Quando si esportano i progetti, il Responsive Manager di UiChemy può ottimizzare il layout per i dispositivi mobili. Qui è possibile digitare i valori che si desidera utilizzare su tablet e smartphone.
Per ottenere risultati ottimali è necessario fornire ogni valore mobile come percentuale del valore totale desktop. Questo può creare confusione, quindi sarete felici di sapere che UiChemy fornisce anche un calcolatore responsive.
È sufficiente digitare il valore che si desidera utilizzare sui dispositivi mobili, ad esempio 10 sgranature. UiChemy lo calcolerà in percentuale.
A questo punto, è sufficiente aggiungere la percentuale nel Responsive Manager. In questo modo, potrete essere sicuri che il vostro layout si visualizzerà correttamente su smartphone e tablet, senza dover fare i calcoli da soli.
8. Supporta il layout assoluto
Sebbene UiChemy raccomandi l’uso del layout automatico, supporta anche il layout assoluto.
Quando si esporta un layout contenente oggetti assoluti, UiChemy utilizza la posizione assoluta CSS per garantire che tali oggetti rimangano esattamente nella stessa posizione all’interno del layout importato.
9. Importazione dal vivo
È possibile esportare i propri progetti Figma come vedi l’anteprima dal vivo. In questo modo si salva un sacco di tempo e fatica rispetto al download e all’uploader manuale dei file dei progetti. Questo è particolarmente vero se volete provare molti progetti diversi.
È anche possibile add-on più layout nello stesso file, ad esempio per diverse pagine del sito web WordPress. A questo punto, UiChemy può creare un’unica anteprima che vede tutti-in-uno di questi layout e si può passare da uno all’altro con un solo clic.
10. Compagno di ottimizzazione
UiChemy è dotato di un Compagno di ottimizzazione integrato che può aiutare a migliorare l’accuratezza e la qualità dei progetti importati.
Questo strumento rileva automaticamente eventuali problemi del progetto.
I problemi vengono quindi raggruppati in 4 schede: Ottimizzazione dei media, Fase di ottimizzazione del frame, Ottimizzazione del testo e Ottimizzazione del frame principale. Ad esempio, se si è creata un’immagine vettoriale utilizzando più elementi, UiChemy segnala questo come un potenziale problema e suggerisce di bloccare il gruppo in modo che venga esportato come immagine singola.
Spesso è possibile indirizzare questi problemi semplicemente facendo clic sui pulsanti “Correggi” o “Correggi tutto” di UiChemy. UiChemy risolverà il problema.
11. Ottimizzazione del telaio principale
UiChemy è in grado di analizzare il frame principale del progetto per individuare le proprietà che di solito vengono ignorate nel template esportato. Tra queste, gap, spaziatura orizzontale, spaziatura interna e allineamento.
Sebbene queste proprietà vengano solitamente ignorate, la loro inclusione nel file esportato può talvolta dare risultati imprevedibili. Per questo motivo, lo strumento di ottimizzazione del frame principale di UiChemy può identificare e rimuovere queste proprietà facendo solo pochi clic.
12. Rilevare e combinare automaticamente gli SVG
Di default, Figma divide le immagini e le icone SVG in sezioni separate. Tuttavia, questo può causare problemi quando è il momento di importare il progetto in WordPress.
Per risolvere questo problema, UiChemy è in grado di rilevare automaticamente gli SVG e i loro elementi, per poi esportarli come un singolo file SVG.
In alternativa, è possibile taggare l’elemento a un widget o utilizzare la caratteristica di blocca di UiChemy per combinare più elementi in un’unica immagine. In questo modo si ha un maggiore controllo sul modo in cui UiChemy gestisce i file SVG del progetto.
13. Bloccaggio degli oggetti
Per default, UiChemy esporta ogni elemento del progetto come elemento singolo. Tuttavia, a volte è possibile creare un singolo oggetto utilizzando più elementi. Ad esempio, si può creare un header utilizzando l’immagine del banner, il pulsante di invito all’azione e il testo.
In questo caso, UiChemy può bloccare questi elementi insieme ed esportarli come un’unica immagine. Spesso questo riduce le dimensioni del file esportato, poiché si esportano meno elementi singoli. Di conseguenza, il sito web, il blog o il mercato online dovrebbero essere più facili da gestire.
14. Velocizzare le importazioni
Per default, UiChemy importa le immagini direttamente dal progetto Figma. Questo può rallentare l’importazione se il progetto ha molte immagini o se non è stata ottimizzata la grafica. È quindi importante ottimizzare le immagini prima di importarle in Figma.
In caso contrario, UiChemy può importare il layout di Figma senza immagini. Questa può essere un’opzione valida se il progettista originale non ha seguito le migliori pratiche. È anche una buona opzione se il progetto Figma è caratterizzato da immagini in evidenza che si intende comunque sostituire.
Un’altra opzione è l’esportazione del progetto con immagini in scala. È sufficiente digitare il valore di scala che si desidera utilizzare e UiChemy esporterà il layout con una grafica ridimensionata.
15. Libreria di template incorporata
Per aiutarvi a creare layout belli e veloci, UiChemcy è dotato di una collezione di template Figma pre-progettati.
Questi template sono tutti ottimizzati per WordPress, in modo da poter importare facilmente il design finito nell’editor a blocchi, in Elementor o in Bricks Builder. Ad esempio, tutti i componenti all’interno dei template di UiChemy sono pre-taggati ai relativi widget, quindi non è necessario taggarli manualmente.
UiChemy dispone di 3 template: Pagina, Sezione e Componente. I template di pagina creano una nuova pagina in alto che segue le linee guida di UiChemy.
Esistono anche template di sezione, che possono essere utilizzati all’interno di qualsiasi template di pagina. Infine, i template Component di UiChemy forniscono elementi individuali, quindi sono perfetti per essere aggiunti al livello di modifica corrente.
16. Sostegno comunitario e professionale
UiChemy promette di farvi risparmiare una tonnellata di tempo e fatica, convertendo automaticamente i vostri progetti Figma in vedi l’anteprima di WordPress, pagine e siti web. Tuttavia, lungo il percorso potreste aver bisogno di ulteriore aiuto per creare pagine ad alta conversione e siti web sorprendenti.
Per iniziare, UiChemy dispone di una documentazione online a cui si può accedere 24 ore su 24, 7 giorni su 7. Qui troverete guide passo-passo su come impostare e utilizzare il plugin, oltre a un’utile guida alla risoluzione dei problemi.
Inoltre, il team di UiChemy ha creato video tutorial, webinar e un Educational Community File che si può importare nel proprio account Figma. Questo file contiene linee guida, template ed esempi di utilizzo dei tag manuali nei progetti Figma.
Preferite un’assistenza individuale? Allora potete passare al piano premium e ricevere assistenza tramite live chat o help desk. Secondo il sito web di UiChemy, è possibile ricevere una risposta entro 24 ore, esclusi i fine settimana.
Se si utilizza il plugin gratuito, è possibile pubblicare il forum di UiChemy su WordPress.org e ottenere risposte alle domande di base.
Quando si scrive nei forum di supporto pubblici, è sempre una buona idea includere il maggior numero di informazioni possibili, in modo che gli esperti possano comprendere appieno il problema e pubblicare una risposta utile. Per saperne di più su questo argomento, consultate la nostra guida su come richiedere correttamente il supporto di WordPress.
Recensione di UiChemy: Prezzi e piani
Se siete agli inizi o avete un budget limitato, potete scaricare la versione lite di UiChemy da WordPress.org.
Con questo plugin gratuito, è possibile esportare 10 progetti Figma al mese. Si tenga presente che ogni pagina conta ai fini della quota. Il piano gratuito comprende anche 10 template di partenza e l’assistenza di base.
Per esportare più di 10 pagine al mese o per utilizzare caratteristiche avanzate, è necessario effettuare un aggiornamento.
È possibile scegliere tra 2 piani:
- Pro. Per 19 dollari al mese, potrete esportare fino a 100 progetti. Avrete anche 50+ template professionali da utilizzare nei vostri progetti.
- Tutto-in-uno. Dopo aver investito nel piano All Access (al prezzo di 49 dollari), è possibile esportare fino a 500 progetti al mese. È inoltre possibile condividere UiChemy con un massimo di altri 5 utenti Figma. Questo piano è perfetto per team o agenzie di sviluppo WordPress che hanno bisogno di creare molti progetti e di accedere a caratteristiche più avanzate.
Indipendentemente dal piano acquistato, i progetti esportati rimarranno intatti anche se la licenza UiChemy scade.
Recensione di UiChemy: Il convertitore da Figma a WordPress giusto per voi?
Per riassumere questa recensione di UiChemy, siamo sicuri che si tratta di un ottimo plugin per ottimizzare il flusso di lavoro da Figma a WordPress.
UiChemy è una soluzione facile per i designer o i proprietari di siti web che vogliono tradurre i loro progetti in layout WordPress funzionanti. È compatibile con l’editor a blocchi, ma si integra perfettamente anche con Elementor e Bricks Builder. Ciò significa che è possibile modificare e gestire i progetti importati utilizzando il builder di pagine WordPress preferito.
Se si desidera esportare solo un piccolo numero di progetti Figma, il piano gratuito è un buon punto di partenza. Tuttavia, se si vuole progettare un intero sito web o gestire più siti diversi, è necessario il piano premium.
Speriamo che questa recensione di UiChemy vi abbia aiutato a decidere se è il convertitore Figma-to-WordPress giusto per voi. A seguire, potete consultare la nostra guida su come aumentare la velocità e le prestazioni di WordPress, oppure dare un’occhiata alla nostra selezione dei migliori moduli di contatto.
Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.
Syed Balkhi
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!