Weedle » Adobe

365 PSD : un PSD gratuit chaque jour !

Fred — Sun, 14 Mar 2010 10:00:32 +0000

365 PSD est un site intéressant qui vous propose chaque jour un nouveau PSD à télécharger. Idéal pour trouver des ressources et déployer rapidement de nouveaux éléments graphiques, certes, mais aussi pour apprendre une tonne de choses très utiles sur Photoshop. Car en effet, pour se former à la création graphique, il peut être intéressant de voir comment travaillent les graphistes et sortir ainsi le nez des traditionnels tutoriels.

Et on trouve vraiment de tout : des photographies retouchées, des éléments graphiques pour des sites web, des icônes, des modèles de formulaire et ainsi de suite. Globalement, toutes les ressources présentées sont de très bonne qualité. Point intéressant, plusieurs contributeurs participent à ce projet. Parmi eux, on trouve Jonno Riekwel et Jord Riekwel.

Précisons enfin que l’opération 365 PSD ne durera qu’un an.

Cet article original a été publié sur Weedle.
Toute reproduction, même partielle, est interdite sans l'accord explicite de ses auteurs sauf citation de quelques lignes accompagnées d'un lien vers ce billet.
Si vous aimez Weedle, vous pouvez nous rejoindre sur Twitter, sur Facebook ou rejoindre notre groupe sur Flickr.

30+ tutoriels Photoshop pour des effets vintage

Fred — Mon, 11 Jan 2010 15:15:13 +0000

Parfois, la mode nous joue de drôles de tours et il arrive fréquemment que les styles les plus démodés finissent par revenir sur le devant de la scène. Le webdesign n’échappe évidemment pas à la règle et de nombreux créateurs s’inspirent des années passées pour leurs propres créations. C’est ainsi que j’ai décidé de vous sélectionner 30 tutoriels Photoshop pour vous apprendre à réaliser des effets « vintage ». Alors si vous recherchez un peu d’authenticité, vous savez ce qu’il vous reste à faire.

PSD TUTS

Abduzeedo

Tutorial9

PSHero

PSD Fan

DeviantArt

PSDFan

Computer Arts

Outlaw Design Blog

PVM Garage

DesignBlurb

Talk Mania

X24D

EyesOnTutorials

UBLTuts

Online Photoshop Tutorials

Worth1000

Vileworks

200+ brushes vintage pour Photoshop

Fred — Wed, 23 Dec 2009 15:10:10 +0000

Simples à utiliser, les brushes (ou brosses) permettent d’enrichir considérablement une œuvre graphique en quelques clics. Or, comme nous l’avons vu avec nos 30 tutoriels Photoshop pour des effets rétro, le vintage a de plus en plus tendance à revenir à la mode. Il ne m’en fallait pas plus pour vous sélectionner plus de 200 brushes à effets vintage, le tout réparti en une dizaine de sets pour le célèbre logiciel de création graphique de la société Adobe.

Si vous ne connaissez pas encore Photoshop sur le bout des doigts et que vous n’avez jamais utilisé de brushes, voici la procédure à suivre pour en profiter pleinement :

Sélectionnez l’outil pinceau (touche « B »).
Déroulez la liste forme située dans la barre d’outils du logiciel (en haut).
Cliquez sur la toute petite flèche située dans le coin haut droit du menu qui apparaît.
Sélectionnez l’option « Charger des formes ».
Sélectionnez sur votre disque dur le fichier ABR précédemment téléchargé.
Les nouvelles formes sont ajoutées à la suite.

Et hop, voici la liste :

50+ tutoriels pour Adobe inDesign

Fred — Mon, 07 Dec 2009 16:00:11 +0000

Incontournable mais néanmoins méconnu, Adobe inDesign fait partie de ces logiciels qu’il est difficile de prendre en main et qui nécessite par conséquent un certain temps d’adaptation. Afin de vous aider et de vous accompagner durant votre découverte de l’outil, je vous propose donc plus de 50 tutoriels complets et originaux qui vont vous apprendre à maitriser l’interface du logiciel et qui vont vous guider pour vos premières créations.

