In generale, è meglio rendere tutte le parti funzionali o far funzionare prima l'interfaccia utente - o un mix delle due?


47

In generale, è meglio rendere tutte le parti funzionali o far funzionare prima l'interfaccia utente - o un mix delle due?

Supponendo che tu stia lavorando su qualcosa di grande, è generalmente accettata far funzionare tutti i BLOB di raccolta dati funzionali prima di qualsiasi interfaccia utente, far funzionare l'intera interfaccia un pezzo alla volta mentre vai, o qualcosa nel mezzo?

Sappiamo tutti di suddividere il lavoro in pezzi gestibili, ma alla fine la domanda è se l'interfaccia utente è inclusa in pezzi gestibili, suppongo.

Nel caso dell'esempio, considera un'applicazione GUI con una finestra principale, ma più di una dozzina di schede in vari dock per separare diversi componenti di dati. Ogni singola scheda ha un insieme relativamente complesso di parti mobili dietro di essa dal punto di vista delle unità funzionali.

L'applicazione di esempio in questa domanda particolare è qui con il blog di accompagnamento e il prodotto commerciale originale .

Risposte:


85

C'è una concezione generale tra molti utenti e clienti aziendali che quando sembra completo, è quasi completo. Come probabilmente saprai, questo è lontano dalla verità. Si può avere un bell'aspetto, ma senza backend e alcuni utenti pensano che renderlo bello sia l'80% del lavoro, non il 20% ( o l'altro 80% ).

Innumerevoli sviluppatori possono raccontare storie horror di questo: ottenere un mockup delle pagine fatte in Microsoft Word usando le schermate di qualche altro strumento e il cliente dice "quindi, ce l'hai quasi fatta?"

È necessario stimolarlo in modo che tutte le parti vengano eseguite al termine. Cercare di fare prima tutto il back-end e poi tutto il front-end porterà l'utente finale a pensare che non stai facendo nulla e a chiederti perché vieni pagato quando non c'è nulla da mostrare. D'altra parte, front end prima e troverai l'utente finale che sta apportando cambiamenti assurdi e consumando tutto il nostro tempo.

Il caso peggiore con un "uno prima e l'altro" è quando si arriva all'altra parte, si scopre che non si adatta affatto al design.

Quindi, costruisci entrambi. Mostra i progressi nel front-end, fai funzionare il back-end con ciò che stai costruendo. In molti casi è una buona idea fornire build incrementali e assicurarsi che tu stia facendo ciò che il cliente vuole (questo diventa Agile). Andare troppo a lungo senza "avanzamenti visibili" può danneggiare la relazione con il cliente (questo è per entrambi i casi di "tutto sembra fatto in anticipo" e "nulla viene fatto fino alla fine" - è difficile per il cliente vedere il quadro scritto o i test unitari o la sanificazione dei dati come avanzamento).

Joel ha scritto di questo in The Iceberg Secret, Revealed :

Corollario importante due. Se mostri a un non programmatore uno schermo che ha un'interfaccia utente bella al 100%, penseranno che il programma è quasi finito.

Le persone che non sono programmatori stanno solo guardando lo schermo e vedendo alcuni pixel. E se i pixel sembrano costituire un programma che fa qualcosa, pensano "oh, cavolo, quanto potrebbe essere più difficile farlo funzionare davvero?"

Il grande rischio qui è che se prima deridi l'interfaccia utente, presumibilmente in modo da poter avviare alcune conversazioni con il cliente, tutti penseranno che hai quasi finito. E poi, quando passerai il prossimo anno a lavorare "sotto le coperte", per così dire, nessuno vedrà davvero quello che stai facendo e penseranno che non è niente.

Questo è nuovamente ribadito nel post del blog. Non far sembrare la Demo Fatto che ha questo utile grafico:

Com'è fatto a come appare

