Qual è il modo giusto di lavorare con un grafico? [chiuso]

41

Recentemente, abbiamo lavorato con un grafico (organizzato dal cliente) per fornire la skin per un'applicazione Django + Bootstrap che avevamo creato. Il designer ha fornito una serie di immagini statiche del nuovo layout, insieme a un documento che descrive alcuni attributi tecnici (dimensioni dei caratteri, colori, alcune dimensioni ecc.).

Si è rivelato molto dispendioso in termini di tempo per implementarlo. Sebbene l'intero sito fosse fondamentalmente una prima pagina, una pagina indice e una mezza dozzina di pagine di dettaglio, ho trascorso almeno 5 giorni a implementare le modifiche CSS e HTML. Quindi andrò su un arto e chiamo questo The Wrong Way .

Il mio approccio di base era:

  1. Confronta l'immagine statica e il rendering corrente e nota una differenza.
  2. Indovina quale cambiamento sarebbe necessario nel CSS / HTML
  3. Apporta la modifica
  4. vai al passaggio 1.

Alcuni dei problemi particolari non riguardavano il fatto che il design includesse un cambiamento da 8 colonne a 12, alcune immagini fornite nel formato sbagliato (le versioni di .png possono essere visualizzate in modo diverso su diverse combinazioni browser / piattaforma), problemi che cercano di annullare Bootstrap styling, la solita lotta CSS per ottenere il rendering perfetto dei pixel ecc. E occasionalmente ho dovuto riorganizzare i template HTML per ottenere un certo comportamento.

Qual è la strada giusta?

    
posta Steve Bennett 29.05.2013 - 04:11
fonte

6 risposte

15

Nella mia azienda, ci sono alcune persone specializzate in questo lavoro.

Sono designer. E conoscono l'HTML. Possono essere un ponte tra i progettisti e gli ingegneri front-end; che di solito sono. In questo modo, dobbiamo solo integrare il loro HTML.

Questo è un lavoro difficile. C'è un motivo per cui siti come "PSD to HTML in 24h" funzionano bene. La soluzione nella nostra azienda è avere persone specializzate in questo. Per noi, lavorare con l'HTML è un gioco da ragazzi.

Non c'è un proiettile d'argento.

    
risposta data 29.05.2013 - 09:54
fonte
6

Non sono sicuro che esista un "modo giusto", ma un modo ragionevolmente efficace di collaborare con un designer è innanzitutto quello di costruire un sistema senza stile che utilizza modelli e consente di scambiare facilmente tutti i modelli. Quindi, una volta che si dispone di un'interfaccia funzionale ma senza stile (o minimamente stilizzata), si consegnano i risultati al designer per lo styling.

Un buon esempio di questo tipo di design pattern sarebbe jQueryUI ( link )

    
risposta data 29.05.2013 - 07:51
fonte
3

In primo luogo, devo ammettere che non ho mai lavorato finora con i front-end del Web.

Ma penso che potrebbe essere una buona pratica per te e il designer scrivere in prosa come dovrebbe essere il design finale. In questo modo puoi essere più sicuro che sia coerente, perché potrebbe avere un cattivo odore se tu stessi descrivendo tabelle diverse per ogni pagina. La prosa può semplificare la tua implementazione, perché in realtà stai scrivendo il codice, che è più vicino all'implementazione rispetto alle immagini.

Prova anche a fare in modo che il designer si concentri sui componenti, non su pagine intere. Se ottieni correttamente i componenti di una pagina, comporli su tutta la pagina è un passo molto più semplice.

    
risposta data 29.05.2013 - 09:19
fonte
0

Ho sviluppato HTML / CSS con diversi designer e, come già detto, non esiste un "proiettile d'argento". I designer con cui ho lavorato non conoscevano molto (niente) su html / css. Alcuni di loro avevano una certa esperienza nel webdesigning e devo dire che quando hanno questa conoscenza, finisce sempre con lo sviluppo e il "sito web migliore" più facilmente quando è coinvolta la reattività di una UX.

Immagino che alcune aziende che cercano un sito web non lo sappiano / ignorano: chiunque può dire che è un designer grafico / webdevelopper / webdesigner / progettista dell'interfaccia utente con conoscenze di base (o addirittura nessuno, sì, l'ho visto) in o. Mentre i "veri" possono fare il miglio e produrre siti web sostenibili ed efficaci. Cerco di "educare" il cliente e spiegare che il Web design coinvolge competenze che i "grafici" di sola stampa non hanno. Quando funziona, investo abitualmente il cliente verso i designer con cui ho già lavorato e con cui ho un flusso di lavoro comune.

