Category Archives: Webdesign

UX design et webdesign 2018

UX design – Webdesign : 10 tendances 2018

By | UX Design, Webdesign | No Comments

Même si 2018 est déjà bien entamé, on peut encore dire qu’en UX Design comme en webdesign, les tendances pour cette année suivront celles de 2017 qui a fait la part belle aux visuels de qualité (images et vidéo) et à une expérience utilisateur toujours plus fluide et intuitive.
Dans cette article, nous avons choisi de vous parler plus particulièrement de 10 tendances qui vont marquer 2018.

1. Le cinémagraph, un atout pour le webdesign

cinemagraph ChopardApparu déjà en 2017, l’utilisation du cinemagraph va s’intensifier en 2018. Il s’agit d’un mélange entre image et vidéo tournant en boucle et qui sera incorporé sous forme de gif animé dans les sites web et landing pages. L’originalité d’un tel procédé est que seule une infime partie de l’image est animée. Nous avons déjà pu en voir notamment dans les newsletters de nos grandes marques préférées. Il a d’ailleurs été noté que cette technique permet d’augmenter le taux de clic de 25% sur un emailing par rapport à un emailing sans animation.
En effet, par son attractivité et son effet de nouveauté, le cinemagraph augmente l’intérêt de l’internaute et permet de focaliser son attention sur un point précis.
Attention toutefois à son poids : il est important, en terme d’UX design et de SEO, de veiller à ce que le poids du cinemagraph n’augmente pas de manière significative le temps de chargement de la page web.

2. L’image : contenu prioritaire

Comme nous le savons, le cerveau a tendance à retenir plus facilement les images que le texte. Les visuels sont aussi beaucoup plus parlant qu’un long discours. Pour cela, il est évident que l’utilisation d’images (photographie, vidéo, illustration) reste pertinente dans la conception de site web en 2018.

Ainsi, pour attirer l’attention de l’internaute et vous démarquer de la concurrence, il est important de lui offrir des visuels uniques et qui vous ressemblent plutôt de de faire appel à des banques d’images plus impersonnelles, qu’il s’agisse de photographie ou d’illustration. Il est donc préférable de faire appel à des professionnels tels que photographes ou illustrateurs qui ont un style propre qui pourra vous séduire et donc séduire votre clientèle.

De même, la vidéo et l’animation 3D sont encore largement utilisées et permettent de rendre plus attrayante la présentation d’une entreprise ou d’un produit qu’un long bloc de texte.

3. Les couleurs vives

Webdesign 2018 - Pantone Violet2018 voit le grand retour des couleurs vives et dynamisantes. Ce n’est pas pour rien que l’Ultra-violet est la couleur Pantone 2018 ! Ce qui n’est pas pour nous déplaire 😉

Les webdesigners osent les couleurs « flashy » pour les marques qui veulent être originales et marquer les esprits.

4. Retour du dégradé

Dégradé Apple webdesignAprès quelques années de Flat Design, parfois jugé un peu trop froid et manquant de profondeur, les dégradés, plus élégants, sont de retour. En effet, depuis 2016, certaines marques comme Apple ou Instagram ont modifié leur identité visuelle pour y intégrer de larges dégradés de couleurs. Que ces dégradés soient utilisés pour la création de logos ou en superposition sur de larges visuels, cette tendance se confirme encore cette année.

Du point de vue de l’UX Design, il est nécessaire de faire attention à la lisibilité des textes qui sont apposés sur ces dégradés et, par mesure de précaution, de ne pas y associer de contenu informatif important.

5. Typo massives

Police massive UX DesignToujours dans le but d’aller au plus simple et au plus rapide, les items de menus sont de plus en plus courts, les phrases d’accroche le sont tout autant. Ainsi, afin de faciliter la lecture de l’internaute, les typo sont de plus en plus épaisses pour ce type de textes. Elles attirent le regard, se lisent en un clin d’oeil et permettent une action plus rapide.

Ces typo massives sont utilisées pour attirer l’attention de l’internaute qui a pris l’habitude de lire les pages web en diagonale pour gagner du temps. Il est à la recherche des mots importants qui lui aideront à comprendre rapidement le contenu de ces pages.

