Progettazione per Apple Watch linee guida di progettazione

Apple Watch offre un nuovo mezzo per comunicare con gli utenti. L'utilizzo di un'app su un dispositivo indossabile è molto diverso rispetto all'utilizzo sullo smartphone. Per guidare i creatori di app nel loro viaggio verso la realizzazione di una buona app Apple Watch, Apple ha rilasciato le linee guida sulla progettazione per aiutarli a progettare una buona esperienza di app. In questo articolo, diamo uno sguardo a queste linee guida.

Filosofia del design

Per progettare buone applicazioni per Apple Watch, è importante capire la filosofia di design che Apple aveva in mente quando ha progettato l'Apple Watch. Apple consiglia di tenere presenti le seguenti basi.

Le interazioni più leggere e personali sono il fondamento del design Apple per Apple Watch.

leggero

A causa delle dimensioni dello schermo e della potenza operativa limitate, Apple Watch dovrebbe essere utilizzato principalmente come dispositivo per supportare le interazioni veloci.

Personale

Un dispositivo non è mai stato così vicino a noi. Apple sottolinea di essere consapevole e di tenere a mente la stretta connessione mentre progetta un'app Apple Watch.

interazioni

Esistono quattro modi distinti in cui un utente può utilizzare i gesti per navigare in un'applicazione:

  • Un tocco attiva un evento basato sull'azione.
  • I movimenti verticali scorrono la schermata corrente (un utente può anche usare la corona digitale per scorrere).
  • I passaggi orizzontali visualizzano la pagina precedente o successiva in un'interfaccia basata su pagina.
  • I margini del lato sinistro tornano a una schermata principale in un'interfaccia gerarchica.

Forza tocco

Quando un utente fa pressione sulla schermata Apple Watch, rileva forza e visualizza una sovrapposizione di menu per la schermata corrente. Ad esempio, nell'app allarme, Forza tocco viene utilizzato per aggiungere un nuovo allarme.

Feedback aptico

Un modo unico per dare un feedback agli utenti per Apple Watch è fornire feedback tattile. Esistono diversi tipi di aptica, ciascuno dei quali trasmette un significato specifico come successo, insuccesso o clic.

Componenti dell'app

Apple offre una gamma di opzioni per interagire con un'applicazione, tra cui notifiche, sguardi e complicazioni.

notifiche

A sinistra: breve sguardo. Giusto: Long Look.

C'è una distinzione tra un aspetto corto e un aspetto lungo. Quando un utente riceve una notifica e alza il polso, prima vede un breve sguardo. Un breve sguardo è composto da un titolo, il nome dell'app e l'icona dell'app.

Viene visualizzato un aspetto lungo quando un utente continua a guardare la notifica anziché abbassare il polso dopo vedendo il breve sguardo. L'area del contenuto per un aspetto lungo è dinamica, ma la struttura generale della notifica non lo è. È possibile aggiungere pulsanti a un aspetto lungo per rendere la notifica utilizzabile.

sguardi

Un'occhiata è una singola schermata a cui un utente può accedere senza dover aprire un'app. Questo viene fatto scorrendo verso l'alto sulla schermata principale. Non tutte le app hanno bisogno di un'occhiata dato che sono uno schermo unico e informativo. Un utente sceglie quali sguardi desidera aggiungere al suo Apple Watch. In generale, ci sono alcune regole da tenere a mente durante la progettazione di uno sguardo.

  • Un'occhiata dovrebbe essere veloce e facile da leggere.
  • Un'occhiata dovrebbe essere contestualmente rilevante e non solo un lanciatore di app. Ad esempio, per un'app stock, visualizzerai i prezzi di mercato più recenti.
  • Contenuto d'occhio allineato a sinistra. Questo è uno standard per tutti gli sguardi e mantiene la gerarchia visiva coerente.

complicazioni

Esempi di complicazioni. Da sinistra a destra: immagine piatta, ad anello e pila di grandi dimensioni.

Una complicazione aggiunge informazioni specifiche dell'app al quadrante di un utente. I quadranti sono personalizzabili e quindi le complicazioni visualizzate su un quadrante sono diverse. Ad esempio, ci sono anche complicazioni modulari grandi e piccole e modelli circolari. Le complicazioni sono disegnate usando i modelli, il che significa che c'è una personalizzazione limitata in termini di design.

Puoi saperne di più sulle famiglie e i modelli di complicanze nelle Linee guida dell'interfaccia umana. Le complicazioni sono opzionali.

Informazione architettura

In generale, esistono due tipi di modelli di navigazione che si adattano alle tue esigenze:

  • navigazione basata su pagina
  • navigazione gerarchica

Navigazione basata sulla pagina

