Tutto quello che avresti sempre voluto sapere sulla prototipazione (ma avevi paura di chiedere)

I prototipi sono la mia struttura per l'apprendimento di nuovi strumenti, piattaforme e tecniche. Un prototipo funziona come prova concreta che un'idea funzionerà o non funzionerà. È al centro del mio intero processo creativo ed è il mezzo che utilizzo per relazionarmi con le persone e le aziende con cui collaboro.

Sono entusiasta dei prototipi perché penso che possano fare miracoli , ma penso anche che non ottengano il dovuto. La prototipazione di solito non è affatto incorporata nelle linee temporali del progetto o, se lo è, di solito come risultato tangenziale di un progetto più ampio. Può essere di più se vuoi che lo sia!

Voglio convincerti a integrare la prototipazione in modo più approfondito nel tuo flusso di lavoro. Questo modo di affrontare i progetti potrebbe cambiare il modo in cui collabori, impari e cresci come persona creativa. Ecco il problema: proverò a mettere su carta una buona definizione, e poi analizzerò come puoi rendere la prototipazione tanto importante per la tua pratica quanto lo è per la mia . E per addolcire il piatto, fornirò alcuni prototipi che ho creato per un gioco che ho realizzato, Melody Jams, che è stato presentato da Apple in 130 paesi ed è stata l'app per bambini numero uno nel negozio per un breve periodo.

Che cos'è un prototipo?

La definizione classica di prototipo è che è una demo in scala di una cosa in scala reale che vuoi realizzare. Un prototipo potrebbe essere parzialmente costruito o progettato per mostrare una caratteristica particolare di un sistema più grande. Questa è una definizione abbastanza buona, ma mi piace pensare ai prototipi come a qualcosa di ancora più ampio. La mia definizione di prototipo? È un artefatto tangibile che esplora un'idea .

Potrebbe essere semplice come alcuni schizzi approssimativi disegnati su carta. Forse è puramente progettato, come una procedura dettagliata animata di come funziona un'interfaccia in After Effects. Forse è una demo approssimativa lanciata su Codepen. Oppure potrebbe essere qualcosa di molto più alto nella fedeltà. Quando qualcuno vede un prototipo, non dovrebbe esserci alcuna ambiguità nella sua risposta. In altre parole, se la persona chiedesse "E se l'app fosse blu?", allora non si tratta di un prototipo. Se mostri come sarebbe l'app se fosse blu, allora lo è.

Esistono anche diversi tipi di prototipi, ognuno con uno scopo diverso: interno, esterno e pubblico .

Prototipo interno

Un prototipo interno non trasmette necessariamente un valore immediato a nessuno al di fuori di me o del mio team. Può essere ruvido e veloce come voglio farlo. Nel mondo dei siti web, potrei costruire un semplice componente usando CSS, HTML e JavaScript, React, Angular o Vue, solo per avere un'idea di come funziona e per valutare i pro ei contro. Questi tipi di prototipi tendono a presentarsi molto presto nel mio processo, il primo giorno in cui inizia un progetto, in effetti. Con questi prototipi, non devo aver paura che qualcuno non "capisca" o che possa causare più danni che benefici. Posso scegliere di mostrare i prototipi interni a un cliente o a uno stakeholder per rafforzare il valore del processo di prototipazione a mia discrezione, ma non è ancora questo il punto: in questo momento voglio mostrare le idee velocemente, velocemente, velocemente.

Prototipo esterno

Un prototipo esterno è un caso per la direzione in cui stai cercando di andare, per mostrare i progressi o per dimostrare come funziona qualcosa. Quando un cliente ha bisogno di uno strumento di amministrazione, potrei creare un rapido blog in Craft, WordPress e Contentful (sì, tutti e tre!) Per dare loro un'idea di come funziona ogni strumento, in modo che possano prendere una decisione più informata su cosa è meglio per loro. Questi prototipi sono fantastici nelle fasi intermedie e successive di un progetto. Ricordo un progetto in cui un cliente stava valutando una modifica per includere l'API di un nuovo fornitore di servizi. L'assemblaggio di un prototipo ha dimostrato al cliente cosa potrebbe fare il fornitore, quanto velocemente potremmo integrarlo e quale sarebbe l'impatto sul resto del progetto.

