Oggi ti voglio parlare di alcuni strumenti per Web Designer. Sono strumenti che possono essere utili per chiunque crea siti web, web app e app per smartphone.
Sin da subito ti voglio però mettere in guardia sul fatto che non sono un sostenitore dell’utilizzo di questi strumenti per quanto riguarda la creazione di siti web e che questi strumenti non rimpiazzeranno mai (e sicuramente non lo fanno ancora) la mano di un programmatore.
Vediamo allora quali sono questi strumenti per web designer.
Gli Strumenti per Web Designer
Gli strumenti per web designer di cui ti voglio parlare servono per:
- Creare interfacce web di buon gusto
- Esportare HTML, CSS ed a volte pure codice JavaScript
Normalmente funzionano tutti tramite Drag & Drop e poi ti permettono di esportare il mockup, mandare un link al cliente o esportare direttamente il codice.
Prima però voglio illustrarti pro e contro dell’utilizzo di questi strumenti.
Pro e Contro
Analizziamo i pro e contro dell’utilizzo di strumenti di questo tipo.
I pro sono i seguenti:
- Possibilità di avere un mockup da mostrare al cliente
- Creazione rapida di componenti banali con feedback visuale rapido
- Studio del codice creato dallo strumento
I contro sono i seguenti:
- Creazione di un sito web senza saperci mettere le mani
- Impossibile assecondare tutte le possibili richieste del cliente poiché nessuno strumento ti dà il 100% delle possibilità
- Se lo strumento cessa di esistere (cose che accadono!) rimani a piedi
- Non diventi appetibile per aziende e compagnie quindi al massimo contatti clienti online che non sanno nulla del tuo lavoro
Sono certo che potrei andare avanti con i contro e so anche per certo che il primo contro per chi non sa scrivere HTML e CSS può trasformarsi facilmente in un pro.
Vediamo comunque quali sono gli strumenti per web designer e cerchiamo di capire principalmente quanto possono essere interessanti per dei mockup.
Strumenti
Alcuni degli strumenti che vedremo sono a pagamento, ma offrono tutti un periodo di prova gratuito.
Al momento in cui stai leggendo l’articolo potrebbero essere cambiate alcune cose.
Iniziamo a vedere gli strumenti per web designer che ho provato e di cui ti voglio parlare.
Bootstrap Studio
Questo strumento è molto interessante. Ti permette di fare una prova online andando a questo indirizzo ed allo stesso tempo è disponibile l’acquisto (varia dai 25$ ai 50$ a seconda del periodo).
Una volta acquistato non dovrai pagare più nulla e avrai lo strumento installato sul tuo computer.
Ti dà la possibilità di:
- Spostare tutti gli elementi Bootstrap che già dovresti conoscere
- Modificare il CSS e l’HTML direttamente
- Esportare HTML e CSS
Può essere molto utile per qualche mockup, ma posso confermare che conoscendo Bootstrap sono più veloce a crearmi un sito web da solo che utilizzando questo strumento.
Inoltre alcuni degli elementi che vai a posizionare hanno delle classi prestabilite e bloccate da un lucchetto. In questo caso è necessario effettuare alcune modifiche che si potrebbe risparmiare chiunque sa mettere mano direttamente al codice.
In ogni caso il prezzo non è alto ed è probabilmente uno dei migliori strumenti che esista in circolazione.
Google Web Designer
Tra gli strumenti per web designer non poteva mancare uno strumento di casa Google.
E’ ancora in versione Beta e serve principalmente per creare banner pubblicitari. Con un po’ di fantasia ci si può creare una qualsiasi cosa che si trova all’interno di una pagina HTML.
Finito il lavoro puoi esportarlo senza problemi ed utilizzarlo nel tuo sito web.
JUSTINMIND
Forse il più rapido, offre sicuramente tante possibilità fino a farti creare un sito web con effetto parallax.
Si possono creare design puliti e puoi provarlo gratuitamente per 30 giorni.
La pecca è che utilizza classi CSS definite dal team di JustInMind, quindi ciò comporta che doverci mettere le mani non è una delle cose più rapide del mondo.
Direi che è ottimo per creare dei mockup.
UXPIN
Tra gli strumenti per web designer c’è anche UXPIN utilizzabile da browser, offre 7 giorni di prova gratuita e poi costerà circa 29$ al mese per ciascun utente.
Anche UXPIN mette a disposizione l’export in HTML così come la condivisione di un link privato per vedere il mockup.
E’ molto completo, contiene sia Bootstrap che Bootstrap-Material, così come tanto altro nei riguardi anche di Android, iOS, ecc.
Davvero utile per i mockup, qualcosa può essere riutilizzato e lo strumento è molto veloce, ma l’HTML generato comunque è un immenso macello.
Quindi se sai scrivere HTML e CSS da solo non lo utilizzare per costruire una pagina web, ma usalo solo per mockup rapidi.
Balsamiq
Balsamiq tra gli strumenti per web designer che vediamo è uno tra i più interessanti a mio parere.
E’ gratuito, ti permette di condividere i progetti con i colleghi ed inoltre ti permette di creare dei mockup in stile sketch.
E’ possibile integrare Bootstrap, ma sempre in stile sketch, e serve fondamentalmente per dare al cliente un’idea di come verrà strutturata una pagina senza stabilire sin da subito come sarà esattamente.
Ciò porta ad avere maggiore flessibilità sia per il web designer sia per il cliente ed allo stesso tempo ci si viene incontro nel capire le funzionalità che dovranno esserci nella pagina.
Moqups
Tra gli strumenti per web designer non può mancare Moqups che ci dà la possibilità di creare degli ottimi mockup proprio come Balsamiq. Lo stile però è più moderno ed è possibile anche definire degli schemi per studiare la user experience (ho già parlato della UX quì).
E’ gratuito, ma per sbloccare ad esempio i progetti illimitati bisogna pagare circa 13$ al mese.
Template Toaster
Questo strumento è davvero potente e ti permette di creare un template/tema con HTML5, WordPress, Joomla, PrestaShop, WooCommerce, VirtueMart, ecc. in maniera rapida.
Il costo varia dai 49$ ai 149$ e puoi usarlo quanto vuoi dal tuo computer.
Tra gli strumenti per web designer questo sicuramente può fare molto gola a chi non sa mettere bene le mani sul codice.
Onestamente avrei un po’ paura a promettere ad un cliente un progetto creandolo solo con questo strumento.
Probabilmente se lo vuoi usare ti conviene provarlo al 100% così da capire cosa puoi e non puoi promettere al cliente.
Artisteer
Artisteer è un altro strumento interessante e sembra essere ampiamente utilizzato dai web desginer specialmente in UK e USA.
Si possono creare ottimi template HTML e CSS ed esportare il codice.
Per quanto mi riguarda però è molto più utile dal punto di vista mockup sempre per il solito discorso.
Il prezzo varia dai 49$ ai 200$.
Adobe InDesign CC
I prodotti Adobe sono sempre molto potenti. Questo in particolare potrete anche provarlo gratuitamente.
Ma a mio parere è anche questo più portato per dei mockup, per le riviste, per dei PDF interattivi da mostrare anche online. Il codice HTML e CSS prodotto infatti non è così amichevole quando ci si vuole poi mettere le mani.
Potenza e grafica rimangono comunque ottime.
Conclusioni
In questo articolo ti ho mostrato un po’ di strumenti per web designer che possono essere molto utili.
Se sei interessato al mondo del Web Design dovresti studiarti HTML e CSS prima di tutto. Per farlo ti consiglio questo articolo in cui parlo di qualche libro interessante o anche:
- Web Design per Creativi, Grafici e Sviluppatori
- HTML & CSS Design and Build Websites
- Colori e Forme per il Web Design
- CSS: The Definitive Guide (O’Reilly)
- CSS: The Missing Manual
- The Principles of Beautiful Web Designs
Se vuoi iscriviti alla newsletter e non ti perderai i nuovi articoli. Mando da 1 a 4 mail al mese ricapitolando dove siamo arrivati con ogni guida. Con la newsletter hai anche accesso a libri ed ebook gratuiti, così come a coupon Udemy ? .
Per dubbi o domande scrivimi nei commenti ? .
Se ti è piaciuto l’articolo seguimi su Facebook e Twitter oppure rimani sempre aggiornato con la newsletter (da 1 a 4 mail al mese!).