Adobe inDesign est un incontournable dans la vie d’un graphiste « print ». Similaire à Quark Xpress, il permet en effet de créer aussi bien des journaux que des plaquettes que des jaquettes. Lancé en 1999 par la société Adobe, il n’a cessé d’évoluer pour atteindre, aujourd’hui, sa cinquième version. Les tutoriels suivants vous permettront de vous familiariser avec son interface et de réaliser vos premiers travaux.

Débuter avec Adobe inDesign

Comme n’importe quel logiciel, Adobe inDesign nécessite un certain temps d’adaptation afin que l’utilisateur se familiarise avec son interface. Les tutoriels suivants vous permettront de progresser rapidement et de mieux comprendre les fonctionnalités proposées.

Adobe Atelier Vidéo : une tonne de vidéos très pratiques

Adobe TV

Psill : un article complet pour débuter sur Adobe inDesign

Benzor : un exercice complet pour les débutants

JoliesPages : quelques tutoriels très bien expliqués

Réaliser vos premiers travaux avec inDesign

A présent que vous vous êtes familiarisés avec l’interface du logiciel, vous allez pouvoir réaliser vos premiers travaux afin de mettre en pratique ce que vous venez d’apprendre. Les tutoriels suivants vous permettront de créer des projets de A à Z.

WKS : réaliser une carte de visite et l’exporter en PDF

Vector Tuts+ : créer une affiche publicitaire

Vector Tuts+ : créer la couverture d’un magazine de musique

Vector Tuts+ : créer un coupon de réduction

Layers Magazine : créer une couverture de magazine

SpoonGraphics : créer un CV complet

Pour aller plus loin

Si vous souhaitez parfaire votre connaissance d’Adobe inDesign, vous pouvez suivre les tutoriels suivants. Ils vous apprendront à utiliser certaines fonctions avancées et méconnues de l’outil.

Webdidacte : de nombreuses astuces en tout genre

Wisibility : des tutoriels dédiés à certaines fonctions

Dailymotion : de nombreuses astuces en vidéo

20+ tutoriels pour faire de la typographie avec Adobe Photoshop

Fred — Sat, 05 Dec 2009 16:00:22 +0000

Même si Photoshop n’est pas l’outil le plus adapté à la création typographique, certains des outils qu’il propose peuvent pourtant faire des merveilles. Le fait est que le logiciel d’Adobe est très polyvalent et les différents tutoriels qui suivent vous permettront de réaliser des compositions à la fois originales, percutantes et très branchées.

20 tutoriels de création de menus avec Photoshop

Fred — Thu, 19 Nov 2009 17:00:18 +0000

Le système de navigation est sans doute le point le plus important à prendre en compte lors de l’élaboration d’un service web. Si un bon site doit pouvoir présenter un contenu de qualité, il doit également le présenter, l’organiser et le structurer pour le rendre accessible de tous les publics. En la matière, de nombreux webdesigners n’hésitent pas à construire leur système de navigation sous Photoshop avant de l’intégrer à leur page. Et justement, nous avons sélectionné plus de 20 tutoriels complets pour apprendre à créer des menus.

1. Un bouton style Windows Vista

Depuis sa sortie, et comme pour la plupart des O.S de la firme de Redmond, Windows Vista a inspiré nombre de designers. C’est la raison pour laquelle on trouve aujourd’hui de nombreux sets d’icônes inspirés par le style de ce système d’exploitation. Les menus ne dérogent pas à la règle, comme le prouve ce tutoriel très bien réalisé.

2. Un menu inspiré de Windows Vista (encore)

Encore un menu inspiré de Windows Vista, mais un peu plus détaillé que le précédent. On remarquera d’ailleurs le fond du menu, qui a subit de nombreux effets de transparence et qui fait ressortir le système de navigation proposé.

3. Un bouton mat et minimaliste