Les typo massives sont donc à privilégier pour des titres, des textes courts, des slogans et les items de menus (quand il y en a peu).

6. Nouveau format d’image : SVG

Le développement du rôle de l’UX Design dans la création des sites web ainsi que de la qualité des écrans disponibles sur le marché (avec l’arrivée des écrans Retina) a augmenté notre exigence en terme de qualité d’images. Les images JPG, PNG et GIF correspondant à des formats compressés, elles subissent des pertes de qualité non négligeables. Nous avons donc de plus en plus tendance à utiliser des formats nous permettant de conserver les propriétés et la qualité des images sans impacter le temps de chargement des pages web. Dans cette optique, le format SVG (Scalable Vector Graphic) sera probablement le format le plus utilisé lors de la conception de sites web en 2018, notamment pour les icônes.

En effet, quelle que soit la taille ou la résolution d’écran, les logos, icônes et autres graphiques conservent une qualité irréprochable. De plus, ce format gère parfaitement les effets de transparence, de filtre et d’animation.

De plus, trois types d’objets graphiques sont permis avec ce format : images, textes et formes vectorielles.

7. UX design : les interactions

UX Design Interactions Avec l’avancée des technologie et de l’importance de l’UX Design, les sites internet proposent de réelles expériences utilisateur qui permettent un engagement de l’internaute dans sa navigation. L’animation par l’interaction est le meilleur moyen de faire participer les visiteurs.

Ainsi, plus l’expérience utilisateur est originale et agréable, plus le temps passé sur chaque page du site est long et meilleur sera l’engagement des internautes.

Par exemple, les animations déclenchées par le scroll de la page invitent les visiteurs à faire défiler les pages du site et ont pour but d’augmenter le taux de conversion, à l’image du LookBook Winter de Wed’ze.

Il existe également des micro-interactions qui correspondent à de subtils mouvements déclenchés par l’action de l’internaute, comme, par exemple, le « saut » du caddie déclenché par l’ajout d’un produit dans le panier virtuel de l’utilisateur.

Très appréciées en UX design, ces micro-interactions permettent également d’améliorer l’expérience utilisateur de l’internaute en lui donnant un feedback immédiat sur l’action qu’il vient de réaliser et ainsi le rassurer. Ces micro interactions doivent être subtiles car elles doivent être à la fois visibles, discrètes et explicites.

8. Design asymétrique

UX desgin asymétriqueSur une page web, le design asymétrique consiste à mettre en place de manière non symétrique mais équilibrée différents blocs d’éléments (images, texte…), donnant ainsi plus de liberté à la créativité.

Le contenu est segmenté permettant ainsi à l’internaute de se concentrer plus longtemps sur le contenu de la page et améliorant l’expérience utilisateur…si et seulement si un équilibre est respecté dans la page afin d’éviter toute confusion.

En effet, les blocs de texte et les espaces doivent s’équilibrer avec les images afin d’obtenir une page fluide et esthétique.

9. Ecran partagé ou split screen

UX design et Ecran partagéL’écran partagé est comme son nom l’indique un écran « coupé » en deux afin de créer deux espaces différents permettant de véhiculer deux messages simultanément.

Très apprécié en UX Design, l’écran partagé offre une bonne expérience utilisateur d’un point de vue visuel quelque soit le support utilisé car l’interaction y est fluide et intuitive. Il est ainsi possible d’utiliser un bloc pour le titre et le visuel tandis que le contenu textuel  sera dans le bloc adjacent.

10. UX design : Chatbot

Autrefois limité aux messageries, les chatbots se démocratisent pour apparaître sur toujours plus de site internet, voire même devenir des sites internet à part entière. Ces robots conversationnels interactifs offrent à l’internaute une expérience utilisateur simple et intuitive d’autant que l’interface est généralement réduite au strict minimum, se concentrant au maximum sur la qualité des réponses à apporter aux utilisateurs.

