Critique de VOS créations #2

Voici enfin le deuxième numéro de cette série d’articles qui a pour but de donner un avis constructif sur les créations que vous m’avez envoyé.

Si vous souhaitez envoyer une de vos créations et recevoir une critique sur le blog, la démarche à suivre et toutes les informations sont ici :

Critique de vos créations : Sommaire et démarche à suivre

Disclaimer : Les avis et critiques données dans cet article ne reflètent que ma seule opinion. Il va de soi que les avis peuvent diverger d’une personne à l’autre et que je n’ai pas la prétention de donner la Vérité ultime. Chacun est libre d’interpréter ces créations et leur critique.

1. Digital painting par Fabrice P.

La toute première création de cette série à être critiquée est ce digital painting de Jordan P. Inspiré, je me suis lancé dans une critique et même dans un « paint over » très rapide afin de mieux illustrer ma critique (une image vaut mieux que 1000 mots).

Pour améliorer la création :

• Mieux délimiter les plans
• Améliorer la profondeur
• Replacer l’arbre plus au centre de la composition
• Avoir un aspect moins monochromatique
• L’arbre se confond avec le ciel (cela rejoint le premier point)

Pour aller encore un niveau au-dessus, cela nécessiterait de lourds changements. Il faudrait alors se poser la question suivante : qu’est-ce que je souhaite mettre en avant ? Quel est le sujet de ce painting ? Est-ce l’arbre ? les montagnes ? un juste milieu des deux ? Cela permettrait ainsi d’avoir une composition plus intéressante et plus en accord avec la volonté de l’artiste. Cela permet de choisir un placement différent des éléments, un angle de vue approprié, cela guiderait également le choix de couleurs, etc… Quelle vision désire-t-il choisir ?

Mais corrigeons déjà les principaux points cités au-dessus car ceci nécessite plus d’expérience et c’est un choix personnel que seul l’artiste peut faire.

Après un rapide « paint over » :

Comme cela a été dit plus haut, on pourrait encore grandement améliorer cette création en modifiant lourdement la composition mais je pense que le principal a été fait afin de mieux lire l’image :

– moins de contraste, surtout dans les valeurs les plus sombres

– meilleure délimitation des plans (arbre – rochers – montagnes) donc meilleure lisibilité et plus de profondeur

– arbre légèrement déplacé

– modification des couleurs pour « calmer » la scène

2. Webdesign de Crelcreation :

Ce redesign de Youtube très intéressant a été proposé par Crelcreation. Probablement inspiré par le webdesigner Andasolo, je vais offrir mon opinion sur ce redesign du célèbre site de vidéos en ligne.

La première impression est que c’est beau, on sent le soucis du détail jusque dans le moindre bouton et dans chaque texture. L’interface est agréable à regarder, les sections sont bien claires et délimitées et l’utilisation des typographies est judicieuse à l’exception des paragraphes de textes blancs que je n’aurais pas laissés en gras.

• Ma première critique, et de loin la plus importante, ne concerne en réalité pas le design des blocs ou les effets graphiques, mais plutôt le choix de direction artistique. Une des choses les plus importantes à garder à l’esprit lorsqu’on crée un webdesign est pour qui ce site est destiné. Quelle est mon public cible ? Ce design, très soigné et détaillé, tranche fortement avec l’image actuelle du site qui est claire et épurée, adaptée à une cible d’utilisateurs très large. Le choix d’une interface sombre et de ses nombreux effets graphiques donne une image plus sombre, plus proche à mon goût de l’univers du gaming, par exemple. Néanmoins cela était peut-être volontaire pour l’exercice de style ou alors aurait été cohérent s’il s’agissait par exemple d’un « Youtube pour gamers ».
• Deuxième soucis : l’optimisation du chargement. La page étant graphiquement assez chargée et possédant de nombreuses images, le temps de chargement sera long. Le soucis ? C’est que Youtube est un des sites les plus visités au monde et traite des millions de requêtes par minutes. Il faut donc obligatoirement limiter au maximum les images et scripts ralentissant le chargement de la page et privilégier tout ce qui peut être fait en CSS uniquement. Encore une fois, cela n’a rien à voir avec la qualité du design mais cette fois avec le contexte d’utilisation du site.

Maintenant place à la critique du côté de l’ergonomie :

