Drapeau Réunionnais
drapeau reunionnais
Comité du Tourisme
photo satelite de la reunion




calque_de_fondRéaliser son Skin

(part. 2)


attention-page lourde, env. 4 Mo
Pour Vsk4 ou Vsk5

Dans ce tuto je vous montre par des captures la manip. pour réaliser un Skin de Grand voile pour Vsk 5, bien entendu la manip pour vsk 4 est, à peu de choses près, la même chose.

C'est un Tuto pour débutant avec Gimp, (je suis moi-même débutant), je suppose qu'il a une meilleure façon, voir des meilleures façons.

Je vous donne ma version...



Avant de commencer, je veux vous dire que réaliser son skin est long... mais gratifiant.
C'est une touche perso, qui peut être artistique et/ou jolie à regarder.

Le but aussi est de le montrer aux autres lorsque qu'on joue en ligne.
Eh oui c'est bien d'être vue...et ça se fait pas tout seul...

Ca donne ça sinon  :

sans skin sans skin sans skin

Lire les explications sur le Locator


Sommaire:

1-Logiciels nécessaires
2-Fichiers nécessaires
3-Mise en route avec Gimp
4-Mise en couleur de la GV
5-Ajouter les lattes et renforts en couleurs originales
6-Ajouter notre TUX
7-L'alpha
8-Sauvegardes en zip,dds, et essais
9-Décors sur les 2 faces
10-Raccourcis que j'utilise
11-Remarques supplémentaires
-couche alpha sur la coque et team
-diviser par 3 à 4 le poids du skin (vsk5)




1-Logiciels nécessaires:

La bonne nouvelle c'est qu'ils sont gratuits.
Allez à la page "Logiciels", pour des infos (téléchargement, tutoriaux...)

2-Fichiers nécessaires (pour gagner du temps):

Dans la partie téléchargement, prendre:
Téléchargez aussi un Tux (mascotte Linux)

3-Mise en route avec Gimp

Je prendrais comme exemple la Grand Voile (sails2).
Décompressez le calque de fond et "décapsulez les DDS" (cf part. 1), y compris l'alpha.
(vous renommez le "!_Calques_de_fond.zip.ludo" en !_Calques_de_fond.zip")
Vous vous retrouvez avec ces fichiers là:

capture

Vous faites comme bon vous semble:
Vous vous retrouvez avec ça:

capture

Le truc à comprendre avec Gimp est qu'il superpose des calques que l'on modifie.
Pour les voir, il faut cliquer sur l'oeil.

Petites définitions pour ceux qui ne connaissent pas:

capture

On ouvre les 2 calques, la voile et son alpha (ouvrir comme un calque):

capture

capture

on obtient ça

capture et capture

C'est la voile de couleur qu'on voit, étant donné quelle est opaque à 100%, elle couvre la vision des autres calques, même si il y a les "yeux" devant.

pour éviter toutes fausses manoeuvres on renomme notre fichier sails2.xcf, par exemple "test.xcf"

capture

capture

Pour éviter des fausses manoeuvres, on duplique les calques:
On sélectionne un par un les calques (ligne bleue) et icônes dupliqués:

capture capture

Vous pouvez les classer, les renommer (en double cliquant sur le nom d'un calque),

Pour éviter de m'embrouiller, j'ajoute une feuille blanche entre chaque partie (ici, la partie: originaux et la partie: calques manipulés(alpha et couleur))

capture capture

capture capture

4-Mise en couleur de la GV


Je ne suis pas artiste, alors ne me tenez pas rigueur sur les choix des couleurs.
Vous choisirez les vôtres vous même :-)

on sélectionne le chemin de GV

capture capture

capture capture

capture
dans la barre d'outils, allez dans: "outils\outils de couleurs\Balances des couleurs"
faites varier les curseurs, vous pouvez aussi agir sur les tonalités (vif, ombre...)

capture

voila le résultat

capture
Stoppez la sélection (clignotement des tirets) par le raccourci " shift - ctrl - a "

5-Ajouter les lattes et renforts en couleurs originales.


Créer un calque transparent :

capture capture

On obtient:

capture

retour dans les chemins, et on va ajouter des sélections successives en maintenant la touche shift:

capture

On retourne dans les calques et on sélectionne la GV original, on copie (par le raccourci ctrl - c), on sélectionne le calque transparent (lattes, oeillets..), on colle (raccourcis ctrl - v), on ancre la manip:

capture capture
capture

C'est pas très beau, je vous ai prévenu, j'ai pas trop de goût :-)

6-Ajouter notre TUX (mascotte linux)