Ciò detto, spesso accade per molte ragioni che si finisce per costruire siti Web con persone con competenze grafiche e senza competenze di webdesigning. In questa situazione, il modo migliore che ho trovato per risparmiare tempo di codifica e non finire con un layout undevellopable è essere coinvolto nel processo di design e comunicare con il designer e spiega cosa puoi / non puoi fare e cosa sarebbe più semplice / migliore dal tuo punto di vista.

Anche se questo può essere difficile da organizzare in alcune situazioni, è fondamentale spiegare al cliente e al progettista che "se pensi che il webdesigning faccia parte di un progetto web, finisci per risparmiare tempo, denaro e risorse" e che sarai felice di prendere parte al processo di progettazione per risparmiare tempo e denaro.

Questo è il worflow che cerco di seguire nella maggior parte dei progetti:

  1. Il progettista crea standard grafici se non esistono (io di solito non sono coinvolto qui. Cerco solo di suggerire il designer verso i caratteri web compatibili ex: google font)
  2. Mokup realizzato dal designer. Sono coinvolto qui e lavoro con il progettista per creare layout compatibili con il web (soprattutto per quelli reattivi) prima che il client lo veda .
  3. client convalida mokup
  4. Codice il mokup

Il tempo trascorso a comunicare e lavorare con il progettista è stato salvato durante il processo di codifica e questo si traduce in un codice più semplice, più gestibile e più pulito.

Questo non ti salva da un designer felice che ti chiama venerdì sera con un bel mokup che il cliente ha visto e che ora vuole con questa frase: "Ehi pallido, potresti codificarlo per me, la scadenza è .. . ieri!" Quindi l'intera teoria va in pezzi e se stai cercando lavoro in quel momento, sei a posto per tutto il week end.

Conclusione:

Non penso che questo sia molto diverso da qualsiasi codice relativo a non progetto, il modo migliore per lavorare con altre persone è comunicare con loro.

    
risposta data 08.10.2014 - 15:42
fonte
-1

Come progettista grafico diventato sviluppatore web completo, per me questa è stata finora la parte facile. Trovo che molte volte ci sia un divario di comunicazione tra un team di progettazione UX e gli sviluppatori che implementano il prodotto. Certo, i documenti aiutano, ma il processo può iniziare a sentirsi molto più naturale una volta che alcune conversazioni faccia a faccia sulla strategia si verificano. Inoltre, so che il tempo è scarso per tutti, ma cerco di essere coinvolto durante la fase di progettazione e layout. Ciò può aiutare enormemente quando è necessaria la comunicazione tra un progettista e uno sviluppatore. Il progetto assume più di uno sforzo di squadra unificato e meno di uno scenario "Bene, ho fatto la mia parte, oltre il muro". Ho trovato molto utile avere il lavoro di progettazione e sviluppo in parallelo, incoraggiare il team di progettazione a fornirvi wireframe nelle prime fasi del processo. In questo modo, puoi eseguire un pass di stile che si occupa esclusivamente di layout e posizionamento. Quindi, man mano che i deage diventano più ricchi e completi. Prendi un altro pass CSS per l'aspetto e altri attributi di stile. Almeno questo ti impedisce di concentrarti su tutto in una volta.

    
risposta data 17.08.2015 - 13:41
fonte
-2

Sto affrontando un problema simile. Ho l'idea che strumenti come Greasemonkey o Tampermonkey possano essere usati a tale scopo. Proprio la settimana scorsa, ho chiesto commenti su questa idea: Come esternalizzare l'interfaccia utente di un'applicazione Web dinamica? , ma non ha ottenuto risposte soddisfacenti.

Con questi strumenti puoi inserire CSS, HTML e Javascript in una pagina. Nella mia idea, si fornisce l'URL del sito di lavoro al progettista e si aspettano in cambio gli script Greasemonkey. In teoria dovresti essere in grado di integrarli rapidamente al sito esistente. In questo modo, sarà compito del designer scrivere HTML e CSS e rendere il sito effettivamente funzionante. Ciò richiede però molte più abilità di programmazione dal lato del designer.

So che questa idea richiede molta elaborazione. Ma non l'ho ancora provato e non so se qualcun altro lo sta facendo. Potrebbero esserci alcuni problemi con l'implementazione.

    
risposta data 29.05.2013 - 05:44
fonte

Leggi altre domande sui tag