Prototipo pubblico

Un prototipo pubblico è là fuori nel resto del mondo. Si tratta fondamentalmente di inviare l'effettivo processo di progettazione allo stato brado, imparare cosa fanno gli utenti e ripetere da lì. Potrebbe essere un prodotto pilota a tutti gli effetti o qualcosa di accessibile a un piccolo sottoinsieme di utenti. È il tipo di prototipo più raffinato e si avvicina di più a quella definizione tradizionale a cui ho fatto riferimento in precedenza. Tende a inserirsi in un progetto più ampio come parte di una fase di test di qualche natura.

I prototipi veloci sono buoni prototipi?

La risposta breve è sì. Prototipi rapidamente e il prima possibile in un progetto. Per darti un'idea del perché, proviamo un esercizio.

Immagina nella tua mente come appare una sedia. Ne hai una buona idea? Era questa sedia?

Probabilmente no, giusto? Potresti aver pensato a una sedia da esterno, una poltrona, una sedia da ufficio o uno sgabello. Potresti non aver nemmeno pensato a una sedia fotorealistica! Ora che hai una foto di questa sedia, non c'è ambiguità. Questa è la sedia di cui sto parlando e, d'ora in poi, lo sappiamo tutti. Ora abbiamo un quadro di riferimento comune.

Quando il tuo cliente dice "Ho bisogno che il mio sito web sia moderno", come fai a sapere cosa significa? Senza un artefatto tangibile, come un mood board, ognuno avrà in mente una diversa definizione di "moderno", proprio come con la sedia sopra. Il problema non è specifico del design. Riguarda il modo in cui funziona un flusso di accesso o la scelta tra gli ambienti di hosting. Fare le cose rapidamente forza conversazioni e reazioni. Tutte le cose nebulose vengono risolte più velocemente.

È importante sottolineare che il prototipo non deve risolvere il problema che ti aspetti che risolva . La semplice creazione e condivisione a volte sbloccherà idee, ispirazione, sfide o preoccupazioni di cui le persone non erano a conoscenza. Più velocemente e più frequentemente realizzi prototipi, prima tutte le cose buone verranno a galla.

Questa è la chiave. La prototipazione sblocca la tua capacità di sperimentare, fallire, imparare e crescere in una sandbox. Stai migliorando contemporaneamente te stesso e il prodotto su cui stai lavorando.

Chi dovrebbe creare un prototipo?

Tutti! La prototipazione è un'opportunità per abbattere i muri tra le discipline. I progettisti dovrebbero creare prototipi in modo da poter apprendere i limiti, le complessità e le possibilità del progetto. I programmatori possono creare prototipi per testare la fattibilità, ovviamente, ma anche per essere più coinvolti nel processo creativo. Project manager, produttori, copywriter, chiunque abbia un'idea può mettersi in gioco.

Ancora una volta, la prototipazione non riguarda necessariamente la codifica di qualcosa di folle, o addirittura la codifica! Si tratta di generare e testare idee con cose reali con cui giocare ed esplorare.

Poiché la prototipazione può essere semplice o complessa quanto vuoi, otterrai un sacco di valore dall'adottarla come parte della tua pratica. Esaminiamo alcuni dei vantaggi.

Graffia un prurito creativo

A volte vuoi solo provare a costruire qualcosa che non hai mai visto prima o emulare qualcosa che ritieni interessante. Potrebbe essere un'idea stravagante o la prossima tendenza dell'interfaccia utente - chi lo sa? Come minimo, capire come funzionano le cose è una delle parti più soddisfacenti dell'essere un designer e la prototipazione fornisce un terreno fertile.

Aggiunge spazio al coraggio e alle idee radicali

È difficile provare a spedire contemporaneamente qualcosa che gli utenti capiranno e saranno creativi. Anche se inizi un progetto con la "settimana di prototipazione", quella è una settimana in cui il limite è il cielo.

Aumenta la competenza in materia