Nota qui le due opzioni generalmente riflettono il 'get the ui done' (e quindi l'aspettativa è che presto lo farai) e 'get the backend' (e quindi il cliente è preoccupato che tu non abbia rispettato la scadenza).

L'aspetto di "fatto" dovrebbe corrispondere a quanto "fatto" è.

Ogni sviluppatore di software lo ha sperimentato molte volte nella sua carriera. Ma gli strumenti di desktop publishing portano allo stesso mal di testa per gli scrittori di tecnologia: se mostri a qualcuno una bozza approssimativa che è perfettamente formattata e formattata, la vedono come più fatta di quanto desideri. Abbiamo bisogno di una corrispondenza tra dove siamo e dove gli altri percepiscono che siamo.

Questo articolo evidenzia anche un punto importante sul tipo di feedback che ricevi con diversi livelli di doneness dell'interfaccia utente. Se hai qualcosa che sembra completo, hai maggiori probabilità di ricevere feedback su "potresti cambiare il carattere" rispetto a "questo layout non funziona - ci sono troppe schede".


Per coloro che stanno combattendo con questo nel mondo Swing Java, c'è un aspetto chiamato Napkin che lo rende in modo che l'interfaccia utente non sembri completa (anche se lo è).

La chiave qui è farlo in modo che non sembri fatto. Avere l'aspetto dell'interfaccia utente completo è un segnale per molti utenti aziendali che l'applicazione è completa (anche se si tratta di poche pagine statiche senza alcuna logica dietro o qualcosa incorporato in un builder di interfacce).


Ulteriori letture (e collegamenti dall'articolo):


7
Sembra che tu stia proponendo una sorta di metodologia agile ... :)
Alexander,

7
@Alexander Agile aiuta in questo caso, ma non è essenziale. Waterfall può avere traguardi (consegnabili) e i clienti possono essere molto delusi nel vedere "sembra fatto, perché ci sono 3 pietre di più miglia che impiegano altrettanto tempo?" FWIW, ho avuto casi in cui l'utente aziendale ha pensato che fosse fatto a causa della schermata + ms vernice nel design tecnico (negozio a cascata) sembrava buono.

3
Se non hai visto una risposta esperta a quel video, eccolo qui: youtu.be/B7MIJP90biM
ragol

3
Ho progettato le interfacce utente per gran parte della mia carriera di programmatore e NON UNA VOLTA se un cliente pensava che un'interfaccia utente prototipo significasse che il software era "quasi finito". Mi sembra che i presentatori dell'interfaccia utente di wireframe non stiano facendo un buon lavoro spiegando i wireframe in anticipo se i clienti sono in qualche modo confusi nel pensare che il progetto sia quasi finito.
Graham,

2
+1 per Tovagliolo L&F. Sarà sicuramente nel mio futuro. :)
Kathy,

27

Dipende: è necessario un circolo di feedback stretto attorno alla parte più importante della funzionalità

Se il nucleo di ciò che fai, la parte rischiosa e spaventosa, è un motore interno, fai in modo che la parte centrale funzioni nella console o attraverso i test delle unità. Ad esempio, un parser di protocollo non ha bisogno di un'interfaccia utente per sapere se funziona correttamente.

Se la tua cosa interessante riguarda qualsiasi interattività - l'interattività devi costantemente risolvere i problemi, buttare via e riscoprire - allora un approccio UI-first è cruciale. Ad esempio, voglio creare un'app per consentire alle persone di interagire con una visualizzazione dei dati. La cosa più importante che devo capire è se la visualizzazione è significativa, quindi probabilmente getterò via una mezza dozzina di approcci prima di stabilirne uno. Lo farò prima di scrivere un singolo test unitario.

C'è una zona grigia sfocata nel mezzo in cui puoi decidere la migliore combinazione su come interagire e convalidare meglio il tuo codice (test automatici? UI per la sperimentazione?). Personalmente ho fatto entrambi gli estremi e tutto il resto, e decidere il posto giusto per essere su quello spettro è una delle cose più difficili che devo decidere e dipende al 100% dal tipo di cosa che sto costruendo.


2
Vale a dire identificare e affrontare in anticipo i componenti più rischiosi e più critici in modo da mitigare la possibilità di sovraccarichi e / o guasti. Se tali componenti sono l'interfaccia utente, la logica aziendale, ecc ... o, molto probabilmente, una combinazione di tutti i vari componenti.
Alexander,

1
Sembra davvero che tu stia parlando di prototipazione per me, perché se stai ancora buttando via i progetti, allora è quello su cui dovresti iterare, non un vero codice.
Aaronaught,

