CHI SIAMO | CONTATTACI | PUBBLICAZIONI
 
 
 
    stampasegnala a un amico
  STRUMENTI
    Vocabolario visuale
    Tool - Card sorting
    Tool - Diagrammi
  METODI



 

I SOFTWARE PER CREARE WIREFRAME

La necessità di creare dei prototipi o wireframe del sito da progettare, soprattutto per discuterne i dettagli funzionali o estetici con committenti che hanno poca dimestichezza con termini quali UI design, Architettura dell'informazione, Usabilità e Accessibilità, ci pone di fronte al non facile compito della selezione di un buon software per realizzare i nostri wireframe.

Agli inizi, infatti, il progettista di siti web utilizzava un blocco di carta ed una matita. Successivamente sono stati introdotti o utilizzati software per fare diagrammi, come Visio, Power Point, Illustrator, con il vantaggi di trasporre in digitale e rendere condivisibili i wireframe.  Si trattava in sostanza di realizzare dei prototipi visuali delle pagine del sito, in alcuni casi anche high fidelity.

Oggi emerge sempre più la necessità di realizzare dei prototipi interattivi che simulino l’effettiva interazione sul sito e permettano di testarne le funzionalità, a volte complesse, già nella fase di progettazione, il tutto senza dover scrivere una riga di codice.

Spesso la scelta dello strumento giusto non è così semplice ed immediata, questo in parte perché sul mercato si possono trovare molti strumenti open source e commerciali per la progettazione di prototipi funzionali sia semplici che complessi, e in parte dipende da vari fattori come la semplicità di utilizzo dello strumento, il numero di funzionalità utili messe a disposizione del progettista e il tipo di prototipo o wireframe che si intende realizzare.

Nei capitoli successivi cercheremo di analizzare alcuni tra i più quotati software presenti sul mercato. La maggior parte di questi funziona unicamente in ambiente Windows, quindi se volessimo progettare su piattaforma Mac o Linux dovremmo accontentarci di pochi software che offrono funzionalità più ridotte rispetto alla controparte Windows, anche se negli ultimi anni le cose stanno lentamente migliorando.

Come dicevamo, quindi, per scegliere il miglior strumento che si adatta ai nostri scopi è importante valutare alcuni aspetti quali:

- Il tipo di prototipo o wireframe che vogliamo realizzare
- La facilità di utilizzo del software
- Le funzionalità chiave per il nostro scopo
- La presenza o meno di librerie di oggetti in bundle con il software
- Costo del software

Una volta definiti gli aspetti più importanti che il nostro software deve avere, il passo successivo è quello di valutare mediante il periodo di prova alcuni o tutti i software disponibili sul mercato.
Se non si dispone di un ampio budget da destinare allo strumento per la progettazione, il metodo più semplice e anche il più conveniente per iniziare a sviluppare wireframe per il web è il classico foglio di carta e matita. Questa soluzione potrebbe essere un inizio per realizzare una prima bozza del sito che abbiamo in mente.
Esistono software decisamente più facili e potenti da utilizzare per la creazione dei nostri wireframe e prototipi, che in poco tempo ed in modo semplice aggiungono interattività al prototipo.


Strumenti Off-line vs On-line: Quale scegliere?

Come abbiamo visto, la scelta dello strumento giusto per la progettazione e creazione di wireframe, dipende da vari fattori. Tra questi, possiamo valutare se lavorare off-line o on-line: infatti da alcuni anni sono sempre più presenti sul mercato strumenti di progettazione e creazione di wireframe completamente on-line. Ma come funzionano?
Semplicemente, collegandosi al sito del produttore e previa registrazione, si accede ad uno spazio sul sito stesso dedicato alla progettazione di wireframe. L'utente noterà ben poche differenze rispetto agli strumenti off-line sia per l'aspetto funzionale (es. strumenti,opzioni etc), sia per la logica di progettazione del prototipo che tende a rispecchiare quella degli strumenti off-line.
Una volta creati wireframe relativi al proprio sito, questi vengono salvati in un repository disponibile sul sito del produttore. In questo modo è possibile lavorare ai propri progetti da qualsiasi computer (PC, Mac o Linux) dotato di un browser web e una connessione internet. Uno dei vantaggi principali di questo tipo di soluzione è proprio la portabilità e l'immediatezza di accesso allo strumento, oltre che alla possibilità di avere in un unico repository centralizzato per tutti i propri progetti.

Come per gli strumenti off-line, anche le soluzioni on-line non sempre sono free, ma spesso sono accessibili tramite pacchetti a seconda della dimensione del repository offerta.
In pratica anziché investire principalmente sul software da installare localmente sul proprio computer, si paga per la quantità di spazio necessaria al proprio progetto.
Nonostante gli strumenti on-line stiano crescendo sempre più in popolarità, molti designer preferiscono ancora affidarsi a soluzioni off-line sul proprio computer per avere uno strumento ottimizzato per la propria piattaforma (Windows o Mac) e di conseguenza più performante e rapido.



Non c'è dunque una soluzione definitiva per la progettazione di wireframes, ma diverse soluzioni a seconda delle necessità.

Nei capitoli successivi analizzeremo alcuni tra gli strumenti più blasonati e utilizzati per la progettazione di prototipi interattivi e wireframes, sia off-line che on-line.


Strumenti Off-line

La nostra analisi degli strumenti per la progettazione di tipo Off-line, disponibili per piattaforme Windows e Mac, vuole solo dare un'idea delle potenzialità dei vari strumenti presenti ad oggi sul mercato. Alcuni di essi sono tra i più utilizzati ed apprezzati da molti designer in tutto il mondo mentre altri, nonostante siano meno noti, hanno potenzialità interessanti da tenere in considerazione.

