Condividi tramite


Il presente articolo è stato tradotto automaticamente.

Windows Phone 7

Progettare applicazioni Windows Phone da vendere

Mark Hopkins

Buon design è più appena aggiungendo effetti visivi piuttosto all'applicazione dopo aver implementato tutte le funzionalità.È il processo di decidere come utenti interagirà con la tua applicazione, così come l'aspetto e la funzione.Esperienza utente svolge un ruolo enorme nel determinare come felice la gente sarà con la tua applicazione, così voi non dovrebbe lesinare su questo passaggio.Progettazione non dovrebbe essere un ripensamento.

Potrei essere che mostra mia età, ma mi ricordo quasi ogni classe di scienza del computer che ho preso, iniziando con una lezione sull'importanza della pianificazione vostri programmi prima inizio al codice.Abbiamo usato strumenti quali i diagrammi di flusso disegnati su carta reale con una matita reale (e di solito un grande cancellatore nelle vicinanze).Questo è stato perché il tempo del computer era costoso su quel vecchio hardware.Volevi essere sicuro che hai fatto il più delle volte che hai avuto.Tempo del computer è piuttosto a buon mercato al giorno d'oggi e ci sono strumenti stupefacenti, come Visual Studio ed Expression Blend, che lo rendono molto facile da ottenere qualcosa che sembra piuttosto buono fino e in esecuzione molto rapidamente.Di conseguenza, c'è una tendenza a sedersi e iniziare a codifica.In questo articolo, parlerò di spendere tempo davanti progettare l'applicazione in modo è possibile risparmiare tempo nella codificazione elaborare e raccogliere frutti nel mercato Windows Phone (windowsphone.com/marketplace).

Tratterò cosa significa progettare intenzionalmente il vostro app Windows Phone, che comprende il brainstorming, architettura dell'informazione, prototipazione, ricerca utente e iterazione, tutti prima di scrivere una sola riga di codice.Avrete anche notato alcuni degli strumenti disponibili per queste attività.

Perché progettare?

Sguardo attraverso i voti e recensioni sul mercato Windows Phone.Una delle lamentele coerente trovo in recensioni è quando un'applicazione non fare ciò che gli utenti si aspettano.Ho visto sbrigativa recensioni di due parole come "Non funziona", o, spesso, molto peggio.Alcuni di questi reclami sono validi e alcuni non lo sono.Potrebbe essere che il revisore non capisce come un'applicazione è destinata al lavoro.È che l'utente colpa o dell'applicazione?Ecco una rassegna direttamente dal mercato:

"L'interfaccia utente è terribile e corre veramente lento.È inutilizzabile".

Che la revisione potrebbe essere ambigua, ma penso che riflette il fatto che le persone non sono disposti a mettere un sacco di fatica in apprendimento complicate applicazioni su un telefono.Né sono disposti a spendere molto tempo dando dettagliato feedback.Chi può biasimarli?Un telefono cellulare è un dispositivo di uso casual.L'applicazione deve essere evidente e facile da usare.Con decine di migliaia di applicazioni disponibili, gli utenti sono difficilmente spendere molto tempo con uno che non danno loro il payoff che stai cercando, se che sta risolvendo un problema o essere intrattenuti mentre aspettano in linea presso la banca.

Perché non c'è molto spazio per elementi dell'interfaccia utente sullo schermo di un telefono cellulare, è necessario pensare davvero attraverso il modo in cui gli utenti interagiranno con la tua applicazione.Un'applicazione ben progettata, completa e facile da usare genererà vendite.Come scaricare le persone e rivedere la vostra applicazione nel mercato Windows Phone, quei grandi revisioni alimenteranno ulteriori download.

Principi di progettazione della metropolitana