Très complet, ce tutoriel vous apprendra à travailler aussi bien sous Photoshop qu’au niveau des CSS. Vous apprendrez ainsi à créer une image, à l’affecter à un bouton et à la déplacer suivant l’état de la souris de l’internaute. Précisons également que Six Revision propose une archive complète contenant l’image, bien sûr, mais aussi le PSD et les CSS de l’exercice.

4. Un menu « plastique »

Certains webdesigners aiment s’inspirer de matériaux pour construire leurs systèmes de navigation. Avec ce tutoriel, vous apprendrez à réaliser un menu type « plastique ». Au passage, je vous conseille d’en profiter pour jeter un coup d’oeil à la charte graphique du site source, qui est vraiment magnifique.

5. Des boutons « glossy »

Si l’on devait citer deux grandes tendances « web 2.0″, ce serait sans doute les reflets et les effets d’ombre. Tant mieux, car c’est justement ce que va vous faire travailler ce tutoriel. A conseiller à tous ceux qui ne sont pas très familiers des effets de calque.

6. Un menu noir et bleu

Un peu plus conventionnel, ce tutoriel permettra de vous familiariser avec les effets de volume et de lumière. Là encore, il s’agit d’effets incontournables dont il devient de plus en plus difficile de se passer.

7. Un menu minimaliste

Parfois, la simplicité paie. Ce menu blanc et fin pourra s’intégrer à la plupart des chartes graphiques. L’inconvénient de ce genre de menus, c’est qu’ils se font parfois trop discret. Heureusement , le rollover bleu vous permettra d’attirer l’attention de vos visiteurs.

8. Un menu minimaliste et sombre

Pourquoi faire compliqué lorsqu’on peut faire simple ? Ce tutoriel, reposant sur 10 étapes seulement, vous permettra de réaliser un menu complet, minimaliste mais très agréable à l’oeil. A noter qu’il conviendra sans doute à tous les publics, y compris à ceux qui apprennent tout juste à maitriser Photoshop.

9. Un menu minimaliste blanc

Toujours dans le minimalisme et dans le discret, voici un autre menu tout en douceur qui ne vous laissera peut-être pas indifférent. Là encore, il s’agira de jouer avec les effets de dégradé et d’ombre, tout en prenant soin de choisir des couleurs adaptées et nuancées.

10. Un menu futuriste

Si ce genre de menus était très à la mode dans les années 90-2000, cela n’est plus vraiment le cas aujourd’hui. En revanche, ce tutoriel est surtout intéressant sur le plan technique puisqu’il vous permettra de vous familiariser avec les formes et certains effets de calque.

11. Un menu en trois dimensions

Si les menus figés et traditionnels vous déçoivent, alors ce tutoriel proposé par PSD Tuts risque de vous intéresser. En effet, il vous apprendra à utiliser les effets de dégradés, d’ombres et de lumières afin de rendre vos systèmes de navigation plus vivants et plus séduisants. Là encore, les techniques étudiées sont nombreuses et vous permettront d’approfondir votre connaissance de l’outil.

12. Un menu « aquarelle »

Là encore, le manuscrit, le « fait main » revient de plus en plus à la mode. Il n’est ainsi pas rare de voir des blogs opter pour ce style si particulier (je pense notamment aux blogs BD). Justement, durant ce tutoriel, vous apprendrez à fabriquer du papier et à l’intégrer au mieux au reste de votre charte. Et comme un bonheur ne vient jamais seul, le site source vous conseillera également l’une des plus belles polices écrites qui existe.

13. Un menu moderne noir

Là encore, ce menu fait partie de ce qui pouvait se faire dans les années 90-2000, avec quelques effets de reflet en plus. Cela dit, il n’en reste pas moins pertinent et le tutoriel proposé vous permettra, une fois de plus, de vous familiariser avec les effets de calque.

14. Un menu professionnel

Une entreprise ne peut pas tout se permettre, et c’est d’autant plus vrai sur le web. Tout en proposant un design agréable, séduisant et épuré, elle doit faire en sorte de ne pas choquer et de convenir à la plupart des publics. Ce que ce tutoriel vous propose, c’est justement ça : parvenir à réaliser un système de navigation agréable et professionnel.

