Imparare Photoshop solo per il web design


17

Voglio diventare un web designer, quindi sto guardando molti tutorial video di Photoshop, ma alcuni di questi tutorial non sono utili per la progettazione web. Ad esempio, alcuni film riguardano la pelle, i denti, il disegno di un fiore o la modifica del motivo di un muro o cose del genere. Perché non ho alcuna risorsa specifica per il web design e quei tutorial sono una specie di perdita di tempo per me!

Conosci qualche fonte tutorial per aiutarmi a imparare il web design in Photoshop?

Cosa devo fare per concentrarmi sul web design in Photoshop?

Quali parti di Photoshop sono necessarie per il web design e quali parti no?

Risposte:


15

Ogni strumento, pennello, filtro ed effetto in Photoshop ha il suo scopo nel mondo. Non esiste un semplice "impara bene questo strumento e usalo per tutto" perché strumenti diversi, ecc. Vengono utilizzati per effetti diversi.

Ad esempio, se ti piacciono i pulsanti lucidi leggermente 3dishish lucidi sulla tua pagina (questi erano molto popolari un po 'di tempo fa) avresti bisogno di usare un po' di ombra, diversi gradienti, mascheramento e forse un po 'di tremolio della mano con uno strumento pennello. Per uno sfondo puoi semplicemente usare un colore solido o una sfumatura con una maschera strutturata / a motivi.

Poiché non esiste "una parte di Photoshop" da imparare, la cosa migliore che puoi fare è diventare a tutto tondo usando i vari strumenti. Sfoglia e guarda tutte le varietà di siti. Prendi nota delle funzionalità che ti piacciono, quindi prova a ricrearle tu stesso. Spesso puoi sezionare gli elementi - l'oggetto ha bordi, sfumature, trame, fonti di luce, ecc. - e ricreare qualcosa di simile.

Allo stesso tempo, non riesco a martellare a casa abbastanza forte da progettare molto di più di un semplice Photoshop. La mia raccomandazione sarebbe quella di tenere un corso di design presso il college della comunità locale (o whever) e avere un'idea di cose come equilibrio, colori, spazi bianchi, ecc. Questi concetti spesso fanno la differenza tra apparire professionali e sembrare la zia di qualcuno ( che, in questo scenario, non è un designer di professione ) modificato un modello Geocities.


4
"... c'è molto altro da progettare oltre a Photoshop." Senti senti! +1.
Philip Regan,

1
Photoshop ha una grave mancanza di alcune funzionalità di cui trarrebbe beneficio la progettazione di un layout ... insieme a molti strumenti vettoriali. Potrei passare a Illustrator e utilizzare Photoshop per altre grafiche specializzate. Come personaggi, icone fotorealistiche ...
Muhammad Umer,

17

"Voglio diventare un web designer, quindi sto guardando molti tutorial video di Photoshop"

Conosci HTML, CSS e JS? In caso contrario, iniziare prima da lì.

Photoshop viene quindi utilizzato come strumento per creare elementi grafici compatibili con HTML, CSS e JS.

Non c'è nulla di particolare incentrato sulla "progettazione di siti Web" su strumenti particolari in PhotoShop. È semplicemente uno strumento di creazione e modifica delle immagini.


4

Per progettare siti Web dovresti guardare anche altri modelli. Considera alcuni degli effetti che potresti utilizzare come peeling di pagina, collegamenti alla barra di navigazione. Molto di questo non è difficile da fare in Photoshop, ma richiederà un po 'di ricerche su Google. Controllo spesso Dribbble che è una meravigliosa comunità di design. È molto popolare, quindi vedrai sicuramente molte nuove tecniche che i web designer stanno implementando.

Ma per avere una panoramica generale, prova a lavorare con una serie di tutorial appositamente utilizzati per la progettazione di siti Web. Anche tutorial davvero di base. Perché questi illustreranno i passaggi per te e puoi replicarli su progetti futuri. Ho aggiunto 2 risorse davvero fantastiche qui sotto, spero che tu possa verificarle. Ti garantisco che troverai un tutorial per template per principianti che ti piace - e imparerai molto!


4

Se si desidera progettare siti Web, sarebbe molto meglio lavorare con Fireworks che Photoshop. PS è, in sostanza, un'applicazione di manipolazione fotografica e, sebbene i suoi strumenti possano essere utilizzati per i wireframe, non sono particolarmente efficienti. In altre parole: usare PS per il web design è come usare PS come applicazione DTP su InDesign. Sì, può essere fatto, ma non è un ottimo modo per farlo e perderai a lungo termine.

I vantaggi offerti da Fireworks sono:

  • molto più facile lavorare con vere forme vettoriali
  • Molto più facile definire le dimensioni dei pixel; nessun offuscamento dei colpi su tratto ecc.
  • può definire "pagine mastro" per apportare modifiche di progettazione a livello di sito ai tuoi modelli, senza dover ripetere ogni singola immagine
  • più semplice creare una libreria di controlli dell'interfaccia utente comunemente utilizzati (utile per la progettazione di app Web)
  • Interfaccia utente più vicina alla tipica interfaccia dell'applicazione desktop, il che significa una curva di apprendimento più superficiale

L'unico vero vantaggio che Photoshop porta sul tavolo è il fatto

  • il rendering dei caratteri è migliore
  • i tuoi colleghi conosceranno l'applicazione un po 'meglio

1
Sì, Fireworks è migliore, altrimenti devi usare sia Illustrator che Photoshop e passare avanti e indietro.
Cakey,

0

Sulla nota di "c'è di più da progettare di Photoshop": ho trovato questo approfondito: http://naldzgraphics.net/tips/what-designers-need-to-know-about-typography/


Soffre di prosa truccata e occasionali errori grammaticali. Posso sintetizzarlo (e migliorarlo) in una casella di commento: usa il buon gusto in tutte le cose e cerca e rendi molto chiaro le seguenti parole: font vs. font , serif vs. sans serif, crenatura, tracciamento, spaziatura , iniziale, allineamento, a filo, giustificato. L'articolo non fornisce definizioni chiare o complete per la maggior parte di questi; le spiegazioni sono superficiali e sembrano di seconda mano.
Wildcard il

Inoltre è solo una risposta al link.
Wildcard il

0

Photoshop è solo uno strumento e meglio conosci lo strumento, meglio sarai in grado di usarlo per fare quello che vuoi fare. Tuttavia, c'è molto altro da progettare oltre a conoscere Photoshop.

Questa mentalità che devi solo imparare a Photoshop e poi diventerai un designer equivale a definirti un costruttore perché sai come usare un martello o un meccanico perché puoi usare una chiave inglese. Il design in quanto tale sta facendo funzionare bene le cose (e probabilmente ha un bell'aspetto nel processo), ha ben poco a che fare con la conoscenza di Photoshop / Illustrator / InDesign / Sketch / qualunque cosa, ma come usi questi strumenti per realizzare le tue idee.

Ci sono tonnellate di tutorial cattivi su YouTube e tonnellate di quelli buoni. Scopri come fare tutto, le tecniche saranno comunque utili in ogni momento. Creative Block ha anche dei simpatici tutorial. Inoltre, esamina la teoria del colore, la teoria del layout, la tifografia ( Stop Stealing Sheep di Eric Spiekerman e Scopri come Type Works è un'ottima introduzione) e altre abilità di progettazione grafica più tradizionali sono abilità molto più preziose in cui investire il tuo tempo rispetto al semplice apprendimento Photoshop.

Inoltre, come già accennato in precedenza, l'apprendimento di HTML / CSS / JS è decisamente un vantaggio anche per il lavoro di web design.


-2

Puoi convalidare il tuo file PSD per problemi di compatibilità web noti qui https://www.oss-usa.com/web-preflight?promo=web-preflight è gratuito


Ciao Nik, benvenuto in GDSE e grazie per la tua risposta. Non riesco a vedere come questo risponda alle domande, potresti per favore elaborare? Grazie!
Vincent,

Ho esperienza nello sviluppo web e ho incontrato molti principianti nel web design. Ci sono errori comuni che chiunque può fare. Ad esempio, i pixel decimali nelle dimensioni dei caratteri. Questo servizio può aiutare i principianti.
Nik,

Grazie. Sarebbe comunque di grande aiuto se desideri condividere la tua esperienza e svelare quegli errori. In questo modo, la tua risposta avrà ancora (molto!) Valore nel caso in cui il collegamento si interrompa in un secondo momento. Il marcio dei link è il motivo per cui non siamo molto interessati alle risposte (principalmente) solo ai link e il motivo per cui ho votato la tua risposta verso il basso. Non scoraggiarti, per favore, sappiamo che l'utilizzo di questo sito può essere una curva di apprendimento. Noi siamo felici di averti, continuare a contribuire!
Vincent,
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.