(J'y pense n'oubliez pas de sauvegarder de temps en temps, raccourcis ctrl-s au format *.xcf)

Fichier\ouvrir comme un calque\tux_500px.png\ouvrir
On obtient ça:

capture

On le centre en sélectionnant "l'outil déplacer", et dans l'image vous faites un glissé-déplacé (clic gauche enfoncé et déplacement souris)

capture capture

On peut...

capture

par exemple:

capture capture

7-L'alpha


Voilà, on s'occupe de la couche de transparence maintenant, l'ALPHA.
Pour mémoire:
( l'alpha pour la coque et le Team gére la brillance et non la transparence.)
Moi, j'aime bien un dégradé de transparence, je vous montre:

On ne rend plus visibles les calques de couleurs en cliquant sur les yeux pour les faire disparaître,
et j'ajoute un calque transparent que je nomme dégradé:

capture capture


capture capture

vous sélectionnez-activez (chemin vers sélection) la GV:

capture

Dans l'image, vous sélectionnez le calque transparent nommé"dégradé" et tracez une ligne dans l'image pour réaliser le dégradé:

capture capture

capture

Pour foncer le dégradé, on duplique le calque dégradé, et on agit aussi sur son opacité:

capture capture

on obtient ça:

capture

On désactive les sélections (ctrl - shift - a)

On va tracer les contours de Tux, pour ne pas le rendre trop transparent.

-On sélectionne son calque, on le rend visible avec un fond blanc.
-On sélectionne l'outil "sélection des formes dans l'image" ou "ciseaux" ou "sélection intelligente.
-On zoom sur l'image (ctrl et rotation molette souris)

capture capture
capture

on trace les contours de Tux en créant des points tout autour:

capture

on termine ( ferme ) en cliquant sur son premier point:

capture

On clique une fois à l'intérieur de la boucle que l'on vient de réaliser, pour rendre la sélection active:

capture

capture

Pour enregistrer cette sélection en chemin, on va dans chemin, et on clic sur "sélection vers chemin", on peut nommer cette sélection.

capture capture

On aurait pu faire plus simple étant donné que l'image source de Tux gère la Transparence (*.png), mais pour les débutants j'ai donné cette manip qui pourra servir plus tard pour d'autres images pas transparentes...

Sinon, plus simple on aurait fait:

outil sélection par couleur, réglage à 255 (toutes les couleurs, comme le fond est transparent)

capture capture

et sélection dans Tux (une de ses 255 couleurs)

capture

Désolé, si vous avez suivi la précédente manip (plus longue) mais ça vous servira si vous ne la connaissiez pas ...

On revient à notre Alpha

On créé un nouveau calque, pour l'alpha de Tux,

capture

On "sélectionne-active" le Tux,
et on contrôle bien que le calque "alpha de Tux" est bien sélectionné

capture capture

On prend l'outil peinture, en contrôlant que la peinture de PP (premier plan) est noire et la AP blanche (Arrière Plan)
On règle l'opacité à 100%, et remplissage avec couleur de AP

capture capture


On clique dans la sélection une fois

capture

Maintenant on règle le gris en jouant sur l'opacité du calque (pas trop blanc):

capture capture

On va opacifier à 100% les zones de renforts, lattes..., pour ce faire,

on créé un nouveau calque transparent, que je nomme "alpha lattes..."

capture

on sélectionne les lattes, renforts oeillets..., Cf la manip déjà réalisée là

et on rempli de blanc opacité 100%

capture capture

capture capture

On stop la sélection (shift-ctrl-a)
On obtient ça:

capture

N'oublier pas de sauvegarder au format Gimp (.xcf) (ctrl-s)

8-Sauvegardes en dds, zip et on essai


On va sauvegarder ce que l'on voit au format "bmp", pour pouvoir les mettre dans la capsule DDS puis ZIP.

Et oui, on se rapproche de la fin...

Faites apparaître (avec les yeux) les calques nécessaires pour l'alpha:

capture

puis, enregistrer:

Fichier\enregistré sous\sélectionner le fichier "sails2-alpha.bmp" \enregistré\ remplacé\exporter.

Faites la même chose pour la couleur:

capture

Fichier\enregistré sous\sélectionner le fichier "Sails2.bmp" \enregistré\ remplacé\exporter.

Encapsulé en DDS avec DXTBmp comme vue dans la partie 1 en sauvegardant pour la "Sails2.dds" (option "dds dxt5")

capture

Zippez les fichiers nécessaires:

capture

appelez le "1-TUX.zip" par exemple (le "1-" pour qu'il arrive dans les premiers dans vos choix de skins)

capture

Insérez-le dans le répertoire du jeu :
C:\program files\32nd America's Cup\gamedata\Skins\Boats\Acc

->pour vsk5, on peut mettre le fichier dans ce repertoire ou au choix dans:

 Mes Documents\32nd America's Cup\Skins\Boats\Acc

ou C:\Documents and Settings\votreID\mes Documents... (si vous n'avez pas déplacé "Mes documents" de Partition.

Notez qu'il vous faut créer les repertoires manquant, c'est à dire pour notre cas,  Boats et ACC, sinon ça ne fonctionne pas.

capture

Lancer...

Face A
capturecapture

Face B

capture

9-Décor sur les 2 faces


Je vous montre comment je travaille sur l'autre face.

Nouveau calque transparent, je le nomme "couleur face bd":

capture

rendre visible les calques couleurs:

capture

Édition\copie visible
sélectionner le calque "couleur face bd"
coller (ctrl-v), ancrez

On obtient un calque totalisant ce qui est visible
On "sélectionne-active" le chemin de la GV

capture capture

On sélectionne le calque "couleur face bd" et l'outil de rotation

capture capture

dans l'image, cliquez enfoncez et faites tourner, validez par "pivoter"

capture capture

Prendre l'outil de déplacement:

capture capture

Baisser l'opacité du calque (pour voir le calque de dessous qui nous sert de référence pour le positionnement):

capture

déplacez votre calque pour le superposer pile-poil sur la voile de droite
Une fois bien placé, remontez l'opacité à 100%, puis ancrer:

capture capture

Enregistrez en *.BMP

faites la même opération pour l'alpha
Perso, je préférais une voile plus transparente

capture

On sauvegarde, on fait un essai... et ainsi de suite
Il ne vous reste plus que : le spi, le génois, l'équipage et l'avatar :-)

Là, je vous laisse faire.
J'espère vous avoir aidé (ou carrément vous avoir fait passé l'envie de faire votre skin.)

Et n'oubliez pas de lire la page Locator, car cela serait dommage que l'on ne voit pas votre Oeuvre :-) , sauf si vous savez ce qu'est un locator


