Apprendre Photoshop juste pour la conception web


17

Je veux devenir concepteur Web, je regarde donc beaucoup de didacticiels vidéo Photoshop, mais certains de ces didacticiels ne sont pas utiles pour la conception Web. Par exemple, certains films parlent de peau, de dents ou de dessin d'une fleur ou de modification du motif d'un mur ou de choses comme ça. Parce que je n'ai pas de ressource spécifique pour la conception web, et ces tutoriels sont une sorte de perte de temps pour moi!

Connaissez-vous une source de tutoriel pour m'aider à apprendre la conception Web dans Photoshop?

Que dois-je faire pour me concentrer sur la conception Web dans Photoshop?

Quelles parties de Photoshop sont nécessaires pour la conception Web et quelles parties ne le sont pas?

Réponses:


15

Chaque outil, pinceau, filtre et effet dans Photoshop a sa propre utilité dans le monde. Il n'y a pas de simple "bien apprendre cet outil et l'utiliser pour tout" car différents outils, etc. sont utilisés pour différents effets.

Par exemple, si vous aimez les boutons brillants brillants légèrement 3dish sur votre page (ils étaient très populaires il y a un certain temps), vous devrez utiliser de l'ombre, plusieurs dégradés, du masquage et peut-être un peu de jigger à la main avec un outil de pinceau. Pour un arrière-plan, vous pouvez simplement utiliser une couleur unie ou un dégradé avec un masque texturé / à motifs.

Puisqu'il n'y a pas "une seule partie de Photoshop" à apprendre, la meilleure chose que vous puissiez faire est de devenir bien équilibré en utilisant les différents outils. Parcourez et regardez toutes les variétés de sites. Prenez note des fonctionnalités que vous aimez, puis essayez de les recréer vous-même. Souvent, vous pouvez disséquer les éléments - l'objet a-t-il des bordures, des dégradés, des textures, des sources de lumière, etc. - et recréer quelque chose de similaire.

En même temps, je ne peux pas marteler assez fort pour qu'il y ait plus à concevoir que Photoshop. Ma recommandation serait de suivre un cours de design au collège communautaire local (ou n'importe où) et d'avoir une idée des choses comme l'équilibre, les couleurs, les espaces blancs, etc. Ces concepts font souvent la différence entre avoir l'air professionnel et ressembler à la tante de quelqu'un ( qui, dans ce scénario, n'est pas un concepteur de métier ) a modifié un modèle Geocities.


4
"... il y a plus à concevoir que Photoshop." Entendre entendre! +1.
Philip Regan

1
Photoshop manque sérieusement de fonctionnalités dont bénéficierait la conception d'une mise en page ... ainsi que de nombreux outils vectoriels. Je pourrais passer à l'illustrateur et utiliser Photoshop pour d'autres graphiques spécialisés. Comme des personnages, des icônes photoréalistes ...
Muhammad Umer

17

"Je veux devenir concepteur de sites Web, donc je regarde beaucoup de didacticiels vidéo sur Photoshop"

Connaissez-vous HTML, CSS et JS? Sinon, commencez par là.

Photoshop est ensuite utilisé comme un outil pour créer les graphiques qui vont avec le HTML, CSS et JS.

Il n'y a rien de particulier à la conception de sites Web sur des outils particuliers dans PhotoShop. Il s'agit simplement d'un outil de création et d'édition d'images.


4

Pour concevoir des sites Web, vous devez également consulter d'autres maquettes. Considérez certains des effets que vous pourriez utiliser comme les décollements de page, les liens de la barre de navigation. Une grande partie de cela n'est pas difficile à faire dans Photoshop, mais nécessitera un peu de recherche sur Google. Je vérifie souvent Dribbble qui est une merveilleuse communauté de design. C'est très populaire, donc vous verrez sûrement beaucoup de nouvelles techniques que les concepteurs de sites Web mettent en œuvre.

Mais pour obtenir un aperçu général, essayez de travailler avec un ensemble de didacticiels spécifiquement utilisés pour la conception de sites Web. Même des tutoriels vraiment basiques. Parce que ceux-ci décriront les étapes pour vous, et vous pouvez les reproduire sur de futurs projets. J'ai ajouté 2 très bonnes ressources ci-dessous, j'espère que vous les vérifierez. Je vous garantis que vous trouverez un tutoriel de modèle pour débutant que vous aimez - et vous apprendrez beaucoup!


4

Si vous souhaitez concevoir des sites Web, vous feriez mieux de travailler avec Fireworks que Photoshop. PS est, au fond, une application de manipulation de photos, et bien que ses outils puissent être utilisés pour les wireframes, ils ne sont pas particulièrement efficaces. Autrement dit: utiliser PS pour la conception Web, c'est comme utiliser PS en tant qu'application DTP sur InDesign. Oui, cela peut être fait, mais ce n'est pas une excellente façon de le faire, et vous perdrez à long terme.

Les avantages apportés par Fireworks sont:

  • beaucoup plus facile de travailler avec de vraies formes vectorielles
  • BEAUCOUP plus facile à définir les dimensions des pixels; aucun flou de coups sur l'étirement, etc.
  • peut définir des «pages maîtres» pour apporter des modifications de conception à l'échelle du site à vos maquettes, sans avoir à refaire chaque image
  • plus facile de créer une bibliothèque de contrôles d'interface utilisateur couramment utilisés (utile pour la conception d'applications Web)
  • Interface utilisateur plus proche de l'interface d'application de bureau typique, ce qui signifie une courbe d'apprentissage moins profonde