Ogni negozio di sviluppo che conosco sembra avere una profonda esperienza in una piattaforma e desidera segretamente lavorare al di là di essa (sono sicuro che questo è lo stesso per i designer). Stai costruendo tutto in PHP e vuoi entrare in Rails? Costruisci alcuni prototipi mentre avvii un progetto, anche se sono irrilevanti per l'obiettivo aziendale.

Mitiga il rischio

Fare qualcosa che non hai mai fatto prima fa paura. Capirlo in modo approssimativo e rapido rimuove le barriere psicologiche. Improvvisamente, l'impossibile richiede solo un giorno o due per essere realizzato.

Costruisce un catalogo di idee

Man mano che la tua libreria di prototipi cresce di progetto in progetto, le idee vengono rivisitate. A volte la spazzatura di un progetto diventa un tesoro per il successivo.

Potenzia tutti

Quando stai appena iniziando a capire le cose, titoli, anni di esperienza e set di abilità non dovrebbero avere importanza. Le buone idee possono venire da chiunque, ma è difficile da fare quando il creativo senior del tal dei tali viene dall'alto per dirigere il pensiero. Iniziare con un processo di creazione puro scioglie i titoli e fa emergere buone idee dal basso.

Personalizza il tuo processo

Ho lavorato con un certo numero di designer e agenzie e una cosa che sembrano costantemente sbalorditi è la velocità con cui inizio a lavorare. Non aspetto che i requisiti vengano compilati, la direzione artistica per ottenere l'approvazione o qualsiasi altra cosa. Colpendo il suolo correndo, posso portare avanti il ​​progetto molto più velocemente.

Come iniziare

Il modo sbagliato di creare prototipi è preoccuparsi di creare prototipi nel modo sbagliato. Come diceva Bruce Lee, "Sforzati di non sforzarti". Con questo in mente, ecco alcune linee guida per aiutarti a promuovere una pratica di prototipazione rapida.

Scrivi dichiarazioni di problemi

Data la cosa che stai cercando di imparare o risolvere, scomponila in unità atomiche e tratta ciascuna di queste come prototipi distinti. "Come faccio a caricare una mappa in iOS?" "Come faccio a posizionare la mappa in una posizione particolare?" "Come faccio a disegnare una forma sulla mappa?" "Come faccio a posizionare un segnaposto sulla mappa?" Quattro affermazioni, quattro prototipi, quattro cose imparate velocemente.

Inizia con qualcosa che sai come fare

Come lo stretching prima dell'allenamento, non puoi prendere un ritmo iniziando a tutta velocità. Se sei un programmatore che sta prototipando un sito Web, forse vuoi iniziare costruendo il tuo boilerplate: un file HTML statico, una configurazione Gulp, quel genere di cose. Questo farà fluire i tuoi succhi creativi, così che quando sarai in un territorio inesplorato, il tuo mojo sta già funzionando.

Costruisci brutto

Usa Comics Sans MS e verde lime brillante per i tuoi caratteri. Non nominare i tuoi livelli. Rompi tutte le regole. Ora non è il momento per la perfezione dei pixel; è il momento di mettere le idee su carta.

Mantieni i prototipi iniziali a 60 minuti max

La prototipazione e la complessità sono nemici mortali. Quando lo fai bene, dovresti essere in grado di sfornare almeno quattro prototipi entro la fine del tuo primo giorno di progetto.

Dai la priorità ai sentimenti, non all'urgenza

Cosa ti senti di fare oggi? Non c'entra niente con il progetto? Non combatterlo. Fallo. Chissà? Forse ha un valore ancora da scoprire!

Forchetta

Non sovrascrivere mai un prototipo. Invece, fai una copia e ripeti da lì. In questo modo, i tuoi prototipi saranno sempre i più semplici possibile, possono essere biforcati in diverse direzioni e sarà facile da imparare.

Condivisione eccessiva

Mostra a tutti cosa stai facendo! Sii orgoglioso di questo! L'energia positiva che costruisci attorno alla pratica alimenterà l'intero ciclo di vita del progetto. Questo passaggio da solo può migliorare notevolmente la cultura di un progetto.

Documenta cosa stai prototipando e i risultati

