App di produttività

Windows 8.1 è una piattaforma straordinaria per le app di produttività. Oltre al tradizionale ambiente desktop che consente il funzionamento ottimale delle app di produttività, il nuovo ambiente per le app di Windows Store consente di realizzare tipi di app di produttività completamente nuove e moderne. Vi mostreremo vari modi di migliorare le app di produttività sfruttando i vantaggi offerti dalla progettazione Microsoft e dalle funzionalità di Windows 8.1.

Panoramica

Windows 8.1 offre il supporto ineguagliato di un'intera gamma di dispositivi, dai tablet basati su input tocco e input penna ai laptop e PC desktop ad alta risoluzione. Per le app di produttività, questa è un'opportunità unica di usare input diversi che assicurino la produttività degli utenti in svariati scenari e casi di utilizzo.

Windows Store offre inoltre opportunità per la distribuzione, la promozione e la vendita delle tue app. Sono supportati scenari come acquisti in-app e versioni di prova con interventi minimi di scrittura di codice, che ti permetteranno di iniziare a guadagnare rapidamente.  

Questo argomento evidenzia le nuove funzionalità di Windows 8.1 particolarmente importanti per le app di produttività, tra cui:

  • App di Windows Store: un nuovo linguaggio di progettazione per app, che mette in evidenza la creazione di contenuto a schermo intero e scenari di produttività Immersive. Windows passa in secondo piano, lasciando totalmente spazio al contenuto.
  • Riquadri animati: ottimizzano l'impegno e inducono gli utenti a ritornare alla tua app grazie alla possibilità di creare riquadri animati che mostrano il contenuto su cui l'utente ha lavorato di recente. Anche i riquadri secondari facilitano il collegamento diretto al contenuto e consentono agli utenti di aggiungere alla tua app il contenuto che usano più frequentemente.
  • Contratto Share: Windows 8.1 facilita la condivisione e la collaborazione da app ad app, così che la tua app possa interagire con altre app per consentire agli utenti di fare tutto ciò che è necessario per favorire la produttività.
  • Contratto Search: questa nuova funzionalità di alto livello del sistema operativo aiuta gli utenti a individuare e organizzare il contenuto più facilmente di quanto sia mai stato possibile. La tua app è inclusa nei risultati della ricerca per aumentarne la visibilità quando gli utenti ricercano il contenuto
  • Casella di ricerca: consente agli utenti di cercare contenuto nella tua app e prevede una visualizzazione personalizzata dei risultati.
  • Selezione file: consente agli utenti della tua app di produttività di usare file, documenti e foto dal file system e da altri servizi e app che aderiscono ai contratti di selezione file.
  • Zoom semantico: questa funzionalità nativa di Windows 8.1 consente agli utenti di avvicinare le dita e fare zoom indietro dal dettaglio di un'app e ottenere una vista complessiva del contenuto e degli elementi su cui stanno lavorando. Prova a usarlo nella schermata Start per vedere come funziona.
  • Finestre ridimensionabili: gli utenti possono ridimensionare le app in modo da eseguirne diverse affiancate simultaneamente. In questo modo possono operare in multitasking e rimanere sempre produttivi con la tua app.

Schermo intero

Uno dei vantaggi più evidenti delle app di Windows Store per la produttività è che non si contendono lo spazio con altre applicazioni o con l'interfaccia utente di Windows. Un'app tende a usare ogni singolo pixel visibile sullo schermo per presentare il contenuto. Tutti gli elementi dell'interfaccia utente non essenziali o dispersivi possono essere nascosti e ricomparire con un semplice gesto, così che l'app abbia sempre ampio spazio per visualizzare le informazioni più importanti sull'attività in corso. La filosofia di progettazione di “anteporre il contenuto ai riquadri”, così piacevole e gradevole in un'app video o lettore di riviste, viene applicata anche alle app di produttività. Una volta rimosse le distrazioni, è più facile concentrarsi sull'uso del contenuto presentato dall'app.

Quando progetti un'app di produttività, identifica prima di tutto l'attività di base dell'utente. Usa quinti ogni pixel dello schermo per fare in modo che l'app esegua al meglio esattamente quell'attività. Pensa come la disponibilità di più spazio possa rendere quell'attività più facile, veloce e gradevole. Pensa a versatili visualizzazioni di informazioni interessanti e fruibili, anziché alla rappresentazione statica dei dati. Considera in che modo puoi usare lo spazio e il posizionamento della tua app per rappresentare un concetto. Molte delle convenzioni e dei controlli in uso oggi sono stati sviluppati quando gli schermi dei computer desktop avevano una risoluzione inferiore a quella degli attuali smartphone. Le app di Windows Store offrono la possibilità di ridefinire il modo in cui gli utenti interagiscono, analizzano e manipolano le informazioni per completare un'attività.

Le app di produttività prevedono in genere un'interessante combinazione di scenari di creazione di contenuti e di utilizzo di contenuti. Ad esempio, le app di produttività possono essere usate per la creazione e la lettura di documenti o per la creazione e la gestione di elenchi di attività. Le app di produttività variano inoltre ampiamente per complessità nel modo di gestire l'esplorazione e di esporre comandi ed esperienze—da app semplici e leggere di cose da fare ad app avanzate e complesse per la creazione di contenuti con menu a più livelli che includono una miriade di opzioni. Un'eccellente app di produttività per Windows 8.1 consente l'esplorazione tra queste esperienze in modo rapido, fluido e piacevole.

Layout ed esplorazione nelle app di produttività

Il modello di esplorazione che scegli deriva dai tipi di scenari supportati dalla tua app. Se la tua app contiene più esperienze avanzate, che presentano ad esempio più documenti, con un'organizzazione e una struttura che le collega, un modello gerarchico può essere utile per fare in modo che tutto il contenuto sia disponibile al livello superiore anziché essere nascosto in menu o schede. Se tuttavia la tua app non è caratterizzata da un'alta densità di contenuto o da scenari che richiedono una gerarchia e una struttura, considera un modello semplice che consenta agli utenti di navigare in modo efficiente tra le esperienze della tua app. Le app con visualizzazioni "master/dettagli", ad esempio le app di e-mail e messaggistica, potrebbero usare una visualizzazione elenco per )presentare il contenuto in modo ottimale. Per alcune app di produttività, certi scenari potrebbero richiedere tipi input di dati diversi, ad esempio moduli, e per queste può essere usato il layout modulo suggerito più avanti in questo articolo. Scegli il modello più adatto ad assicurare che gli utenti trovino in modo rapido e pratico il contenuto che desiderano.

