Search the Community
Showing results for tags 'graphisme'.
-
Bonjour, Aujourd'hui je décide de faire un tutoriel assez complet pour mieux vous expliquer les bases du WebDesign/Graphisme et de vous aider à vous lancer sur divers logiciels de PAO mais je vais parler plus précisement des deux logiciels les plus importants "Adobe Photoshop" & "Adobe Illustrator". 1- WebDesign ? Quesako ?? Le WebDesign comme vous pouvez le lire par vous même c'est la conception de l'interface web Je m'explique mieux, avant de developper n'importe quel site il faut d'abord avoir fait la maquette et c'est le WebDesigner qui va s'en occuper il va constituer une maquette complète du site web en image. C'est grace aux WebDesigners que tous les sites où vous naviguer actuellement ont un design exceptionnel, chaque sites web ont leurs structure personnelle. 2- L'organisations des calques Déjà pour travailler je pense que le plus important a mes yeux c'est l'organisation des calques, s'ils sont mélangés et pas renommer il est impossible de travailler. C'est pour cela que je vous conseille de les organisaient en créant des "groupes" sur photoshop ou bien "calques" sur illustrator. Vous pouvez y voir un exemple d'une maquette que j'ai réaliser y'a quelques jours: http://imageswl.fr/i/BEABIHJHCFM L'entête sera le haut du site (souvent appeler la bannière) > Le menu seras tous les textes où ont y place tes onglets comme "Accueil, Contact, Nos services, ..." le pied sera le bas du site (souvent appeler footer) > Puis après tout ce qui est expertise est autre ce sont les différents emplacements de divers widget. Le plus important seras donc de faire un dossier où calque avec Entête > Menu > Pied c'est le strict minimum. Si ce point et acquis alors vous pourrez travailler plus simplement et organiser. 3- Les couleurs Il est aussi très important dès le début de votre maquette de choisir la bonne couleur, il en existe des millions c'est pour cela qu'il faut une couleur qui donne envie à l'oeil, donc surtout éviter les couleurs fluo (flash) et rester dans la simplicité. Pour cela je vais vous donner mon pack de nuancier spécialement pour le web, dedans il y a 68 palettes de nuancier toutes différentes. Aperçu des nuanciers: http://imageswl.fr/i/BEABIIAJHCM Lien de téléchargement: http://ge.tt/2EJrowi1/v/0 4- Les ressources graphique Débutant ? Ce n'est plus un souci maintenant nous pouvons créer un design très professionnel sans savoir trop utiliser les logiciels de PAO ! Mais comment ? Alors donc il existe des sites de "Ressources". C'est quoi sa ? Des sites qui regroupent des tonnes de .psd ou .ai ou dedans y ai intégrer des menus, icons, enfin vraiment de tout qui est déjà fait, quelques modifications vous le mettez sur votre calque a vous il sa s'intègre parfaitement. Voici un exemple de ressource: http://imageswl.fr/i/BEABIHJHJJM Tous les différents modules comme le "Slider" "Top games" etc ... sont tous modifiables comme si c'était vous qui l'avait enregistrer en .psd pour le modifier au cas où. Il y a des UI KIT 100% gratuit qui traînent sur le net, en gros des UI KIT sont des éléments comme je t'ai montrer sur la screen mais pour les sites web car sur les sites de ressources tu as vraiment de tout. Voici des exemples: www.365psd.com (Ils rajoutent une ressource tout les jours il est déjà très bien remplis, je l’utilise très souvent c'est le mieux pour moi) www.igraphisme.com www.facegfx.com www.smashfreakz.com/category/resources www.ui-cloud.com/free-ui-elements www.webuikits.com www.freebiesbug.com/psd-freebies 5- Les sources d'inspirations Il y a des tonnes de sources d'inspirations sur le web ce n'est pas ce qu'il manque, heureusement que ce genre de sites est la pour nous quand ont a plus d'idées pour un concept on va faire un tour sur ces sites puis quelques minutes après on est repartis pour quelques heures de créations. Voici des exemples: www.webdesign-inspiration.com (Celui que je trouve le plus complet que j'utilise très souvent) www.themeforest.net www.siteinspire.com www.dossierdesign.com J'allais oublier voici une liste de 200 sites indispensables pour un Graphiste: www.dubostbenoit.com/influences Voilà j'espère que je vous aurais bien aider, et que maintenant vous êtes prêt pour votre première maquette ! Je tiens aussi à m'excuser des fautes que j'ai pu faire mais l'orthographe, la conjugaison c'est pas mon truc. © Tutoriel entièrement rédiger par Swan merci de respecter mon travail et de ne pas redistribuer ce tutoriel sans mon autorisation - 2014.
-
Bonjour à tous, Après une longue errance en tant qu'infographiste web, j'ai enfin trouvé un logiciel qui permet de facilement optimiser les PNG : http://pnggauntlet.com/. Petit rappel du problème avec les PNG. Beaucoup de site utilisent les images au format PNG car il permet d'encoder des images sans perte de données (au contraire du JPEG) et avec des informations de transparence. Le problème c'est que ce format peut vite s'avérer lourd si on ne fait pas attention. De plus les grands logiciel de dessins, Photoshop en tête, n'optimise pas correctement le PNG (une honte vu le prix, mais bon... un autre débat). Donc quant on bosse sur plein de projets, on se retrouve facilement avec plusieurs dizaines voire centaines d'images sur les bras. Ce qui représente un véritable labeur si toutes les images sont à réencoder. Un exemple concret auquel j'ai été confronté : sur un ensemble de sites j'utilise un sprite d'icône contenant 150 icônes. Ce sprite est décliner en 4 versions (normal noir, normal blanc, couleur de survol et état désactive), puis chacun de ces sprite est décliner en différentes taille : (16x16, 24x24, 32x32, 48x48, 64x64). Chaque site à ses propres couleurs et donc ses propres sprites, ca nous fait donc 40 sites x 20 déclinaisons soit 800 images à réenregistrer dès qu'on touche à une icône . Et c'est la qu'intervient PNG Gauntlet pour la partie optimisation : on glisse tout les fichiers dans le logiciel, on clique sur optimize et... c'est tout ! Simple, léger, efficace et fait gagné du temps de production. Une remarque quant même, l'optimisation peut être assez longue malgré une bonne utilisation des ressources machines. Pour mes 800 images, il aura fallut 2 heures avec le CPU entre 80% et 100% sur mon poste (Core-i7 3770K avec 18Go de RAM et un bon SSD).
- 7 replies
-
- 3
-
- logiciel
- optimisation
-
(and 1 more)
Tagged with:
-
Bonjour, Pour mon premier sujet je vais poster une maquette que j'ai réaliser il y a quelques jours ! (je ferais une présentation ce soir) Je pense que c'est la maquette qui ma demander le plus de créativité et d'inspiration, car je peux vous dire que quand ont n'a aucun cahier des charges c'est bien en générale car le thème est ouvert mais pour un Avocat alors la j'ai bloquer pendant beaucoup de temps avant de me lancer sur divers test. Cette maquette sera développer dans le futur pour cette Avocat. J'ai réaliser ce WebDesign en 5H de travail non-stop. Sans plus attendre les résultats: V1: (Cliquez sur l'image pour la voir en taille réel) V2: Vos avis?
-
Bonjour à tous, Je vais donc me présenter... J'ai 18 ans, je suis Belge (montois), je programme depuis que j'ai ~12ans, j'ai arrêter de programmer pendant 2ans pendant les quelles j'étais devenu un no-life addict de world of warcraft qui reste pour moi LE meilleur jeu du monde^-^ Actuellement je me suis remis à programmer, je code en html, css, js(+jquery&ajax), php, c(quand je suis vraiment motivé), delphi, pascal, vb.net et tout ce qui est sous-langage comme sur des cartes arduino, le sql et le bash(win/unix). Je code principalement des sites et des jeux 3d. Je fais aussi de l'infographisme 2d/3d, de la calligraphie (latine et gothique), du fussing (travailler le verre), du tricot (mais du tricot High-Tech ), de la couture et de la cuisine ._. Je passe le 3/4 de mon temps libre à travailler gratuitement pour des gens que je connais pas ou dormir au lieu d'étudier ce qui se voit dans mes notes *tousse*. que dire de plus... j'ai connu ce forum par un autre forum euh... mon pseudo que j'utilise depuis si longtemps vient d'un générateur de pseudo car "Mars" était déjà utilisé x') j'aime le jus de cranberrys et les pommes
- 16 replies
-
- présentation
- graphisme
-
(and 1 more)
Tagged with:
-
Le premier Concours graphique a été lancé, et la section Jeux Android / iOS ont été créés Let's go