Ce système ressemble donc à une messagerie instantanée et permet à l’internaute d’obtenir des réponses à ses interrogations dans les plus brefs délais ; en revanche, il faut savoir qu’il est très difficilement indexable et cela est donc à prendre en compte dans sa stratégie SEO.

Tendances webdesign

Tendances du webdesign 2016 en 5 points

By | Webdesign | No Comments

Infos sur le Webdesign aujourd’hui

Quand on doit créer un webdesign, il faut bien sûr tenir compte des règles techniques à respecter mais aussi des contraintes liées au cahier des charges du client ou encore des tendances en terme de graphisme et de l’expérience utilisateur.
En effet, le webdesign ce n’est pas que l’art d’associer des couleurs et des images sur un site Internet ; il doit tenir compte du style, de l’ergonomie et de l’UX Design pour faire de la visite des sites Internet, des expériences uniques.
Webdesign GAFAM
Voici donc une sélection des dernières tendances du web pour 2016 et les évolutions.
Il est vrai que le monde technologique est en pleine mutation avec le passage au tout mobile qui a accéléré et les interfaces qui ont dû s’adapter, le développement des objets connectés et l’arrivée des assistants vocaux.
Ce sont les GAFAM – pour Google, Apple, Facebook, Amazon et Microsoft – qui ont fait le webdesign d’aujourd’hui en optant pour le flat design , un style épuré, de grands visuels, des sites onepage et en plein écran, un grand retour de la typographie et surtout, le storytelling ! De plus, comme nous l’avons vu dans un autre article, les icônes ou pictogrammes sont encore largement utilisés.

Actus : les 5 tendances du webdesign en 2016

Les nouvelles tendances qui voient le jour ou se développent cette année sont :

  • Le material design : l’ergonomie et l’esthétique ont été optimisés pour la mobilité. Le style est semi-flat, les couleurs chatoyantes, il joue sur les profondeurs et les animations. Il est basé sur le réalisme et la physique, unissant ainsi réel et virtuel. Lancé par Google, le material design aurait un impact positif sur le SEO. A bon entendeur !
  • Le web immersif : c’est une autre façon de vivre le web. Nous parlons ici d’expérience utilisateur et non plus de navigation web. L’internaute participe à un « voyage immersif », sous forme de jeu le plus souvent, et qui marque son esprit à l’image de la campagne Petit ecolier de Lu en 2014 ou encore de Magnum plus récemment.
  • La vidéo : c’est un levier d’acquisition de trafic très efficace, alors pourquoi s’en priver ? L’internaute préfère regarder une vidéo à la lecture d’un article. Aujourd’hui, elles sont intégrées dans les sites web.
  • App first : après le responsive design et le mobile first, c’est au tour des applications mobiles d’être référentes. Ceci est lié au développement des appareils wearable.
  • Smart data : les sites sont et seront ultra-personnalisés grâce à l’utilisation des data récoltées dans nos différents appareils (géolocalisation, habitudes de navigations…).

Ainsi, en prenant en compte ces informations sur les tendances du webdesign de 2016, il vous restera à réaliser un benchmark dans ce sens et à trouver l’inspiration grâce aux sites de référence en webdesign listés sur ce site web.

Tendances webdesign

Webdesign : sources d’inspiration

By | Webdesign | No Comments

Pour réaliser un webdesign, plusieurs étapes sont nécessaires en amont pour s’assurer que celui-ci sera en accord avec les codes et les tendances web du moment. Cela passe bien entendu par un benchmark concurrenciel, d’une part, et par un benchmark sectoriel, d’autre part, qui permettront de connaître et respecter les codes du secteur d’activité des sites réalisés.

Dans un second temps, après avoir réalisé une études webmarketing et stratégique, le webdesigner doit également trouver l’inspiration même s’il réalise son site web à l’aide d’un CMS comme WordPress. Notez, au passage, que Voici un tutoriel pour vous aider à réaliser un site web avec WordPress.

Dans cet article, je partage mes sources d’inspiration aussi bien pour les sites web que les sites mobile first ou les applications mobiles.

Inspiration pour le webdesign

