Non so disegnare. Come posso fare applicazioni lucidate?


41

Non sono un graphic designer. Sono abbastanza cattivo nel disegnare qualsiasi cosa. Faccio fatica a costruire cose che sembrano belle come applicazioni "campione" in bundle con strumenti di sviluppo; principalmente perché non ho uno squat in termini di risorse artistiche.

Quali strategie potrei prendere per mitigare questo?


3
Giusto per essere chiari: vuoi creare GUI che non utilizzano l'aspetto grafico della piattaforma predefinita? La prima domanda sarebbe quindi: perché non fare affidamento sul sistema operativo per disegnare l'interfaccia utente?
Konrad Rudolph,

2
@KonradRudolph: Anche con l'aspetto predefinito (che in realtà è quello che trovo più piacevole di qualsiasi altra cosa il più delle volte) ci sono ancora risorse artistiche tipicamente necessarie per un'applicazione raffinata, come le icone.
Billy ONeal,

5
Risorse icona: usa set di icone Open Source. ;-) Ci sono alcuni tra quelli abbastanza di alta qualità, ad esempio, di Silk Icons famfamfam o Glyphicons ... Personalmente preferisco evitare troppi altri elementi grafici, ma per coloro contratto di lavoro è probabilmente la soluzione migliore ...
Konrad Rudolph

method.ac potrebbe essere utile, una volta lanciato.
Max

Risposte:


24

Personalmente non penso che tu debba essere bravo artisticamente per creare piacevoli interfacce utente .

Ciò che rende una buona interfaccia utente non dipende dalla creatività, ma è più correlata a un paio di linee guida ben definite. Se segui queste linee guida e ne pratichi alcune puoi creare tu stesso grandi interfacce.

Suggerirei di fare quanto segue ...

  • Leggi cosa rende una buona interfaccia utente. (principalmente online)
  • Ricerca e trova alcune interfacce utente che ti piacciono.
  • Confronta diversi buoni progetti e prova a scegliere cose simili tra loro.
  • Ora guarda il tuo design e vedi se hai quegli elementi.
  • Prova a ricreare l'interfaccia utente in modo che sia simile a quelle che ti sono piaciute.

Prevedo che se fai questo esercizio per una settimana o due (e se mi chiedi, una settimana o due per imparare a progettare buone interfacce non è così tanto tempo), imparerai la maggior parte di ciò che rende una buona interfaccia utente .

Ho scoperto solo un paio di cose che rendono piacevoli le interfacce utente:

  • Semplicità
  • Coerenza (colori, caratteri, utilizzo di pulsanti, collegamenti, ecc ...)
  • Spaziatura
  • Meno è di più (nascondi il più possibile all'utente senza ridurre l'usabilità)
  • Non utilizzare sfondo bianco e caratteri neri. Assicurati che il contrasto sia abbastanza buono, ma di solito cambia lo sfondo in una leggera tonalità di grigio mentre il tuo carattere diventa grigio scuro.

Inoltre ... non iniziare con il design. Inizia con la funzionalità e lascia che il design si evolva. Inoltre, sperimenta! Non arrabbiarti se non sembra perfetto dopo 1-2 "iterazioni". Migliora nel tempo. Ma soprattutto, devi provare .


3
Sto parlando di polacco, non di UX. Sapere come progettare un'interfaccia utente "piacevole" non aiuta (ad esempio) le tue icone ad avere un aspetto migliore.
Billy ONeal,

5
@BillyONeal: Mi dispiace ma la tua domanda per me era molto più ampia di "progettare icone".
c_maker,

3
È; le icone sono solo un semplice esempio. Il mio punto era che questo non si "nasconde dietro una scusa" - ci sono parti legittime del design dell'interfaccia utente decente che richiedono, beh, arte. Ci sono interfacce belle e inusabili, interfacce utilizzabili e brutte, interfacce inutili e brutte e interfacce utilizzabili e belle; un'applicazione raffinata deve essere utilizzabile e visivamente accattivante. Affronta bene l'usabilità in questa risposta (+1); ma la "bella" è anche una preoccupazione legittima.
Billy ONeal,

Penso che il colore del carattere / colore di sfondo stia andando nella direzione giusta qui. Il contrasto è stato uno dei primi elementi per cui ho ricevuto feedback pubblici dal primo sito che abbia mai pubblicato. Forse alcuni altri suggerimenti, come come scegliere / applicare il colore - quanti? Uno o due? Di Più? Chiaro o scuro? Metterlo nei titoli? Frontiere? Sfondo? Tutto / nessuno / alcuni dei precedenti?
Stoive,

12

La mia abilità artistica è di circa 5 ° grado in una buona giornata :). Assumo un graphic designer, sia professionalmente al lavoro, sia mia moglie, che ha eccellenti capacità artistiche e ama usarle.

Si noti che nella mia mente il design grafico non è UI / UX design. O faccio la maggior parte di UX, o impiego un esperto di UX per mantenere il controllo di UX, che quindi collabora con GD per renderlo carino. Anche se sono sicuro che ci sono buoni professionisti di UX / GD combinati, ho avuto pessime esperienze con GD che hanno fatto cose che sembravano belle, avevano UX molto cattive ed erano obsolete in un paio di mesi e non mi assumerò questo rischio fino a quando ho lavorato con il GD per un paio di progetti.


1
Quindi, paga qualcuno per farlo, o fatti attaccare da qualcuno che può farlo gratuitamente? : p. Cosa succede se è troppo presto per pagare un designer - prova di concetto o provare la funzionalità? C'è bisogno di un'attenzione estetica minima al software, affinché le persone con cui dimostrerò il mio software siano distratte da colori e caratteri sgargianti per i quali non so fare meglio.
Stoive,