Metro è il nome della filosofia progettuale che va in Windows Phone e in Windows 8.Molto è stato scritto su Metro, ma mi piacerebbe andare oltre i principi di design della metropolitana, brevemente, prima di entrare il processo effettivo di progettazione di un'applicazione.

  • Pulire, luce, aprire e veloce applicazioni dovrebbero essere facile da capire a colpo d'occhio.Essi dovrebbero essere altamente reattivi all'input dell'utente.Essi dovrebbero avere uno sguardo pulito e aperto con un sacco di spazio bianco.
  • Celebrare la tipografia parole sono comuni attraverso tutti i disegni di interfaccia utente, e il modo in cui appaiono fa la differenza.Tipo è bella.Non solo è piacevole per gli occhi, ma può anche essere funzionale.Il giusto equilibrio di peso e posizionamento può creare una gerarchia visiva.Inoltre, ben piazzato tipo può indirizzare gli utenti a più contenuti.
  • Vivo in moto Motion è vita e movimento porta Windows Phone alla vita.Dal vivo di piastrelle, transizioni e risposta all'input dell'utente legare tutto insieme.Le transizioni sono una parte importante della user experience design.Una buona transizione dà gli indizi di utente sul contesto nell'applicazione.
  • Contenuti, non Chrome gli utenti sono interessati a contenuto.Contenuto dovrebbe essere elevato e tutto altro ridotto al minimo.Rimuovendo tanto cromo possibile, si mettono il contenuto dentro il fuoco.Ciò è particolarmente importante su un piccolo schermo.Il contenuto è l'interfaccia utente e l'utente dovrebbe essere in grado di interagire direttamente con esso.La capacità di ridimensionare un'immagine utilizzando un pizzico gesto è un esempio di questa interazione diretta.
  • Autenticamente Digital Design esplicitamente per dispositivi palmari che utilizzano tocco, uno schermo ad alta risoluzione e forme semplificate di interazione.In altre parole, essere "autenticamente digitale". Non provate a simulare controlli analogici come manopole.

Il processo di progettazione

Se siete abbastanza fortunati a lavorare presso una società che ha un dipartimento di design, essere coinvolti designer all'inizio.Le applicazioni si raccoglieranno i vantaggi di lavorare con persone che capiscono la user experience design.Molti di voi probabilmente funziona in piccole imprese, però, o anche sviluppare apps phone come un'occupazione di lato per conto proprio, quindi dovrete gestire la progettazione voi stessi.Discutiamo il processo di progettazione, quindi è possibile includere queste pratiche come si crea il tuo capolavoro di Windows Phone.

Brainstorm essere creativi.Potete già avere un'idea su un'applicazione che si vuole costruire o si potrebbe essere cercando di venire con uno.In entrambi i casi, "brainstorming" ti aiuta a esplorare le idee che non potrebbe considerato.Ed è divertente!

Provare a riflettere con gli altri, se possibile.Se sei uno sviluppatore solitario creare applicazioni da soli, chiedere la vostra famiglia o un gruppo di amici per fare questo con voi.Ma essere consapevoli di questioni giuridiche che potrebbero sorgere se si utilizza l'idea di qualcun altro.Il punto di "brainstorming" è quello di generare idee come molti possibili.

Ho intenzione di assumere che hai familiarità con la meccanica di brainstorming.Ma solo per rivedere, qui ci sono alcune linee guida per il processo:

  • Annotare tutto.
  • Nessuna idea è troppo scandalosa in questa fase.
  • Impostare un limite di tempo per mantenere le cose in movimento.
  • Non ancora immersione profonda su qualsiasi cosa.

Vostra applicazione potrebbe aiutare le persone a realizzare un compito, o il suo scopo potrebbe essere per intrattenerli.In ogni caso, tu sei il narratore.Considerare queste domande per aiutare il seme tuo "brainstorming":

  • Che cosa farà l'applicazione?
  • Chi è l'applicazione per?
  • Come l'applicazione adatta nel mercato?
  • Dove e quando l'applicazione utilizzerà?
  • Che tipo di contenuto verrà visualizzato?
  • Come può l'applicazione sfruttare l'hardware?
  • Come funziona la vostra idea di app confrontare con applicazioni simili del mercato di Windows Phone e altri negozi di applicazione smartphone?

Dopo che siete capitati con una grande lista di idee, li filtrare attraverso un elenco di vincoli per aiutare a limitare il loro giù a qualcosa in realtà ti consente di creare.Vostre domande potrebbero includere:

  • Devo avere, o posso guadagnare, le competenze necessarie per realizzare la visione di questo app?
  • Riesco a sviluppare questa applicazione in un ragionevole lasso di tempo?
  • Io posso permettermi di sviluppare questo app?
  • Posso sfruttare le attività aggiuntive come servizi on-line?
  • Posso io partner con qualcuno di fare ancora meglio questo app?
  • C'è un sacco di infrastrutture necessarie per questo app?Ad esempio, un servizio di streaming media potrebbe essere un'idea impressionante, ma posso permettermi di risorse del server necessarie per scendere a terra un servizio del genere?

Se hai fatto un buon lavoro sulla "brainstorming", si dovrebbe avere una grande lista di idee, quindi probabilmente si dovrà essere molto critica per ottenere l'elenco fino a due o tre idee che si vuole veramente andare avanti.