Una navigazione basata su pagina è più adatta per una raccolta di informazioni piatta. L'app è composta da un numero di singole pagine. Un utente può scorrere orizzontalmente tra le pagine (e in verticale per visualizzare più contenuti su una singola pagina). Si consiglia di limitare il numero di pagine per mantenere la navigazione scorrevole per gli utenti.

Navigazione gerarchica

Una navigazione gerarchica fornisce una gerarchia. Il design più comune è avere una pagina di elenco e una pagina di dettaglio. Si consiglia di avere solo due o tre livelli di gerarchia.

Avvisi e fogli di azione

Un esempio di un foglio di azione

Così come ci sono avvisi e fogli di azione in una tipica app per dispositivi mobili, puoi anche utilizzare questo tipo di navigazione in un'app Apple Watch. Le linee guida generali qui sono di usare gli avvisi con parsimonia, usare messaggi succinti e offrire sempre la possibilità di ignorare un avviso.

Design dell'interfaccia

Al fine di rendere le linee guida di progettazione dell'interfaccia utente più digeribili, ho riepilogato le regole più importanti di seguito.

  • Un Apple Watch è disponibile in due dimensioni, 38 mm e 42 mm. Lo stesso contenuto dovrebbe essere visualizzato, indipendentemente dalle dimensioni del display, utilizzando il dimensionamento relativo.
  • In generale, elementi allineati a sinistra. Il testo allineato a sinistra è molto più facile da leggere e le app di Apple Watch applicano questa regola in modo coerente.
  • Le app hanno sempre uno sfondo nero per creare l'illusione che ci sia uno schermo senza bordi.
Un rettangolo arrotondato è un motivo di progettazione utilizzato per i pulsanti.
  • Evitare l'uso del colore come unico modo per mostrare l'interattività, il rettangolo arrotondato è un motivo di progettazione coerente per i pulsanti.
  • È possibile definire un colore di tinta globale per agire come colore principale del marchio. Assicurati che i colori scelti per un'applicazione siano leggeri per garantire leggibilità e contrasto con lo sfondo nero.
  • Non includere una schermata di avvio in quanto rallenta le velocità di interazione.
  • Apple Watch supporta sequenze di immagini animate e animazioni di apparizioni, ma in genere non aggiungono valore alla tua app.

Tipografia

Apple usa SF Compact come font di sistema su Apple Watch. Esistono due varianti (dimensioni in punti basate su immagini di 144px / pollice):

  • SF Testo compatto per etichette il cui testo è di 19pt o inferiore
  • SF Display compatto per etichette il cui testo è 20pt o più grande

È possibile aggiungere una tipografia personalizzata, ma non è consigliabile. Tipo dinamico è molto utile su Apple Watch, quindi usare il font di sistema è spesso la migliore soluzione di design.

Apple offre stili di tipo built-in standard che vanno dai titoli alle note a piè di pagina per ridurre la necessità di tipografia personalizzata.

Costruzioni

Due blocchi di commutazione

Per semplificare la creazione di app Apple Watch, Apple fornisce una serie di elementi di interfaccia, che puoi utilizzare come blocchi predefiniti per creare la tua app. Di seguito trovi una breve lista di quelli che puoi usare. Ogni elemento dell'interfaccia ha il proprio insieme di linee guida. Puoi saperne di più su queste linee guida nella sezione risorse qui sotto.

  • testo statico (etichette)
  • immagini
  • gruppi (combina immagini ed etichette, per esempio)
  • raccoglitori (manipolati con la corona digitale)
  • tavoli
  • pulsanti
  • interruttori
  • cursori
  • mappe
  • film
  • etichette data e timer
  • menu

risorse

Apple fornisce risorse di progettazione che è possibile utilizzare. Puoi accedervi dal sito Web Guildeines di Apple Interface.

Inoltre, per un'indicazione delle esatte dimensioni dei pixel necessarie per l'iconografia e le immagini di complicazioni, Apple offre una panoramica delle linee guida dell'interfaccia umana.

Infine, per saperne di più sulle linee guida specifiche per i diversi elementi costitutivi per creare la tua app di Apple Watch, puoi saperne di più nella sezione Elementi dell'interfaccia delle linee guida per l'interfaccia umana di Apple.

Conclusione

Attenendosi alle linee guida di progettazione di Apple per Apple Watch, ti assicuri che la tua app sia comprensibile per gli utenti di Apple Watch. Allo stesso tempo, con la tipografia e gli elementi costitutivi esistenti, è possibile creare fantastiche app Apple Watch senza personalizzazione.

Se vuoi saperne di più sulle linee guida di progettazione, visita le linee guida di Apple Human Interface per Apple Watch. Se avete domande, lasciatele nei commenti qui sotto o contattatemi su Twitter. Grazie per il tuo tempo.