Per informazioni sui modelli di esplorazione disponibili per le app, vedi Modelli di esplorazione.

Per una dimostrazione pratica, vedi l'argomento Modello di esplorazione semplice incluso nella serie Funzionalità dell'app dall'inizio alla fine.

Modello gerarchico

Le app di produttività con una struttura gerarchica e un set di dati esteso, ad esempio le app delle note con numerosi blocchi appunti e note, possono usare un modello gerarchico che presenti tutto il contenuto dell'utente al livello superiore. Questo modello risulterà soddisfacente per gli utenti, in quanto avranno tutto il contenuto a portata di mano.

Pagina hub della tua app

La pagina hub è costituita da diverse sezioni, ognuna delle quali è mappata alle diverse sezioni della tua app. Ogni sezione può esporre contenuti o funzionalità. L'hub deve essere visivamente vario per coinvolgere gli utenti e condurli nelle diverse parti dell'app. Ad esempio, l'app delle note seguente mostra alcune delle note più recenti per ogni blocco note direttamente al livello superiore. L'immagine seguente mostra un esempio di pagina hub.

Esempio di pagina hub

Con un semplice tocco, l'utente può accedere direttamente alla nota desiderata. Un tocco sull'intestazione (ad esempio "Travel - NYC") consente di visualizzare la pagina della sezione relativa a quel blocco appunti, se a tale blocco note è associato più contenuto di quello visibile nella home page,

Considera la possibilità di lasciare che gli utenti scelgano come ordinare il proprio contenuto. Ad esempio, possono scegliere di ordinarlo alfabeticamente, per data, per tipo o in base allo stato di condivisione. Il metodo di ordinamento giusto dipende dal contenuto presentato dalla tua app e dal modello di utilizzo abitualmente scelto dagli utenti. L'immagine seguente mostra un esempio di ordinamento delle note.

App di esempio con ordinamento delle note

Barra superiore dell'app

Con la barra superiore dell'app puoi permettere agli utenti di passare lateralmente tra le varie sezioni della tua app. Ad esempio, un utente che legge una nota in un blocco appunti può passare in modo rapido e immediato a una nota di un altro blocco appunti usando la barra superiore dell'app. Nell'immagine seguente è illustrata una barra superiore dell'app visualizzata in un'app di note quando l'utente scorre rapidamente dal bordo superiore o inferiore.

App di blocchi note con intestazione a discesa¾

Zoom semantico

Lo zoom semantico consente agli utenti di spostarsi rapidamente all'interno di un'unica visualizzazione, mostrando informazioni diverse in base al livello di zoom. Ad esempio, in un'app di note gli utenti possono rapidamente avvicinare le dita e fare una panoramica per passare da un blocco appunti a un altro. In alternativa, se gli utenti scelgono di visualizzare le note per data, possono passare rapidamente dalle note più recenti a quelle meno recenti.

Questa immagine mostra il raggruppamento del contenuto quando l'utente fa zoom indietro

Contenuto raggruppato per titolo nello zoom semantico.

Lo zoom semantico può essere usato anche nella pagina di una sezione o categoria specifica per esplorare il relativo contenuto. Ad esempio, nell'app di note gli utenti possono usare lo zoom semantico per passare rapidamente tra le diverse note nello stesso blocco appunti.

Per altre info sullo zoom semantico, vedi Linee guida per lo zoom semantico.

Modello di layout semplice

Se la maggior parte del contenuto della tua app è allo stesso livello e con una gerarchia limitata, considera l'uso di un sistema di esplorazione semplice. Questo modello consente agli utenti di spostarsi tra documenti, pagine, schede o modalità che si trovano allo stesso livello gerarchico in modo rapido e fluido. Per altre informazioni sul modello semplice, vedi Progettazione dell'esplorazione per app di Windows Store.

Se inoltre la tua app presenta scenari che possono trarre vantaggio da un'interfaccia a documenti multipli, il modello semplice è ottimo per questo scopo. La barra superiore dell'app permette di passare rapidamente da un contesto all'altro. Ad esempio, in un'app per la creazione di fogli di calcolo il modello semplice può permettere il passaggio rapido tra i diversi fogli di calcolo che l'utente sta usando.