Sketch e Wireframe progettare un prototipo comporta tirando insieme le vostre idee di brainstorming.Si potrebbe voler avviare valutando alcune applicazioni simili che sono già sul mercato.Si scoprirà probabilmente disegni di buoni e cattivi.Ciascuno offre buone opportunità per l'apprendimento.

Utilizzare una lavagna o carta e matita per spostare rapidamente.Stendere l'architettura di navigazione per la vostra applicazione.Designer chiamare questo l'architettura delle informazioni, anche se questo significa qualcosa di completamente diverso da quelle di noi nel mondo dell'editoria contenuto.Non importa che cosa si chiamano, questo passaggio può scoprire le incoerenze nel vostro disegno.Esso inoltre può ispirare le idee per fare la tua applicazione facile da usare.Ho fatto un rapido esercizio con alcune note appiccicose e mia lavagna (vedere Figura 1).Questo esempio è davvero semplice, ma che mostra come questo passaggio potrebbe apparire.Ogni nota adesiva rappresenta una pagina in un'applicazione dello shopping online.

Information Architecture PlanningFigura 1 architettura dell'informazione pianificazione

Il dettaglio qui non è importante; Ho disegnato su ciascuna di queste pagine in meno di un minuto.Il punto è davvero pensare attraverso il flusso e la navigazione della vostra applicazione.Note appiccicose sono grandi strumenti per deridere rapidamente le pagine di un'applicazione.E perché sono di dimensioni simili a uno schermo di telefono reale, può conferire loro la sensazione di un effettivo app.

Utilizzando una lavagna per stendere la navigazione lo rende facile da spostare pagine intorno e disegnare le connessioni senza investire troppo tempo.Questo esercizio rapidamente e, ovviamente, mostra dove ci sono buchi nella vostra interfaccia prevista.Essa vi contribuisce anche stimare quanto lavoro di codifica si potrai essere impresa per implementare la vostra visione.

Tentare di portare in altre persone e ottenere il loro feedback sulla vostra architettura dell'informazione, forse colleghe, o amici e membri della famiglia se stai lavorando sul proprio.Li camminare attraverso il design, ma cerco di non overexplain.Lo scopo e la navigazione della vostra applicazione dovrebbe essere ovvi; mantenere raffinazione fino a quando non è.

Prototipazione e utente ricerca volta sei soddisfatto con le pagine e la navigazione del vostro disegno, è il momento di creare un prototipo e iniziare a ricevere un feedback da parte degli utenti.

Il prototipo non deve essere un'applicazione funzionante.Prototipi di carta sono ottimi strumenti per creare rapidamente l'aspetto della vostra applicazione per presentare agli utenti per test di usabilità (vedere figura2).Naturalmente, se stai usando carta, è necessario aiutare l'utente a capire come funziona l'applicazione.Fare una ricerca di YouTube per "prototipo di carta" e troverete molti video che mostrano questo processo.

Paper PrototypeFigura 2 prototipo di carta

Una volta che avete un paio di prototipi, invitare gli utenti di provarli.Chiedere agli utenti di affermare i loro obiettivi all'interno di un'applicazione piuttosto che di formulare proposte specifiche su interfaccia utente o interazione.

Prova a rispondere alle seguenti domande sugli elementi funzionali della vostra applicazione:

  • È chiaro che cosa fa l'applicazione?
  • È chiaro come far funzionare esso?
  • Sono attività intuitiva in scopo e il funzionamento?

Questo può essere un processo incredibilmente potente e gratificante.Ho una volta guardato un team di progettazione di creare rapidamente nuovi disegni al volo, prima che il gruppo successivo di usabilità testare soggetti che si presentò anche.Hanno potuto testare diversi disegni in un solo giorno.Parlare di agile!

Iterare e raffinare continuare a perfezionare il vostro prototipo basato sul feedback degli utenti.Essere attenti a non farsi prendere nelle richieste degli utenti per più caratteristiche.Mentre alcuni feedback degli utenti possono segnalare ai problemi dell'interfaccia utente, la maggior parte dovrebbe essere assorbita olisticamente.Mantenere l'applicazione mirata e minimal.