Souvent, les benchmarks concurrentiel et sectoriel réalisés en amont orientent déjà notre inspiration. Avec des visites de sites comme Pinterest et Behance, il est possible de booster son imagination et de se tenir informé des dernières tendances en matière de webdesign.

Pour autant, il existe quelques autres sources indispensables comme :

Blog du Webdesign

Mais surtout, il ne faut pas négliger les thèmes des différents CMS présents sur le marché (en ce qui me concerne, ce sera plutôt WordPress et Prestashop) qui offrent un panorama de tout ce qui se fait sur le web. Il ne faut donc pas hésiter à s’en inspirer !

Inspiration pour le design mobile

En ce qui concerne l’inspiration mobile, on retrouve des points communs à ceux cités plus haut comme Pinterest ou Behance mais j’utilise préférentiellement Mobile Awesomeness qui met en avant des designs mobile dans l’air du temps.

Awesomeness - webdesign mobiles

Si, vous aussi, vous souhaitez partager vos meilleurs sites d’inspiration, alors n’ hésitez pas à les laisser en commentaire.

UX design

UX Design : quelques outils incontournables

By | UX Design, Webdesign | No Comments

UX design et méthode de maquettage de site web

Dans un projet web ou de refonte de site, avant la réalisation du webdesign, il est nécessaire de réfléchir à l’expérience utilisateur (UX) et donc de dessiner la structure du futur site internet. Ces pré-maquettes nous permettent de savoir où placer chaque élément, de penser les différents scénarii de parcours des internautes et de tester différentes versions. Donc avant de penser webdesign, aujourd’hui, on pense UX Design ou design d’Expérience Utilisateur. L’utilisateur est au centre du projet.

Vous pouvez voir ci-dessous, un exemple de wireframe réalisé avant la création du webdesign du site Emprint (projet personnel).

UX design site web

Etapes de l’UX Design d’un site web

1 – Maquettage papier ou wireframing

La première étape de création d’un site Internet consiste à dessiner l’arborescence du futur site comprenant toutes les pages avec leurs différents niveaux d’interactions. Nous sommes déjà entrés dans l’UX Design.
Lorsque l’arborescence est réalisée, l’étape suivante est le dessin de la structure des pages principales : on l’appelle structure filaire ou wireframe.

A cette étape, les différentes parties du site sont représentées par des blocs et chaque image est représentée par un rectangle. Ce type de maquette n’est pas très détaillée mais nous permet d’avoir une vision d’ensemble des différentes pages et de penser les moindres détails de la navigation et des interactions à mettre en place entre les différentes pages du futur site web.

Afin de nous faciliter cette étape, il existe différents outils que j’apprécie particulièrement :

  • Une feuille de papier et un crayon : il est vrai qu’à l’ère du digital, on a tendance à les oublier mais ils sont pourtant très utiles pour la première phase de réflexion.
  • Wireframe CC : il s’agit d’un outil en ligne. Dans sa version gratuite, on peut déjà réaliser des maquettes intéressantes.
  • Balsamiq Mockup : c’est un logiciel payant très bien fait et intuitif. Il permet de réaliser rapidement des maquettes claires et de qualité.
  • Photoshop ou Fireworks de la suite Adobe : ce sont des logiciels payants mais permettant d’être plus précis et d’ajouter de la couleur.

2 – Réalisation de l’UX design / webdesign

A partir du wireframe, la réalisation du webdesign est possible. Il correspond à la version illustrée de la maquette dessinée en filaire. Elle est très détaillée et comprend généralement les photographies, les logos et les typologies qui seront utilisés pour l’intégration du site web. En général, on en présente deux versions à notre client. La version choisie par ce-dernier pourra encore faire l’objet de quelques modifications mineures avant la réalisation du site Internet, comme cela a été le cas pour le site Emprint.

