Tutorial Spicynodes

http://www.spicynodes.org

Spicynodes un servizio del web 2.0 per creare mappe mentali interattive e dotate di effetti grafici accattivanti. E possibile provare subito lapplicazione scegliendo Try it! dal menu. Tuttavia, se si desidera salvare le proprie mappe, occorre registrarsi cliccando sul pulsante Sign up. Dopo la registrazione sar possibile accedere al servizio premendo il pulsante Login.

Figura 1 - Home Page

Dopo il login si accede alla propria pagina personale ( Home), dove sono riportate le informazioni sul traffico (numero di visite da parte di altri utenti) e le mappe gi realizzate.

1
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Figura 2 - Home Page personale

Cliccando sulla freccia che compare vicino al nome di una mappa vengono visualizzate o nascoste alcune informazioni di dettaglio. Per ogni mappa sono disponibili quattro pulsanti che permettono, rispettivamente, di vedere unanteprima della mappa ( View), modificare la mappa (Edit), duplicare la mappa (Clone), eliminare la mappa (Remove).

2
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Creare una nuova mappa

Nella propria home page personale, fare clic sul link Create new nodemap (vedere figura 2).

Figura 3 - Creare una nuova mappa

Inserire il titolo della mappa e una eventuale descrizione come indicato in figura 3. Premere, successivamente, il pulsante Make new nodemap. Nella finestra che appare immediatamente dopo, fare clic sul pulsante Continue.

Impostare lo stile

Il passaggio successivo consiste nella scelta dello stile. Nel box Choose a style sono disponibili alcuni stili che, se scelti, vengono immediatamente applicati alla mappa e resi visibili nel riquadro anteprima (Preview). Una volta scelto lo stile occorre salvare le impostazioni (vedere figura 5) facendo clic sul pulsante Save. Si suggerisce di salvare dopo ogni modifica, sia dello stile che del contenuto.

3
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Figura 4 - Decidere lo stile della mappa

Figura 5 - Salvare lo stile scelto

4
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Inserire il contenuto

La figura 6 mostra unanteprima della mappa creata. Per impostazione predefinita sono presenti 4 nodi: il nodo home di primo livello, gli altri tre nodi sono di secondo livello, cio sono figli del nodo home. Vedremo che possibile inserire altri nodi di secondo livello e creare nodi di livello 3, 4 e cos via.

Figura 6 - Anteprima della mappa priva di contenuto specifico

Osserviamo il modo in cui sono visualizzati i nodi nella pagina di modifica del contenuto.

Figura 7 - Struttura della mappa e livello dei nodi

5
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Per modificare il testo contenuto in un nodo basta fare clic su di esso.

Figura 8 - Modifica del contenuto del nodo

Come si pu osservare, il testo predefinito del nodo selezionato diventa di colore verde. A questo punto possibile sostituirlo con altro testo digitandolo direttamente nella casella e premendo il pulsante Done per confermare la modifica. Il pulsante Edit details, posto vicino a Done, permette di aggiungere una descrizione, unimmagine o un video di YouTube.

Figura 9 - Inserimento di una risorsa multimediale

6
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Le immagini possono essere caricate dal proprio computer ( Upload) o reperite dalla rete fornendo lURL1 (Copy from URL e Use URL)i. Per quanto riguarda i video di Youtube sufficiente fornire lURL alla risorsa ii. Per esempio, se si copia unimmagine da URL occorre inserire lURL nella casella apposita e premere il pulsante Get file. Se limmagine, invece, viene caricata dal proprio computer, al posto del pulsante Get file sar visualizzato il pulsante Browse, per ricercare limmagine sul disco. In ogni caso, dopo la selezione dellimmagine, appariranno altre opzioni, come si pu vedere in figura 10.

Figura 10 - Ulteriori opzioni per le immagini

Dopo aver effettuato le modifiche occorre confermarle premendo il pulsante Done. Per ciascun nodo sono disponibili ulteriori opzioni selezionando More options.

Figura 11 - Ulteriori opzioni per i nodi

In particolare possibile applicare colori personalizzati al testo e ai nodi, aggiungere etichette sui connettori, inserire link interni (a nodi della mappa) o esterni (a pagine web o ad altre mappe).
1

URL (Uniform Resource Locator) una sequenza di caratteri che identifica univocamente una risorsa in Internet.

7
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Aggiungere nodi

Per aggiungere un nodo sufficiente selezionare il nodo di livello immediatamente superiore e fare clic sul pulsante +, come mostrato in figura 12.

Figura 12 - Aggiunta di nodi e menu opzioni

Il menu opzioni consente di copiare un nodo ( Copy), tagliarlo (Cut), incollarlo sotto (Paste Below), collegarlo con quello sopra/sotto (Merge Up/ Merge Down). Inoltre, i nodi di livello sottostante al primo, presentano anche un pulsante x che consente di eliminare il nodo. I nodi possono essere spostati nella struttura mediante selezione e trascinamento (drag and drop) oppure utilizzando le apposite frecce, come si pu vedere nella figura seguente.

Figura 13 - Spostamento di nodi

8
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Condividere la mappa

Premendo il pulsante Go to Preview o scegliendo Preview nodes si pu vedere unanteprima della mappa realizzata.

Figura 13 - Anteprima della mappa

Il pulsante See it live permette di visualizzare la mappa cos come la vedranno gli altri utenti. Il pulsante Get URL consente di copiare lURL della mappa negli appunti. I pulsanti GetHTML e Get oEmbed forniscono il codice per incorporare la mappa in una pagina web. Al fondo della pagina di anteprima e nella versione live sono disponibili i pulsanti social, cio quei pulsanti che permettono di condividere la mappa sui principali social network e blog.

Considerazioni conclusive

Spicynodes non permette di allegare ai nodi dei documenti di testo. Il problema pu essere risolto, per esempio, trasformando il documento di testo in una immagine. Esistono svariate applicazioni del web 2.0 che forniscono tale servizio, ma mi limiter a segnalarne una: Zamzar (http://www.zamzar.com/). Nel caso, altamente probabile, che le immagini superino le dimensioni in byte consentite per lupload da Spicynodes, possibile pubblicarle su un sito di condivisione di immagini come Flickr (http://www.flickr.com/) e ottenerne, in seguito, lURL.
9
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Se si desidera vedere la mappa di esempio occorre andare http://www.spicynodes.org/a/af183749f02031ad8aa18e636d22bef8.

alla

pagina

10
Bocchi Cinzia Ultimo aggiornamento: 29/04/2013

Per salvare unimmagine sul proprio computer basta fare clic con il tasto destro del mouse su di essa e scegliere dal menu che appare la voce Salva immagine con nome. Utilizzando lo stesso menu anche possibile copiare limmagine o copiare il suo URL.
i

Per ottenere lURL di un video di YouTube si pu copiare lindirizzo che compare nella casella degli indirizzi del browser quando si visualizza il video. In alternativa si pu scegliere lopzione condividi nel menu che appare sotto al video e copiare lURL.
ii

Quest'opera stata rilasciata con licenza Creative Commons Attribution-ShareAlike 3.0 Unported. Per leggere una copia della licenza visita il sito web http://creativecommons.org/licenses/by-sa/3.0/ o spedisci una lettera a Creative Commons, 171 Second Street, Suite 300, San Francisco, California, 94105, USA.