15. Un menu futuriste

Aujourd’hui, en matière de web, il ne faut plus montrer, il faut suggérer. Ce que fait justement ce menu avec ses rollovers gros clair qui dénotent à peine du fond blanc du menu. Au passage, on remarquera que la police d’écriture utilisée occupe une place de choix puisqu’elle parvient à déterminer l’ambiance générale de la création. Avec une autre police, ce menu n’aurait pas eu l’air aussi futuriste.

16. Un menu tout en décorations

Si les techniques utilisées pour réaliser ce menu sont globalement les mêmes que pour les autres menus de cette sélection, ce tutoriel n’en reste pas moins très intéressant, notamment en ce qui concerne le travail effectué sur le fond. Malheureusement, ces étapes-là n’ont pas été très détaillées, il vous faudra donc faire preuve de patience et de rigueur pour obtenir ce résultat.

17. Un menu très « web 2.0″

Là encore, ce tutoriel vous permettra de jongler avec les différents effets de calques proposés par l’outil. Sans être inoubliable, l’effet produit est tout-de-même intéressant.

18. Un menu inspiré par Apple

Ce n’est un secret pour personne, les designers d’Apple ont toujours su faire parler d’eux. Ainsi, depuis ces dernières années, nous avons vu débarquer un bon nombre de tutoriels vous proposant de recréer le système de navigation du site officiel de la marque. Celui-ci en est un de plus.

19. Encore un menu inspiré par Apple

Bien que ce menu puisse paraître redondant une fois confronté au quatorzième menu présenté dans cette sélection, on comprend vite qu’il n’en est rien. En effet, celui-ci avait pour objectif de reproduire le menu proposé sur le site officiel de la marque. Il en reprend donc le logo, la police ainsi que la présentation générale et constitue un bon moyen d’éduquer son oeil.

20. Un menu inspiré de la Wii

Cette fois, c’est de Nintendo dont s’est inspiré le concepteur de ce tutoriel très élaboré qui vous propose de reproduire le même menu de la Wii. Très détaillé, il vous apprendra à utiliser conjointement toutes les techniques vues pendant les tutoriels de cette sélection. Au passage, on remarquera l’effet de lumière bleue sur la gauche, qui est vraiment magnifique.

20 exemples de diaporamas en Javascript

Fred — Wed, 18 Nov 2009 17:00:02 +0000

Dans les années 90-2000, le flash était la seule technologie qui permettait aux webmestres d’animer leurs sites. Les temps ont changé, il est désormais possible d’en faire autant en utilisant la technologie AJAX et des librairies Javascript comme Mootools, JQuery ou encore Scriptaculous. Certains effets n’ont d’ailleurs rien à envier à la technologie d’Adobe et pour vous en persuader, voici une sélection de 20 exemples impressionnants de diaporamas en Javascript.

Depuis leur apparition, les diaporamas en Javascript n’ont eu de cesse de faire des émules et de séduire les webmestres désireux d’animer leur site. Leur avantage est certain, puisqu’ils permettent d’afficher sur une surface restreinte une quantité conséquente d’informations. Et si vous n’êtes pas encore convaincu de leur intérêt, les quelques exemples qui suivent devraient vous permettre de mieux comprendre l’impact qu’ils peuvent avoir aujourd’hui.

1. Prat

2. Icon Designer

3. CPeople

4. Charlie Gentle

5. X3 Studios

6. A Simple Measure

7. Orman Clark

8. Rico Verdeo

9. Galan Design

10. JP3 Design

11. Search Inside Vidéo

12. Oh Media

13. Richard Qilayout

14. Hold Fire

15. Digital Convulsions

16. Deluge Studios

17. Daniel Steinberg

18. House Hold

19. Lucas Hirata

20. EyeDraw

21. Newsberry

22. Paramore Redd

500+ brushes vectorielles pour Adobe Photoshop

Fred — Thu, 12 Nov 2009 16:00:15 +0000