Là encore, il existe différents outils et leur choix dépend du webdesigner et de son affinité avec eux. Voici ceux que’j’utilise le plus souvent :

  • Photoshop : qui est un logiciel de retouches photo très connu des photographes et des graphistes,
  • Illustrator : qui est plus utilisé dans la création de logos, d’illustration, d’images vectorielles et fait aussi partie de la suite Adobe,
  • Fireworks : qui peut être vu comme un mix entre Photoshop et Indesign, est très pratique pour réaliser des webdesigns. Le seul bémol est que la qualité des images que l’on exporte à partir de notre travail réalisé sur Fireworks est de moins bonne qualité que celles issues de photoshop ou Illustrator. D’ailleurs, Adobe ne semble pas vouloir continuer à développer ce logiciel puisqu’il est resté dans sa version CS6 même dans la suite Creative Cloud.
  • 960 grid system : qui est un site proposant à la fois un framework CSS et des templates de grilles à utiliser dans différents logiciels tels que Photoshop, Fireworks ou même Gimp. Ces templates de grilles sont très utilisés en webdesign pour aligner des images, du texte et respecter les proportions dans la réalisation des sites web.

3 – UX design : Prototypage du site

Une fois le webdesign réalisé sur chaque page du futur site web et avant l’étape d’intégration web, il peut être utile de réaliser un prototype du site, notamment pour une présentation à un client. En effet, un prototype permettra de visualiser les différents parcours utilisateurs, les différentes interactions entre les pages ou simplement les effets que l’on souhaite faire apparaître sur le site.

Pour cette étape, il existe aussi des outils performants. Voici ceux que j’affectionne le plus :

Outils UX Design

  • InVision : qui est un outil en ligne permettant de réaliser des prototypes de sites web et d’applications mobiles à partir des maquettes des différentes pages préalablement uploadées sur le site InVision. Cet outil est très utile et vraiment bluffant. C’est celui que j’utilise le plus.
  • Flinto : là encore, c’est un outil en ligne qui a les mêmes fonctions qu’InVision. Ces deux outils ont l’avantage d’être collaboratifs et intuitifs.
  • Fuid UI : qui est un outil en ligne très complet permettant directement le maquette et prototypage d’applications mobiles. Tout comme les deux précédents, il est très efficace.
  • GifYoutube : cet outil en ligne est très utile pour convertir des portions de vidéos en gifs animés utilisables ensuite sur les maquettes. Effet whaou garanti !

A vous de jouer maintenant et bonne création !

Webdesign immersif

10 webdesign tendances pour s’inspirer en 2016

By | Webdesign | No Comments

Afin de réaliser des webdesign dans l’air du temps, il est indispensable de faire une veille perpétuelle, comme je l’ai déjà expliqué dans l’article traitant des sources d’inspiration de webdesign en 2015.

Voici donc 10 sites internet remarquables par leur webdesign, leur expérience utilisateur, leur ergonomie ou leur créativité. Réalisons donc un petit tour de ces petites merveilles.

Les webdesign les plus créatifs

Ricanza

Ce site présente des couleurs pepsy et un webdesign moderne et original. A première vue, nous sommes sur un site vitrine simple au design coloré mais au fil de la navigation, on s’aperçoit que les fruits sont « animables » telles des maquettes 3D. Ce site découvert il y a quelques temps est une bonne surprise pour un site de producteur de fruits !

Webdesign Ricanza

Fiber Sensing

Ce site web est original et présente un webdesign moderne et dynamique pour une expérience utilisateur agréable. La navigation n’est cependant pas toujours intuitive.

Webdesign FiberSensing

Animal Made

Voici un autre site très créatif à l’ergonomie et la navigation simple. L’originalité du site réside dans son design et ses animations.

Webdesign Animal

Working Not working

Ce site est original par sa simplicité et les quelques petits effet…jusqu’au formulaire de contact!

Webdesign Workingnotworking

Webdesign : une expérience utilisateur hors du commun

Delaneau : le site d’un horloger bien inspiré.

Nouveau coup de coeur : nous arrivons tout d’abord sur une page présentant une animation ressemblant à celle d’un kaléidoscope très coloré. C’est une expérience ludique qui commence. Puis, une fois la surpise passée, en cliquant sur le logo, nous arrivons sur la réelle page d’accueil, qui, elle aussi est très colorée. Ce type d’illustration est très originale sur le web. Cela permet de marquer les esprits.

