Grâce à Internet, le graphisme et la programmation se superposent de plus en plus.
En tant que programmeur, je constate constamment que j'ai besoin de connaissances de base en conception graphique, mais que j'ai du mal à localiser des ressources d'apprentissage complètes mais concises, mais plutôt à trouver des bases de connaissances applicables à la tâche à accomplir.
Pouvez-vous nous donner des conseils ou recommander de bons livres, tutoriels, blogs et sites Web qui fournissent aux débutants un aperçu de la conception de sites Web qui ont été, selon votre expérience, des supports pédagogiques efficaces et de grande qualité? Je ne cherche pas de conseils sur l'utilisation des outils de retouche d'image, mais en supposant en saisir les bases, quelles ressources et quels conseils aideront le mieux un nouveau designer à créer des designs d'aspect professionnel?
Réponses:
En ce qui concerne les ressources, vous consultez l'un des sites Web suivants:
la source
L' index des bases du design de Jim Krause m'a fourni un très bon résumé des bases de la composition, de la couleur et du type. Je n'étais pas un grand fan de la plupart de ses propres exemples, mais ils illustrent très bien ses propos et il aborde quelques points précieux que je n'ai pas beaucoup vus mentionnés ailleurs. Et peut-être plus important encore, la lecture de ce livre me rendait vraiment excité de sortir et d’expérimenter les idées qu’il présentait.
la source
Il y a parfois un léger chevauchement entre développement Web et conception Web, mais je ne pense pas que les développeurs Web devraient essayer de devenir des concepteurs à temps plein, à moins d'être disposés à y consacrer autant d'efforts qu'à apprendre à programmer. Ce n'est pas quelque chose que vous pouvez simplement barboter le week-end et être bon à.
Si c'est le cas, vous pourrez apprendre à devenir votre propre concepteur Web (c.-à-d. Créer votre propre conception Web pour tous les sites sur lesquels vous travaillez), alors je vous recommande vivement de suivre une formation formelle (même si vous ne suivez que quelques cours en design collégial). apprendre les bases du design visuel et de la composition. Un livre de style manuel comme celui que Damon a posté pourrait aider, mais vous devrez en fait faire tous les exercices du livre et vous assurer de bien comprendre le contenu. Mais plus important encore, vous devez passer beaucoup de temps à regarder (parcourir des galeries de design en ligne, parcourir des magazines et des annonces de magazines, etc.) et à créer des dessins (télécharger des briefs de design pratiques en ligne ou participer à des concours de design en ligne).
Si c’est pour vous aider à communiquer avec les concepteurs Web / graphiques avec lesquels vous travaillez, procurez-vous simplement un livre qui vous apprendra le vocabulaire (par exemple, les concepts de typographie) et vous concentrant sur la convivialité , l’ accessibilité et la conception UX, ce sera probablement la meilleure utilisation de votre temps. De cette façon, vous pouvez vous impliquer dans la direction créative du projet et participer à la conception des interfaces, mais le concepteur est celui qui crée le "look" ou l'esthétique du site.
Virtuosi Media répertorie beaucoup de bonnes ressources (le réseau Tutsplus est génial en général et Smashing Magazine est une lecture incontournable pour tout développeur / concepteur Web), à quoi j’ajouterais:
la source
Je suis moi-même programmeur et pour moi, les ouvrages suivants ont été très utiles pour moi:
la source
Cela n’est peut-être pas pertinent dans tous les cas, mais pour les programmeurs Web, l’une des choses les plus importantes qui me tient à l’esprit, qui jette un pont, c’est peut-être d’apprendre le CSS de fond en comble, car être capable de bien concevoir ne veut rien dire si vous ne pouvez pas l'intégrer dans votre projet que vous créez.
la source
En 2004, je me suis retrouvé à mi-chemin entre les deux mondes, comme je l'avais passé la majeure partie de ma vie. Je connaissais le Web depuis HTML 3.2 à l'époque du commerce électronique. élevé avec un Apple // e par des parents (une chorégraphe et une éducatrice) qui m'ont permis et encouragé de passer beaucoup de temps avec l'art. Le design n’est pas de l’art. En fait, certains de ses modèles plus algorithmiques s’alignent parfaitement avec la programmation, que vous fassiez du Web ou non.
Mais si oui, 2004: je divisais la différence lorsque je poursuivais des études supérieures, où j’avais d’abord reçu un enseignement typographique de premier ordre, puis une latitude d’exploration - au cours de laquelle mes perspectives de geekier se sont révélées utiles.
Alors, envisagez peut-être des études supérieures, ou tout ce qui vous intéresse également. Bonne chance dans les deux cas.
la source
Apprenez beaucoup sur la typographie.
Des classiques …
Jan Tschichold
Pas les clowns …
David Carson
La typographie stratégique et efficace est l’une des qualités les plus souvent absentes dans ce domaine (et l’a toujours été).
Je peux généralement recruter un designer entièrement basé sur leur type de traitement. Environ 80% de l'histoire se trouve dans le curriculum vitae mis en place.
Un bon début (gratuit) est cette adaptation détaillée de la ressource essentielle de Robert Bringhurst pour son application sur le Web.
Les éléments du style typographique, Bringhurst
Ceci est une considération plus large qui traite de l'interaction du type et de la mise en page.
Systèmes de grille en design graphique, Brockmann
la source
Penser de manière critique aux objets conçus autour de vous
Presque tout dans l'environnement créé par l'homme a une sorte de design derrière, que ce soit un graphique, un site web ou un accessoire de mode.
Notez à quel point la conception fonctionne correctement et à quoi elle ressemble.
Penser le design comme un moyen de répondre à un besoin ou de résoudre un problème
Bien qu'il s'efforce de rendre les choses belles, le design se distingue des autres types d'art en ce qu'il a une application pratique.
Un logo, par exemple, est un type de design graphique qui permet de rendre une marque ou une entreprise rapidement reconnaissable.
Un article de vêtement sert à recouvrir le corps et à rendre l’utilisateur plus attrayant.
Pratiquez la communication visuelle.
Les concepteurs doivent être en mesure de réaliser des dessins ou d'autres représentations de leurs conceptions afin de les affiner et de les expliquer à d'autres personnes, tels que leurs collègues concepteurs et les fabricants.
Le dessin est un outil puissant pour les concepteurs, mais ne vous inquiétez pas si vous ne pouvez pas dessiner de façon photoréaliste. Les dessins des concepteurs ne doivent pas nécessairement être des chefs-d’œuvre, mais simplement un moyen de saisir rapidement les idées qui mèneront au produit fini. Le traçage est également totalement acceptable.
En plus des dessins, les concepteurs utilisent également des éléments tels que des maquettes, des prototypes et des images de synthèse pour visualiser leurs conceptions.
Explorez comment les choses sont faites
Lorsque vous travaillez en tant que designer, vous devez non seulement prendre en compte ce qui est agréable à l'oeil, mais également déterminer comment votre conception sera mise en œuvre.
Pour un objet comme un étui de téléphone portable, les concepteurs industriels doivent réfléchir au type de processus de plastique et de moulage qui sera utilisé et à la manière dont chaque partie sera assemblée.
Trouver de bonnes sources d'information
En plus des magazines de design, recherchez des livres sur le processus, les principes et les méthodes de design.
Essayez de regarder des manuels et des vidéos techniques pour la fabrication de vêtements, les méthodes de fabrication et diverses techniques d’artisanat.
En savoir plus sur le design va au-delà de la lecture de magazines de mode et de décoration, bien qu'ils constituent une bonne ressource pour les tendances actuelles.
Développer vos compétences en design
Étudier et pratiquer, c’est bien, mais l’expérience du monde réel est ce qui fera vraiment passer votre conception au niveau supérieur.
Faire des erreurs rapidement
vous ferez beaucoup d'erreurs, et plus vite vous pourrez les surmonter, mieux ce sera.
Soyez toujours prêt à attraper des idées.
Cherchez l'inspiration partout. L'inspiration ne doit pas nécessairement provenir d'autres conceptions ni de tendances en matière de conception - elle peut souvent provenir de la nature ou de choses accidentelles.
Livres et matériels
http://www.alistapart.com
http://webdesignledger.com
Smashing Magazine
PSD Tuts
Abuzeedo
UX Booth
la source
Quelques points à garder à l'esprit:
Arrêtez de penser à la conception en termes de "Comment puis-je rendre cela joli?" et commencez à y penser en termes "Comment puis-je rendre cela aussi facile à utiliser que humainement possible?"
Lorsque vous créez des sites Web, cela signifie que, dans son sens le plus large, vous résolvez un problème commercial .
Un site Web existe pour réaliser un objectif commercial .
Les utilisateurs d'un site Web ont également leur propre objectif en tête: ils peuvent vouloir acheter quelque chose, comparer des produits, lire sur un sujet, etc.
En tant que concepteur, votre travail consiste à aider l’entreprise en veillant à ce que le plus grand nombre possible d’utilisateurs atteigne son objectif et à les aider à naviguer sur le site Web afin qu’ils puissent atteindre leur propre objectif.
Par exemple, vous concevez un magasin d’e-commerce: L’objectif commercial ici serait de vendre les produits. Et l'objectif des utilisateurs est de trouver exactement ce qu'ils veulent acheter, le plus rapidement possible et de vérifier, le plus rapidement possible.
Une grande partie du processus de conception est consacrée à la résolution du problème, à la création d’un profil de l’utilisateur, à la réflexion sur la réalisation de l’objectif commercial, etc.
Les couleurs, les polices de caractères, la mise en page, chaque décision de conception que vous prenez doit être dictée par l'objectif du site Web .
C'est ce que la cohérence est à propos.
Par exemple, l'association de polices. Les polices sont appariées en fonction de traits similaires, en fonction de la répétition des détails.
Voici un match: Farnham et Benton Sans.
Selon ce post ici 2, ces deux polices correspondent car:
La répétition de certains traits fait que ces 2 polices fonctionnent bien ensemble. Vous pouvez les voir sur une page Web ici 3 .
La répétition apporte l'harmonie dans un design. Et l'harmonie rend le design magnifique.
Mais, comme vous pouvez le constater, Farnham et Benton Sans contrastent également: Farnham est une police à empattement et Benton est sans empattement.
Pourquoi y a-t-il besoin de contraste? Nous cherchons à introduire des similitudes dans un design, non?
Eh bien, oui, mais trop de répétitions rendent vos dessins terne et difficile à utiliser .
Le remède est le contraste.
Cela les aide à distinguer différents éléments les uns des autres. Cela les aide à trouver les éléments clés tels que les titres, la navigation, les boutons.
Plus l'élément est important, plus il doit contraster avec son environnement.
Utilisez la répétition pour rendre vos conceptions cohérentes. Comme d’autres l’ont dit — 2 polices, une palette de couleurs limitée, etc.
Utilisez le contraste lorsque vous avez vraiment besoin de distinguer un élément du reste.
Tout ce qu’il est bon de savoir, mais… ne vous aide toujours pas à concevoir votre prochain site Web, n’est-ce pas?
Eh bien, j'ai une solution pour cela aussi.
La première étape pour devenir meilleur en conception de sites Web consiste à observer et à absorber le travail des autres. Beaucoup. C'est de là que vient "l'inspiration".
Examinez une centaine de motifs que vous aimez, analysez-les et commencez à repérer des motifs. Votre cerveau vous aidera à combiner ces motifs dans votre propre design, qui sera une variation de tous les designs similaires que vous avez vus. Vous n'avez pas besoin de créer quelque chose "unique".
Résumé: la prochaine fois que vous commencez à concevoir pour votre projet parallèle
Parcourez une douzaine de sites Web / applications Web similaires et tracez rapidement leur conception. Notez quel flux de travail ils ont utilisé. Pourquoi l'ont-ils utilisé? Notez quelles formes, couleurs et polices ils ont utilisées.
Suivez ensuite ce processus pour créer votre propre design:
Définir le projet. Plongez dans le projet et apprenez-en plus sur:
1. Son objectif, les résultats attendus
Donner forme au contenu
Vous pouvez en savoir plus sur chaque étape de ce processus ici .
la source
Un peu plus:
Parcourez les collections de sites Web inspirants pour trouver des idées. Une collection Motherload of Inspirational Site Collections répertorie de nombreuses collections. Siiimple.com et minimalsites.com sont deux autres bons sites .
La proposition «Supprimez le fouillis» de Virtuosi Media est un idéal bien défini, mais un site avec fouillis réalisé par un débutant est meilleur qu'un site minimaliste créé par un débutant. L'encombrement camoufle quelque peu les autres éléments de conception médiocres, gênant le contenu. Le site professionnel typique est beaucoup trop encombré, à l'instar de presque tous les modèles, mais reste assez professionnel.
Il faut une connexion intime avec les polices de caractères, le contraste, l’espace négatif, la coloration, la densité, le flux, ... pour créer un site vraiment bien conçu, efficace et qui respire bien.
Si tout devient un peu écrasant, envisagez l'achat d'un modèle.
la source
Juste pour ajouter quelques liens supplémentaires aux personnes issues de la programmation et intéressées par la conception d'interface utilisateur.
la source
Au début, vous rencontrerez des problèmes, car certaines choses ne vous gêneront pas. Mais vous devrez faire preuve de patience et pratiquer beaucoup. Quand j'ai commencé à concevoir et à regarder en arrière, il y a 4 ans, je ne peux pas croire que j'ai fait ce travail.
Vous devez vraiment rechercher d’autres grands designers. Pour cela, vous devez suivre les grands designers sur Dribbble . Il est également très important de regarder régulièrement les dernières créations sur des sites de galeries css telles que www.minimalistgallery.com ou autres.
En souhaitant le meilleur !!!
la source
Abonnez-vous à http://sidebar.io/ pour les bulletins quotidiens. Chaque article sera utile d'une manière ou d'une autre. Le dribbble est un autre excellent moyen d'autoapprentissage des designs .
la source
C'est peut-être un conseil général, mais pour moi, c'est quelque chose qui dit vraiment si quelqu'un est un bon designer ou non:
Espaces blancs, marges et alignement.
Ils sont la clé pour créer des conceptions lisses et d'aspect professionnel. Ils créent un "espace de respiration" et peuvent vraiment déterminer si votre conception sera mise en place ou non. Tout comme avec les polices, vous voulez vous en tenir à certaines marges / espaces blancs pour conserver une mise en page propre.
Pour garder une trace de ce genre de choses, il peut être très utile d’utiliser une grille ou des guides pour la conception.
la source
Votre question est la suivante: "En tant que designer, je suis constamment confronté à des connaissances de base de la programmation d'applications". Ce sont de vastes régions, avec des régions superposées superposées qui ont besoin les unes des autres. La bonne nouvelle: vous êtes intéressé et comprenez leur importance. La mauvaise nouvelle: il n’existe pas de moyen facile de bien comprendre ce qu’il faut faire pour bien concevoir sans un cours ou une méthodologie appropriée. MAIS pour les premières étapes, ce livre est un bon moyen de commencer en toute sécurité à construire des systèmes visuels sensés.
Livre de design non design
la source