2
@Stoive. Ottimo punto, ora mi hai iniziato. Le impressioni iniziali sono davvero importanti. Per tutti i non ingegneri (e molti ingegneri), il GD è di solito critico, purtroppo supera la progettazione e l'ingegneria UX di diversi ordini di grandezza. Rendi la grafica luminosa e brillante e le gazze si affollano sul prodotto, non importa quanto sia schifo. Prendi lo sbagliata GD ......
mattnz

1
Per elaborare: ho già convinto un cliente ad assumere un graphic designer in precedenza (il design dell'interfaccia utente è ok, la grafica sono orrendo), affermando che una buona grafica proietta la fiducia e l'affidabilità degli utenti. In questo caso, il cliente stava già pagando (le sue idee, io stavo solo scrivendo un codice), ma in altre circostanze è necessario trasmettere fiducia e affidabilità ai clienti prima di poter toccare qualsiasi somma per le risorse di progettazione grafica. Oppure, come per l'OP (progetti per hobby?), I soldi non saranno mai coinvolti: assumere un designer non è fattibile, ma la presentazione è ancora importante.
Stoive,

9

Se stai cercando risorse grafiche, ci sono alcuni siti Web che raccolgono grafica di alta qualità per l' uso gratuito :

  • Bootstrap per probabilmente il migliore (ma sicuramente il più caldo adesso) framework web dell'interfaccia utente
  • Glifi per un set di icone che integra il framework dell'interfaccia utente Bootstrap di Twitter
  • Modelli sottili per, bene, motivi di sfondo sottili
  • Le icone Silk di FamFamFam che vengono utilizzate in molti software dappertutto
  • Mercato creativo per diversi elementi

E molti altri, come il progetto artistico GNOME che include anche molte risorse grafiche gratuite.

Non essendo il meno creativo e senza avere un'educazione nel design, mi sforzo sempre dalla parte del conservatorismo: usare schemi consolidati (ad es. Quadri) e deviare il meno possibile dai percorsi calpestati. Questo non sarà necessariamente molto interessante ma almeno minimizzi le possibilità di fallimento e disastro UX.

Picasso ha affermato che "i grandi artisti rubano", ma in realtà sono soprattutto gli hack privi di talento, e guarda dove questo ha portato Microsoft e Samsung: a piattaforme di grande successo.


8

Puoi assumere specialisti per questo genere di cose, ma non hai bisogno di innata capacità artistica per apprendere alcune tecniche di base. Il mio corso di laurea in realtà ha richiesto un semestre di "arte per ingegneri". Prendere una o due lezioni al college della comunità locale potrebbe essere molto utile. Non sarai ancora bravo come le persone appositamente addestrate sul campo, ma puoi sicuramente migliorare al punto in cui i tuoi programmi sembrano più professionali.

Ci sono anche libri rivolti ai relativi dilettanti. Un libro che ho trovato utile per il web design è The Principles of Beautiful Web Design di Jason Beaird. Anche se i tuoi progetti non migliorano molto, ottenere un po 'di istruzione può aiutarti a verbalizzare meglio ciò che non va in un design. Invece di dire sempre "So che sembra male, ma non riesco a capire perché", sarai in grado di individuare problemi come crenatura cattiva o mancanza di spazio negativo, e definire il problema è metà della battaglia.


3

Quello che potresti cercare è "UI / UX Design for Developers". Un libro correlato a questo argomento è la progettazione dell'interfaccia utente per programmatori

Se non stai cercando la progettazione dell'interfaccia utente / UX ma stai cercando di migliorare le capacità di progettazione grafica, consiglierei di trovare un corso su come utilizzare Adobe Photoshop o Adobe Illustrator (in caso contrario, almeno alcuni tutorial su Internet). Imparando alcune tecniche e guardando il lavoro di altre persone come fonte d'ispirazione, rimarrai sorpreso dalla poca creatività artistica di cui hai bisogno.

Ad esempio, potresti imparare lo strumento sfumatura in Photoshop, insieme allo strumento Rettangolo arrotondato, e puoi creare qualcosa di simile al pulsante "Iscriviti alla newsletter" sulla destra (anche se in questo caso è fatto con CSS puro).


La maggior parte (tutti?) Del libro di Joel si trova sul suo sito: joelonsoftware.com/uibook/fog0000000249.html
Fara,

Sembra che ci siano circa i 2/3 del libro. Non ha capitoli 13-18.
Steve Bennett,

1

Lascia che gli altri "facciano il lavoro per te" sotto forma di utilizzo di framework, template e componenti di gui precostruiti. Ad esempio, non riesco a disegnare o progettare, così come per ogni nuovo progetto Web che faccio, inizio con un modello CSS (dai numerosi siti di modelli CSS gratuiti) per il layout e il design e poi lo "modifico" da lì. Questi modelli includono un design completo che può aiutarti a colmare questa lacuna.

Concordo con c_maker sul fatto che una buona usabilità è un buon design, sebbene sembri che tu sia più specifico sulla parte finale "artistica".

Se stai facendo lavori di web design e layout qui ci sono alcuni di questi siti CSS:
http://www.freecsstemplates.com/
http://www.templatemo.com/
http://www.free-css.com/
http : //www.oswd.org/
http://www.openwebdesign.org/


Funziona bene per gli sviluppatori web credo. Pensa davvero più alla lingua -agnostica qui però. Anche i clienti spessi hanno bisogno dell'amore per l'interfaccia utente.
Billy ONeal,
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.