Questo potrebbe essere semplice come un file README in una directory o un messaggio su Slack. Torna sempre indietro per imparare da quello che hai fatto.

Scrivi le tue paure mentre vai e trasformale in affermazioni di problemi

Quindi, hai appena trasferito il tuo primo sito Web su Heroku, ma sei preoccupato di come impostare un certificato SSL? Non è un problema. Mettilo in coda per la prototipazione in seguito.

Come inserire questo budget nel tuo progetto

Ecco la cosa: non lo fai. Questa non è una sorta di upsell. Questo è il modo in cui lo faccio. Questo articolo ha la parola "processo" nel titolo per un motivo: non si tratta solo di come creare un prototipo. È un principio guida su come costruire cose.

Inizierai a creare prototipi il giorno in cui inizi un progetto. Non ti fermeresti finché non c'è più niente da prototipare. Un prototipo non è lo stesso del codice principale o dei file di progettazione. All'inizio, i tuoi prototipi dovrebbero essere troppo grezzi per essere pronti per la produzione. Più tardi, se trovare un modo per la transizione sembra sensato, va bene. È una decisione progetto per progetto. La prototipazione è sempre una costante. Quando è impostato in questo modo, non esiste un prototipo fallito o un errore.

Quando parlo con un potenziale cliente, spiego loro che questo processo tende a generare molto più output molto più rapidamente di quanto si aspetterebbe dai miei concorrenti (leggi: tu). Tale output potrebbe aiutare a definire un'API o dimostrare la fattibilità tecnica o verificare un'attività spaventosa. Il punto in cui è particolarmente d'impatto è con i designer e i team di progettazione interni: adorano lavorare in questo modo perché sono molto rapidamente nei guai con loro, a capire le cose. Produco lavori di qualità superiore, più personalizzati e meno soggetti a errori. Poiché tutti si abituano a vedere un lavoro duro, non c'è il rischio che un prototipo che fallisce allarmerà un cliente: alcune cose che non funzionano sono solo una parte prevista del processo.

Mi posiziona bene anche a lungo termine, perché sono in grado di acquisire nuove tecnologie molto rapidamente. I miei clienti sanno che possono mettersi in contatto con me per un'installazione, un progetto di calcolo fisico, un'app o un sito Web di qualsiasi scala, perché sanno che l'approccio garantisce risultati di successo.

Per me, non si tratta di massimizzare il profitto. Si tratta di guadagnarsi da vivere facendo la cosa che voglio fare. Non ho mai deciso di essere bravo con siti Web o app, in effetti, quelle cose non esistevano quando ho iniziato! Ho deciso di imparare cose interessanti e interessanti con il codice. Voglio che la mia carriera sia lunga, appagante, eccitante e costantemente piena di nuove cose da imparare. Un processo basato su prototipi è perfetto per questo.

Utensili

In questi giorni, sembra che non si possa pronunciare la parola "prototipo" senza pensare a InVision: è come il Kleenex della prototipazione. Nel caso in cui non hai mai utilizzato InVision prima, è un ottimo strumento per i designer per fare clic sui progetti senza richiedere un programmatore. È il vero affare: veloce, intuitivo e facile da ritirare.

Con Sketch che sta guadagnando popolarità diffusa, vengono visualizzati molti plug-in per facilitare l'utilizzo dei prototipi. Framer è un esempio fantastico; importa i file di Sketch e, con una piccola conoscenza del codice, puoi creare demo personalizzate come toccare le animazioni. InVision ha anche un plug-in Sketch. Altri, tra cui Marvel e Craft, meritano di essere esplorati. Ci sono un sacco di strumenti da provare.

Non è necessario essere un programmatore o utilizzare software per creare prototipi. La prototipazione su carta è un ottimo modo per sperimentare la progettazione dell'interfaccia utente senza bisogno di un computer. Puoi anche fare una lavagna. Queste tecniche funzionano anche per la progettazione di giochi.

Non sai da cosa iniziare? Considera uno sprint di prototipazione utilizzando ciascuno di questi strumenti!

