Suivez-nous sur X
|
|
|
0,
A,
B,
C,
D,
E,
F,
G,
H,
I,
J,
K,
L,
M,
N,
O,
P,
Q,
R,
S,
T,
U,
V,
W,
X,
Y,
Z,
ALL
|
|
0,
A,
B,
C,
D,
E,
F,
G,
H,
I,
J,
K,
L,
M,
N,
O,
P,
Q,
R,
S,
T,
U,
V,
W,
X,
Y,
Z
|
|
0,
A,
B,
C,
D,
E,
F,
G,
H,
I,
J,
K,
L,
M,
N,
O,
P,
Q,
R,
S,
T,
U,
V,
W,
X,
Y,
Z
|
|
A propos d'Obligement
|
|
David Brunet
|
|
|
|
En pratique : Karate - le colorblending
(Article écrit par Laurent Stéphanoni - octobre 2004)
|
|
Note : le script de cet article est fourni ici.
Colorblendquoi ?
Vous n'avez jamais eu envie de vous la raconter avec des effets de déments bien typés démos, comme des blur,
des color blending, ou même des effets d'alpha-blending ("light") ? Ok, avec Karate, c'est facile ! Mais pour
cela, il va falloir créer des color tables.
Déjà, qu'est-ce que le color blending ? C'est faire des mélanges de couleurs (en gros). Mélanger la couleur
de fond déjà posée avec la couleur de l'effet à poser. En gros (encore ?), si, en un point, j'ai telle couleur
en fond, et que je veux poser une autre couleur, je dois trouver la couleur qui résulte de la fusion des deux
pixels de couleurs précédents.
Regardons de plus près. Notre image de fond est en 256 couleurs, notre image à poser est en 256 couleurs également.
Il suffit donc de mélanger les valeurs pour obtenir une palette pleine de 256x256 couleurs, soit une palette en 16 bits,
soit 65 536 couleurs. Ensuite, on a plus qu'à afficher des images dans cette palette.
Avec des palettes en 16 bits (hi color) ou 24 bits (true color), c'est très simple, puiqu'on a toutes les couleurs
disponibles. Seulement voilà, Karate fonctionne en 8 bits, donc avec une palette fixe de 256 couleurs. Il faut donc
lui donner une table de conversion de 256x256 couleurs vers la palette courante de 256 couleurs.
Colorblending, ah ok...
Comment faire ? C'est simple, Karate est fourni avec une image ("colortablemodel") 24 bits, qu'il ne nous reste plus
qu'à réadapter à la palette utilisée dans notre présentation. Il suffit donc de charger notre palette avec Deluxe Paint ou
Personal Paint ("Load Image" sur un des sprites utilisés dans la démo), et ensuite de charger cette image sous forme
de brosse ("Load Brush"). Deluxe Paint va alors recalculer cette image avec notre palette. Pour Personal Paint, il faut
demander explicitement le recalcul couleur simple (menu brosse -> recalculer). Il suffit ensuite de sauver votre
colortable où vous voulez (dans le répertoire de votre démo, par exemple). Si toutefois, à l'usage, vous voyez des
couleurs très bizarres dans votre démo, pensez à répéter l'opération en modifiant les options de recalcul palette
(avec/sans diffusion, avec/sans Floyd-Steinberg). Il semblerait que le logiciel Brilliance donne d'excellent résultat pour
ces opérations.
Ensuite, il n'y a plus qu'à charger votre colortable.
Deux colortables ? et deux modes ? Ça devient compliqué
En fait, je vous mens un peu. Karate construit les colortables deux par deux. Je m'explique. Déjà, Karate gère deux types de
colortables, et deux modes pour chaque type.
- Soient les colortables 256x256->256, les colortables pour des opérations mélangeant deux images de 256 couleurs,
- Avec un effet de transparence de 50%,
- Ou avec un effet de persistance avec affadissement.
- Soient les colortables 256x64->256, les colortables mélangeant une image de 256 couleurs et une image de 64 couleurs (une image "light"),
- Avec un dégradé du noir vers le blanc,
- Ou l'inverse, blanc vers noir.
Et toutes ces options se retrouvent dans un seul constructeur dont la syntaxe est :
<KCOLORTABLE> nom_colortable | disk:chemin/colortable.iff |
type256x256 |
R | G | B </KCOLORTABLE>
|
Avec type256x256 qui prend la valeur 0 pour 50% de transparence, et 1 pour la persistance avec affadissement, et
les valeurs R, G, et B qui prennent 255 si vos images light ont une palette qui va du noir au blanc, ou 0 dans le
cas contraire.
Mais il existe un autre constructeur, qui vous évite d'avoir à créer cette ColorTable sous Deluxe Paint ou Personal
Paint, il s'agit de ComputeColorTable. Celui-ci calcule la colortable directement sur une image déjà chargée.
Il faudra que cette image soit suffisamment grande (de la taille de colortablemodel.iff), et
cette image ne pourra plus être utilisée comme un sprite ensuite. Ou alors, ne soyez pas surpris quand vous l'afficherez
avec Sprite ou SpritePlain.
Le constructeur a donc la syntaxe suivante :
<COMPUTECOLORTABLE> nom_colortable | nom_image_source |
type256x256 |
R | G | B </COMPUTECOLORTABLE>
|
Les effets 256x256->256
Bon, c'est bien mignon toutes ces belles lignes de textes, mais ça nous fait pas des beaux effets ! On va rajouter ces
2-3 effets stylés dans notre ancien script. On va commencer par les effets de flou, très simples.
Il faut déjà charger la colortable, au début du script, avec les lignes suivantes. On prévoit de faire du 50% de
transparence pour les effets 256x256->256, et des sprites lights qui vont vers le blanc pour les effets 256x64->256,
ce qui donne :
<KCOLORTABLE> coltab0255 | data/remaptable.iff | 0 | 255 | 255 | 255 </KCOLORTABLE>
|
Pensez à varier la valeur de type256x256, et les valeurs R, G, B dans le constructeur pour voir les différents type de flou.
Le flou de mouvement
Pour appliquer un flou de mouvement (motion blur) sur un rectangle (petit rappel : Karate rend tous les effets dans des rectangles),
il suffit de créer sa colortable, et de poser les lignes suivantes :
<FX>
<PA> MotionBlur </PA>
<PA> monRectangle </PA>
<PA> maColortable </PA>
</FX>
|
Avec monRectangle qui prend un nom de rectangle, ou qui est vide pour appliquer le flou de mouvement à tout l'écran.
Il est important de noter que la place du flou de mouvement dans la kpart est, justement, importante. En effet, seuls les effets
placés avant le flou de mouvement seront affectés, ce qui est logique.
On va y rajouter à la fin de la seconde kpart, après le sprite dans un premier temps, mais avant le </KPART>, avec
les paramètres suivants :
<FX>
<PA> MotionBlur </PA>
<PA> </PA>
<PA> coltab0255 </PA>
</FX>
|
Vous pourrez aussi regarder ce que ça donne si vous le placez avant le sprite. Le sprite ne sera alors pas affecté par le flou.
Le flou radial
Le flou radial (radial blur) est un peu plus complexe que le flou de mouvement, car il faut spécifier le centre du flou, et sa force.
Le flou radial se pose ainsi :
<FX>
<PA> RadialBlur </PA>
<PA> monRectangle </PA>
<PA> maColortable </PA>
<PA> centreX </PA>
<PA> centreY </PA>
<PA> forceX </PA>
<PA> forceY </PA>
</FX>
|
Vous pouvez essayer de remplacer le flou de mouvement de votre deuxième part par le flou radial suivant par exemple :
<FX>
<PA> RadialBlur </PA>
<PA> </PA>
<PA> coltab0255 </PA>
<PA> 2CTE | 0.5 | 0.5 </PA>
<PA> SIN | 0.5 | 0.05 | 0.4 </PA>
<PA> SIN | 0.5 | 0.05 | 0.4 </PA>
</FX>
|
Les sprites transparents
Dernière opération de colorblending 256x256->256, il est possible de rendre des sprites transparents !
Pour cela, la syntaxe est :
<FX>
<PA> SpriteTable </PA>
<PA> monRectangle </PA>
<PA> monSprite </PA>
<PA> abscisse (X) du coin supérieur gauche </PA>
<PA> ordonnée (Y) du coin supérieur gauche </PA>
<PA> abscisse (X) du coin inférieur droit </PA>
<PA> ordonnée (Y) du coin inférieur droit </PA>
<PA> maColortable </PA>
</FX>
|
Donc, la seule différence avec un sprite classique, c'est le nom de l'effet (premier paramètre), et un paramètre en
plus pour donner la table. Vous pouvez donc essayer de modifier le sprite qu'on faisait bouger au centre de l'écran
en ajoutant votre colortable.
Les effets 256x64->256
Les effets de "light" sont très impressionnants dans Karate. Ils permettent de faire apparaître des titres, ou des
dessins en noir et blanc avec pas mal d'efficacité. ;) Ici par exemple, nous allons faire tourner un fantôme autour
de notre sprite central sauteur. Je rappelle qu'une image "light" est une image sans limite de taille, mais en 64
niveaux de gris (du noir au blanc, ou l'inverse, de toute façon la couleur à l'écran est définie par les trois derniers
paramètres du constructeur de la colortable).
Pour utiliser un sprite light la commande est la suivante :
<FX>
<PA> SpriteLight </PA>
<PA> monRectangle </PA>
<PA> monSpriteLight </PA>
<PA> abscisse (X) du coin supérieur gauche </PA>
<PA> ordonnée (Y) du coin supérieur gauche </PA>
<PA> abscisse (X) du coin inférieur droit </PA>
<PA> ordonnée (Y) du coin inférieur droit </PA>
<PA> maColortable </PA>
<PA> taux de visibilité </PA>
</FX>
|
Le taux de visibilité doit être compris entre 0 et 1. A 0, le sprite light n'est pas du tout visible, à 1, le sprite light
est totalement visible, et de la couleur désignée par les trois derniers paramètres du constructeur de "maColortable". Dans
notre cas, il sera blanc. Libre à vous de tester avec 0 | 0 | 0.
On va donc ajouter à notre kpart (avant ou après le flou, c'est vous qui voyez) :
<KIMG> ghost64 | data/lightghost.iff </KIMG>
<FX>
<PA> SpriteLight </PA>
<PA> </PA>
<PA> ghost64 </PA>
<PA> COS | 0.45 | 0.1 | 0.4 </PA>
<PA> SIN | 0.45 | 0.1 | 0.4 </PA>
<PA> COS | 0.55 | 0.1 | 0.4 </PA>
<PA> SIN | 0.55 | 0.1 | 0.4 </PA>
<PA> coltab0255 </PA>
<PA> SIN | 0.5 | 1 | 0.4 </PA>
</FX>
|
Et voilà !
Bon, maintenant que vous connaissez pas mal de nouveaux effets bien sympathiques, il ne vous reste plus qu'à
expérimenter, et à faire vos propres démos 2D qui tuent ! Et n'oubliez pas de fouiner dans la doc !
Pour ceux qui veulent une doc complète sur les effets disponibles dans Karate, leurs paramètres, les objets concernés,
allez faire un tour sur lightourfire.free.fr sur la page [karate].
Il y a un joli guide qui contient toutes les informations utiles, et qui propose, pour chaque effet/objet/paramètre, un
lien direct vers une démo et un lien direct vers les sources des tutoriels officiels.
La prochaine fois, on va finir les quelques derniers effets 2D : les textes défilants (scrolltexts) et les effets de raycasting
(pour faire des tunnels et des déformations de textures impressionnantes, mais aussi un super effet qui remplit
l'écran avec une tonne de sprites ou sprites light) !
PS : rappel pour ceux qui l'aurait manqué : Karate 1.0 est disponible sur
www.k-fighter.net.
Soutenez le travail d'Obligement
|
|
|