Axure
Software commerciale ($589 Licenza Singola) - Trial per 30 giorni
Axure RP Pro (al momento giunto alla versione 5.6) si è affermato negli ultimi anni come ottimo strumento per la progettazione di prototipi interattivi e wireframes. Una delle caratteristiche che ne fanno uno strumento largamente utilizzato da molti designers è la sua facilità ed immediatezza di utilizzo, che riprende la logica di Visio e dei più conosciuti strumenti di design (es. Illustrator e Fireworks).

iRise
Software commerciale ($6,995 Professional Edition) - Trial per 30 giorni
iRise si pone come una piattaforma Enterprise per la progettazione di wireframe e prototipi interattivi. Oltre alle funzionalità di base per la progettazione di wireframe, iRise offre nuovi strumenti integrati per la gestione degli scenari d'uso e per la gestione interna di dati (es. popolamento di una tabella) in modo rapido e semplice.

Balsamiq Mockups
Software commerciale ($79 Desktop version) - Trial Online
Balsamiq Mockups è uno strumento molto semplice per la creazione di mockups e wireframe non troppo complessi. Mantiene un aspetto pulito e lineare anche se sono assenti molte delle funzionalità di software più completi. E' comunque uno strumento che fa della rapidità e semplicità d'uso i suoi punti di forza.

Justinmind Prototyper
Software commerciale ($690 Single Edition) - Trial per 30 giorni
Justinmind Prototyper permette la creazione di wireframe e prototipi altamente interattivi. Come gli altri software visti in precedenza, offre una libreria di oggetti già pronti all'uso per la creazione di un wireframe completo, la gestione della documentazione funzionale e degli scenari d'uso. Una funzionalità sicuramente molto apprezzata è la simulazione in tempo reale del comportamento degli oggetti nella pagina senza dover generare il prototipo ogni volta.

Microsoft SketchFlow
Software commerciale ($599 Expression Studio 3) - Trial 60 giorni
L'estate scorsa anche Microsoft ha rilasciato uno strumento interessante per la progettazione e realizzazione di wireframe e prototipi interattivi. Il suo nome è SketchFlow ed è un plug-in integrato con il più noto Expression Blend 3. Le funzionalità offerte sono molte, e questo software rende soprattutto semplice la gestione delle animazioni tra gli oggetti nella pagina, oltre a mettere a disposizione uno strumento potente come il concetto di "stati".

Altri software Off-line



Strumenti On-line

In questa seconda parte analizzaremo gli strumenti online per la progettazione, disponibili per multipiattaforma. Questi strumenti si stanno sempre più diffondendo anche grazie alla loro flessibilità e alla possibilità di avere lo stesso strumento per la progettazione di wireframe su qualsiasi computer in qualsiasi luogo: basta possedere una connessione internet veloce e un comune browser web.
Questa analisi vuole solo dare un'idea delle potenzialità dei vari strumenti presenti ad oggi sul mercato. Alcuni di essi sono tra i più utilizzati ed apprezzati da molti designer in tutto il mondo, mentre altri nonostante siano meno noti hanno delle potenzialità interessanti da tenere in considerazione.

Protoshare
Software commerciale ($19 personal - $45 Advantage - $89 Team) - Trial per 30 giorni
Protoshare è forse uno degli strumenti per la progettazione di wireframe e prototipi on-line più apprezzati e utilizzati. Questo grazie alla sua interfaccia web che rende semplice ed immediata la creazione di wireframe proprio come se si utilizzasse un software di tipo client (off-line).

iPlotz
Software commerciale ($99 per Year - $75 Desktop version) - Trial 1 Project & max 5 wireframe
iPlotz è un altro ottimo strumento on-line per la progettazione di wireframe e prototipi interattivi. Infatti cerca di estendere il processo di wireframing con il processo di Project management. Infatti, dal momento in cui ogni progetto viene ospitato interamente online, l'applicazione offre la possibilità di condividerlo e lavorare con altri utenti allo stesso progetto.

Altri software online



Conclusioni

Come abbiamo visto, sul mercato sono presenti diverse soluzioni per la progettazione di wireframe e prototipi interattivi, e non c'è che l'imbarazzo della scelta. Sebbene la fase di progettazione e concept di un nuovo prodotto/servizio si possa tranquillamente fare anche mediante l'utilizzo di carta e penna o meglio ancora con diagrammi in Visio, Power Point, Illustrator, sempre di più si rende necessario creare dei wireframe interattivi che permettano, oltre che di gestire la navigazione tra le pagine, anche di simulare task e interazioni in modo da creare dei prototipi che riproducano quanto più fedelmente possibile l'esperienza dell'utente finale sul sito.

La scelta dello strumento più indicatosi dovrebbe basare su questi fattori:
- il proprio modo di lavorare
- l'attitudine alla collaborazione e gestione dei progetti
- il tempo di apprendimento a disposizione
- la facilità di utilizzo dello strumento
- il contesto d'uso all'interno dell'azienda

Vi sono poi molti altri fattori che possono influenzare la scelta di uno strumento in favore di un altro; ad ogni modo la differenza macroscopica tra le diverse soluzioni presentate in questo articolo è la tipologia di strumento, ossia:
- Strumenti off-line (Desktop)
- Strumenti on-line (web application)
- Strumenti Ibridi (sia Desktop che web based)

Il consiglio migliore è quello di provare alcuni delle diverse cat,egorie (desktop - web based) e valutare quale sia meglio per il proprio modo di lavorare, ai propri obiettivi e alle necessità del team di lavoro, o in base al tipo di progetti da realizzare (es. task oriented o content oriented).