8

In un ambiente Agile, potresti sentire discussioni su "scheletri ambulanti" o "sottili fette verticali". L'idea è che dal momento che il software di lavoro è ciò che è importante per l'utente, costruisci il software in modo funzionante pezzo per pezzo.

Nell'applicazione di esempio che hai citato, inizieresti con la finestra e forse con una scheda, e faresti funzionare tutto da un lato all'altro in qualche modo. Quindi, nel tempo, aggiungi funzionalità e quindi schede caso per caso, facendo in modo che ogni funzione funzioni mentre la costruisci. Questo fa parte di ciò che le frequenti dimostrazioni dei clienti ti danno: la possibilità di mostrare qualcosa di nuovo funzionante e ottenere immediatamente un feedback su di esso.

In breve, sì, il lavoro dell'interfaccia utente è assolutamente parte integrante di un'unità di lavoro funzionale, se si dispone di un'interfaccia utente.

Inizia con qualcosa di piccolo che funzioni e itera le sue funzionalità fino a fornire un intero software.


+1 Avere sempre un pezzo spedibile di qualcosa è essenziale.
JensG,

@Jens: "Avere sempre un pezzo spedibile di qualcosa è essenziale" è un canard. Nella migliore delle ipotesi questo detto si applica solo a una minoranza di applicazioni software. Nel mondo reale, le applicazioni che svolgono solo una parte del lavoro necessario non sono minimamente utili.
Dunk,

Queste sono le tue esperienze. Ne ho diversi. Grandi progetti del mondo reale con molti traguardi e clienti reali inclusi.
JensG,

1
@Dunk: un'applicazione che non svolge alcuna parte del lavoro è meno utile di un'applicazione che fa parte del lavoro. Non sto tuttavia parlando di un'applicazione che viene "fatta"; Sto parlando dell'ordine in cui si dovrebbe creare un'applicazione. La mia esperienza è congruente con JensG: essere sempre in grado di tagliare una beta in base a ciò che hai dimostrato quella settimana e spedirla ai clienti rende i clienti immediatamente più felici.
Keith B,

Questa è l'unica risposta con cui posso identificarmi. Gli altri non sembrano nemmeno considerare la possibilità che un buon sviluppo del prodotto non si scomponga in modo chiaro in "UI" e "back-end". È una domanda che solo un programmatore principiante o un project manager avrebbe mai posto, e non uno che un programmatore esperto o PM dovrebbe degnarsi di rispondere al valore nominale. L'idea stessa di chiedere quale dovrebbe essere "fatto prima" puzza di cascata.
Aaronaught,

3

Consiglierei di combinare funzionalità e interfaccia utente (e ottenere feedback o esperienza di test al più presto).

A proposito, non è il modo in cui viene sviluppato il più grande software GUI? Cerca ad esempio nel browser Firefox : da una versione all'altra si sono evolute sia la funzionalità che l'interfaccia utente.


2

Nelle applicazioni di grandi dimensioni (basate sul Web PHP) su cui lavoro, cerco di mettere in atto le classi e i metodi che restituiscono valori fittizi . Questo per stabilire uno pseudo-contratto che gli altri sviluppatori possono utilizzare per implementare l'interfaccia utente.

Un vantaggio secondario di questo metodo è che possiamo affinare il contratto / l'interfaccia man mano che i requisiti dell'interfaccia utente cambiano (e cambiano sempre), anche prima che tutto il codice venga scritto e consegnato.


Questo è qualcosa che sto cercando di fare. Poiché il mio progetto particolare è implementato come una grande shell dell'interfaccia utente e ogni raccoglitore di punti dati è un plug-in, ogni plug-in è responsabile della gestione dei propri componenti dell'interfaccia utente. In questo modo non è richiesto un "contratto" per una determinata persona / gruppo di persone. Il presupposto è che lo stesso gruppo di persone lavorerà su un determinato plug-in dall'inizio alla fine. Fa parte del motivo per cui lo sto progettando come sono. In alternativa, per altri progetti questo è un eccellente consiglio. Quindi vota da me poiché sarà utile per gli altri.
RobotHumans,

2