10-Raccourcis que j'utilise:


sauvegarde: ctrl - s
sélection de toute la feuille: ctrl - a
inverser la sélection: ctrl - i
annulation de sélection: shift - ctrl - a
annulation des dernières manipulations: ctrl - z
suppression des zones sélectionnées: ctrl - z
copier: ctrl - c
coller: ctrl - v
couper: ctrl - x
Zoom avant arrière dans l'image: ctrl - rotation molette souris
déplacement latéral de l'image en position zoom: ctrl - molette souris


11-Remarques supplémentaires:

a/ La couche alpha

Pour les voiles elle agit sur la transparence.
Pour la "Coque et le Team" l'alpha agit sur les reflets (Blanc = très brillant ...)

b/ Divisé par 3 à 4 le poids des skins (VSK5)

Ca c'est une bonne nouvelle pour la rapidité des échanges de skins durant les courses en ligne, on peut diminuer la taille des calques.

Par exemple, les génois qui sont en 2048x2048, peuvent être réduit à 1024x1024.

On perd très très peu en définition (franchement je vois à peine la différence), et surtout le poids du fichier final est divisé par 3 à 4.

fichier traditionnel = 10 Mo
fichier diminué = 3 Mo (tous les fichiers divisés par 2 sauf l'avatar)

Mode opératoire avec Gimp

Après avoir décapsulé le zip et les dds en bmp, ouvrez un fichier bmp

capture ecran

ouvrez son analogue Alpha (comme un calque)

capture ecran

capture ecran

Notre exemple, la coque, est en 2048x2048, on va donc le mettre en 1024x1024.
Faire Image\echelle et taille de l'image :

capture ecran

capture ecran

Selectionnez l'interpolation "Cubique" (meilleure)

capture

Comme il y a un lien entre la hauteur et la largeur, le fait de modifier un des 2 éléments, l'autre de modifira automatiquement du même rapport.

capture ecran

Maintenant nous sommes en 1024x1024.
Faites apparaitre un des 2 calques

capture

Enregistrez sous..., ecrasez l'actuel (----.bmp)

capture

Passez à l'autre calque

capture

capture


Réencapsulez en dds et zip (compression normal)

Voila, voili voilou, et franchement, de loin on ne voit aucune différence, mais au moins on nous voit .


Fin
@+ Ludo

Et laissez vos commentaires...

capture
.
Créé avec : logo nvu, logo kompozer, logo gimp, logo site du zero,logo alsacreation , logo Valid XHTML 1.0 Strict, logo css valid,......Retour en Haut de Page