Una volta che voi avete raffinato vostro disegno a qualcosa ti piacerebbe AP­ment, mossa al computer.Considerare l'utilizzo di uno strumento di prototipazione come SketchFlow (microsoft.com/expression/products/Sketchflow_Overview) per iniziare a creare prototipi dei disegni reale della pagina.Sono abbastanza dettagli così non avrete bisogno di prendere decisioni durante la codifica su:

  • Elementi visivi: Tipografia e contenuto presentato chiaramente, in modo leggibile e brevemente sono?Il display è visivamente accattivante?Tema risorse per Windows Phone (msdn.microsoft.com/­library/ff769552(VS.92)) rendono più facile per aderire ai principi di progettazione di Metro, come pure le preferenze dell'utente, fornendo valori predefiniti per le proprietà come pennelli, colori e font.
  • Elementi di controllo: Sono controlli di dimensioni e distanziati per tocco facile operazione?Si noti che in Visual Studio, gli strumenti della casella degli strumenti sono già a tema della metropolitana.
  • Elementi di personalizzazione: Hanno accuratamente riprodotto colori e loghi?Tutta l'arte è compatibile con i diritti d'autore?

Assicurarsi che si implementano tutti gli elementi necessari per ricreare le interazioni tracciata nel corso di prototipazione.Confermare che i compiti e le operazioni di guardare e flusso correttamente basato sul vostro precedenti test di usabilità.

Il grafico di semplice flusso di lavoro in Figura 3 visivamente rappresenta il processo di progettazione che ho descritto.

The Design ProcessFigura 3 il processo di progettazione

Strumenti di progettazione

Ora dovrebbe essere ovvio che non hai bisogno di investire in un sacco di costosi strumenti per fare un buon lavoro di progettare la vostra applicazione.Le probabilità sono che si sono alcuni di questi strumenti disponibili adesso.

  • Carta e matita: L'originale design tools, ancora potente.
  • Sticky notes: Si tratta di "tele" grande per i disegni di pagina del telefono.
  • Videocamera: Per test di usabilità di registrazione e la creazione di animazioni stop-motion dei vostri disegni di condividere con colleghi, amici, la famiglia.
  • Windows Phone SDK 7.1: Download gratuito (bit.ly/snlph6) che include Visual Studio 2010 Express per Windows Phone, la Windows Phone emulatore ed Expression Blend per Windows Phone.
  • SketchFlow: Consente di disegnare rapidamente su disegni funzionale in Expression Blend.

Resources

Ci sono molte risorse online che possono aiutare durante la progettazione di applicazioni Windows Phone.La seguente documentazione risorse immersione negli argomenti discussi qui molto più dettagliatamente:

  • Utente esperienza Design Guidelines per Windows Phone (wpdev.ms/wpuxguide)
  • Progettare le risorse per Windows Phone (wpdev.ms/dsnrsrcs )
  • Microsoft .toolbox (wpdev.ms/designtb)
  • I post del blog di Alfred Astort (wpdev.ms/alfreddesign)
  • PhotoShop Design Templates per Windows Phone (wpdev.ms/dsntemplates)

Non si sa mai dove ispirazione potrebbe venire da, quindi ingresso è importante.I seguenti utenti di Twitter tweet spesso su design utile e interessante e temi di ricerca utente:

Il confezionamento di

Una volta che il vostro disegno è finalizzato, è il momento di iniziare la codifica.Perché è stato fatto tutto il lavoro di progettazione davanti, sarete liberi di concentrarsi sulla logica necessaria per implementare la funzionalità si hai già verificato attraverso test di usabilità.Questo processo vi farà risparmiare tempo perché non dovrete verrà ristrutturato la vostra applicazione di implementazione.E perché si sarà già testato l'applicazione con utenti reali, sarete più probabilità di finire con buone recensioni sul mercato Windows Phone.

il SDK di Windows Phone tenta di set up per il successo con controlli con temi e modelli di Visual Studio che includono le intestazioni, le risorse del tema e così via.Hai ancora bisogno di fare il lavoro intellettuale di fronte, ma gli strumenti verranno aiuterà a creare un bel app Metro, una volta che si sposta alla fase di implementazione.

Questo articolo è solo la punta dell'iceberg, quando si tratta di progettare.Spero che ho suscitato il vostro interesse e vi hanno aiutato a considerare come questo processo può sollevare la qualità della vostra prossima applicazione Windows Phone.Un ben progettato app crea un ciclo di feedback sul mercato di Windows Phone che porta a più downloads e aumentare le vendite.Investire più pensiero nella progettazione di applicazioni e può essere successo.

Mark Hopkins è uno scrittore di programmazione senior sul Team Windows Phone Developer Documentation. È stato impiegato in Microsoft dal 1992 lavorare susviluppatori prodotti tra cui il supporto di sviluppatore, Visual C++, MFC, Windows Platform SDK, Internet Explorer SDK, Tablet PC SDK, superficie SDK e WindowsPhone SDK.

Grazie ai seguenti esperti tecnici per la revisione di questo articolo: Robert Lyon, Cheryl Simmons e Matt Stroshane