Nel mondo dello sviluppo web e software, una cosa che amo fare è configurare un repository GitHub specifico per i prototipi. Ho incluso un file README che descrive alcune delle regole a cui tengo durante la prototipazione, che puoi usare o biforcare per provare.

Caso di studio: Melody Jam

Circa un anno fa, ho creato e lanciato un gioco iOS per bambini con alcuni amici, chiamato Melody Jams (e ho scritto un articolo per Smashing Magazine tutto su di esso!). Quel gioco è stato codificato zuppa in noci in circa tre mesi. Ci sono state alcune sfide: il designer non aveva mai creato un'app prima, viveva a 3000 miglia da me e non ci eravamo mai incontrati. Inoltre, non avevo codificato un'app iOS per un anno, quindi le mie costolette si erano notevolmente atrofizzate.

Il gioco prevede il trascinamento di mostri dalla parte inferiore dello schermo in punti caldi designati sul palco. Da quel solo progetto, una serie di affermazioni di problemi scorrevano nella mia testa:

• Come faccio a creare un'app iOS?
• Come faccio a creare un gioco iOS?
• Come faccio a creare una cosa nel gioco?
• Come posso toccare quella cosa?
• Come faccio a trascinare la cosa?
• Come faccio ad avere più cose che possono essere trascinate?
• Come faccio a rilevare quando una cosa è vicina a un'altra cosa?

E così via. Ognuno di questi è diventato prototipi individuali su misura, un'app iOS per ciascuno, fino a quando non sono stati risolti tutti. Ognuno ha risolto un problema e alcuni hanno sollevato nuovi problemi, ad esempio, come faccio ad animare una cosa quando ho finito di trascinarla?

Ho ricreato questi prototipi in Swift 3, in modo che tu possa vedere come potrebbe apparire il repository di prototipi se fosse costruito oggi. Una cosa che noterai è che la documentazione su questi è piuttosto leggera: un file README e uno screenshot o GIF in ogni directory, ma non una tonnellata di documentazione dettagliata. Se aiuta a stampare i nostri commenti, fallo con tutti i mezzi. Per me, si tratta di vedere una progressione. Non c'è nessuna teoria qui, nessun post sul blog o tutorial. Il prototipo 3 deriva dal prototipo 2, che deriva dal prototipo 1. Con abbastanza pratica, puoi cogliere rapidamente le sfumature del linguaggio di programmazione, anche se non l'hai mai visto prima.

Abbiamo seguito questo flusso per le prime settimane del progetto, sviluppando in gran parte prototipi senza lavorare sull'applicazione principale. Alla fine del progetto, avevamo oltre 50 prototipi distinti che hanno testato diversi tipi di animazione, schemi di caricamento, memorizzazione nella cache, test audio e meccanica dell'interfaccia utente.

Mentre ciò accadeva, il designer creava prototipi di loghi, test di movimento, icone di app e così via. Il sound designer ha fornito esempi di canzoni a cui stava pensando. E tutti hanno adorato quello che stavamo facendo per tutto il tempo in cui lo stavamo facendo.

Conclusione

Seguendo la mia definizione ampia, probabilmente esegui già alcuni prototipi senza nemmeno pensarci come tale. Forse il prossimo passo per te è condividere più frequentemente con i tuoi colleghi o affermare che la prototipazione sarà il modo in cui avvierai il tuo prossimo progetto.

Integrare profondamente la prototipazione nel tuo processo creativo può essere trasformativo . Può creare una cultura di squadra più positiva e arricchente. Può essere un meccanismo per gli sviluppatori per imparare nuove lingue o per i designer per imparare nuovi strumenti. I progetti vengono eseguiti più velocemente e con una qualità superiore e sono più divertenti. I tuoi clienti avranno una maggiore visibilità nel processo e saranno preparati a vedere le cose con una fedeltà inferiore, il che rende la condivisione delle cose con loro più frequente e meno dolorosa. Sembrerai anche che lavori molto più velocemente dei tuoi concorrenti e che sei in grado di lavorare su una più ampia varietà di progetti.

Con tutti questi vantaggi, cosa c'è che non va? Allora, dimmi, sei convinto? Ispirato? Come sarà il tuo prossimo passo?