Per alcune app puoi scegliere di includere altre funzionalità nella barra superiore dell'app, ad esempio un pulsante "+" per la creazione di un nuovo foglio di calcolo direttamente nella barra superiore dell'app. Puoi vedere un esempio nel browser (un'app di Windows Store) illustrato qui.

Browser con funzionalità di esplorazione aggiuntive.

Modello di layout elenco

Se la tua app di produttività prevede scenari basati sul concetto di visualizzazione "master/dettagli", dove la selezione di un elemento determina ciò che viene visualizzato in un riquadro di dettagli, considera la possibilità di usare un layout elenco per il riquadro master. Ad esempio, un'app per la gestione di progetti potrebbe mostrare attività cardine e scadenze in un riquadro master e, alla selezione di un elemento in questo riquadro, visualizzare i dettagli corrispondenti nella sezione dei dettagli. Un'app di e-mail può avere la posta in arrivo a sinistra e il riquadro di lettura sul lato destro dello schermo, come mostrato qui.

App di e-mail con layout elenco

Modelli di layout modulo

Gli scenari nelle app di produttività richiedono spesso un layout modulo, in cui gli utenti devono immettere le informazioni richieste. Ad esempio, quando si crea una convocazione di riunione in un'app calendario, gli utenti devono immettere l'ubicazione, l'ora di inizio e di fine, la data, i partecipanti e altre informazioni analoghe. Questo tipo di layout usa in genere un insieme di tipi di controlli diversi e offre le migliori prestazioni con una progettazione basata su colonne.

Quando decidi quale layout modulo usare, considera il flusso dell'attività che l'utente dovrà completare e in quale punto del flusso sarà richiesto lo scorrimento Lo scorrimento aumenterà sensibilmente quando la tastiera virtuale è visibile, perché la tastiera occupa il 50% dello spazio disponibile sullo schermo con l'orientamento orizzontale. Anche le notifiche di errore incorporate, quando sono visualizzate, aumentano la lunghezza del contenuto e la necessità dello scorrimento.

Anziché tentare di inserire tutti i controlli in un modulo molto lungo, considera di suddividere l'attività in una sequenza di diversi moduli.

Un layout con una singola colonna può funzionare nel caso di moduli, brevi o lunghi, a scorrimento verticale. Nel seguente esempio di layout con una singola colonna, l'ordine di lettura e tabulazione è dall'alto in basso e da sinistra a destra.

Esempio di layout modulo.

Un layout modulo con due colonne ottimizza lo spazio visibile orizzontale con l'orientamento orizzontale. Per ridurre al minimo la necessità di scorrimento, imposta l'ordine di lettura e di tabulazione da sinistra a destra e dal basso in alto.

L'immagine seguente mostra un layout con due colonne.

Modo corretto di disporre il contenuto in un layout con due colonne.

Non usare un ordine di lettura dall'alto in basso e da sinistra a destra per un layout con due colonne, lungo e a scorrimento. Questa impostazione è molto scomoda perché l'utente deve scorrere fino in fondo la prima colonna, quindi ritornare all'inizio della seconda colonna e scorrere di nuovo verso il basso per compilare tutto il modulo. Un layout con due colonne non funziona inoltre nel modo ottimale con l'orientamento verticale perché le colonne diventano troppo strette.

L'esempio seguente mostra come evitare un layout con due colonne, lungo e a scorrimento.

Modo scorretto di disporre il contenuto in un layout con due colonne

Esplorazione del contenuto di un'app di produttività

Le app di produttività comportano spesso l'uso del multitasking, dove gli utenti passano alternativamente tra i vari tipi di contenuto all'interno dell'app. Ad esempio, durante lo svolgimento di un'attività un utente può passare tra più documenti, come i risultati di una ricerca e i compiti fatti in precedenza. Consentendo agli utenti di accedere rapidamente a tutto il contenuto in modo rapido e fluido ne ottimizzerà la produttività all'interno della tua app. Valuta la possibilità di usare la barra superiore dell'app descritta in Progettazione dell'esplorazione per app di Windows Store per i documenti usati di recente, i documenti attualmente aperti e qualsiasi tipo di contenuto presente nella tua app che sia pertinente per l'attuale sessione di lavoro dell'utente. Valuta inoltre se supportare più finestre in modo che gli utenti possano operare in multitasking con diverse parti della tua app. Per altre informazioni, vedi Linee guida per le finestre multiple.

Esecuzione di comandi

Le app di produttività tendono ad avere molti più comandi rispetto ad altri tipi di app. Questo fatto pone una serie di domande interessanti sul modo migliore di presentare i comandi affinché siano facilmente individuabili ma dando sempre la precedenza al contenuto dell'utente. Gli utenti devono poter completare agevolmente gli scenari di base della tua app — gli scenari che facilitano l'identificazione della “specificità” della tua app — usando semplicemente il pannello Canvas dell'app. Quando possibile, permetti agli utenti di modificare il contenuto direttamente nel canvas invece di aggiungere comandi che agiscano sul contenuto. Ad esempio, quando gli utenti leggono un documento, fai in modo che possano avvicinare e allontanare le dita direttamente sul canvas per aumentare o ridurre le dimensioni del carattere della visualizzazione invece di inserire un controllo a questo scopo. Per ulteriori informazioni sui comandi, vedi Modelli d'uso dei comandi.

Alcuni comandi e pulsanti sono talmente funzionali alla tua app che sarebbe ridicolo non averli sempre visibili sullo schermo. Il pulsante Play in un'app video in pausa, ad esempio, non sarà probabilmente mai nascosto. Tuttavia, la maggior parte dei comandi non deve essere sempre visibile. Per consentire agli utenti di concentrarsi sul contenuto per migliorare la produttività, è possibile rimuovere dallo schermo molti comandi dispersivi e visualizzarli di nuovo solo quando necessari con un semplice gesto comune.

La barra inferiore dell'app è la barra degli strumenti comune che può visualizzarsi lungo il bordo inferiore della tua applicazione. Di solito è fuori dallo schermo e in secondo piano, ma può essere visualizzata facendo scorrere rapidamente un dito dal lato inferiore o superiore dello schermo, facendo clic con il pulsante destro del mouse o premendo il tasto logo Windows+Z sulla tastiera. Inoltre, la barra inferiore dell'app appare automaticamente nel caso di una selezione all'interno di un contenuto dell'app. Gli strumenti presentati nella barra inferiore dell'app sono contestuali, quindi vengono sempre visualizzati solo i comandi pertinenti. Ad esempio, se viene selezionata una parola, la barra inferiore dell'app appare automaticamente con i comandi di formattazione del testo. Se invece viene selezionata un'immagine, sulla barra inferiore dell'app saranno presenti i comandi per la modifica delle immagini. La natura contestuale della barra dell'app significa che l'utente non viene distratto da comandi non pertinenti. In questo modo, gli strumenti che desideri sono sempre a portata di mano, ma in secondo piano finché non servono.

La barra superiore dell'app può essere visualizzata anche quando richiami manualmente le barre dell'app. Permette all'utente di spostarsi in diverse posizioni di un'applicazione. Ad esempio, un browser può usare questa barra per visualizzare le anteprime delle schede aperte. Un'app di elaborazione di testo può usare questa barra per passare da un documento aperto a un altro. Un'app di shopping può usare questo spazio per passare tra i diversi reparti di un negozio

Sia la barra superiore che quella inferiore dell'app possono includere pulsanti e menu. Se hai molti comandi correlati tutti contestualmente pertinenti simultaneamente, è utile inserirli in un menu che viene aperto dalla barra.

Barra inferiore dell'app

È importante organizzare e presentare i comandi in un modo coerente e organizzato per evitare di opprimere gli utenti con un numero eccessivo di comandi. Ad esempio, in un'app delle note, gli utenti possono voler creare nuove note o blocchi note, ordinare i blocchi note alfabeticamente o per data, cambiare le opzioni di formattazione per il testo delle note, inserire note audio,specificare la posizione e aggiungere tag e immagini. La barra dell'app consente di collocare i comandi della tua app su una superficie uniforme e prevedibile per gli utenti, in modo che possano avere la certezza di trovare tutti i loro comandi in un'unica posizione

Per la tua app, compila un inventario di tutti i comandi e determina gli scenari di utilizzo. Un modo per ridurre il numero di comandi che appaiono sulla barra dell'app consiste nell'organizzarli in due categorie: comandi globali per l'app e comandi utili solo in caso di selezione Nel secondo caso, non visualizzare sempre i comandi contestuali sulla barra dell'app, ma solo quando l'utente ha effettuato una selezione o solo nel contesto dell'app quando sono pertinenti.

Inserisci i comandi globali che appaiono ovunque nell'app, come le operazioni di sincronizzazione e “Crea nuovo”, sul lato destro della barra dell'app. In particolare, inserisci il comando Nuovo—quello che crea nuovo contenuto come una nuova nota o un blocco appunti nuovo— lungo il bordo destro della barra. In tal modo, ogni comando Nuovo, indipendentemente dall'app o dal contesto specifico, occuperà la stessa posizione e sarà facilmente accessibile per l'input tocco usando i pollici.

Usa i comandi Elimina e Nuovo se l'app gestisce singole entità che possono essere permanenti all'esterno dell'applicazione specifica—ad esempio in un'app di e-mail Elimina e Nuovo devono apparire sempre nell'ordine visualizzato qui.

Pulsanti Elimina e Aggiungi; Elimina a sinistra, Nuovo a destra

Usa i comandi Rimuovi e Aggiungi se la tua app gestisce un elenco, ad esempio un elenco di attività. Rimuovi e Aggiungi devono apparire sempre nell'ordine visualizzato qui.

Pulsanti Rimuovi e Aggiungi; Rimuovi a sinistra, Aggiungi a destra

Esistono altri comandi che influiscono sulle selezioni. Questi devono sempre essere visualizzati all'estrema sinistra, sia i comandi contestuali che appaiono in caso di selezione che i comandi che influiscono su una selezione esistente, come le opzioni di formattazione, "Seleziona tutto" e "Cancella selezione".

Determina quali comandi sono correlati funzionalmente e devono essere posizionati uno accanto all'altro. Fai in modo di posizionare i comandi in modo coerente, se possibile. Crea inoltre set di comandi per gestire il numero di comandi che appaiono sulla barra dell'app e valuta la possibilità di creare menu per i set di comandi, se possibile. Ad esempio, in un'app delle note, la disposizione delle note in ordine alfabetico o per data può essere effettuata tramite un singolo comando usando un menu di comandi. I menu di comandi facilitano l'organizzazione e riducono il numero di comandi sulla barra dell'app, come illustrato qui. Nella prima immagine ogni comando Nuovo è un comando distinto sulla barra dell'app. Nella seconda immagine tutti i comandi Nuovo sono raggruppati in un menu sul singolo comando Nuovo.

Esempio della posizione in cui appaiono i comandi sulla barra dei comandi.

Comandi con riquadro a comparsa sulla barra dell'app

Verifica che le impostazioni siano visualizzate nel contratto Impostazioni e non nella barra dell'app. Questo permetterà agli utenti di configurare la tua app con un meccanismo comune che conoscono già.

Estensione delle barre dell'app

Entrambe le barre dell'app possono includere pulsanti e menu. Se hai molti comandi correlati tutti contestualmente pertinenti simultaneamente, è utile inserirli in un menu che viene aperto dalla barra. Le barre dell'app bar non sono limitate a pulsanti e menu: permettono entrambe di creare controlli personalizzati unici. In questo caso, pensa a come ottimizzare l'interazione degli utenti tramite tocco, mouse o tastiera con i nuovi controlli creati.

Nelle app con un numero elevato di comandi puoi valutare l'opportunità di estendere la barra dell'app in vari modi. Per mantenere la massima coerenza possibile con il resto del sistema, prova a seguire queste linee guida:

  • Mantieni l'utente concentrato sul contenuto—Presumi che la maggior parte delle interazioni inizia con la manipolazione diretta del pannello Canvas. È prevedibile che la maggior parte dei comandi, se non tutti, sia normalmente fuori dallo schermo senza alcuna affordance visibile per portarli in primo piano. Usa i gesti validi a livello di sistema per mostrare e nascondere la barra dell'app per mostrare e nascondere la tua interfaccia utente. L'aggiunta della tua interfaccia utente alternativa e nascosta con metodi di chiamata diversi ti indurrà ad aggiungere più pulsanti widget e frecce sullo schermo mentre tenti di b istruire l'utente. L'uso dei gesti di sistema ti consente di evitare di aggiungere distrazioni sullo schermo che sottraggono l'attenzione dell'utente dal contenuto.
  • Mantieni i comandi nella barra inferiore dell'app. Nelle app di Windows Store la posizione naturale e prevista per i comandi è lungo il bordo inferiore dell'app (appena al di sopra della tastiera virtuale). Questa posizione permette agli utenti che usano il tocco di interagire con i comandi senza bloccare la visualizzazione del contenuto. Questa posizione è inoltre correlata al movimento tocco usato per mostrare i comandi manualmente. Il raggruppamento dei comandi in un'unica posizione è meno prevedibile e interferisce potenzialmente con il contenuto con cui l'utente sta tentando di interagire o che desidera visualizzare.
  • Mantieni i controlli di spostamento nella barra superiore dell'app. Nelle app di Windows Store la posizione naturale e prevista per i controlli di spostamento è il bordo superiore dello schermo. Poiché questa barra serve per spostarsi dal contenuto che l'utente sta usando, è normale che la mano dell'utente impedisca la visualizzazione dello schermo mentre usa la barra. La barra superiore dell'app in genere visualizza miniature anziché pulsanti, in modo da distinguersi dalla barra inferiore dell'app.
  • Mantieni tutti i comandi nascosti sulla barra dell'app— Tutti i comandi nascosti fuori dallo schermo devono essere nascosti nella stessa posizione. I gesti di sistema offrono un modo semplice e standard per portare i comandi nascosti in primo piano. Se i comandi sono nascosti in diverse posizioni, dovrai usare più modi per richiamare queste superfici nascoste. Questo comportamento crea un numero eccessivo di posizioni che l'utente deve controllare per trovare i comandi. Peggio ancora, ogni superficie può essere nascosta dietro un gesto segreto o un altro elemento dell'interfaccia utente e gli utenti avranno difficoltà a scoprire dove si trovano.

Per i comandi degli Appunti, come Taglia, Copia e Incolla per il testo selezionato e i comandi per copiare e aprire collegamenti per gli URL, puoi usare i menu di scelta rapida, forniti per impostazione predefinita dal sistema. Ecco alcuni esempi di comandi degli Appunti in un menu di scelta rapida.

Comandi degli Appunti in un menu di scelta rapida.

Input di dati nelle app di produttività

Le app di produttività possono comportare numerosi scenari di input dei dati. Ad esempio, la creazione di un elenco di attività o un altro nuovo documento, la modifica di un foglio di calcolo esistente o la creazione di un invito nel calendario richiedono tutte un'operazione di input. Rendere l'immissione dei dati più veloce e fluida possibile consente agli utenti di svolgere il proprio lavoro in modo più rapido ed efficiente.

Esamina i tuoi scenari e, se possibile, riduci la quantità di testo che gli utenti devono immettere nel sistema. Le strategie per ottenere questo risultato sono:

  • Controlli comuni—Per l'input molto formattato o che richiede la convalida (come data, ora o posizione), usa i controlli comuni come il controllo di selezione, gli elenchi a discesa, i pulsanti di opzione e i controlli di selezione ora.
  • Completamento automatico—Usa il completamento automatico ogni volta che è possibile per dare un aiuto immediato all'utente. Questo migliorerà l'efficienza dell'utente nella fase di input.

L'immagine seguente illustra i suggerimenti relativi alla selezione contatti.

Suggerimenti in una selezione indirizzi di e-mail

Tastiera virtuale

Progetta la tua app in modo che funzioni correttamente con le tastiere seguendo le linee guida in Risposta all'input tastiera. progetta la tua app in modo che funzioni correttamente con la tastiera virtuale seguendo queste linee guida:

  • inserisci i controlli per l'input di testo verso la parte superiore del pannello Canvas della tua app, se possibile, in modo che il contesto o l'area visibile per l'utente non cambi quando appare la tastiera virtuale.
  • Se l'input di testo è tale per cui non può essere completamente inserito nella parte superiore del pannello Canvas, quando l'utente tocca o passa tramite TAB al controllo di input di testo, l'app scorre automaticamente fino al punto in cui appare il controllo in modo che l'utente possa vedere il testo mentre lo immette. La finestra deve scorrere in modo che ci siano minimo 30 pixel tra il controllo con lo stato attivo e il bordo dello schermo e la parte superiore della tastiera virtuale, per lasciare spazio per vari gesti del bordo, per gli elementi dell'interfaccia utente e per la barretta verticale di ridimensionamento della selezione testo. per altre informazioni sulla selezione testo, leggi Linee guida per la selezione di testo e immagini.
  • Non mantenere visibile la tastiera semplicemente per il gusto di visualizzarla sullo schermo. Se non si prevede che venga immesso del testo, nascondi la tastiera impostando il campo di input su sola lettura o spostando lo stato attivo.

uno sguardo alla tastiera virtuale.

La tastiera virtuale è un'app

Se la tua app presenta una schermata di tipo modulo dove solitamente si trova una combinazione di controlli di modifica (caselle di testo) e altri controlli (come pulsanti di opzione e caselle di testo), lasciare che la tastiera virtuale continui a essere alternativamente visualizzata e nascosta avrebbe un impatto negativo sull'esperienza utente. Windows 8 risolve questo problema impedendo che la tastiera virtuale venga chiusa quando un utente sta usando un modulo e si sposta tra alcuni controlli comuni come i pulsanti di opzione, le caselle di testo, i controlli di selezione e la barra dall'app. L'uso di controlli standard consente di conferire gratuitamente alla tua app un'esperienza fluida. Questa illustrazione mostra come la tastiera virtuale rimanga visibile mentre l'utente passa da un controllo all'altro.

Modulo con controlli standard.

Controllo ortografico

Abilita il controllo ortografico per la tua app. Aiuterà gli utenti e immettete il testo in modo rapido e pratico. (Il controllo ortografico può essere abilitato tramite il controllo RichEdit). Quanto l'utente digita una parola che non è disponibile nel dizionario e quindi preme la barra spaziatrice, sotto la parola con l'errore di digitazione appare una sottolineatura ondulata di colore rosso. Toccando la parola sottolineata viene richiamato il menu del controllo ortografico in cui l'utente può correggere l'errore o ignorarlo, come illustrato qui.

Esempio di esperienza di controllo ortografico

Input penna e riconoscimento della grafia

Poiché gli utenti tendono a usare più metodi di input di testo per le app di produttività, valuta la possibilità di supportare metodi alternativi per immettere testo, ad esempio l'input penna. Se abiliti l'immissione del testo tramite l'input penna, gli utenti potranno scarabocchiare le loro note e i documenti all'interno della tua app e saranno in grado di immettere il testo rapidamente e in modo naturale usando una penna. Per altre informazioni sui vari metodi di input disponibili, vedi Linee guida per interazioni utente comuni.

Selezione del testo

In molti scenari di produttività, inclusi la creazione e l'uso di documenti, gli utenti hanno l'esigenza di selezionare il testo. Abilita quindi la selezione del testo digitato dagli utenti, in modo che possano modificarlo. Il testo proveniente da altri utenti comprende il testo del corpo dei messaggi e-mail e altro testo soggetto alla copia. Qui è illustrata un'esperienza di selezione del testo.

Esempio di selezione del testo che mostra una parola selezionata tra due aree di selezione

Quando abiliti la selezione del testo, imposta un margine pari a metà della larghezza della barretta verticale di ridimensionamento (4 millimetri) ai lati del testo e pari all'altezza della barretta (8 millimetri) nella parte inferiore dell'area, se il testo non è scorrevole. Questa impostazione assicura che le barrette verticali di ridimensionamento non verranno toccate in alcun caso e non interferiranno con l'esperienza utente in corrispondenza del bordo dello schermo. L'immagine seguente mostra i margini corretti ma mantenere quando abiliti la selezione del testo.

Esempio di dimensioni dei margini per la selezione del testo tramite tocco

Tipografia nelle app di produttività

L'uso della gamma di dimensioni e la griglia della tipografia nelle app di produttività consentono di creare una gerarchia visiva attraverso sui gli utenti possono analizzare e usare una grande quantità di informazioni in modo facile e rapido. Anche se l'uso del tipo di carattere Segoe UI specificato nella gamma di dimensioni e formati previsti è appropriato per il contenuto nelle app di produzione, puoi considerare di usare Calibri, l tipo di carattere consigliato per i "documenti moderni" oppure Cambria, che è consigliato per i "documenti tradizionali". Calibri è il tipo di carattere sans-serif predefinito in Microsoft Office e Cambria è il tipo di carattere serif predefinito, quindi entrambi i tip di carattere sono intrinsecamente associati alle app di produttività. Per altre informazioni sugli elementi tipografici, vedi Linee guida per i tipi di carattere.

Se decidi di specificare tipi di carattere di sistema alternativi, assicurati di verificare che vengano installati con Windows 8 e che non richiedano l'installazione di un'applicazione distinta, come Microsoft Office. Se usi i tuoi tipi di carattere personalizzati o in licenza, assicurati di avere diritti legali sufficienti per includerli nella tua app. Indipendentemente dai tipi di carattere che scegli, la gamma di dimensioni e formati previsti di Windows 8 offre ottime indicazioni sul numero massimo di dimensioni e stili che devi usare.

L'aspetto e il comportamento dell'interfaccia utente di Windows 8 richiedono l'uso dell'iniziale maiuscola nelle intestazioni, che ti consigliamo di applicare per le app di produttività. L'uso delle iniziali maiuscole nei titoli può tuttavia risultare appropriato anche in alcuni casi. L'uso di testo tutto in lettere minuscole può apparire troppo informale in un'app di produttività, mentre il testo tutto i lettere maiuscole può involontariamente ricordare alle persone il tono irritato nei messaggi e-mail. Tieni presente che questi ultimi comportamenti tipografici non saranno trasferiti a molte lingue localizzate. Assicurati inoltre di usare in modo coerente gli stili che applicano l'iniziale maiuscola; usali per fare distinzione tra le diverse parti di contenuto, non sono per aggiungere un effetto visivo alla tipografia della tua app.

Usando un set limitato di dimensioni dei caratteri in tutta l'app, come consigliato nelle indicazioni sulle gamma di dimensioni e formati previsti, si conferisce un senso di strutturazione e ritmo al contenuto. Se più elementi nella tua app usano le stesse dimensioni dei caratteri della gamma di dimensioni e formati previsti e trasmettono tuttavia diversi tipi di informazioni, considera l'uso del colore e il peso del carattere per definire una gerarchia delle informazioni.

Contratti

I contratti sono il collante che lega le applicazioni di Windows Store tra loro e con l'interfaccia utente del sistema. Due app che hanno implementato lo stesso contratto possono lavorare insieme per completare uno scenario ampio o complesso. Per un elenco completo dei contratti per le app, vedi Contratti ed estensioni delle app.

Share

La condivisione di contenuti è un componente chiave delle app di produttività ed esistono molti scenari interessanti per la condivisione in e dalle app di produttività. Se vuoi consentire agli utenti di condividere contenuto dall'app, l'app deve essere un'origine di condivisione. Se vuoi consentire all'app di usare dati di altre app, l'app deve essere una destinazione di condivisione.

Condivisione dall'app

Poiché la produttività riguarda spesso la creazione di contenuto, gli utenti solitamente lo condividono con altri e Windows 8.1 offre un'esperienza senza problemi per la condivisione tra app. Man mano che l'utente ottiene nuove app, questa interoperabilità accresce la portata del contenuto della tua app a un'ampia gamma di possibilità.

Ad esempio, gli utenti potrebbero voler condividere gli elenchi delle attività e della spesa con i familiari usando un'app dei contatti, condividere i documenti con i colleghi usando un'app di collaborazione oppure condividere le loro creazioni sui blog usando un'app di blog, per citare solo alcuni degli scenari di condivisione possibili. Queste catture di schermate mostrano alcuni metodi di condivisione nelle app di produttività.

Condivisione in un'app di produttività

Condivisione via posta in un'app di produttività

Impostare un'app come origine di condivisione significa rendere il relativo contenuto, sia che si tratti di URI, bitmap, HTML, testo, elementi di archiviazione o tipi di dati personalizzati, disponibile ad altre app che possono usare questi formati. Nell'app di origine è importante supportare il maggior numero possibile di tipi di dati significativi per il contenuto che vuoi far condividere agli utenti. In questo modo, gli utenti possono condividere il contenuto della tua app con un ampio insieme di app di destinazione della condivisione.

Con il supporto del contratto Condivisione origine, consenti inoltre alla tua app di condividere direttamente il contenuto con dispositivi in prossimità near field, tramite Tocco e invio.

Condivisione nell'app

Le app di produttività in genere sono ottime destinazioni per la condivisione di contenuto da altre app perché la creazione di contenuto inizia spesso con l'uso del contenuto. Se la tua app è una destinazione di condivisione, i tuoi utenti possono importare direttamente il contenuto, senza doverlo salvare o copiare e incollare. Esistono molti scenari interessanti per l'uso delle app di produttività come destinazione di condivisione. Ad esempio, la condivisione di URL, frammenti di testo, foto dal browser e contenuto da un libro può essere indirizzata a un'app per la creazione di documenti come fonte di riferimento per un'attività. Per fare un altro esempio, gli utenti possono condividere i tagliandi da un'app tagliandi nell'elenco della spesa nella tua app delle cose da fare. Queste catture di schermate mostrano esempi di un'app come destinazione di condivisione. Puoi anche immaginare una maggiore interoperabilità tra una suite di applicazioni di produttività che si basano sulla condivisione reciproca di dati mediante il contratto Condivisione.

Condivisione di una pagina Web come nota in un'app delle note.

Condivisione di una pagina Web come nota in un'app di note

La ricerca costituisce uno scenario importante per le app di produttività e la tua app potrebbe dover visualizzare una grande quantità di dati come risultati della ricerca. Puoi usare il controllo casella di ricerca di Windows 8.1 per integrare l'interfaccia utente per la ricerca nel canvas. La casella di ricerca è integrata con il contratto di ricerca per migliorare le prestazioni e consentire personalizzazioni avanzate. In questo modo, la tua app può offrire esperienze di ricerca su misura per le esigenze degli utenti.

Quando progetti l'esperienza di ricerca della tua app, tieni presente quanto segue:

  • Fornisci suggerimenti per le query per consentire agli utenti di completare automaticamente le query di ricerca e accelerare l'operazione evitando di dover digitare l'intera stringa di ricerca.
  • Fornisci i filtri di ricerca per la visualizzazione dei risultati.
  • Mostra la query di ricerca nella visualizzazione di risultati.
  • Visualizza il numero totale di risultati provati.
  • Mantieni lo stato della tua app, in modo che gli utenti possano ritornare all'attività che stavano svolgendo prima della ricerca.
  • indica perché un risultato corrisponde alla ricerca.
  • Considera di visualizzare suggerimenti sui risultati per permettere agli utenti di ottenere rapidamente il risultato più pertinente. Selezionando un suggerimento sui risultati, l'utente dovrebbe poterne visualizzare i dettagli. Limita il numero di suggerimenti a cinque. Un breve elenco è più facile da analizzare per gli utenti.

Per altre info sul controllo casella di ricerca, vedi Aggiornamenti delle funzioni di ricerca.

Questa cattura di schermata mostra l'uso della ricerca in un'app delle note.

Ricerca in un'app delle note

Trova nella pagina

Insieme alla ricerca, nelle app di produttività è comune anche lo scenario "Trova nella pagina". Considera ad esempio di trovare tutte le istanze di una parola in un determinato documento. Non usare il pulsante di accesso rapido Cerca per implementare la funzionalità Trova nella pagina per la tua app; implementala invece all'interno della barra dei comandi dell'app, non nel riquadro di ricerca. Trova nella pagina consente agli utenti di individuare tutte le istanze nella visualizzazione corrente. Evidenzia i risultati della ricerca nel documento e mostra i pulsanti "Avanti" e "Indietro" nella barra dell'app per consentire all'utente di passare rapidamente tra le diverse istanze della parola o di una frase trovata. Nelle app di produttività, la funzionalità Trova viene spesso usata soprattutto per completare l'esperienza di sostituzione. Trova è sempre limitata alla visualizzazione corrente, come illustrato qui.

Esperienza Trova nella pagina.

Impostazioni

Tutte le impostazioni applicabili alle app di produttività, come le impostazioni relative alla privacy, alle notifiche e alle preferenze di visualizzazione, dovrebbero far parte del pulsante di accesso rapido Impostazioni. Il pulsante di accesso rapido Impostazioni offre all'utente un unico punto in cui modificare le impostazioni e impedisce inoltre che l'interfaccia utente dell'app diventi ingombra di impostazioni. Per altre informazioni sulle impostazioni, vedi Linee guida per le impostazioni dell'app.

Dispositivi

La stampa di documenti e note è uno scenario comune nelle app di produttività. Metti a disposizione degli utenti la funzionalità di stampa tramite il pulsante di accesso rapido Dispositivi per un'esperienza di stampa senza problemi. Qui è illustrata l'esperienza di stampa per i dispositivi.

Esperienza di stampa per i dispositivi.

Quello dei dispositivi può essere un contratto interessante da collegare alla tua app di produttività. Se nell'app sono presenti molti contenuti multimediali e potenziali scenari di presentazione, gli utenti potrebbero volerli visualizzare sulla TV in esperienze multimediali condivise, cosa che possono fare grazie all'integrazione della tua app con il contratto Dispositivi.

Selezione file

Le app di produttività possono includere numerosi scenari interessanti per l'uso di contenuto da altre app. Tramite selezione file la tua app può accedere ai file e alle cartelle dell'utente sul PC locale, sui dispositivi di archiviazione connessi, nel gruppo Home e in altre applicazioni che implementano un contratto di selezione file. In questo modo gli utenti possono inserire contenuto da altre app nella tua, arricchendo l'esperienza per i tuoi utenti. Ad esempio in un'app delle note, l'utente potrebbe voler inserire una foto dall'app per la gestione di foto o note audio da un'app di registrazione suoni.

La tua app può anche personalizzare vari aspetti della selezione file. In particolare:

  • Modalità selezione file. Puoi impostare la modalità della selezione file in base alla tua attività. Selezionare file, salvare un file e selezionare una cartella sono tutte operazioni supportate nella selezione file. Se si consente all'utente di selezionare, ad esempio, una cartella sarà in grado di selezionare un'intera cartella da caricare in un percorso di archiviazione cloud.
  • Modalità di visualizzazione. Quando è richiesto all'utente di scegliere una foto o un video, puoi personalizzare la selezione file in modo da mostrare i file nella modalità di visualizzazione anteprime. Per tutti gli altri tipi di file, usa la modalità di visualizzazione riquadri.

Inoltre, il contenuto della tua app di produttività può essere significativo per gli utenti in altri contesti e la possibilità di accesso a questo contenuto da altre app rende disponibili potenti scenari per i tuoi utenti. I contratti di selezione file offrono l'opportunità di rendere disponibile il contenuto della tua app in altre app di Windows 8. Questo consente agli utenti di accedere al loro contenuto dalla tua app senza dover passare attraverso un processo intermedio, come il salvataggio preliminare di tali file nel computer locale. Se le app consentono questa esperienza, gli utenti possono selezionare la tua app dall'elenco di percorso nella selezione file Quando viene selezionato il contenuto della tua app diventa accessibile agli utenti tramite una visualizzazione delle selezione file specifica per la tua app e controllata da te.

La funzionalità selezione file rende possibili alcuni scenari interessanti. Ad esempio, se un utente desidera inviare per e-mail ad alcuni amici una nota creata nella tua app delle note, può allegare il contenuto direttamente dall'app delle note anziché salvarlo prima localmente.

La selezione file consente inoltre il salvataggio diretto nella tua app. Questa funzionalità abilita inoltre scenari realmente interessanti. Ad esempio, un utente può salvare un messaggio e-mail o un altro elemento creato in un'altra app direttamente nella tua app come una nota. Ecco come è possibile personalizzare la selezione file.

Componenti che possono essere personalizzati

Connessione e animazioni

Le app eseguite in Windows 8.1 dovrebbero integrare esperienze e comportamenti che ne mettono in evidenza la specificità Grazie all'uso di riquadri, notifiche, roaming e contratti, la tua app si inserirà senza problemi nell'ecosistema di Windows 8.1.

Riquadri e notifiche

La visualizzazione di contenuto sempre aggiornato e personalizzato nel riquadro dell'app ricatturerà l'attenzione degli utenti e continuerà ad attirarli verso la tua app quando avranno l'opportunità di osservare la presenza di contenuto interessante nel tuo riquadro. Gli scenari considerati interessanti includono la visualizzazione di notifiche di riquadro quando qualcuno aggiorna un documento condiviso, condivide una nuova nota con l'utente o modifica l'elenco della spesa o aggiunge nuovi elementi. Una notifica può anche mostrare la posizione di un punto di interesse, come in questo esempio.

Riquadri con notifiche

Consentendo agli utenti di aggiungere riquadri secondari per accedere rapidamente alle note e al contenuto preferiti, potranno vedere le notifiche personalizzate per quel contenuto e, di nuovo, essere attirati dalla tua app.

Per le app di produttività con scenari di promemoria soggetti a limiti di tempo—ad esempio un elenco di attività per effettuare un pagamento a fine mese—gli utenti potrebbero voler associare promemoria e date di completamento alle attività. Valuta la possibilità che possano visualizzare notifiche di tipo avviso popup pianificate per l'ora in cui l'utente desidera ricevere il promemoria. Per le notifiche di tipo avviso popup mancate è consigliabile visualizzare il promemoria anche nel riquadro, come illustrato qui.

Riquadri con notifiche mancate

In Linee guida ed elenco di controllo per le notifiche di tipo avviso popup puoi trovare altre informazioni sulle procedure consigliate relative alle notifiche di tipo avviso popup. in Linee guida ed elenco di controllo per i riquadri puoi trovare altre informazioni sulle procedure consigliate per i riquadri.

Roaming

la maggior parte delle persone dispone di più PC che eseguono Microsoft Windows. Configurando la tua app in modo che fornisca un'esperienza utente uniforme su tutti i PC con Windows dell'utente, potrai assicurare il livello di esperienza che l'utente si aspetta. Puoi eseguire il roaming delle impostazioni dell'app, delle info sull'ultima operazione eseguita dall'utente nella tua app e di qualsiasi altra preferenza nella tua app che ritieni utili per gli utenti in tutti i loro PC. In Linee guida per il roaming dei dati dell'applicazione sono disponibili altre informazioni sulle procedure ottimali per il roaming.

Orientamento e dimensioni delle finestre

Poiché Windows 8.1 viene eseguito su vari tipi di dispositivi e prevede un nuovo modello di multitasking, assicurati che la tua app supporti gli orientamenti verticale e orizzontale e che funzioni bene in qualsiasi dimensione, fino alla larghezza minima.

Quando progetti la tua app di produttività per Windows 8.1, tieni conto di tutte le visualizzazioni dell'app, come le diverse risoluzioni dello schermo e le dimensioni dei dispositivi. Con Windows 8.1 è facile adattare la progettazione includendo nella tua app una maggiore quantità di contenuto per i dispositivi più grandi. Ecco un'app di note ridimensionata con un layout alto e stretto.

Visualizzazione verticale in un'app delle note

I layout alti e stretti e l'orientamento verticale sono ideali per la lettura e il consumo di grandi quantità di contenuto. Assicurati che il contenuto della tua app si adatti alle dimensioni della finestra.

Quando un utente ridimensiona l'app, il contesto e lo stato non devono andare persi. Questo aspetto è particolarmente importante nelle app di produttività, in cui gli utenti si sono impegnati a lungo per produrre contenuto. Preserva l'input di testo, la posizione di scorrimento e le eventuali selezioni effettuate dall'utente quando l'app viene ridimensionata.

Quando la larghezza dell'app è ridotta, il controllo della barra dell'app rimuove automaticamente le etichette e riduce la spaziatura tra i comandi. Se i comandi sono numerosi, puoi scegliere di visualizzarli in diversi modi creativi. Usa ad esempio due righe di comandi sulla barra dell'app oppure imposta i riquadri a comparsa sui comandi. Per altre informazioni, vedi Linee guida per le barre dell'app.

Pensa inoltre agli scenari in cui la tua app offre valore aggiunto e cerca di ottimizzarli. Dimostra agli utenti perché la tua app interagisce perfettamente con altre app. Ad esempio, è facile immaginare che un'app per prendere appunti o per creare elenchi venga usata con altre app. Quando si eseguono attività di ricerca o creazione, è normale tenere un'app di riferimento o analisi sullo schermo accanto all'attività principale. Le app di questo tipo sono molto utili a larghezze ridotte, perché l'utente può farvi riferimento mentre esegue altre attività. Pensa a tutte le volte in cui la tua app non sarebbe ingrandita su un desktop tradizionale. Questi sono gli scenari che l'app dovrà supportare quando viene ridimensionata su una larghezza ridotta.

Se progetti la tua app in modo che funzioni bene a larghezze ridotte, potrai aumentare il tempo di permanenza dell'app sullo schermo e coinvolgere gli utenti per periodi più lunghi. Ecco un esempio di app di note affiancata al browser.

app di note a larghezza ridotta

Presentazione delle app di Windows Store

Linee guida per l'esperienza utente delle app di Windows Store