Les seuls avantages réels que Photoshop apporte à la table sont le fait que

  • le rendu des polices est meilleur
  • vos collègues connaîtront un peu mieux l'application

1
Oui, Fireworks est meilleur, sinon vous devez utiliser à la fois Illustrator et Photoshop et basculer d'avant en arrière.
Cakey

0

Sur la note "il y a plus à concevoir que Photoshop": j'ai trouvé cela perspicace: http://naldzgraphics.net/tips/what-designers-need-to-know-about-typography/


Il souffre de prose sur pilotis et d'erreurs de grammaire occasionnelles. Je peux le résumer (et l'améliorer) dans une boîte de commentaire: utilisez le bon goût en toutes choses, et recherchez et clarifiez les mots suivants: police vs police , serif vs sans serif, crénage, suivi, espacement , menant, alignement, affleurant, justifié. L'article ne fournit pas de définitions claires ou complètes pour la plupart d'entre elles; les explications sont superficielles et semblent de seconde main.
Wildcard

C'est aussi une réponse par lien uniquement.
Wildcard

0

Photoshop n'est qu'un outil et mieux vous le connaissez, mieux vous pourrez l'utiliser pour faire ce que vous voulez faire. Cependant, il y a plus à concevoir que de simplement connaître Photoshop.

Cet état d'esprit dont vous avez juste besoin pour apprendre Photoshop et ensuite vous serez un concepteur revient à vous appeler un constructeur parce que vous savez comment utiliser un marteau ou un mécanicien parce que vous pouvez utiliser une clé. Le design en tant que tel fait bien fonctionner les choses (et semble probablement bien dans le processus), il a très peu à voir avec Photoshop / Illustrator / InDesign / Sketch / peu importe, mais comment vous utilisez ces outils pour concrétiser vos idées.

Il y a des tonnes de mauvais tutoriels sur YouTube et des tonnes de bons aussi. Apprenez à tout faire, les techniques seront utiles de toute façon. Creative Block propose également de jolis didacticiels. Mais en outre, examinez la théorie des couleurs, la théorie de la mise en page, la typhographie ( Stop Stealing Sheep & Find Out How Type Works est une très bonne introduction d' Eric Spiekerman ) et d'autres compétences de conception graphique plus traditionnelles sont des compétences beaucoup plus précieuses pour investir votre temps que d'apprendre. Photoshop.

En outre, comme quelqu'un l'a mentionné précédemment, l'apprentissage du HTML / CSS / JS est également un avantage certain pour le travail de conception Web.


-2

Vous pouvez valider votre fichier PSD pour les problèmes de compatibilité Web connus ici https://www.oss-usa.com/web-preflight?promo=web-preflight c'est gratuit


Salut Nik, bienvenue à GDSE et merci pour ta réponse. Je ne vois pas comment cela répond aux questions, pourriez-vous s'il vous plaît développer? Merci!
Vincent

J'ai de l'expérience en développement web et j'ai rencontré beaucoup de débutants en webdesign. Il y a des erreurs courantes que n'importe qui peut faire. Par exemple, des pixels décimaux dans les tailles de police. Ce service peut aider les débutants.
Nik

Merci. Il serait cependant très utile si vous souhaitez partager votre expérience et préciser ces erreurs. De cette façon, votre réponse aura toujours (beaucoup!) De valeur au cas où le lien se briserait plus tard. La pourriture des liens est la raison pour laquelle nous ne sommes pas très intéressés par les réponses (principalement) liées uniquement aux liens, et la raison pour laquelle j'ai voté contre votre réponse. Ne vous découragez pas, s'il vous plaît, nous savons que l'utilisation de ce site peut être une courbe d'apprentissage. Nous sommes heureux de vous avoir, continuez à contribuer!
Vincent
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.