Exercices sur la bannière proposée par JajaVisuel d’origine[Vous devez être inscrit et connecté pour voir cette image] Il s’agit de l’écran de présentation d’un jeu vidéo. Pour transformer cet écran en bannière nous allons devoir apporter des modifications. Premièrement adapter le format de ce visuel à celui de la bannière devant prendre place sur le site et bien sûr remplacer les textes. Le but du jeu est de garder le look du visuel d’origine et de l’adapter au caractère du site.
Voici une première tentative[Vous devez être inscrit et connecté pour voir cette image] On constate effectivement que le rapport homothétique du format est différent par rapport à l’original, celui du site est plus large et moins haut. Le cartouche du bas a entièrement été refait pour pouvoir recevoir la ligne de texte du site qui est plus longue que celle du visuel original. Un logo pour le site a également été conçu à partir de deux polices de caractères différentes pour prendre la place du titre du jeu vidéo.
Le but est de garder l’esprit graphique du visuel d’origine, pour ce faire, le cadre a entièrement été revu et simplifié pour aérer la fenêtre du visuel. La plus grande partie de la bannière devant être occupée par ce dernier afin d’en renforcer l’impact. Dans l’idéal, il aurait fallu créer un nouveau cadre avec des arabesques en respectant le graphisme du cadre d’origine. Ici, je me suis contenté de reprendre des parties du cadre pour en créer un nouveau plus sobre et moins lourd visuellement parlant mais mieux équilibré grâce aux deux côtés verticaux pour éviter que le cadre flotte comme sur l’original.
Les couleurs d’origine sont respectées et il a fallu recréer de la matière dans le visuel en bas à gauche et à droite, ainsi qu’en haut au centre.
Idem au précédent, mais le halo blanc autour du logo nuisant à la lisibilité de la typo, il a été remplacé par une ombre portée pour l’améliorer. Voyez la différence.
Ici, l’idée consistait à ajouter un côté féerique en plaçant des étoiles autour du logo. L’exercice ne se révèle pas concluant parce que là aussi cela nuit à la lisibilité du logo.
Dernière phase
Jusqu’à présent les couleurs d’origine ont été gardées, mais comme vous le constatez ce visuel a quelque chose de lugubre : une porte lumineuse au fond de la nuit entourée d’arbres tordus en bordure de marécage n’a rien d’engageant et si je passais devant il y a de fortes chances que je ne m’attarderais pas dans les parages !
Il fallait donc essayer de remédier à cela.
C’est ce qui a été tenté ici en changeant les couleurs, certes le décor n’a pas changé mais le coin est devenu un peu plus « hospitalier » parce que moins sombre. Les bruns et les verts adoucissent l’ambiance et peuvent rassurer d’une certaine manière même si les arbres tordus et la paroi du fond restent peu engageants. L’espoir vient de cette porte qui brille de mille feux.
La qualité de l’image d’origine ne permet pas techniquement parlant d’améliorer plus en avant les teintes. C’est la raison pour laquelle vous devez choisir une image de bonne définition dès le départ sinon vous serez vite limité dans votre démarche graphique et créatrice. Le choix de l’image, ce qu’elle représente et l’ambiance qui s’en dégage doivent être en accord avec l’état d’esprit du site. Cette démarche n’est pas évidente parce que vous devez penser à l’avance, en choisissant une image, si elle sera en accord avec le concept du site et si elle vous permettra techniquement parlant de la modifier pour atteindre le but fixé.
C’est la raison pour laquelle vous devez aborder ce travail d’une façon totalement différente de celui des « Sig Battle ». Ici vous n’avez pas d’image imposée mais un thème, ce qui change tout parce que vous devez respecter ce thème et le concept du site.
Pour conclure : il ne vous suffira pas de choisir une image qui vous plaise, vous devrez en choisir une qui réponde à la demande et au thème imposé… et ce n’est pas un travail facile !Bon courage à tous et merci de nous faire partager vos idées et vos créations :D