Webdesign original Delaneau
Une fois cette deuxième surprise passée, il suffit de scroller pour connaître l’activité de Delaneau. Les photos y sont très qualitatives et les animations agréables. Vers la fin, le scroll initie une animation montrant les différentes étapes de la fabrication d’une montre dans ses moindres détails. Ce site est très bien fait et très agréable. A voir !

LA 24

Ce site a été mis en place pour promouvoir Los Angeles pour les jeux Olympiques de 2024. Il comporte de nombreuses animations et vidéos ; les couleurs sont superbes. En bref, le webdesign est splendide, l’ergonomie est intuitive et l’expérience utilisateur remarquable ! Un immanquable de la liste des webdesign originaux !

Webdesign La24

Mmorph

Ce site promet une expérience utilisateur hors du commun de part son interactivité. Il joue à la fois sur le visuel avec des photos et vidéos de qualité et invite l’internaute à composer sa musique en manipulant la souris ou en touchant l’écran du mobile. Un autre coup de coeur à tester de toute urgence !

Webdesign gamification

Petra

Expérience utilisateur immersive garantie !

Webdesign immersif

Webdesign : l’inspiration au service de l’ergonomie

Ljosleidarinn

Avec ce site internet au webdesign moderne et épuré, nous sommes face à un site web ergonomique à la navigation simple et bien pensée. Hop ! Dans mon carnet d’adresse !
Webdesign original

Billabong

Le site de Billabong est simple mais très bien conçu. Encore une bonne adresse pour l’inspiration en webdesign et ergonomie.

Webdesign Billabong 2016

Site web html5-css3

10 outils indispensables pour construire son site web en HTML/CSS

By | Web, Webdesign | No Comments

Si vous êtes débutant ou si vous avez besoin de gagner du temps sur la création de votre site web, vous pouvez opter pour la solution simple de prendre un template et de le modifier à votre guise. Cela nécessite évidemment d’avoir des bases en HTML/CSS pour pouvoir comprendre la manière dont a été conçu le template et ensuite en faire ce que vous voulez. Il existe des sources de templates gratuits comme OS-template ou HTML5 UP ou encore Templated.co et il existe bien évidemment des templates payants à l’image de ceux que l’on trouve sur Themeforest, Template Monster  ou Gridgum. Sur les sites payant, pour 13$, on peut dénicher un template sympa et bien codé.

Si vous préférez coder vous-même votre site web de A à Z, il existe des outils formidables pour vous y aider. Voici donc les 10 outils indispensables pour construire votre site web en HTML/CSS.

  • HTML-ipsum

    htmlipsum-pttCe site vous donne les structures de base en HTML qui vous permettront de gagner du temps dans la rédaction de votre code.

  • OpenClassRooms

    OpenClassRoomsPour les débutants, il existe des mémentos pour le HTML et le CSS sur le très connu OpenClassRoom. Il sont facilement compréhensibles et pourvus d’exemples concrets.

  • Tutoriels vidéo

    Tuto.comVous pouvez également vous aider de tutoriels vidéo comme ceux de Tuto.com avec par exemple des tutoriels CSS et des tutoriels HTML gratuits.

    GraphikartLes tutoriels de Graphikart sur Youtube sont également bien faits à l’image de celui qui permet d’intégrer une maquette PSD en site HTML/CSS ci-dessous.

  • W3 Schools

    W3SchoolsW3 Schools propose des tutoriels pour maîtriser les langages HTML et CSS qui sont de bonne qualité et accessibles aux débutants.

  • Cubic Bezier

    Effet CSS Cubic-BezierSur le site de Cubic Bezier, vous pouvez tester vos paramètres sur les différents effets CSS tels que ease, linear…etc. Vous pouvez également y importer de nouveaux effets pour pouvoir les tester et ainsi proposer l’effet visuel désiré sur votre site web.

  • Animate CSS

    Animate CSSEn appliquant des class CSS à certains éléments de votre site web, vous pouvez les animer grâce aux différentes séquences pré-écrites sur le site Animate CSS

  • Les effets d’ombre

    AlsacréationsSur Alsacréations, vous retrouverez les différentes syntaxes pour réaliser différents effets d’ombres, qu’il s’agisse de « text-shadow » ou de « box-shadow. Ceux-ci sont présentés avec des démonstrations vous permettant de gagner du temps sur le rédaction de votre code.

  • Code-couleur

    Code-couleur.com est un site qui permet de générer les codes hexadécimaux des couleurs pris en charge par le langage CSS.

  • Initializr

    InitializrInitializr.com est un outil qui permet de générer un template en HTML5 et CSS3 sur-mesure et qui fonctionne sur la base de HTML5 boilerplate.

  • CSSMatic

    CSS MaticCSS Matic est un site regroupant 4 outils qui permettent de simplifier le codage d’effets plus ou moins complexes, comme les ombres ou les dégradés, et de manière personnalisée.