Quello che tendo a fare è iniziare con un'interfaccia utente scadente : qualcosa che scarica semplicemente i dati variabili sullo schermo. Nessun carattere, nessun allineamento, nulla di grafico per molto tempo. Solo "Benvenuto utente x" e pulsanti chiamati "carica foto" ecc. La cosa buona è che scoprirai se qualcosa nel backend è rotto.

Man mano che lo sviluppo procede, potresti trovare più cose da fare o meno. Ma a un certo punto, deciderai che il backend è quasi completato. Ora hai un'interfaccia utente che contiene tutti gli allegati necessari e puoi dedicare molto tempo a fare tutto il materiale grafico.

Attenzione però, non è infallibile. Hai bisogno di un po 'di lungimiranza per vedere sorgere determinati problemi. Ad esempio, potrebbe essere necessario ricercare i componenti dell'interfaccia utente per visualizzare i dati in modo ragionevole.


E dove entra in gioco il cliente nella tua metodologia? Tieni presente che di solito il tuo cliente ha solo un'idea molto generale di ciò che desidera. Sta a te capire come "tirarli fuori" esattamente quello che vogliono in modo da poterlo costruire. La tua metodologia ha appena costruito ciò che pensi che desideri il cliente, ma raramente sarà ciò che il cliente desidera effettivamente. Quindi hai appena perso un sacco di tempo a codificare qualcosa che il cliente non vuole.
Dunk,

Ah, i miei "clienti" sono seduti proprio accanto a me, e ho un background sul campo che mi dà una buona idea di ciò che si desidera. Fondamentalmente siamo sempre vicini al prodotto finale, per quanto riguarda l'interfaccia utente, e posso sempre ricevere feedback. Non avevo considerato il problema di avere un lungo ciclo di feedback. Immagino che avere la conoscenza del dominio sia la chiave.
Carlos,

0

Se usi una buona pietra miliare e un sistema di tracciamento dei problemi, puoi evitare alcuni di questi problemi perché, a prima vista, la direzione può vedere quanto sei produttivo. Saranno in grado di vedere che hai finito l'80% del backend e che l'interfaccia utente è il prossimo traguardo; saranno in grado di vedere che hai una serie di UI e attività di back-end da terminare per un traguardo specifico di funzionalità. Ma tutto inizia con i requisiti del progetto e la risposta di Doug T solleva alcuni punti positivi su quell'aspetto della progettazione di un sistema.


0

Pensa dal punto di vista dei tuoi utenti / clienti. Un sistema software è una raccolta di funzioni che danno valore a questi utenti / clienti. Ovviamente ognuna di queste funzionalità ha e UI, un backend e alcune altre cose.

Costruisci il tuo sistema sempre funzionalità per funzionalità e prova a dividere in funzionalità molto piccole. In questo modo sei sempre vicino ad avere qualcosa in più da offrire ai tuoi clienti, ricorda che lo sviluppo del software non si tratta di costruire la versione 1.0 ma di andare alla versione 1.0.1 alla 1.0.2 e così via ...


0

Dipende. Quanto ben definiti sono i tuoi requisiti? Quanto del sistema deve affrontare l'interfaccia utente?

Dalla mia esperienza, la maggior parte dei clienti non sa cosa vogliono fino a quando non vedono qualcosa di fronte a loro. Quindi normalmente fornisco alcuni wire-frame di aspetti chiave dell'interfaccia utente o invio della maggior parte dell'interfaccia utente (non funzionante). Ciò consente al cliente di cambiare idea su caratteristiche / funzioni senza troppi effetti poiché la progettazione del database e la struttura del codice sono ancora solo in fase di progettazione: è facile modificarne la progettazione. È più facile / rapido cambiare ordini di grandezza prima nel progetto e poi dopo.

Agile afferma che dovresti anche lavorare prima sugli oggetti più difficili e quelli più importanti. Fallire velocemente . Quindi, una volta che il cliente ha visto l'interfaccia utente, mi concentro sulla costruzione di piccoli componenti che sono perfettamente funzionanti, parlando per primi il più importante e il più difficile da implementare, in modo da sapere al più presto se si incontrano ostacoli.

Quindi hai i tuoi sprint e hai una comunicazione costante con il cliente sviluppando contemporaneamente l'interfaccia utente e gli aspetti funzionali.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.