Ehi designer, stai facendo impazzire i tuoi colleghi sviluppatori?
È probabile che tu abbia alcune abitudini che non si traducono in modo particolare per il codice, e sta rendendo la vita dura per lo sviluppatore che lavora con te sui progetti. Vuoi essere un collega migliore (e amico)?
Scopri come comunicare e progettare meglio in modo che gli sviluppatori ti amano. Velocizzerà i progetti e renderà la vita lavorativa più facile. E non è questione di portare caramelle alle riunioni. Puoi farti amare dagli sviluppatori apportando lievi modifiche al tuo modo di lavorare.
Il problema più grande tra designer e sviluppatori è che lavorano spesso in bolle. Gli individui o le squadre non iniziano a parlare di un progetto fino a quando non viene completata la prima bozza del progetto. Poi c'è un passaggio dal progettista allo sviluppatore.
Sospiro.
Questo non è il modo di lavorare. I progettisti e gli sviluppatori dovrebbero essere coinvolti insieme fin dall'inizio per parlare di come un progetto si unirà. Mentre il progettista potrebbe concentrarsi su colori e caratteri tipografici e immagini, lo sviluppatore può fornire informazioni su usabilità, funzionalità e prestazioni.
I progettisti e gli sviluppatori dovrebbero avere una buona idea di come si presenta l'altra parte. I progettisti dovrebbero comprendere abbastanza codice e usabilità per parlare con gli sviluppatori e comprendere le sfide; gli sviluppatori dovrebbero avere una piccola conoscenza della teoria del design in modo che possano dare suggerimenti quando le idee di progettazione non sono adatte per il web.
Una delle cose più importanti che un designer può fare è preparare e impacchettare i file nello stesso modo ogni volta.
Quante volte hai aperto un documento Photoshop con centinaia di livelli senza nome? Non dare questo tipo di file a uno sviluppatore. Ogni livello e stile, indipendentemente dal software utilizzato, dovrebbe essere denominato in modo appropriato.
Quante volte hai aperto un documento Photoshop con centinaia di livelli senza nome?
Stili, campioni di colore e tipografia dovrebbero essere coerenti in tutto il design. (Un pulsante non dovrebbe apparire diverso da una pagina all'altra).
Assegna nomi file e stili allo stesso modo per ogni progetto. Raggruppa elementi simili in modo simile e utilizza un sistema di cartelle coerente. In questo modo lo sviluppatore non deve reimparare come trovare parti ed elementi con ogni nuovo progetto.
Una delle più grandi sfide per i progetti di design che includono la stampa e pezzi digitali è la gestione tipografica. Non utilizzare font desktop per progetti di stampa per progetti Web o app e supponiamo solo che funzioneranno. (Spesso non lo fanno).
Per i progetti digitali, optare per Google Fonts per la tipografia. Ciò significa che potrebbe essere necessario trovare un carattere tipografico simile per il Web in modo che corrisponda a quello che si sta utilizzando per la stampa. (Va bene.)
Non fare lo sviluppatore a fare questo per te. Scegli i Google Fonts comparabili e usali sin dall'inizio. Nella tua guida di stile puoi anche annotare i caratteri tipografici stampati o digitali.
La ragione di questo è semplice: l'incorporamento dei caratteri può essere un po 'complicato. Inoltre, i Google Fonts sono gratuiti e ti garantiscono di non dover sostenere costi di progetto aggiuntivi. (Mentre ci sei, pensa di fare la stessa cosa con le icone e usa un pacchetto come Font Awesome, che permette allo sviluppatore di disegnare icone usando i CSS, non importa un sacco di file di immagini!)
Mentre siamo sul tema delle risorse immagine, esportare e impacchettare i file correttamente è super importante. Mentre uno sviluppatore può aprire ed esportare tutti i file immagine per soddisfare le loro esigenze, puoi chiedere di cosa hanno bisogno e farlo lungo la strada.
Ciò ti assicura di ottenere le colture che desideri sulle immagini, mentre comprime i file per aiutare il tuo sito web a caricarsi rapidamente.
Non provare a farlo da solo. Chiedi allo sviluppatore come i file devono essere salvati, nominati e compressi per il miglior uso.
Ci sono così tante dimensioni del dispositivo e proporzioni da tenere in considerazione quando si progettano siti Web e app mobili. Come designer, devi conoscere le dimensioni, i margini, i padding, ecc. Del canvas per creare un mockup effettivamente utilizzabile.
Parla allo sviluppatore prima di iniziare a disegnare per assicurarti di conoscere l'aspetto dell'ambiente di progettazione prima di iniziare. Non c'è niente di peggio di un design che sembra fantastico in Photoshop o Sketch e cade piatto nella produzione.
Hai bisogno di sapere queste cose in anticipo:
È già stato menzionato alcune volte, ma la comunicazione tra designer e sviluppatore è davvero la chiave per far funzionare tutto questo. La comunicazione può creare o distruggere progetti, influire sulle scadenze e influenzare la progettazione e la funzionalità del progetto finale.
La comunicazione può creare o distruggere progetti
Porta il tuo sviluppatore a pranzo. Conosci loro. Fai molte domande lungo la strada. Se non sei sicuro che qualcosa funzioni o no, basta chiedere. Gli sviluppatori non sono persone spaventose ed è molto più facile rispondere a una domanda nella fase iniziale del processo piuttosto che dover ripensare l'intero concetto.
Mentre parli con lo sviluppatore e fai domande, vai più in profondità. Scopri alcune nozioni di base sullo sviluppo se non hai già queste competenze nel tuo arsenale di progettazione.
I progettisti che lavorano su progetti digitali dovrebbero versi stessi in:
Potresti non scrivere mai codice, ma imparare i principi di sviluppo ti renderà un designer migliore perché capirai il valore degli strumenti e dei flussi di lavoro.
Anche il processo di progettazione si estende allo sviluppo. Designer, è necessario riconoscere che lo sviluppatore è altrettanto vitale per il processo di progettazione come lo sei tu.
Con questo in mente, crea una guida di stile "vivente" che non includa solo colori e caratteri, ma anche componenti. Tutti dovrebbero poter accedere e aggiornare il documento mentre il progetto prende vita.
Una buona guida di stile aiuterà tutti coloro che lavorano su un progetto a mantenere la coerenza con elementi visivi, a fornire un contesto per le scelte di progettazione, a fungere da punto di collaborazione per il progetto e ad aiutare a standardizzare il codice. La guida allo stile di vita consente a tutti di condividere idee e fornire indicazioni durante tutto il progetto. Non è solo un documento che qualcuno crea proprio prima che un progetto venga pubblicato.
Metti le seguenti informazioni nella guida allo stile per sfruttarla al massimo:
Rispetta la griglia. Nella progettazione di siti Web reattivi, la griglia è più di una semplice linea guida per il posizionamento di elementi sullo schermo, ma può anche stabilire dove gli elementi vanno a diverse dimensioni dello schermo e come le colonne si impilano e rimescolano.
La griglia può aiutarti a progettare e mantenere il flusso. (La sfida è che non puoi arbitrariamente infrangere le regole di progettazione.)
Pensaci in questo modo: il tuo design ha quattro blocchi di contenuto allineati sullo schermo in fila (con le stesse ampiezze di gronda) su un monitor desktop a schermo intero. Quindi su una tavoletta, questi blocchi si trasformano in due colonne, con due righe. Su un dispositivo mobile si spostano per formare un'unica colonna con quattro righe.
Capire come la griglia influisce sulla dimensione degli oggetti e su come gli oggetti si spostano su dispositivi diversi è importante perché può dettare come si progetta per il contenuto che si possiede. Pensa ancora allo stesso scenario. E se avessi cinque blocchi di contenuti? Richiederebbe una riprogettazione per assicurarsi di creare una struttura visiva coerente.
La vera chiave per garantire che i progetti si uniscano con facilità è essere flessibili. Le tecniche di progettazione e gli standard per il web cambiano continuamente. Mentre alcuni progetti ti consentono di essere un pignolo per i dettagli e il design reattivo, non funziona in questo modo.
La regola d'oro quando si tratta di lavorare con gli sviluppatori è ... non essere un idiota.
I designer con cui è facile lavorare guadagneranno più rispetto e avranno migliori relazioni con gli sviluppatori. Ciò porterà a progetti migliori e di maggiore successo. Dovrebbe essere ovvio, ma troppo spesso c'è un sacco di comportamento jerk-ish là fuori. Non cadere in quella trappola.
Sii flessibile, apri e discuti con il tuo sviluppatore. Ti ameranno per questo.