I miei pensieri sulla progettazione nel browser rispetto alla progettazione in Photoshop

La progettazione nel browser sta diventando sempre più popolare con l'ascesa di "designer che codificano". Ma solo perché abbiamo acquisito alcune nuove competenze vuol dire che dovremmo abbandonare la nostra carta, i taglienti, il software di desktop publishing e gli strumenti wireframing e passare direttamente ai prototipi di codifica?

Browser vs Photoshop è un argomento a caldo

Se lavori nello spazio digitale, con designer e sviluppatori, avrai visto la crescente tendenza dei progettisti di avere (alcuni) capacità di codifica.

Molte persone sono tutte per questo, mentre alcuni credono che i progettisti non dovrebbero toccare il codice. Tuttavia, i progettisti che realizzano il codice diventano più sicuri e alcuni sostengono addirittura che la progettazione in Photoshop non è più rilevante in determinati scenari.

Sono dell'opinione che la creatività sia indipendente dallo strumento, ma posso vedere i vantaggi e gli svantaggi di entrambi gli approcci isolati (li ho elencati di seguito, in modo che tu possa avere la mia prospettiva sulla discussione).

In questo articolo uso liberamente il termine "Photoshop" e "UXPin". Mi riferisco davvero a qualsiasi strumento di questo tipo, che tu usi Sketch, Balsamic o qualcos'altro! Lo stesso argomento vale. Photoshop e UXPin sono i miei strumenti preferiti.

Andando dritto nel browser

Una situazione comune in cui un utente di un'organizzazione potrebbe progettare nel browser è se sono esperti in progettazione visiva, ma sono anche una comoda codifica. Ad esempio, lo scopo potrebbe essere quello di comunicare a uno sviluppatore che costruisce un CMS come sarà il design. Un PSD sarebbe adatto, ma il progettista potrebbe pensare che sarebbe più prezioso mostrare tutti gli extra, come l'animazione e la reattività in un modo più vicino alla build finale.

Benefici

Framework come Bootstrap e Foundation rendono il processo più veloce. Nella mia esperienza, è bello imparare effettivamente come codificare da zero prima di appoggiarvi ai framework mentre imparerete cosa succede dietro le quinte.
Imparare a programmare il front-end riduce la quantità di colli di bottiglia, specialmente se la tua squadra è più pesante dal punto di vista del design. Puoi lasciare che gli sviluppatori si concentrino su aspetti più impegnativi dello sviluppo e delle aree specialistiche.

svantaggi

La progettazione nel browser può essere un po 'più lenta se non si è sicuri della codifica. Nella mia esperienza, può pagare per iscriversi a un corso di sviluppo front-end e provare a partecipare a qualche concerto freelance come la creazione di una semplice pagina di destinazione.
Questo processo potrebbe spostare l'attenzione dei progettisti lontano dai loro punti di forza. Sì, può essere buono avere le costolette di codifica. Tuttavia, alcune persone sostengono che la divisione del lavoro (persone che si concentrano su compiti molto specifici) porta a una maggiore efficienza nella produzione. Le realtà del mercato (e la flessibilità ricercata nello spazio digitale) possono portare a persone che discutono diversamente!

Progettazione in Photoshop / UXPin

I software di desktop publishing come Adobe Photoshop e Software as a Services (SAAS) come UXPin sono solo un paio di molti strumenti che sono il pane e il burro dei designer. Anche i designer che può il codice e spesso il design nel browser lo troveranno prezioso per pianificare le cose usando prima questi strumenti.

Benefici

Le applicazioni grafiche sono eccezionali nelle prime fasi di pianificazione e ricerca. Secondo la mia esperienza, la carta e i pennarelli sono modi veloci e sporchi per incarnare rapidamente qualcosa.
I wireframe possono essere un buon modo per un analista aziendale o altri soggetti interessati non visivi per comunicare i metadati di base. Progettare in un browser sarebbe probabilmente eccessivo poiché l'obiettivo di questa fase è generare qualcosa di libero da discutere.
Pianificare e prevedere con mock up di fedeltà inferiore può portare ad una considerevole diminuzione dei tempi di sviluppo.

svantaggi

Progettare per il web reattivo può sembrare ripetitivo in Photoshop e non tradurre realisticamente a come sarà la build attuale. Nella mia esperienza, è più facile modificare le tue richieste multimediali a occhio per dispositivi diversi, ottenendo un riscontro in tempo reale su come sarà la build effettiva, piuttosto che produrre un numero di mock up speculativi in Photoshop.
È difficile riconoscere i limiti tecnici durante la progettazione in Photoshop. Ad esempio, una volta stavo progettando una pagina di destinazione per un cliente. Presentava una casella di cattura della posta elettronica, che in seguito divenne molto difficile da progettare a causa della complessità. Alla fine ho "progettato" nel browser il modo pigro, che era molto più pratico.

Conclusione

La creatività è indipendente dallo strumento. Lavorare direttamente nel browser ti mette immediatamente in contatto con le possibili limitazioni e ti aiuta ad evolvere il tuo design. Tuttavia, nella mia esperienza non è un sostituto per un taglio precoce in UxPin e Adobe Photoshop. Questi approcci non si escludono a vicenda. Uso molto Adobe Photoshop, anche durante la progettazione nel browser. In questi giorni ha anche delle ottime estensioni per aiutarti a codificare in modo molto più efficiente.

Sei un designer che codifica? O preferisci fare il tuo mock up in software di desktop publishing come Photoshop? Lascia un commento qui sotto!

Web design