Visualizza - FileMaker Community

Migliori metodologie operative
per progettare soluzioni
aziendali personalizzate per
iPad e iPhone
Una Guida operativa di FileMaker
Sommario
A chi può essere utile questa guida? ...................................................................................3
Cosa si imparerà ..................................................................................................................3
Passo 1 – Pianificare la soluzione ........................................................................................4
Schema decisionale per la soluzione .......................................................................5
Passo 2 – Progettare la soluzione ........................................................................................7
Passo 3 – Sviluppare la soluzione ........................................................................................8
Impostazione iniziale ..........................................................................................................10
Definire i bordi della soluzione FileMaker ..........................................................................12
Sagome della schermata ...................................................................................................12
Griglie 14
Righelli 14
Guide
............................................................................................................................14
Guide dinamiche ................................................................................................................15
Creare il formato ................................................................................................................15
1.
Aggiungere una barra degli strumenti in stile iOS ...........................................15
a.
Ridimensionare la sezione Intestazione ..........................................................16
b.
Aggiungere un titolo alla barra degli strumenti ...............................................16
c.
Aggiungere un pulsante alla barra degli strumenti ..........................................17
2.
Aggiungere un elenco degli articoli da riordinare o disponibili in magazzino .18
3.
Aggiungere i pulsanti per modificare gli articoli visualizzati nel portale ..........25
4.
Aggiungere un pulsante che consenta di accedere ai dettagli degli articoli ...26
5.
Aggiungere il valore totale dell’inventario .......................................................27
6.
Aggiungere un grafico che mostri la quantità di articoli per ogni categoria ...27
7. Aggiungere una mappa della posizione corrente dell’utente ........................................29
8. Il formato finale ..............................................................................................................31
9. Cosa fare con lo spazio che rimane? ............................................................................31
10.
Accesso automatico al nuovo formato ...........................................................32
Revisione finale della soluzione .........................................................................................32
Testare e distribuire la soluzione ........................................................................................32
APPENDICE – Acquisire familiarità con gli strumenti di progettazione di FileMaker .........33
Temi
............................................................................................................................33
Elaborazione del testo ........................................................................................................34
Riempimenti: sfondi con colore a tinta unita, gradienti e immagini ...................................34
Linee dei bordi e formattazione degli angoli ......................................................................36
Stati degli oggetti ...............................................................................................................38
Icone ed elementi grafici ....................................................................................................39
Accessibilità .......................................................................................................................40
Risorse
............................................................................................................................41
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
2
Guida operativa di FileMaker
Migliori metodologie operative per utilizzare la tecnologia iOS nello sviluppo di
soluzioni personalizzate con FileMaker Pro
Questa guida riporta le migliori metodologie operative per progettare soluzioni aziendali
personalizzate per iOS. Queste soluzioni sono create utilizzando la piattaforma FileMaker,
dove forma e funzionalità si uniscono per aiutare lo sviluppatore a creare soluzioni di grande
utilità, in grado di conquistare i futuri utenti. La piattaforma FileMaker è costituita da FileMaker
Pro per creare le soluzioni FileMaker, dal client gratuito FileMaker Go per eseguirle sui
dispositivi iOS e, infine, da FileMaker Server per distribuirle e condividere le informazioni con
molti utenti.
A chi può essere utile questa guida?
Questa guida è stata pensata per due tipi di creatori di soluzioni:
1. Coloro che non hanno esperienze precedenti con FileMaker che utilizzeranno
FileMaker Pro e FileMaker Go per la prima volta per creare soluzioni aziendali
personalizzate.
2. Utenti di FileMaker Pro esistenti che hanno già una versione desktop della
soluzione di database progettata e sono pronti a creare versioni eseguibili su iPad
e iPhone.
Cosa si imparerà
Si imparerà come pianificare, progettare e sviluppare soluzioni aziendali iOS personalizzate che
non solo aiutino gli utenti ad eseguire le proprie attività, ma siano anche piacevoli da utilizzare.
•
Passo 1 – Pianificare la soluzione – Capire chi sono gli utenti, quali attività devono
eseguire, dove e su quali dispositivi utilizzeranno la soluzione sono aspetti fondamentali
per poter fornire loro un prodotto dalle caratteristiche e dalle funzionalità di cui hanno
bisogno.
•
Passo 2 – Progettare la soluzione – Selezionare con cura gli elementi da visualizzare
sullo schermo più piccolo e presentarli in modo ottimale per sveltire il flusso di lavoro è il
passo successivo nella creazione di un'esperienza davvero gradevole per l'utente.
•
Passo 3 - Sviluppare la soluzione – In questa sezione vengono fornite istruzioni
dettagliate sullo sviluppo che spiegano come coniugare forma e funzionalità per far sì che
gli utenti continuino ad utilizzare la soluzione giorno dopo giorno.
Se questo ha suscitato il vostro interesse, allora incominciamo!
Risorse e aiuto
Questa guida è un punto di partenza per lo sviluppatore e/o il proprio team. Oltre a
questa guida, nell'ambito del programma FileMaker TechNet sono disponibili
numerosissime risorse, ulteriori metodologie operative, trucchi e accorgimenti e
tecniche. È possibile entrare in contatto con altre persone attraverso i forum degli
sviluppatori o vedere video per esplorare e scoprire ulteriori capacità avanzate della
piattaforma FileMaker. Inoltre, se non si ha ancora familiarità con gli strumenti e le
opzioni di progettazione di FileMaker, si può fare riferimento all'Appendice di questa
guida per esercitazioni di base sugli strumenti e sulle opzioni principali.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
3
Passo 1 – Pianificare la soluzione
Capire a quale pubblico è rivolta in modo da fornire le caratteristiche e le funzionalità
giuste
Dedicare il tempo necessario a capire con anticipo a quale pubblico sarà rivolta e le relative
esigenze è la prima cosa da fare per progettare una soluzione veramente utile e utilizzabile,
apprezzata dagli utenti.
Porre a se stessi e al proprio team le seguenti domande per pianificare le caratteristiche e le
funzionalità della soluzione:
•
CHI – Chi la utilizzerà?
o Identificare i gruppi, i team, le qualifiche e/o i nomi delle persone che utilizzeranno
la soluzione.
•
CHE COSA – Quali sono gli obiettivi principali?
o Quali sono le attività principali che la soluzione dovrebbe aiutare gli utenti ad
eseguire?
! All'interno della propria organizzazione i diversi team e gruppi possono
avere esigenze diverse per quanto riguarda la soluzione; è quindi bene
elencare le attività più importanti per ciascun gruppo.
o Quali attività gli utenti dovranno eseguire rapidamente?
o Vi sono attività che devono essere eseguite in un ordine specifico?
•
DOVE – Dove verrà utilizzata la soluzione?
o Sarà utilizzata, ad esempio, in ufficio, sul campo, in pieno giorno, di notte, in auto,
vicino all'acqua, ecc.?
o Quale posizione assumeranno gli utenti durante l'uso? Staranno in piedi o seduti?
Utilizzeranno una o due mani? In che misura gli utenti riusciranno ad essere precisi
durante l'uso?
Conoscere questi aspetti può essere utile a definire il contrasto, le zone da toccare e
molto altro.
•
QUALI – Quali dispositivi verranno utilizzati per quali attività?
o A quali attività deve essere assegnata una priorità per l'accesso dall'iPhone
piuttosto che dall'iPad?
o Quale orientamento verrà utilizzato di più? Orizzontale, verticale o entrambi?
o Quali gesti e quali funzioni di dettatura vocale e di acquisizione di immagini
verranno utilizzate sull'iPhone piuttosto che sull'iPad?
•
QUANDO – Quando deve essere distribuita la soluzione?
o Questo sarà un utile supporto per iniziare a creare una soluzione "dell'ordine di
qualche bite" da cui partire.
o Lo sviluppo della soluzione può essere un processo iterativo che consentirà di
distribuire agli utenti una nuova versione della soluzione mano a mano che verrà
migliorata e perfezionata. Se questo si addice al proprio progetto, stabilire come e
quando effettuare gli aggiornamenti con il minimo disturbo per gli utenti.
•
ALTRE APPLICAZIONI – Quali altre applicazioni complementari utilizzeranno o
amano utilizzare gli utenti?
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
4
o
o
Quali applicazioni verranno utilizzate oltre alla soluzione che si sta creando?
Quali applicazioni amano utilizzare i propri utenti?
Tutto questo sarà fonte di ulteriore ispirazione per creare applicazioni di cui gli utenti siano
entusiasti.
Schema decisionale per la soluzione
Dopo aver risposto alle domande di cui sopra, è possibile ricavare decisioni utili per definire la
propria soluzione. Inserendole in un semplice schema è possibile farsi un'idea d'insieme della
definizione e delle decisioni relative alla propria soluzione.
Di seguito si riporta l'esempio di una soluzione sullo stato dell'inventario destinata ai dirigenti:
Chi
Che cosa
Dove
Quali attività
sull'iPhone
Quali attività sull'iPad
Quando distribuirla
•
•
•
•
Info
Decisione
Alti dirigenti
Deve essere semplice
Numero di articoli
Articoli da riordinare
Valore dell'inventario
Unità disponibili
Aggiungere un formato
con informazioni
riassuntive
In ufficio
Utilizzare un trigger di
script
SuAperturaPrimaFinestra
per determinare il
sistema operativo e
andare al formato
appropriato quando un
utente apre il file
Tema tenue
Spostamenti da una
stanza all'altra
Breve panoramica
dello stato
dell'inventario
Mettere in evidenza le
informazioni più
importanti
Dashboard dei dati
principali con
possibilità di eseguire
un'analisi più
approfondita
10 giorni
Creare un formato
adatto all'iPad con
navigazione facile da
utilizzare
Ottimizzare le
funzionalità
Nello script di accesso
inserire istruzioni per
comunicare all'utente la
disponibilità di una
nuova versione
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
5
Altre applicazioni
utilizzate
Calendario
Mappe
Creare un'esperienza
utente simile, in modo
da non disorientare
l'utente nel passaggio da
un'applicazione all'altra
Seguire le convenzioni
iOS per assicurare
un'esperienza utente
coerente
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
6
Passo 2 – Progettare la soluzione
Consentire agli utenti di svolgere le proprie attività in modo piacevole
Progettare soluzioni mobili non significa solo creare una versione più piccola della versione
desktop corrispondente che si adatti all'iPhone o all'iPad. Le dimensioni dello schermo sono
importanti, ma sono gli elementi visualizzati su quel piccolo schermo e il modo in cui vengono
presentati a determinare il successo di una soluzione… o a far sì che venga scartata.
L'esperienza utente deve essere semplice su qualsiasi dispositivo. Di seguito alcune linee
guida da seguire quando si progetta una soluzione per iOS:
•
Creare formati per ciascun tipo di dispositivo – Creare formati distinti per ogni
dispositivo assicura che la propria soluzione sia ottimizzata per ciascuno di essi. Nella
maggior parte dei casi, non si dovrebbe utilizzare lo stesso formato per l'iPhone e
l'iPad, o per il desktop e l'iPad.
•
Uso principale – L'uso principale di ogni formato dovrebbe essere immediatamente
evidente per l'utente. Inserire un paio di attività veloci sul formato iniziale e assicurarsi
che le attività eseguite con frequenza siano immediatamente accessibili.
•
Semplicità – Piuttosto che creare un unico formato complesso, creare più formati
semplici e dall'aspetto pulito con una navigazione intuitiva e permettere agli utenti di
navigare secondo necessità.
•
Touch – I pulsanti devono essere grandi almeno 44 pt x 44 pt per poter essere toccati
facilmente con un dito.
•
Raggruppamento – Quando su un modulo vengono visualizzati dati raggruppati,
accertarsi di allineare i campi correlati e utilizzare un raggio di 10 pt per gli angoli dei
campi più esterni.
•
Ridurre al minimo la digitazione – Su un'interfaccia touch, la digitazione non è
sempre il metodo di immissione ottimale. Quando possibile, valutare alternative come i
valori dei campi a inserimento automatico, le liste valori, i selettori della data o
addirittura la funzione di dettatura anziché visualizzare la tastiera. Utilizzare valori dei
campi predefiniti intelligenti, le liste valori, i selettori della data e addirittura la funzione
di dettatura per sfruttare le capacità uniche dei dispositivi iOS.
•
Colore – L'interfaccia utente della soluzione non deve compromettere una chiara
visualizzazione dei dati. Scegliere un colore di base e un colore complementare e
partire da questa palette. Evitare di usare molti colori e riservare la scelta di tonalità
molto sature agli elementi che meritano più attenzione, come dati critici o errori. Un
buon modo per iniziare è partire da uno dei temi integrati in FileMaker, che utilizzano
palette di colori studiate per accordarsi bene tra loro.
•
Gradienti – I gradienti possono essere utilizzati per dare dimensione ai formati. I
gradienti sono ideali per dare risalto agli elementi interattivi di un formato, come le barre
degli strumenti o i pulsanti, o per creare un'atmosfera quando applicati allo sfondo
come gradiente radiale ampio. Evitare di utilizzare i gradienti su elementi meno
importanti o posti dietro ad altri elementi.
•
Più finestre – Evitare di aprire più finestre nella soluzione. Piuttosto, permettere
all'utente di accedere facilmente a un formato all'interno della stessa finestra per
portare a termine l'attività desiderata.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
7
Leggere le Human Interface Guidelines (Linee guida per interfacce umane) di
Apple
Le iOS Human Interface Guidelines (Linee guida per interfacce umane per iOS)
descrivono principi utili a progettare un'interfaccia utente e a garantire
un'esperienza utente eccezionali per la propria soluzione iOS. Vi si può trovare
ispirazione e aiuto per rendere la propria soluzione uno strumento potente e
attraente per gli utenti. Queste linee guida sono disponibili sul sito Apple (dove?).
Passo 3 – Sviluppare la soluzione
In questa sezione vengono fornite istruzioni dettagliate su come utilizzare FileMaker Pro per
sviluppare l'interfaccia utente di una soluzione FileMaker ben progettata. Si imparerà come
coniugare forma e funzionalità per far sì che gli utenti continuino ad utilizzare la soluzione
giorno dopo giorno.
L'obiettivo è creare un formato ottimizzato per iPad con un'interfaccia simile a un dashboard
(riportato nelle figure 1 e 2 con orientamento verticale ed orizzontale) che metta in evidenza le
informazioni riassuntive importanti, consentendo al contempo di visualizzare più informazioni
con facilità.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
8
Figura 1: Formato di tipo dashboard con orientamento verticale
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
9
Figura 2: Formato di tipo dashboard con orientamento orizzontale
Le istruzioni di seguito utilizzano la soluzione pronta per l'uso FileMaker "Voci di inventario". Si
tratta di una delle numerose soluzioni pronte per l'uso integrate in FileMaker Pro. In
alternativa, è possibile creare il formato in un file personale, supponendo di avere già definito
tabelle, campi e relazioni e di essere pronti a creare l'interfaccia utente della soluzione. In
questo caso, saltare il passo 1 e iniziare dal passo 2.
Impostazione iniziale
1) Creare la soluzione pronta per l'uso Voci di inventario
a. In FileMaker Pro o FileMaker Pro Advanced, selezionare File > Nuovo da
soluzione pronta per l'uso....
b. Selezionare il modello Voci di inventario.
c. Selezionare la posizione in cui salvare la soluzione pronta per l'uso e fare
clic su Salva.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
10
Figura 3: La finestra di dialogo di selezione della soluzione pronta per l'uso
2) Creare una nuova tabella e un nuovo formato per il dashboard
a. Aprire la finestra Gestisci database utilizzando i tasti di scelta rapida
Cmd+Maiusc+D o Ctrl+Maiusc+D oppure selezionare File > Gestisci >
Database….
b. Creare una nuova tabella Dashboard.
c. Fare clic su OK per chiudere la finestra di dialogo Gestisci database.
d. Fare clic sul pulsante "Modifica il formato" nella barra degli strumenti.
e. Fare clic sul pulsante "Nuovo formato/resoconto" nella barra degli
strumenti.
f. Selezionare "Dashboard" dall'elenco a discesa "Mostra i record di:".
g. Assegnare il nome "Dashboard inventario iPad" al formato.
h. Selezionare "Modulo standard" come tipo di formato.
Figura 4: La prima schermata della finestra di dialogo Nuovo formato/resoconto
i.
Fare clic su Avanti.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
11
j. Fare clic su Avanti senza specificare i campi.
k. Selezionare Aspetto Fiume come tema
l. Fare clic su Fine
Figura 5: La schermata di selezione del tema del formato nella finestra di dialogo Nuovo
formato/resoconto
A questo punto il formato da utilizzare per il dashboard per iPad è stato creato.
Definire i bordi della soluzione FileMaker
Per bordi si intendono la larghezza e l'altezza del formato sulla schermata. Se la soluzione sarà
utilizzata su più dispositivi, occorre definire i bordi di ogni dispositivo su formati distinti per
ciascuno di essi.
Orientamento del dispositivo e ridimensionamento automatico
Le soluzioni devono funzionare bene sia con orientamento verticale che
orizzontale e le funzionalità principali devono essere disponibili in entrambi gli
orientamenti. Ad esempio, gli elementi visibili in corrispondenza del margine
destro di un formato con orientamento orizzontale non devono scomparire o
essere tagliati quando lo schermo viene ruotato in verticale. Un modo per
mantenere l'attenzione sulle funzionalità principali è il ridimensionamento
automatico, che consente di ridimensionare e far scorrere gli oggetti nella
posizione più appropriata a seconda dell'orientamento. Se necessario, mano a
mano che si aggiungeranno elementi al formato in questa sezione, verrà
applicato il ridimensionamento automatico.
Sagome della schermata
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
12
Le sagome della schermata di FileMaker Pro facilitano la definizione dei bordi della soluzione.
Ogni sagoma rappresenta l'area effettivamente disponibile per il formato, corrispondente alla
schermata del dispositivo meno lo spazio utilizzato per gli elementi delle applicazioni iOS e Go
come le barre degli strumenti. È possibile attivare qualsiasi combinazione di sagome, nonché
personalizzare una sagoma. Per questo esercizio, si utilizzeranno sia la sagoma iPad (verticale)
che la sagoma iPad (orizzontale) per visualizzare lo spazio disponibile in entrambi gli
orientamenti.
•
Per impostare i bordi del formato utilizzando una sagoma della schermata:
a. Selezionare Visualizza > Modo Formato scheda.
b. Fare clic sulla freccia delle sagome della schermata nella barra degli strumenti.
c. Selezionare iPad: 768 x 929 (verticale) dall'elenco a discesa per visualizzare la sagoma
desiderata.
d. Fare nuovamente clic sull'elenco a discesa delle sagome della schermata e selezionare
iPad: 1024 x 673 (orizzontale).
Figura 6: L'elenco a discesa delle sagome della schermata
Quindi, sempre nel modo Formato scheda, ridimensionare la sezione Corpo in modo che la
parte inferiore del Piè di pagina sia a 717 pt, appena sotto il bordo inferiore della sagoma della
schermata iPad (orizzontale) (poiché uno script disattiva le barre degli strumenti quando si apre
il file, il formato può essere 44 pt più lungo della sagoma). [Se l'unità di misura corrente nella
scheda Posizione è "cm" o "in", modificarla in "pt" (punti) facendo clic su una qualsiasi
etichetta dell'unità di misura finché non viene visualizzato "pt"]. È possibile ridimensionare la
sezione Corpo facendo clic sulla relativa etichetta e modificando il valore Altezza nella scheda
Posizione della finestra Impostazioni in 641 pt o facendo clic e trascinando la linea tra le
sezioni Corpo e Piè di pagina. Utilizzare la finestra Impostazioni per modificare l'altezza (e poi
la larghezza) è il metodo più preciso per definire le dimensioni degli oggetti e delle sezioni del
formato.
Quindi, modificare la larghezza del formato in modo che sia perfettamente allineato al margine
destro della sagoma della schermata iPad (verticale), senza selezionare nulla e modificando il
valore della larghezza nella scheda Posizione della finestra Impostazioni in 768 pt, oppure
facendo clic sul margine destro del formato e trascinandolo.
È importante che i margini del formato siano perfettamente allineati con le sagome della
schermata (o all'interno dell'area della schermata disponibile con le barre degli strumenti
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
13
disattivate). Se non sono allineati correttamente, gli utenti potrebbero sperimentare casi di
scorrimento indesiderato e il formato potrebbe non ridimensionarsi correttamente quando si
ruota il dispositivo.
Figura 7: Margine destro del formato allineato al margine destro della sagoma della schermata iPad: 768
x 929 (verticale)
Griglie
L'uso di una griglia assicura che ogni cosa sia ben organizzata e disposta in modo ottimale
sulla schermata dei dispositivi più piccoli.
La griglia visualizza una serie di linee orizzontali e verticali intersecanti non stampabili che si
possono utilizzare per creare, ridimensionare, posizionare e allineare gli oggetti.
Per visualizzare la griglia, selezionare Visualizza > Griglia > Mostra griglia.
Quando si deve decidere come allineare e posizionare gli oggetti sul formato, utilizzare la
griglia sottostante per definirne il posizionamento.
Il formato può essere configurato in modo che gli oggetti siano "allineati" alle linee della griglia.
Quando si sposta o si ridimensiona un oggetto, questo viene allineato alla griglia secondaria
più vicina. Quando si aggiungono nuovi oggetti, questi vengono allineati alla griglia principale
più vicina.
Per attivare o disattivare l'effetto di "allineamento alla griglia", selezionare Visualizza > Griglia
> Allinea alla griglia .
La distanza tra le linee della griglia può essere anche modificata inserendo i valori desiderati in
Spaziatura griglia principale e Incrementi griglia secondaria nell'area Griglia della scheda
Posizione della finestra Impostazioni. Un utile "trucco del mestiere" consiste nell'impostare
per Spaziatura griglia principale la dimensione del dispositivo (in questo caso 768 pt) e per
Incrementi griglia secondaria un divisore pari, come 32 pt o 64 pt. È possibile creare
rapidamente formati a 2, 3 e 4 colonne allineando gli oggetti alle linee della griglia
orizzontalmente e verticalmente, come descritto nel paragrafo Guide di seguito.
Righelli
I righelli orizzontale e verticale visualizzano linee di riferimento per tenere traccia della
posizione del puntatore mentre lo si sposta sul formato. Quando si sposta un oggetto come un
campo o un pulsante, i righelli visualizzano anche l'area dell'oggetto, utile per rendersi conto
dello spazio che un oggetto occupa.
Per visualizzare i righelli, selezionare Visualizza > Righelli.
Guide
Dopo aver adattato la spaziatura della griglia al formato, posizionare le guide sul formato per
indicare colonne e righe e attivare la condivisione delle guide in modo da poter utilizzare le
stesse guide su altri formati.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
14
Per aggiungere guide al formato, fare clic sul righello a sinistra o in cima al formato e
trascinarle nella posizione desiderata. Per regolare la posizione delle guide, fare clic su una
delle guide esistenti e trascinarla. La posizione verrà mostrata sul rispettivo righello e nella
scheda Posizione della finestra Impostazioni.
Le guide possono essere condivise con tutti i formati, consentendo di posizionare gli elementi
su più formati con la stessa disposizione. Le guide possono anche essere bloccate o rimosse.
Fare clic con il tasto destro del mouse o fare clic tenendo premuto il tasto Ctrl su una guida per
visualizzare il menu di scelta rapida con le opzioni che consentono di condividere la guida,
bloccarla o rimuoverla.
È anche possibile attivare l'opzione Allinea alle guide. Poiché le opzioni Allinea alla griglia e
Allinea alle guide eseguono funzioni simili, è bene tenere conto di quanto segue:
•
•
•
Selezionare l'opzione Allinea alle guide o Allinea alla griglia, ma non entrambe, poiché può
essere difficile distinguere se gli elementi sono allineati a una guida o alla griglia.
Utilizzare la griglia per impostare le guide, quindi disattivarla e utilizzare esclusivamente
l'opzione Allinea alle guide durante la creazione del formato.
Utilizzare le guide per indicare le posizioni condivise in più formati, quindi utilizzare
esclusivamente l'opzione Allinea alla griglia durante la creazione del formato.
Guide dinamiche
Le guide dinamiche sono linee "a comparsa" che vengono visualizzate quando un oggetto che
si sta spostando, disegnando o ridimensionando corrisponde alla spaziatura, all'allineamento o
alle dimensioni di altri oggetti del formato. Sono utili per riuscire a collocare e ridimensionare
gli oggetti in modo che si armonizzino con gli altri elementi del formato.
Per visualizzare o nascondere le guide dinamiche, selezionare Visualizza > Guide dinamiche.
Per vedere le guide dinamiche in funzione, attivarle, inserire più di un campo o più di un
oggetto sul formato e trascinare uno degli oggetti attorno ad un altro. Quando l'oggetto
trascinato si allinea ad un altro oggetto, le guide dinamiche vengono visualizzate per indicare
l'allineamento. Quindi ridimensionare un oggetto trascinando una cornice di selezione. Le
guide dinamiche vengono visualizzate quando la dimensione dell'oggetto corrisponde a quella
di un altro oggetto o quando uno dei margini si allinea a un altro oggetto.
Creare il formato
Questa sezione descrive i passi necessari per creare un dashboard per l'iPad. Come già detto
riguardo all'orientamento, è essenziale applicare il ridimensionamento automatico ad ogni
elemento affinché il formato funzioni come gli utenti si aspettano, sia con orientamento
verticale che orizzontale. Le istruzioni per l'applicazione del ridimensionamento automatico
sono fornite in questa guida.
1.
Aggiungere una barra degli strumenti in stile iOS
Di solito in iOS la barra degli strumenti si estende in orizzontale nella parte superiore della
soluzione. Due esempi sono le applicazioni Mail o Calendario sull'iPad.
Per aggiungere alla soluzione una barra degli strumenti in stile iOS, modificare la sezione
Intestazione inserita automaticamente con la creazione del nuovo formato. Questa sezione
descrive come modificare la sezione Intestazione in modo da conformarla all'interfaccia
grafica di una barra degli strumenti standard comunemente presente sull'iPad.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
15
Finestre Impostazioni
Aprendo più finestre Impostazioni in modo Formato scheda, lavorare su un
formato diventa più facile. Ad esempio, è possibile visualizzare la scheda Dati di
una finestra Impostazioni e la scheda Aspetto di un'altra finestra Impostazioni,
per avere accesso alle opzioni di entrambe le schede. Per aprire la prima finestra
Impostazioni utilizzare i tasti di scelta rapida Cmd+I o Ctrl+I o selezionare
Visualizza > Impostazioni. Per aprire altre finestre Impostazioni, selezionare
Visualizza > Nuove Impostazioni.
Inoltre, è possibile lavorare con una sola finestra Impostazioni e utilizzare i tasti di
scelta rapida (Cmd+1, Cmd+2 o Cmd+3 su Mac o Ctrl+1, Ctrl+2 o Ctrl+3 in
Windows) per accedere ad ognuna delle schede quando necessario, oppure
aprire più finestre Impostazioni e utilizzare gli stessi tasti di scelta rapida per
passare dall'una all'altra.
a. Ridimensionare la sezione Intestazione
Esistono due modi per ridimensionare la sezione Intestazione:
! È possibile fare clic e trascinare il margine inferiore della sezione Intestazione e,
guardando l'altezza nell'area Dimensione della scheda Posizione di una finestra
Impostazioni, modificare la dimensione in 44 punti.
! In alternativa è possibile fare clic sull'etichetta della sezione Intestazione sul lato
sinistro del formato e modificare l'altezza nell'area Dimensione della scheda Posizione
di una finestra Impostazioni.
!
b. Aggiungere un titolo alla barra degli strumenti
Esistono due modi per aggiungere un titolo alla barra degli strumenti:
! Selezionare lo strumento Testo nella barra degli strumenti, fare clic nella sezione
Intestazione e iniziare a scrivere. È anche possibile selezionare lo strumento Testo,
trascinare un rettangolo nella sezione Intestazione e iniziare a scrivere. Se il testo è più
lungo del rettangolo, verrà mandato a capo su una o più righe per rientrare nella
larghezza.
! Oppure, con lo strumento Selezione selezionato, basta fare clic nella sezione
Intestazione e iniziare a scrivere.
Occorre tenere presente che se si scrive in un'altra sezione, ad esempio nel Corpo, la
formattazione predefinita per il testo sarà diversa da quella del testo inserito nella sezione
Intestazione. Questa "consapevolezza" del punto in cui si sta scrivendo è una funzione dei
temi di FileMaker.
Indipendentemente dal metodo scelto, centrare il testo sia all'interno della casella di testo
che sul formato:
1. Fare clic fuori dalla casella di testo (o premere il tasto Invio sulla tastiera) per tornare
allo strumento Selezione. Quindi si hanno più possibilità:
! Utilizzare i tasti di scelta rapida Cmd+\ o Ctrl+\.
! Selezionare Formattazione > Allinea testo > Centro.
! Fare clic sul pulsante di allineamento al centro nella barra di formattazione.
2. Trascinare il titolo al centro del formato, sempre all'interno della sezione Intestazione. È
possibile calcolare la posizione sottraendo la larghezza del titolo dalla larghezza del
formato, dividendo per due e posizionando il margine sinistro del titolo in
corrispondenza del valore ottenuto. In alternativa allineare il titolo con un oggetto, come
una linea o un rettangolo, per cui sia stata impostata la stessa larghezza del formato e
che sia posizionato in corrispondenza del margine sinistro del formato. Per centrare il
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
16
titolo con l'oggetto, trascinare il titolo finché non viene visualizzata una guida dinamica
per indicare che il centro del titolo è allineato al centro dell'oggetto, oppure selezionare
sia l'oggetto che il titolo e fare clic sul pulsante Allinea sui centri verticali nella scheda
Posizione della finestra Impostazioni. Se si trascina il titolo per allinearlo all'oggetto e
sul formato sono presenti altri oggetti, è possibile che le guide dinamiche vengano
visualizzate anche mentre si trascina il titolo. Assicurarsi di allineare il titolo al centro
dell'oggetto, piuttosto che ad altri oggetti.
c. Aggiungere un pulsante alla barra degli strumenti
La maggior parte delle applicazioni iOS ha pochi pulsanti nella barra degli strumenti, ad
esempio un pulsante per aggiungere un nuovo record e un pulsante per passare a
un'area diversa o a una visualizzazione più ampia. Per questo dashboard, aggiungere
un pulsante per l'invio dell'elenco delle voci di inventario via e-mail. È possibile copiare
il pulsante con questo script sul formato Inventario esistente della soluzione pronta per
l'uso Voci di inventario (nel gruppo dei formati Scrivania) o eseguire questi passi sul
proprio formato:
1. Utilizzando lo strumento Pulsante nella barra degli strumenti, disegnare un pulsante
nell'angolo in alto a destra della sezione Intestazione.
2. Impostare il pulsante in modo che esegua lo script Invia inventario via E-mail e
selezionare Esci nell'elenco a discesa "Script corrente:". Fare clic su OK per chiudere
la finestra di dialogo Impostazione pulsanti.
3. Digitare "Invia inventario via E-mail" come nome del pulsante.
4. Ridurre la dimensione del font a 14 pt e ridimensionare e posizionare il pulsante in
modo che stia nella sezione Intestazione e sia allineato alle guide o agli oggetti
appropriati sul formato.
5. Per adattare il pulsante allo stile della barra degli strumenti, cambiare il gradiente di
riempimento del pulsante, la linea e il colore del testo:
a) Selezionare il pulsante e, nella scheda Aspetto della finestra Impostazioni (sezione
Grafico, Riempimento), selezionare il cursore del gradiente a sinistra ed eseguire il
campionamento o impostarlo sul colore della parte superiore della sezione
Intestazione. (Per eseguire il campionamento del colore, fare clic all'interno del
cursore del gradiente e selezionare lo strumento di campionamento dalla palette
dei colori – lo strumento di campionamento ha l'aspetto di una lente di
ingrandimento. Quindi, spostarsi con il mouse su un'area e notare che l'area viene
ingrandita all'interno dello strumento di campionamento. Quando si trova il colore
che si desidera utilizzare, fare clic su di esso. Il colore selezionato viene così
impostato nell'area in cui si sta lavorando, in questo caso uno dei cursori del
gradiente).
b) Selezionare il cursore del gradiente a destra ed eseguire il campionamento o
impostarlo sul colore della parte inferiore della sezione Intestazione.
c) Modificare il colore della linea nel colore della parte inferiore della sezione
Intestazione.
d) Modificare il colore del font in quello di riempimento della sezione Corpo in modo
che sia visibile sui nuovi colori del pulsante.
A questo punto, la sezione Intestazione sarà simile per aspetto e funzionalità a una
comune barra degli strumenti iOS.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
17
Figura 8: La sezione Intestazione con un titolo e un pulsante
2. Aggiungere un elenco degli articoli da riordinare o disponibili in magazzino
Per essere utile ed efficace, il dashboard deve contenere informazioni che mostrino
immediatamente agli utenti ciò che devono sapere e strumenti che li aiutino ad eseguire le
proprie attività in modo semplice e rapido. Nel caso di questo dashboard, è utile visualizzare
un elenco degli articoli da riordinare o disponibili in magazzino, e un grafico che fornisca una
panoramica dell'inventario.
Creare la tabella e le relazioni
Per visualizzare un elenco degli articoli da riordinare o disponibili in magazzino, si dovrà
innanzitutto aggiungere un campo alla tabella Dashboard e una relazione alla tabella
Inventario:
1. Aprire la finestra Gestisci database utilizzando i tasti di scelta rapida Cmd+Maiusc+D o
Ctrl+Maiusc+D oppure selezionare File > Gestisci > Database….
2. Nella scheda Campi, creare un campo Testo con memorizzazione globale nella tabella
Dashboard chiamato "DisponibilitàDashboard".
3. Nella scheda Relazioni, creare una relazione tra la ricorrenza di tabella Inventario e la
nuova ricorrenza di tabella Dashboard:
a) Fare clic e trascinare una linea da DisponibilitàDashboard nella ricorrenza di tabella
Dashboard a Disponibilità nella ricorrenza di tabella Inventario (è possibile si debba
scorrere verso il basso l'elenco dei campi nella ricorrenza di tabella Inventario per
visualizzare Disponibilità).
b) Oppure selezionare lo strumento Crea relazione in basso a sinistra nella finestra
Gestisci database, selezionare le ricorrenze di tabella in ogni colonna e selezionare il
campo Disponibilità nella colonna Inventario e DisponibilitàDashboard nella colonna
Dashboard.
4. Modificare la relazione in un prodotto cartesiano, selezionando il simbolo "x" al fondo
dell'elenco a discesa tra le colonne delle tabelle. (Se la relazione è stata creata con il
metodo descritto al punto 4a di cui sopra, fare doppio clic sulla linea della relazione per
visualizzare la finestra di dialogo Modifica relazione, quindi selezionare "x" come operatore
cartesiano).
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
18
Figura 9: Selezione di un prodotto cartesiano
5. Fare clic su OK per chiudere la finestra di dialogo Gestisci database.
Figura 10: Ricorrenze di tabella con relazioni nel grafico delle relazioni
Creare il portale
A questo punto, aggiungere un portale basato sulla nuova relazione:
1. Nel modo Formato scheda, aggiungere le guide (se non è già stato fatto) e posizionarle a
15 pt, 500 pt, 515 pt e 751 pt. In questo modo il formato risulterà efficacemente suddiviso
in 2/3 e 1/3, con un bordo di 15 pt a sinistra e a destra e uno spazio di 15 pt tra le
"colonne".
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
19
2. Selezionare lo strumento Portale nella barra degli strumenti e trascinarlo in modo da
creare un portale sul formato.
3. Quando viene visualizzata la finestra di dialogo di impostazione del portale, selezionare
Inventario dall'elenco a discesa "Mostra i record correlati di:".
Figura 11: Aggiunta di un portale al formato
4. Selezionare la casella "Mostra la barra di scorrimento verticale".
5. Fare clic sul pulsante "Specifica" accanto a "Filtra record portale".
6. Inserire il seguente calcolo nell'area Specifica il calcolo:
Dashboard::DisponibilitàDashboard = Inventario::Disponibilità
(In un momento successivo del processo si aggiungeranno dei pulsanti per impostare il
valore di Dashboard::DisponibilitàDashboard).
Figura 12: Specifica del calcolo di filtraggio
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
20
7. Fare clic su OK.
8. In Numero di righe, inserire 7 e fare clic su OK.
Figura 13: La finestra di dialogo Impostazione portale
9. Nella finestra di dialogo "Aggiungi campi al portale", spostare i seguenti campi nella
colonna "Campi inclusi":
• Immagine | Contenitore
• Articolo
• Unità disponibili
• Costo unitario
Figura 14: Selezione dei campi per il portale
10. Fare clic su OK
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
21
Ridimensionare il portale
Ora il nuovo portale è presente sul formato e con ogni probabilità dovrà essere allineato e
ridimensionato. Innanzitutto, tenendo sotto controllo la scheda Posizione della finestra
Impostazioni come riferimento, spostare il portale a 144 pt dal bordo superiore del formato e a
15 pt dal bordo sinistro, allineato alla guida sinistra. Oppure, anziché trascinare il portale, è
possibile modificare semplicemente i valori Superiore e Sinistra nella finestra Impostazioni.
A questo punto, ridimensionare il portale in modo da allineare il margine destro alla guida a 500
pt (impostando una larghezza del portale di 485 pt) e da portare il margine inferiore a 686 pt
(impostando un'altezza del portale di 542 pt). Anche in questo caso è possibile inserire i valori
nella scheda Posizione della finestra Impostazioni o fare clic e trascinare i quadratini sul portale
per ridimensionarlo. Se le opzioni Allinea alle guide o Allinea alla griglia sono selezionate, può
essere difficile ridimensionare il portale in modo che rispetti dimensioni precise, trascinando i
quadratini; modificare i valori nella finestra Impostazioni è il metodo più preciso.
Figura 15: Valori di Posizione e Dimensione per il portale nella finestra Impostazioni
Ridimensionare i campi
Ridimensionare il campo Immagine | Contenitore con una larghezza di 70 pt per un'altezza di
70 pt, quindi ridimensionare gli altri campi in modo che siano posizionati comodamente nel
portale. (Per Articolo è possibile impostare un'altezza di 70 pt se si prevede che i valori
all'interno di questo campo possano richiedere più spazio). Inoltre, selezionare tutti i campi e
rimuovere riempimento e linee (selezionare Nessuno dall'elenco a discesa Riempimento nella
scheda Aspetto della finestra Impostazioni, quindi selezionare Nessuno dall'elenco a discesa
Linea o fare clic sulla casella "Tutti i bordi" sotto l'elenco a discesa Linea). Il risultato deve
essere uguale a quello riportato nella figura 16:
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
22
Figura 16: Attributi Riempimento e Linea del campo impostati su Nessuno nella finestra Impostazioni
Ridimensionamento automatico del portale
Affinché il portale e i suoi contenuti si allarghino correttamente quando si ruota il dispositivo, è
necessario configurare il ridimensionamento automatico in modo adeguato. A questo scopo
selezionare il portale (solo il portale e non i campi) e attivare tutte le icone del lucchetto
nell'area Autodimensionamento della scheda Posizione della finestra Impostazioni (le icone
attivate hanno l'aspetto di un lucchetto, mentre quelle disattivate sono grigie con una casella
bianca).
Figura 17: Impostazioni Posizione e Autodimensionamento per il portale nella finestra Impostazioni
A questo punto il portale si allarga o restringe in base alla rotazione del dispositivo.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
23
Ridimensionamento automatico dei campi
Il ridimensionamento automatico dei campi all'interno del portale dovrebbe essere leggermente
diverso: per il campo Immagine | Contenitore si devono ancorare la parte superiore e il margine
sinistro, mentre per il campo Articolo si devono ancorare la parte superiore e i margini sinistro
e destro e per il campo Unità e Costo unitario si devono ancorare la parte superiore e il
margine destro. Quando il portale si allarga, Immagine | Contenitore manterrà la propria
posizione, mentre Articolo si allargherà e Unità e Costo unitario si sposteranno a destra per
consentire l'allargamento di Articolo.
Per tutti i campi del portale, deselezionare le caselle Modo Usa e Modo Trova relative ad
Inserimento campo (nella scheda Dati della finestra Impostazioni). Disattivando l'inserimento
nei campi, gli utenti non potranno accedere ai campi o modificarne i valori quando toccano
una riga.
Aggiungere una linea al portale
Ora si aggiungerà una linea divisoria tra una riga e l'altra, per conferire al formato un aspetto
ancora più simile a un'interfaccia iOS. Selezionare lo strumento Linea dalla barra degli
strumenti e disegnare una linea sul fondo dei campi nella prima riga del portale. Tenendo
premuto il tasto Maiusc mentre si trascina il mouse, la linea viene mantenuta in orizzontale.
(Tenendo premuto il tasto Maiusc mentre si disegna una linea in verticale, la linea viene
mantenuta in verticale). Spostare e ridimensionare la linea in base alle proprie esigenze
all'interno e attraverso la riga del portale, ma non nella barra di scorrimento del portale.
Utilizzare le opzioni di ridimensionamento automatico nella scheda Posizione della finestra
Impostazioni per ancorare la parte superiore, il margine sinistro e il margine destro della linea.
In questo modo la linea si allungherà con il portale quando verrà cambiato l'orientamento.
Aggiungere i titoli al portale
Quindi aggiungere i titoli al portale. Fare doppio clic sullo strumento Testo nella barra degli
strumenti (facendo doppio clic l'uso dello strumento viene bloccato per un tempo
indeterminato) e fare clic sul campo Immagine | Contenitore. Digitare "Immagine". Fare clic su
ognuno degli altri campi e digitare un titolo appropriato. Dopo aver inserito l'ultimo titolo, fare
clic sullo strumento Selezione nella barra degli strumenti per disattivare lo strumento Testo (o
premere due volte Invio – non Ritorno – sulla tastiera). Trascinare ogni titolo nel punto definitivo
utilizzando le guide dinamiche per allinearlo con gli altri titoli e con i campi appropriati, quindi
posizionare ogni titolo a 120 pt dal bordo superiore. Poiché con questo tema ogni campo ha 5
pt di spaziatura interna su ciascun lato, è bene tenerne conto quando si allineano i titoli.
Per i titoli è possibile impostare un font della dimensione massima di 16 pt per risparmiare
spazio. Per selezionare tutti i titoli, trascinare il puntatore su di essi (tenere presente che se si
tocca qualunque altro elemento, anch'esso verrà incluso nella selezione). Modificare la
dimensione del font selezionando una dimensione personalizzata dalla barra di formattazione o
da Formattazione > Dimensione. (Molte dimensioni dei font possono essere impostate anche
utilizzando i tasti di scelta rapida Cmd+Shift+< o Ctrl+Shift+< per ridurre la dimensione o
Cmd+Shift+> o Ctrl+Shift+> per aumentarla).
Per conferire ai titoli e al portale un aspetto che ne sottolinei l'appartenenza allo stesso
oggetto, selezionare lo strumento Rettangolo angoli arrotondati dalla barra degli strumenti e
disegnare una casella intorno ai titoli. Ridimensionare la casella in modo che abbia la stessa
larghezza del portale e impostarne l'altezza su 34 pt. Posizionarla a 112 pt dal bordo superiore
e allinearla al bordo sinistro al portale, tra le guide. Portare la casella in secondo piano, dietro i
titoli.
Successivamente, copiare lo stile del portale facendo clic sul pulsante "Copia lo stile
dell'oggetto" nella sezione Stile della scheda Aspetto e applicarlo alla casella selezionandola e
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
24
facendo clic sul pulsante "Incolla uno stile". Applicando un colore di riempimento alla casella, i
titoli risalteranno di più; provare un colore basato sul colore della sezione Corpo, con una
saturazione leggermente inferiore e una luminosità leggermente superiore.
Infine, disattivare gli angoli in basso a sinistra e a destra della casella utilizzando le
impostazioni del raggio dell'angolo nella scheda Aspetto della finestra Impostazioni, quindi
selezionare il portale e disattivarne gli angoli in alto a sinistra e a destra.
Angoli
In queste istruzioni si accetta il valore predefinito 5 per gli angoli. Provare ad
impostare valori maggiori o minori sul proprio formato per vedere con quali valori
si ottiene l'aspetto migliore, in particolare con i gruppi di campi. Ad esempio,
valori maggiori possono funzionare meglio sull'iPad piuttosto che sull'iPhone.
Allineare i titoli e i campi
Per rendere l'aspetto del portale ancora più attraente, allineare i campi Unità e Costo unitario e
i titoli al bordo destro e allineare fisicamente ogni titolo al margine destro del rispettivo campo
meno 5 pt (la spaziatura interna ai campi prevista da questo tema). A questo punto, il formato
dovrebbe apparire come nella figura 18:
Figura 18: Campi e titoli allineati tra loro
Dati!
Per visualizzare i dati nel portale, aggiungere dei record alla tabella Inventario
utilizzando il formato Dettagli prodotto nel gruppo dei formati Scrivania.
Assicurarsi di inserire la categoria, l'articolo e il prezzo unitario. Inoltre,
aggiungere un'immagine ad ogni record. Sulla maggior parte ma non su tutti i
record, fare clic su Aggiungi transazione per aggiungere almeno una voce con la
data, il numero di lotto, la descrizione e le unità in ingresso e/o in uscita. In
questo modo per alcuni record verrà visualizzato lo stato "In magazzino" e per
altri "Riordine richiesto" (questo viene calcolato nel campo Disponibilità in base
ai campi Unità disponibili e Punto di riordino).
Una volta creati i record dell'inventario, tornare a Dashboard inventario iPad per
proseguire con la creazione del formato.
3. Aggiungere i pulsanti per modificare gli articoli visualizzati nel portale
Poiché il portale ha un filtro basato sul valore del campo DisponibilitàDashboard, agli utenti
deve essere consentito di impostare il valore su "Riordine richiesto" o "In magazzino", i due
valori presenti nel campo Disponibilità della tabella Inventario. Per facilitare gli utenti, creare
due pulsanti sopra il portale. Il primo pulsante deve eseguire l'istruzione Imposta campo per
impostare DisponibilitàDashboard su "Riordine richiesto" e deve essere chiamato "Riordine
richiesto". Analogamente, il secondo pulsante deve eseguire l'istruzione Imposta campo per
impostare DisponibilitàDashboard su "In magazzino" e deve essere chiamato "In magazzino".
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
25
Per fare in modo che i pulsanti si armonizzino con il resto del progetto, impostare per ognuno
di essi una larghezza pari all'esatta metà di quella del portale (in questo caso, ogni pulsante
deve essere largo 242,5 pt). Allineare il primo pulsante alla guida sinistra a 15 pt e allineare il
margine destro del secondo pulsante alla guida a 500 pt, quindi allineare entrambi i pulsanti
alla stessa altezza sul formato, a 59 pt dal bordo superiore. In questo modo i pulsanti verranno
collocati nello spazio sopra il portale e saranno allineati l'uno accanto all'altro, senza spazi fra
di loro. Ridimensionare l'altezza dei pulsanti a 38 pt.
Successivamente, utilizzando le impostazioni del raggio dell'angolo nella scheda Aspetto della
finestra Impostazioni, deselezionare gli angoli in alto a destra e in basso a destra del primo
pulsante (quello a sinistra). Quindi, selezionare solo il secondo pulsante e deselezionare gli
angoli in alto a sinistra e in basso a sinistra.
Infine, impostare il ridimensionamento automatico di entrambi i pulsanti in modo che sia
ancorata solo la parte superiore. In questo modo, cambiando l'orientamento, i pulsanti saranno
liberi di spostarsi a sinistra e a destra, centrati sopra il portale.
Per un tocco di stile in più, impostare la Formattazione condizionale per ogni pulsante se il
campo DisponibilitàDashboard contiene il valore impostato dal pulsante. Poiché il testo sarà
visualizzato in basso sul pulsante, se con la formattazione condizionale viene messo in
grassetto, optare per cambiare il colore del testo, i bordi o il riempimento dello sfondo.
Impostare DisponibilitàDashboard all'apertura del file
Se si desidera che gli utenti visualizzino gli articoli impostati su Riordine richiesto
o In magazzino appena accedono al dashboard, aggiungere un'istruzione allo
script
eseguito
SuAperturaPrimaFinestra
per
impostare
il
campo
DisponibilitàDashboard sul valore appropriato.
4. Aggiungere un pulsante che consenta di accedere ai dettagli degli articoli
Per facilitare l'accesso da parte degli utenti ai dettagli dei singoli articoli presenti nel portale,
aggiungere un pulsante che consenta di accedere al record correlato:
1. Selezionare lo strumento Pulsante dalla barra degli strumenti e disegnare un pulsante
sopra la prima riga del portale (in questa fase non occorre prestare attenzione alle
dimensioni).
2. Nella finestra di dialogo Impostazione pulsanti, selezionare Vai al record correlato.
3. Fare clic su Specifica e selezionare Inventario dall'elenco a discesa "Ricava i record
correlati da:".
4. Dall'elenco a discesa "Mostra record usando il formato:" selezionare Formato, quindi
selezionare Dettagli prodotto | iPad dalla finestra di dialogo Specifica formato.
5. Fare clic su OK per chiudere la finestra di dialogo Specifica formato.
6. Selezionare la casella accanto a "Mostra soloi record correlati".
7. Fare clic su OK per chiudere la finestra di dialogo Opzioni "Vai al record correlato".
8. Fare clic su OK per chiudere la finestra di dialogo Impostazione pulsanti.
9. Fare clic fuori dal pulsante per salvarlo senza aggiungere alcun titolo.
A questo punto, è possibile che il pulsante copra la maggior parte dei campi. Pertanto, andrà
spostato dietro i campi e poi formattato in modo da non distogliere l'attenzione dal resto del
formato.
Per spostare il pulsante dietro i campi, prima di tutto modificarne le dimensioni in modo che
riempia il portale, coprendo completamente i campi, ma senza sovrapporsi alla barra di
scorrimento. Quindi selezionare Organizza > Porta in secondo piano.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
26
Per fare in modo che il pulsante si fonda con lo sfondo, rimuovere il riempimento, le linee e i
raggi dell'angolo del pulsante utilizzando la scheda Aspetto della finestra Impostazioni. Inoltre,
ancorare la parte superiore, il margine sinistro e il margine destro del pulsante in modo che
scorra e si allarghi con il portale quando si cambia orientamento.
Tenere presente che, avendo deselezionato l'inserimento nei campi nei modi Usa e Trova per i
campi del portale, gli utenti non saranno in grado di accedere ai campi toccando una riga,
attivando invece sempre il pulsante. Inoltre, poiché al pulsante viene applicato
automaticamente uno stato premuto, il pulsante ora verrà visualizzato nell'intera riga del
portale dietro i campi quando un utente tocca la riga (e quindi il pulsante).
È necessario aggiungere un pulsante al formato Dettagli prodotto | iPad per tornare al formato
Dashboard.
Per essere certi che gli utenti visualizzino i dati più aggiornati attraverso il dashboard, creare un
nuovo script "Aggiorna" con un'unica istruzione: Aggiorna finestra [Elimina i risultati dalla
cache]. Nel formato Dashboard inventario iPad, attivare i trigger di script
SuCaricamentoRecord e SuEntrataFormato per eseguire lo script Aggiorna. L'azione Aggiorna
finestra influisce sul visualizzatore Web aggiunto al passo 7 (di seguito). Vedere tale sezione
per maggiori dettagli.
5. Aggiungere il valore totale dell'inventario
Per mostrare agli utenti il valore totale dell'inventario, creare un campo Calcolo nella tabella
Dashboard con il calcolo:
Somma(Inventario::Valore magazzino)
Aggiungere il nuovo campo al formato a destra del portale, con il titolo "Valore totale
dell'inventario". Nella scheda Dati della finestra Impostazioni, nella sezione Formattazione dati,
impostare il formato del campo su Valuta e applicare le opzioni desiderate (ad esempio, un
numero fisso di 2 decimali con separatore delle migliaia attivato).
Ridimensionare il campo in modo che sia posizionato tra le guide che costituiscono la
"colonna" destra sul formato, con il margine sinistro a 515 pt e il margine destro a 752 pt (per
una larghezza del campo pari a 237 pt). Allineare il bordo superiore del campo al portale a 144
pt, quindi allineare il titolo ai titoli sopra il portale. Successivamente, formattare il campo e il
titolo in modo che siano allineati al centro, allinearli al centro uno rispetto all'altro e ancorare
solo la parte superiore e il margine destro. In questo modo il titolo e il campo verranno
mantenuti a destra del portale quando verrà cambiato l'orientamento. Infine, deselezionare le
opzioni per permettere l'inserimento nel campo nei modi Usa e Trova, nella scheda Dati della
finestra Impostazioni.
Affinché l'aspetto del titolo e del campo corrisponda a quello del portale, duplicare la casella
dietro i titoli del portale e ridimensionarla in modo che corrisponda alla larghezza del campo
Valore totale. Allineare la casella tra le guide, centrata con il testo e il campo, con il bordo
superiore nella stessa posizione della casella originale (122 pt). Portare la casella in secondo
piano in modo che si trovi dietro il titolo, quindi ancorare la parte superiore e il margine destro.
6. Aggiungere un grafico che mostri la quantità di articoli per ogni categoria
Un'istantanea dell'inventario aiuterà gli utenti a comprendere l'immagine più ampia del
sistema. Questo grafico si baserà su un nuovo campo Riassunto in Inventario, configurato per
eseguire il totale del campo Unità disponibili. Creare il campo in Inventario prima di aggiungere
il grafico al formato (il nome del campo è sUnitàDisponibili nell'elenco di seguito).
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
27
Per aggiungere il grafico, nel modo Formato scheda, selezionare lo strumento Grafico dalla
barra degli strumenti e trascinare un rettangolo a destra del portale. Nella finestra di dialogo
Impostazione grafico, formattare l'area Grafico come segue:
•
•
•
•
•
•
•
Titolo del grafico: "Quantità per categoria"
Tipo di grafico: Barre
Titolo dell'asse delle X: "Quantità"
Dati
dell'asse
delle
X,
specificare
il
RicavaRiassunto(Inventario::sUnitàDisponibili; Inventario::Categoria)
Titolo dell'asse delle Y: "Categoria"
Dati dell'asse delle Y, specificare il nome del campo: Inventario::Categoria
Mostra coordinate su grafico
calcolo:
Passare all'area Stili e modificare le Dimensioni relative del testo, al fondo, in -1.
Passare all'area Origine dati e selezionare quanto segue:
• Dati del grafico: Record correlati
• Tabella correlata: Inventario
• Impostare il Criterio di ordinamento dei record correlati su Categoria
• Visualizzazione del grafico quando è ordinato: Gruppi di record riassunti
Figura 19: Le tre sezioni della finestra di dialogo Impostazione grafico
Fare clic su Esci per chiudere la finestra di dialogo Impostazione grafico.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
28
A questo punto, ridimensionare il grafico in modo che sia posizionato nella seconda "colonna"
creata dalle guide sul formato, con il margine sinistro allineato alla guida a 515 pt e il margine
destro allineato a 752 pt. L'altezza richiesta dipende in parte dal numero delle categorie
assegnate agli articoli dell'inventario e in parte dalla quantità di spazio disponibile. Per il
momento, assegnare al grafico un'altezza di 229 pt. Allineare il margine superiore a 192 pt
(questo crea uno spazio di 15 pt tra il bordo inferiore del campo del totale dell'inventario e il
bordo superiore del grafico, riflettendo lo spazio tra i pulsanti e la casella del titolo sopra il
portale).
7. Aggiungere una mappa della posizione corrente dell'utente
Per fornire ancora più informazioni all'utente, e per trarre vantaggio della funzione
Localizzazione in FileMaker Go, aggiungere un visualizzatore Web che localizzi la posizione
corrente dell'utente su una mappa.
Per aggiungere un visualizzatore Web, selezionare lo strumento Visualizzatore Web dalla barra
degli strumenti e disegnare un rettangolo verso il fondo della seconda "colonna". Nella finestra
di dialogo "Impostazione visualizzatore Web", nell'area Indirizzo Web, specificare il calcolo:
Dichiara(p = Get(PiattaformaSistema);
If(p = 3;
"https://maps.google.com/maps?q=" & ParoleaSinistra(CercaeSost(Localizzazione(10; 5); " ";
"");2); "data:text/html, <body>Si sta utilizzando un " & If(p > 0; "Mac"; "computer Windows") &
"... Aprire il file su un dispositivo iOS per visualizzare una mappa della posizione.
</body>"
)
)
Il calcolo restituisce su iOS l'URL di una mappa di Google, comprese la latitudine e la
longitudine del dispositivo con una precisione di 10 metri. Tenere presente che le funzioni
Localizzazione e ValoriLocalizzazione non restituiscono un risultato in FileMaker Pro su
computer desktop o portatile; il resto del calcolo visualizza un messaggio invece di richiamare
un URL che non verrà calcolato correttamente.
Fare clic su OK per chiudere la finestra di dialogo "Impostazione visualizzatore Web" e
ridimensionare il visualizzatore Web con una larghezza uguale a quella del grafico (237 pt) e
un'altezza di 217 pt; quindi allineare il margine sinistro a 515 pt e il bordo superiore a 468 pt.
Ancorare la parte superiore e il margine destro del visualizzatore Web in modo che rimanga
attaccato al margine destro, insieme al grafico, quando viene cambiato l'orientamento.
Affinché l'aspetto del portale corrisponda a quello del campo Valore totale, duplicare il titolo e
la casella sopra il campo Valore totale e posizionarli a 436 pt dal bordo superiore (raggrupparli
insieme per visualizzare il valore del bordo superiore, quindi separarli per continuare a
lavorare). Anche in questo caso lo spazio tra il grafico e la casella del titolo della mappa è di 15
pt, riflettendo gli altri spazi orizzontali e verticali. Cambiare il titolo in "Posizione".
È una mappa, e gli utenti vorranno farvi clic sopra e allargarla. La mappa di Google comprende
pulsanti per gestire la mappa; sarebbe quindi controproducente aggiungere un pulsante
direttamente alla mappa. Trasformare invece la casella del titolo sopra la mappa in un pulsante
facendovi clic sopra con il tasto destro del mouse e selezionando Impostazione pulsanti….
Impostare il pulsante in modo che esegua l'istruzione di script Apri URL, senza finestra di
dialogo, specificando l'URL:
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
29
Dichiara(
L = ParoleaSinistra(CercaeSost(Localizzazione(10; 5); " "; "");2);
If(Get(VersioneSistema) ≥ 6; "maps://?ll="; "https://maps.google.com/maps?q=") & L )
Questo calcolo parte dalla funzione Dichiara per dichiarare la variabile "L" (per localizzazione)
con il risultato della funzione Localizzazione. Successivamente, verifica la versione del sistema
per collegarsi a Apple Maps su iOS 6 o versione successiva o a Google Maps sulle versioni
iOS precedenti alla 6. Per eseguire lo zoom della mappa visualizzata a un livello diverso
rispetto a quello predefinito (pari a 15 sia su Apple Maps che su Google Maps), aggiungere alla
fine dell'URL:
& "&z=19" //per aumentare lo zoom (maggiore è il numero, maggiore è il livello di zoom)
– oppure –
& "&z=10" //per diminuire lo zoom
Per far capire agli utenti che possono toccare la barra del titolo per visualizzare una mappa più
grande, aggiungere un rettangolo largo 30 pt e alto 30 pt e posizionarlo a 438 pt dal bordo
superiore e a 720 pt dal bordo sinistro, in modo che si trovi 2 pt all'interno dei margini
superiore e destro della casella del titolo. Applicare un'immagine di riempimento al rettangolo
nella sezione Grafico della scheda Aspetto della finestra Impostazioni e selezionare l'immagine
di una mappa (le immagini delle mappe sono disponibili online, se non se ne ha una a portata
di mano, oppure è possibile scattare un'immagine di una parte di una mappa della posizione
dell'azienda). Selezionare Adatta per riempire dall'elenco a discesa sotto l'anteprima
dell'immagine. Ancorare la parte superiore e il margine destro del rettangolo in modo che si
sposti con la casella del titolo.
Sebbene il pulsante possa essere collegato al rettangolo, le dimensioni sono inferiori ai 44 pt x
44 pt dei pulsanti che è possibile toccare. L'immagine della mappa invita gli utenti a toccarla;
collegando il pulsante alla barra del titolo, lo script verrebbe attivato anche toccando
indirettamente l'immagine.
Un'ultima annotazione sulle prestazioni: poiché il visualizzatore Web sta utilizzando un URL
calcolato che comprende la funzione Localizzazione, si aggiorna con qualsiasi evento (quando
si accede al formato o lo si aggiorna, quando si cambia l'orientamento del dispositivo iOS,
quando gli utenti ritornano alla soluzione, quando si aggiorna manualmente la schermata,
ecc.). Se si desidera non eseguire tutte le volte l'aggiornamento, utilizzare uno script per
impostare il visualizzatore Web su un URL con la posizione attuale quando si deve aggiornare
la mappa. Questo può essere aggiunto allo script Aggiorna richiamato dai trigger di script del
formato, o a uno script collegato a un pulsante che gli utenti toccano per aggiornare la mappa,
o a uno script programmato con un'istruzione di script SuTimer.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
30
8. Il formato finale
Il formato finale deve essere simile a quello riportato nella figura 20:
Figura 20: Il formato finale
9. Cosa fare con lo spazio che rimane?
Ricordarsi che gli elementi su questo formato sono impostati in modo da allargarsi e scorrere
in base all'orientamento. Con orientamento verticale, vi è ancora spazio sotto il visualizzatore
Web per visualizzare un altro piccolo elemento. Si potrebbe aggiungere:
•
•
•
•
Un grafico che mostri l'attività delle vendite (basato sul campo Transazioni
magazzino::Unità in uscita) nell'ora, giorno o settimana precedenti, ecc.
Un portale alla tabella Transazioni magazzino per visualizzare gli ultimi record aggiunti.
Un visualizzatore Web che mostri il grafico dei prezzi di magazzino per l'azienda
dell'utente.
Un pannello struttura a schede con schede per note sui clienti, appuntamenti e un
elenco di cose da fare (che richiederebbe la creazione di tabelle e altri schemi).
Se si desidera inserire un elemento in questo spazio, ridimensionarlo in modo che non sia più
largo del visualizzatore Web e del titolo e più alto dello spazio tra i bordi inferiori delle sagome
della schermata iPad (orizzontale) e iPad (verticale). Di fatto, dovrebbe essere di 30 pt inferiore
rispetto allo spazio disponibile, lasciando uno spazio di 15 pt sopra e sotto. Ancorare la parte
inferiore e il margine destro dell'elemento e posizionarlo dietro il visualizzatore Web e il titolo, in
modo che sia completamente nascosto, allineando il bordo inferiore dell'elemento al bordo
inferiore del visualizzatore Web. Con orientamento verticale dell'iPad, l'elemento scorrerà verso
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
31
il basso e verrà visualizzato sotto la mappa. Con orientamento orizzontale, rimarrà nascosto
dietro la mappa.
10. Accesso automatico al nuovo formato
Nella soluzione pronta per l'uso Voci di inventario, il file è configurato per eseguire uno script
"Trigger | Apri finestra iniziale" quando un utente apre il file. Lo script contiene una verifica della
piattaforma e accede a un determinato formato. Ora che è stato creato un dashboard per gli
utenti dell'iPad, modificare lo script cambiando la prima istruzione Vai al formato, dopo If
[ContaRicorrenze ( Get (VersioneApplicazione ) ; "iPad" )] per passare al nuovo formato.
Inoltre, come suggerito in precedenza, aggiungere un'istruzione per impostare il campo
Dashboard::DisponibilitàDashboard su "Riordine richiesto" o "In magazzino", a seconda di
quali prodotti si desidera che gli utenti visualizzino quando accedono per la prima volta al
formato Dashboard inventario iPad.
Se si sta utilizzando un altro file, assicurarsi di utilizzare un trigger di script
SuAperturaPrimaFinestra, in File > Opzioni file… > Trigger di script, e impostarlo in modo
che esegua uno script che verifichi la piattaforma, acceda al formato appropriato e imposti il
campo.
Revisione finale della soluzione
Una volta terminata la progettazione della propria soluzione, considerare la possibilità di
lavorare con un professionista nel campo della progettazione per una revisione finale,
ponendosi le seguenti domande:
•
•
•
•
Il progetto è equilibrato?
o Un lato della pagina è più ricco di contenuto o più scuro rispetto all'altro? E la
parte superiore e inferiore? Cambia da formato a formato? Se sì, aiuta la
comprensione della pagina da parte dell'utente o lo distrae?
o Si è ridotto il numero di colori solo a quelli che supportano le proprie
informazioni e/o il proprio marchio?
o Si è fatto un uso moderato di caselle e linee? Ve ne sono alcune che possono
essere sostituite con semplici spazi?
Si ha una gerarchia visiva chiara?
o Socchiudere gli occhi. Dove si posa per primo lo sguardo? Quali elementi
saltano all'occhio nella pagina? Si tratta degli elementi più importanti per le
principali attività che l'utente sta eseguendo?
o L'occhio segue un percorso chiaro attraverso la pagina? Questo corrisponde al
flusso di attività dell'utente?
La navigazione è coerente e facile da capire?
o Si sono utilizzati elementi simili allo stesso modo all'interno e tra i formati?
o Le icone e gli elementi dell'interfaccia utente derivano da altri software utilizzati
dagli utenti?
Le icone e il linguaggio nell'interfaccia utente sono chiari, coerenti e privi di errori di
grammatica?
Testare e distribuire la soluzione
Il momento di testare la soluzione è anche il momento in cui pensare a come verrà distribuita.
Verrà ospitata su FileMaker Server e gli utenti vi accederanno da remoto? È una soluzione
standalone da trasferire sul dispositivo di ciascun utente? Se sì, in che modo gli utenti
otterranno una copia? Attraverso un link in una pagina Web, in una e-mail, da un server? Per
informazioni sulla distribuzione, vedere la Guida di spiegazione FileMaker – Distribuzione
semplificata su iOS disponibile sul sito TechNet di FileMaker.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
32
APPENDICE – Acquisire familiarità con gli strumenti di progettazione di FileMaker
Se non si ha ancora familiarità con FileMaker Pro, è importante comprendere i principi di base
sull'uso degli strumenti e delle opzioni di progettazione disponibili in FileMaker.
Di seguito sono riportati gli strumenti e le opzioni di progettazione disponibili in FileMaker Pro
12; per ciascuno di essi è riportata anche una dimostrazione di esempio utilizzando la
soluzione pronta per l'uso FileMaker "Gestione dei contenuti":
o Temi
o Elaborazione del testo
o Riempimenti: sfondi con colore a tinta unita, gradienti e immagini
o Linee dei bordi e formattazione degli angoli
o Stati degli oggetti
o Icone ed elementi grafici
o Opzioni di accessibilità
Temi
FileMaker Pro 12 offre numerosi temi progettati in modo specifico per iPhone e iPad. Sono
chiamati temi "Aspetto" e comprendono sfondi coordinati, bordi, font, ombreggiature, e molto
altro ancora.
Scopriamo come temi diversi possano influenzare l'interfaccia grafica di una soluzione:
1. Avviare FileMaker Pro 12.
2. Selezionare File > Nuovo da soluzione pronta per l'uso…
3. Selezionare Gestione dei contenuti.
4. Selezionare Visualizza > Modo Formato scheda.
5. Selezionare Formati > Cambia tema…
6. Selezionare diversi temi dall'elenco Temi del formato per visualizzare un'anteprima di
ogni tema.
7. Selezionare uno qualsiasi dei temi contenenti la parola "Aspetto" per visualizzare i temi
progettati in modo specifico per iPhone e iPad. Prendere nota di quelli che piacciono di
più per applicarli quando si crea la propria soluzione al passo 4.
Figura 21: Il tema Onice è quello predefinito
della soluzione pronta per l'uso Gestione dei
contenuti.
Figura 22: Selezionando Aspetto Grigio freddo
viene applicato un tema progettato in modo
specifico per iPhone e iPad.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
33
Elaborazione del testo
È possibile scegliere tra numerose opzioni relative a font, dimensioni, stile, allineamento,
orientamento e colore del testo nella soluzione.
Per provare diverse opzioni di elaborazione del testo:
1. Selezionare Visualizza > Modo Formato scheda.
2. Selezionare Visualizza > Vai a formato > iPad > Dettagli contenuto | iPad.
3. Fare clic sull'elemento di testo <<Titolo>> per selezionarlo.
4. Selezionare Formattazione > Carattere, quindi selezionare il font desiderato.
In genere le soluzioni pronte per l'uso FileMaker utilizzano Helvetica Neue, un font
ben visualizzabile su iPad e iPhone.
Di seguito è riportato un breve elenco di font che è possibile utilizzare sui dispositivi:
• Helvetica Neue
• Verdana
• Gils Sans
• Times New Roman
• Georgia
• Courier New
5. Selezionare Formattazione > Dimensione, Stile, Allinea testo, Interlinea,
Orientamento e Colore testo per visualizzare tutti i diversi attributi di testo che è
possibile utilizzare.
Figura 23: Modifica della dimensione del testo
Riempimenti: sfondi con colore a tinta unita, gradienti e immagini
I riempimenti possono essere sfondi con colore a tinta unita, gradienti e immagini e possono
essere applicati a testo, pulsanti, campi, oggetti e molto altro ancora.
Per provare i diversi riempimenti, seguire le istruzioni di seguito:
1. Fare clic sull'elemento di testo <<Titolo>> per selezionarlo.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
34
2. Se la finestra Impostazioni non è già visualizzata sulla schermata, selezionare
Visualizza > Impostazioni (o utilizzare i tasti di scelta rapida Cmd+I o Ctrl+I).
3. Fare clic sulla scheda Aspetto.
4. Fare clic sull'elenco a discesa Riempimento nella sezione Grafico della finestra
Impostazioni.
Figura 24: Aggiunta di un colore di riempimento
5. Selezionare Colore a tinta unita per cambiare lo sfondo in un colore a tinta unita.
Fare clic sulla casella di selezione del colore sotto per scegliere il colore desiderato.
6. Selezionare Gradiente per visualizzarne l'effetto, quindi spostare i cursori e sfruttare
le altre opzioni per modificare l'aspetto del gradiente. Per un esempio, guardare i
pulsanti e le sezioni Intestazione nei temi Onice e Grigio freddo creati per ottenere
effetti diversi.
Utilizzare un contrasto maggiore tra i cursori sulla barra del gradiente per dare maggiore
profondità a barre degli strumenti e pulsanti; tuttavia, per gli sfondi sullo stesso oggetto del
formato, utilizzare un contrasto minimo tra i cursori di un gradiente lineare, o un gradiente
radiale con una distanza elevata tra il cursore iniziale e quello finale.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
35
Linee dei bordi e formattazione degli angoli
È possibile applicare colori, spessori e motivi diversi alle linee dei bordi che circondano testo,
pulsanti, campi, oggetti e molto altro ancora. È inoltre possibile modificare il raggio degli angoli
dei campi.
Per modificare le linee dei bordi e la formattazione degli angoli, seguire le istruzioni di seguito:
1. Fare clic sul campo Tipo per selezionarlo.
2. Aprire la finestra Impostazioni, se non è già visualizzata sulla schermata
3. Fare clic sulla scheda Aspetto.
4. Fare clic sull'elenco a discesa Linea nella sezione Grafico della finestra
Impostazioni.
Figura 25: Modifica dei bordi
5. Selezionare Nessuno, Continua, Tratteggiato e Punteggiato per visualizzare i
diversi effetti.
6. Modificare le dimensioni dei punti della linea per renderla più spessa o più sottile.
7. Fare clic sulla casella di selezione del colore per scegliere il colore delle linee dei
bordi.
8. Fare clic sulla serie di icone appena sotto per vedere in che modo le linee dei bordi
possono circondare completamente il campo o essere visualizzate solo sul bordo
sinistro, superiore, destro o inferiore.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
36
9. Per cambiare il raggio dell'angolo, modificare il valore nel campo Raggio
dell'angolo da 5 a 20 per vedere in che modo un valore più alto arrotonda gli angoli.
Selezionare valori diversi per visualizzare i diversi effetti.
Figura 26: Modifica degli angoli
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
37
Stati degli oggetti
Per fornire agli utenti un feedback visivo sulle azioni eseguite nel modo Usa, gli oggetti
possono essere formattati per visualizzare diversi attributi. Ad esempio, è possibile formattare
un pulsante in modo che visualizzi un colore di riempimento diverso (e altre opzioni di
formattazione, come un bordo diverso) quando viene premuto da un utente.
Per impostare lo stato di un oggetto:
1. Fare clic sul testo Elenco contenuti nell'angolo in alto a sinistra del formato.
2. Aprire la finestra Impostazioni, se non è già visualizzata sulla schermata.
3. Fare clic sulla scheda Aspetto.
4. Fare clic su Stato normale e selezionare Passaggio del mouse.
5. Selezionare un Riempimento con Colore a tinta unita, quindi scegliere il colore
desiderato. In alternativa, è possibile cambiare la luminosità del colore del 25%, o
aumentare lo spessore dei bordi di 1 o 2 punti e impostare un colore più luminoso.
Figura 27: Modifica dello stato di un oggetto
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
38
Figura 28: Il pulsante al passaggio del mouse
In questo modo il testo "Elenco contenuti" cambia colore quando un utente vi passa sopra con
il mouse nel modo Usa.
6. Scegliere tutte le diverse opzioni dall'elenco a discesa e provare a configurare
opzioni di formattazione differenti per ciascuna di esse:
a. Stato normale: l'oggetto è disponibile per l'utente, ma non è attualmente
selezionato.
b. Attivo: l'oggetto è stato attivato.
c. Passaggio del mouse: l'utente posiziona il puntatore sopra l'oggetto (solo Mac e
Windows, non iOS)
d. Premuto: si è fatto clic o si è toccato un oggetto, senza rilasciarlo.
Icone ed elementi grafici
Le icone permettono di risparmiare spazio e possono essere utilizzate con lingue diverse. Una
ricerca delle immagini su Internet mostra numerosi esempi di icone che rappresentano
un'azione particolare. Oltre alle icone, il logo di una scuola o di un'azienda aumenta il livello di
personalizzazione della soluzione e la contraddistingue per gli utenti. Detto questo, utilizzare
ovunque è possibile icone e immagini compatibili con le aspettative sul dispositivo in cui la
soluzione verrà principalmente utilizzata. Devono supportare le attività, semplificandone la
realizzazione, e non devono mai distogliere o allontanarsi dallo scopo della soluzione.
Inoltre, tenere presente che alcuni simboli di uso comune possono essere interpretati in modo
errato in alcuni contesti. Per evitarlo, testare le icone con un pubblico diverso.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
39
In genere le icone per iOS hanno una sorgente luminosa direttamente sopra il centro. Ad
esempio, di seguito sono riportate le icone di FileMaker Go per iPad e iPhone e l'icona
dell'applicazione Meteo di iOS:
Figura 29: Icone iOS con l'effetto di una sorgente luminosa in alto
Se si creano icone ed elementi grafici personalizzati, applicarvi gli effetti per imitare la sorgente
luminosa dall'alto.
Con un display Retina, tutti gli elementi grafici e le immagini devono avere una risoluzione
sufficientemente alta per non risultare sfocati. Tuttavia, tenere presente che maggiore è
l'immagine, maggiore è il tempo richiesto per caricarla. In genere, utilizzare immagini con
risoluzione a 144 DPI.
Posizionare le icone in una posizione simile in tutti i formati; gli utenti si aspettano che gli
elementi e gli oggetti azione vengano visualizzati in posizioni relativamente simili quando
passano da un formato a un altro. Anche se due formati hanno scopi e contengono dati
completamente diversi, la posizione simile dei pulsanti di navigazione, delle icone, ecc. aiuta
l'utente a comprendere ciò che sta visualizzando e a utilizzare in modo efficace la soluzione.
Esaminare diverse soluzioni pronte per l'uso FileMaker per esempi sul posizionamento delle
icone, sulla formattazione e sul ridimensionamento specifico per ciascun dispositivo. Inoltre,
Apple offre linee guida sulla creazione di immagini e icone personalizzate nella propria iOS
Developer Library.
Accessibilità
Per la maggior parte degli utenti, bloccare il livello di zoom su 100%, poiché ogni elemento è
stato ridimensionato per funzionare correttamente sul dispositivo. Gli utenti con problemi di
vista possono essere autorizzati a lavorare con la soluzione a un livello più alto di zoom; sarà
quindi necessario consentire lo zoom per questi utenti. Per impostare il livello di zoom e
bloccarlo o sbloccarlo, utilizzare l'istruzione di script Imposta livello di zoom e le relative
opzioni.
Può essere utile inserire una tabella di utenti nel sistema e segnare se per ciascuno di essi è
consentito lo zoom. Non appena un utente esegue l'accesso, uno script deve confrontare il
nome account con i nomi memorizzati nella tabella di utenti, quindi impostare il livello di zoom
e le opzioni in base alla configurazione memorizzata per l'utente.
In alternativa, il primo formato che tutti gli utenti visualizzano una volta eseguito l'accesso può
contenere un pulsante che gli utenti possono selezionare se preferiscono lavorare con lo zoom.
Naturalmente il pulsante deve essere formattato in modo da poter essere utile per gli utenti con
problemi di vista.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
40
Risorse
Letture consigliate che hanno contribuito alla stesura del presente documento:
•
•
iOS Human Interface Guidelines (Linee guida per interfacce umane per iOS)
Mobile First di Luke Wroblewski
Altre Guide operative di FileMaker che trattano diversi argomenti, tra cui la distribuzione delle
soluzioni, la sicurezza nei gruppi di lavoro e la sincronizzazione, sono disponibili per il
download su http://www.filemaker.com/it/technet/
Vi sono inoltre alcuni argomenti della Guida di FileMaker Pro in grado di aiutare l'utente a
eseguire le operazioni di seguito con gli oggetti del formato:
•
•
•
•
•
•
•
•
•
•
•
•
•
•
•
Selezionare gli oggetti
Utilizzare la finestra Impostazioni per formattare gli oggetti
Copiare, duplicare ed eliminare gli oggetti
Copiare gli attributi degli stili tra gli oggetti o le sezioni del formato
Spostare gli oggetti in un formato
Ridimensionare e cambiare la forma degli oggetti
Impostare le opzioni di ridimensionamento automatico per gli oggetti del formato
Impostare il riempimento, lo stile delle linee e i bordi sugli oggetti
Definire lo stato di visualizzazione per un oggetto
Riempire un oggetto o una sezione del formato con un gradiente
Riempire un oggetto o una sezione del formato con un'immagine
Formattare le immagini in un formato
Proteggere gli oggetti dalle modifiche
Assegnare nomi agli oggetti
Definire la formattazione condizionale per gli oggetti del formato
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
41
© 2012 FileMaker, Inc. Tutti i diritti riservati. FileMaker è un marchio di FileMaker, Inc., registrato negli
Stati Uniti e in altri Paesi. Il logo della cartella è un marchio di FileMaker, Inc. Tutti gli altri marchi sono di
proprietà dei rispettivi proprietari. Le specifiche e la disponibilità dei prodotti sono soggette a modifiche
senza preavviso.
IL PRESENTE DOCUMENTO VIENE FORNITO NELLO STATO IN CUI SI TROVA, SENZA ALCUNA
GARANZIA. FILEMAKER, INC., NON RICONOSCE ALCUNA GARANZIA, ESPRESSA O IMPLICITA,
COMPRESE LE GARANZIE DI COMMERCIABILITÀ E IDONEITÀ PER UNO SCOPO SPECIFICO E LE
GARANZIE DI NON VIOLAZIONE. IN NESSUN CASO FILEMAKER, INC., O I SUOI FORNITORI
POTRANNO ESSERE RITENUTI RESPONSABILI DI QUALSIASI DANNO, COMPRESI DANNI DIRETTI,
INDIRETTI, INCIDENTALI, CONSEGUENTI, PER PERDITA DI GUADAGNO, PUNITIVI O SPECIALI,
ANCHE SE FILEMAKER, INC., O I SUOI FORNITORI SONO STATI AVVISATI DELLA POSSIBILITÀ DI
TALI DANNI. IN ALCUNI STATI NON È CONSENTITA L'ESCLUSIONE O LA LIMITAZIONE DELLA
RESPONSABILITÀ. FILEMAKER HA IL DIRITTO DI APPORTARE MODIFICHE AL PRESENTE
DOCUMENTO, IN QUALSIASI MOMENTO E SENZA ALCUN PREAVVISO. IL PRESENTE DOCUMENTO
POTREBBE NON ESSERE AGGIORNATO. FILEMAKER NON È TENUTO AD AGGIORNARE LE
INFORMAZIONI IN ESSO CONTENUTE.
Guida operativa di FileMaker – Progettare soluzioni aziendali personalizzate per iPad e iPhone
42