• Si on compare à l’ergonomie actuelle de la page d’accueil de Youtube, on peut se demander si certains choix de ce redesign sont justifiés et l’espace optimisés. Je prends en exemple le slider en haut : à mon sens il n’est pas utile et optimisé. Il semble plus intéressant de profiter de l’espace du haut (le plus important sur une page) pour afficher un maximum de vidéos mises en avant (et non une seule à la fois dans un grand slider). Une mosaïque de 6 miniatures de vidéo aurait par exemple été judicieux (ou 3 miniatures plus grandes).
• Dans le même esprit, le bouton « Upload a video » est très anecdotique et vient se perdre dans du contenu pourtant homogène et n’ayant pas de rapport direct. Il semble plus intelligent de placer ce bouton avec toutes les actions propres à l’utilisateur dans une zone comprenant toutes les actions le concernant : « Créer un compte, Connexion, Envoyer une vidéo« , etc… cet espace est généralement placé en haut de page, c’est donc là qu’on le cherchera en premier.
• Dernière critique ergonomique : la zone « Follow us » présentant des liens vers les réseaux sociaux où est présent le géant de la vidéo en ligne me semble disproportionnée. Etant déjà un des sites les plus visités au monde et ayant tout intérêt à mettre en avant le contenu du site (les vidéos) qui génèrera beaucoup plus de trafic, je ne pense pas qu’un tel espace soit nécessaire pour mettre en avant les réseaux sociaux. Le partage des vidéos est beaucoup plus important en comparaison.
• On pourrait bien entendu continuer une critique sur les choix ergonomie/parcours utilisateur durant longtemps tant la tache est lourde pour un site si conséquent mais cela devrait suffire pour comprendre comment faire certains choix de placement.

Côté design pur :

• Ce dernier point est ici le moins lourd à critiquer car le design est comme je l’ai déjà dit, très soigné et parfaitement homogène. Les couleurs sont utilisées de façon cohérentes (par exemple tous les liens respectent un code couleur – texte en rouge) et les quelques effets de lumière semblent très bien réalisées et ajoutent une finition au design.
• Attention aux quelques textes manquant de contraste et donc de lisibilité
• Si on veut chipoter, on pourrait critiquer l’aspect de certains éléments où les reflets sont un peu trop redondants et trop visibles (attention à l’effet glossy web 2.0 !)
• Peut-être que de façon générale, le design pourrait être un peu plus lumineux – malgré le fond noir – pour mettre en avant certaines parties et « égayer » l’interface par endroit.

3. Digital painting d’AcyeL

Nous finissons cet article sur un digital painting d’AcyeL. L’illustration a beaucoup de potentiel, notamment celui de raconter une histoire. D’autre part, le contraste chaud/froid, sombre/lumineux est intéressant. Malheureusement des soucis de composition et de lumière viennent ternir la création. Voyons comment l’améliorer sans tout refaire !

• L’un des principaux problèmes selon moi est cette épée à gauche : on reconnaît l’objet mais on ne sait pas ce qu’elle fait là et qui la tient. En 2-3 petits changements on pourrait rendre la scène plus menaçante
• La zone claire de l’extérieure est trop uniforme et trop présente : tout ce blanc « brûle » l’image.
• On peut encore accentuer le contraste de chaleur

Après un rapide « paint over » – enfin pas si rapide que ça cette fois, je le reconnais (1h30 environ) – voici quelques idées d’améliorations pour AcyeL.

Qu’ai-je fait concrètement pour améliorer cette création sans tout changer ?

• Le point principal a été le changement de composition de la partie gauche de l’image : l’épée manquant de sens, j’ai décidé d’ajouter une partie de personnage tenant cette épée afin de rendre la scène plus menaçante et de donner plus d’information qu’avec la simple épée : on comprend rapidement la tension qui règne juste avant un potentiel duel à mort (ou autre histoire dramatique). De plus, le repositionnement de ces éléments équilibre mieux la composition.
• J’ai ensuite travaillé sur la lumière de la scène : la partie toute blanche représentant l’extérieur de la grotte a été adoucie en ajoutant du relief, à gauche notamment. Cela ajoute du réalisme et de la profondeur en plus de reposer les yeux du spectateur.
• La lumière du personnage a également été améliorée : la source lumineuse chaude provenant de la grotte (sûrement un feu – perspicace je suis !) éclaire et réchauffe beaucoup plus l’avant du personnage qu’avant, ce qui l’intègre mieux dans la scène.
• Enfin, la lumière à l’intérieur de la grotte et sur le dos du personnage au premier plan a été renforcée – ajustée.
• Cerise sur la gâteau, j’ai ajouté un petit effet de lumière dans le fond, pour garder et renforcer l’idée de la lumière extérieure aveuglante. Puis, les effets de lumière, c’est toujours cool. On peut aussi remarquer de la neige faite très grossièrement.

C’est la fin de ce deuxième numéro de Critique de vos avis. Il a mis beaucoup de temps à paraître pour la simple raison qu’offrir une critique cohérente et de qualité demande beaucoup de travail. Du moins, pour la qualité, j’essaie ! 😛 A ce sujet, n’hésitez pas à partagez votre avis sur les trois créations de ce numéro et sur la critique donnée à chaque fois. Je rappelle que nous sommes ici dans le but de progresser ensemble et de partager nos connaissances de façon positive.

Pour finir, merci aux trois lecteurs (et à tous les autres !) qui m’ont envoyé leurs créations afin de recevoir une critique personnalisée. Si vous souhaitez envoyer une de vos créations et recevoir une critique sur le blog, la démarche à suivre et toutes les informations sont ici (c’est simple, promis !) :

Critique de vos créations : Sommaire et démarche à suivre

Critique de vos créations #3

Auteur: Gaétan Weltzer, comme toujours en fait.