Toujours dans l’optique de vous proposer une tonne de ressources pour vos créations graphiques, voici une sélection de plus de 500 brushes (ou formes) vectorielles pour Adobe Photoshop, le tout réparti sur une vingtaine de sets complets. Et il y a de tout : des formes abstraites, du grunge, des pictogrammes et bien d’autres choses encore. De quoi enrichir et donner un peu plus de style à vos compositions.

Si vous ne connaissez pas encore Photoshop sur le bout des doigts et que vous n’avez jamais utilisé de brushes, voici la procédure à suivre pour en profiter pleinement :

Sélectionnez l’outil pinceau (touche « B »).
Déroulez la liste forme située dans la barre d’outils du logiciel (en haut).
Cliquez sur la toute petite flèche située dans le coin haut droit du menu qui apparaît.
Sélectionnez l’option « Charger des formes ».
Sélectionnez sur votre disque dur le fichier ABR précédemment téléchargé.
Les nouvelles formes sont ajoutées à la suite.

Et, comme d’habitude, faites bien attention aux différents copyright avant d’utiliser ces brushes dans vos projets. Normalement, toutes les mentions adéquates figurent sur la fiche de la ressource.

Deux astuces pour accélérer Adobe Photoshop

Fred — Sat, 07 Nov 2009 10:00:53 +0000

Tout en étant très puissant, Photoshop est aussi parfois très lent à exécuter les opérations qu’on lui demande. Alors si vous en avez marre d’attendre encore et encore le recadrage ou l’export de votre PSD et que vous avez envie d’accélérer les choses, ces deux astuces trouvées sur MakePhotoshopFaster (et qui m’ont été conseillées par WinMacSoft) sont faites pour vous. Et rassurez-vous, elles ont été bien entendu testées avant et le gain de performance n’est vraiment pas négligeable.

Si les captures d’écran de MakePhotoshopFaster sont suffisantes pour comprendre la marche à suivre, voici tout-de-même les explications en français :

Réduction du niveau de cache : Aller dans le menu Préférences > Performances et baisser le niveau de cache à 1.
Enregistrement de la prévisualisation des images : Aller dans le menu Préférences > Gestion des fichiers et sélectionner « jamais » dans la liste déroulante.

Voilà, et normalement, suivant votre configuration, cela devrait augmenter les performances et la réactivité générale de votre Photoshop.

Tutoriels : créer le générique de MARVEL.

David — Thu, 05 Nov 2009 15:00:48 +0000

Adolescent, j’ai toujours été un grand fan de MARVEL, ha captain America et toutes les belles pin-up en collants, que de souvenirs à chaque sortie de STRANGE. Il y a bien longtemps que je ne m’était replongé dans cet univers fantastique.

C’est au détour d’une rue près de chez moi que je suis tombé nez à nez avec un COMICS SHOP… 3O minutes après je sortais les bras chargés de COMICS, de figurines…le portefeuille vide, en me jurant de ne plus JAMAIS ré-emprunter ce chemin…

[There is a video that cannot be displayed in this feed. Visit the blog entry to see the video.]

Voici deux tutoriels gratuits trouvés sur le web pour recréer le générique des films de MARVEL, l’un vous propose de realiser ce generique avec le logiciel de montage SONY VEGAS, l’autre avec AFTER EFFECT :

[There is a video that cannot be displayed in this feed. Visit the blog entry to see the video.]

Mais vous l’aurez remarqué, la qualité des ces vidéos est assez moyenne, ce n’est pas faute d’en avoir chercher de meilleures, mais elles semblent ne pas exister.

Je me suis donc tourné vers les plateformes payantes, ou j’ai trouvé pour la modique somme de 5 euros, un tutoriel fait sur mesure :

http://www.weecast.fr/after-effects/generique-marvel-after-effects,4413.html

Un petit dernier pour la route qui vous apprendra à animer le masque de Rorschach avec after-effect et 3DSMAX :

[There is a video that cannot be displayed in this feed. Visit the blog entry to see the video.]

A vous de choisir !

Alors à vos claviers et n’hésitez pas à nous montrer vos œuvres !!!