Avec de tels outils, vous voilà parés pour réaliser votre premier projet de site web ! Un zeste de créativité, un peu de rigueur et  beaucoup de persévérance, voilà ce qu’il vous faudra en plus si vous êtes débutant dans l’intégration web. Pour les autres, j’espère que cet article vous permet de connaître de nouvelles ressources du web même si la plupart sont déjà très connus !

photoshop

Top 5 des meilleurs tutoriels vidéos pour dompter Photoshop

By | Graphisme, Webdesign | No Comments

Pour mon premier article, je souhaite partager avec vous les meilleures sources de tutoriels gratuits pour se former sur l’outil Photoshop. Ce logiciel est incontournable pour réaliser de fabuleux webdesign ou simplement retoucher les images qui mettront en valeur votre site web.
Il existe de nombreux magazines ou blogs qui partagent quelques tutoriels mais je préfère les vidéos qui sont parfois plus explicites que des mots même si elles ne sont pas en français.
Il en existe là encore une grande variété mais voici le TOP 5 des tutoriels vidéo gratuits pour se former sur PHOTOSHOP.

1. Tuto.com 

Sur ce site, vous devez créer un compte pour pouvoir visionner les vidéos même gratuites mais ceci vous permet d’enregistrer des favoris et de télécharger les vidéos sur votre ordinateur ou votre tablette. Ce site ne propose pas que des tutoriels Photoshop ; il traite de nombreux thèmes tels que le graphisme, le webdesign, le code pour les développeurs, la photographie…Etc.
En exemple, j’ai choisi pour vous cette vidéo qui concernera surtout les débutants mais qui est très bien réalisée.

2. Blue lightning TV sur YouTube

Ces tutoriels sont simples, succincts et très bien faits. Même s’ils sont en anglais ils sont très compréhensibles car leur créateur parle lentement et est bon pédagogue ; de plus, les vidéos sont très bien réalisées et de bonne qualité. En voici un exemple concret avec le changement de matière d’un objet.

3. Tutoriels video.com

Ce site propose quelques tuto sur Photoshop intéressants. Les vidéos sont de bonne qualité et en français. Avec par exemple la reproduction de l’effet Vintage sur une photographie contemporaine. Ce site concernera plutôt les débutants.

4. Arunz creation

Ce sont des tutoriels en anglais mais on y apprend des effets sympa pour des design créatifs à l’image de celui présenté ci-dessous.

5. Team8 tuto

On y trouve de bon tutoriels en français dont celui-ci sur la création d’un webdesign moderne.

A ce top 5 des tutoriels PS, il faut absolument rajouter Tuts+ même s’il ne s’agit pas de vidéo.
En effet, ce site comprend d’excellents tutoriels décrits étape par étape, à l’image de celui que j’ai sélectionné pour vous pour la création d’un webdesign élégant.
Ce site propose des tutoriels aussi bien sur la création de webdesign que sur la création graphique.

En maîtrisant ce logiciel de retouches photos, vous serez capables de réaliser de magnifiques webdesign et/ou des images de qualité professionnelle, donnant ainsi une image positive à votre site web qu’il s’agisse d’un blog ou du site de votre entreprise.