Dernière mise à jour : 22/06/2017 à 15h37

Current Project : ...

Index des tutoriaux

SpriteEmitter

Ce tutorial est loin d'être complet et reste très très vague. Il avait pour but d'être un petit guide général des propriétés les plus utilisés. Le tutorial équivalent réalisé pour Projet-3D était beaucoup plus complet. Au final, ce tutorial-ci a été intégré dans l'introduction de l'énorme encyclopédie des SpriteEmitters de Skullk sur Unreal-Design que je vous invite à consulter.

Premiers pas :

Une particule est une image en 2D qui fait toujours face au joueur (sauf si on le paramètre spécialement pour éviter ça). Leur utilisation va de simples images fixes à des systèmes très évolués pour représenter des flammes ou des particules en mouvement. Le SpriteEmitter est l'un des deux composants permettant d'émettre des Sprites, l'autre étant le Xemitter, légèrement différent.

Pour commencer en douceur, nous allons émettre des particules fixes, simples, qui se contenteront d'apparaitre, disparaitre, changer de couleurs, puis nous compliquerons l'effet. Allez l'actor browser et choisissez l'actor Emitter, sans le confondre avec son homonyme, le Xemitter.

Emitter dans l'actor browser

Dans le texture browser, choisissez la texture à émettre. Pour ma part, j'ai choisi dans le package EmitterTextures, celle nommée EFlareR2. C'est une simple... euh... Etoile. La plupart du temps, les textures que vous utiliserez dans les emitters seront très ciblées : une texture de fumée, de feu, de ceci, de cela. Les textures très vagues comme celle-ci sont souvent utilisés pour des effets nécessitant de grosses étendues ou du mouvement intense (coloré en bleu et tombant très vite, on peut ainsi figurer une chute d'eau).

Dans les propriétés de l'emitter, allez dans la catégorie Emitter, et cliquez sur le petit "ajout" sur le coté pour ajouter un objet, que vous configurerez à SpriteEmitter, comme ceci :

SpriteEmitter

Toute une liste de paramètres effrayants se déroule en dessous. C'est l'énorme liste des paramètres des emitters. En temps normal, vous n'en utiliserez qu'une faible partie. Avant toute chose, vérifiez que vous avez activé le rendu en temps réel de votre fenêtre 3D (le petit joystick doit avoir un contour vert, cliquez dessus si ce n'est pas le cas). Logiquement, votre emitter émet déjà la texture par défaut des emitters :

Emission des premiers Sprites

La première chose à faire est de paramétrer la texture que vous voulez utiliser à la place de la texture de base. Dans l'onglet Texture, à Texture, cliquez sur le petit "util" sur le coté pour choisir la texture qui est actuellement sélectionnée.

Texture paramétrée

À ce stade, nous avons plusieurs problème :

Pour le premier problème, c'est dans l'onglet "Size" que cela se passe. Vérifiez que le paramètre "UniformSize" est à vrai (true), et dans StartSizeRange, à x, mettez Max et min à 5 pour que toutes les particules aient la même taille. UniformSize permet de n'avoir à modifier qu'une seule des trois valeurs (X, Y ou Z). Les autres s'ajustent dessus pour converser les proportions de la texture. StartSizeRange permet de définir la taille minimale et maximale des particules. Si vous utilisez des valeurs différentes, chaque particule aura une taille aléatoire comprise entre ces deux bornes.

Si vous avez entré une très faible taille, Il se peut que les particules soient cachées par l'actor. Nous avons vu aussi que nos sprites avaient une longévité bien trop importante, ce qui était un peu dommage car les texture s'empilant au même endroit, on finissait par avoir une grosse tache blanche.

Dans l'onglet Time, à LifeTimeRange, qui définit les durées de vie minimales et maximales de vos particules mettez par exemple 1 à min et 2 à max.

LifeTimeRange ajusté

Par défaut, toutes les particules apparaissent au centre exact de votre actor emitter. Pou modifier cela, allez dans l'onglet Location. La propriété qui définit la zone d'apparition est StartLocationRange. Dans mon cas, je veux créer une colonne assez étroite de particules, je dois donc mettre des bornes larges sur Z et des bornes assez rapprochées pour X et Y (longueur et largeur). Je mets Zmin -100 à et Zmax à 100, et X et Y à 20 max et -20 min

Location

Un autre problème apparait maintenant que chaque particule est bien différenciée : toutes les particules appariassent et disparaissent brutalement. Il serait mieux que les particules se fondent lentement dans et hors du décor. Dans l'onglet Fading, la propriété FadeInEndTime permet de définir combien de temps met la particule à devenir opaque, et FadeOutStartTime définit en combien de temps la particule disparait (en secondes). Pour que ces deux propriétés aient un effet, vous devez mettre FadeIn et FadeOut à vrai. Activez-les, puis réglez vos paramètres comme vous le voulez. Personnellement, je mettrais FadeInEndTime à 0.5 et FadeOutStartTime à 0.6.

Fading... Peu visible enimage

Pour augmenter le nombre de particules, dans l'onglet General, augmentez la valeur de MaxParticles. Je mettrais 35.

Textures en plusieurs parties :

Maintenant que vous maitrisez (n'est ce pas ?), les propriétés les plus simples, voyons comment utiliser les textures subdivisées. Dans le package Emitter Textures, dans le Group Multi Frame, admirez les textures bizarres qui vous attendent :

Textures Multiframes

Ces textures sont (comme vous le voyez), divisées. En fait, leur utilisation donne des effets plus réalistes à l'emitter et n'est pas très compliquée.

Choisissez la texture fire3. Créez un emitter qui envoi lentement ses particules vers le haut et les fait apparaitre toutes au même niveau. Pour ce faire, utilisez l'onglet Velocity et la propriété VelocityStartRange. et revenez à votre emitter, dupliquez le et placez le sur le coté. Arrangez vous, (en utilisant vos nouvelles connaissances, pour que les sprites naissent toutes au même niveau. Ensuite, dans l'onglet Texture, placez votre nouvelle image.

Emission de toutes les frames

Vous remarquez que toute la texture est affichée, et que donc, c'est moche. En dessous de Texture, dans TextureUsubdivision et TextureVsubdivision, mettez 4 et 4, car vous avez 4 images dans le sens de largeur, et 4 dans le sens de la hauteur, sur votre texture :

Division de Fire3

Avec SubdivisionStart et SubdivisionEnd, vous pouvez définir un ordre de chaque frame pour les particules. Ainsi, nous avons 16 frames, qui sont numérotées de 0 à 15. En mettant 0 dans SubdivisionStart et 15 dans SubdivisionEnd, chaque particule jouera dans l'ordre les 16 frames de la texture. Inversement, pour que chaque particule n'affiche qu'une seule frame tirée au hasard, activez UseRandomSubdivision. Enfin, BlendBetweenSubdivision permet de ne pas changer brutalement d'une frame à l'autre mais de faire un fondu entre chaque subdivision.

Flames par frammes de texture subdivisée

Quelques propriétés en plus :

Vous allez surement rencontrer un problème : vos particules seront un peu nombreuses, et cela fera un effet d'empilement des textures qui deviendront blanches, comme ceci :

Les particules blanchissent quand elles sont en nombre

Les textures devraient être transparentes. Dans "Color", à "Opacity", vous n'avez qu'à mettre par exemple 0.5, et tout ira mieux :

Opacité corrigée

Vous pouvez utiliser encore bien des outils spéciaux pour rendre vos emitters plus beau/plus réalise/plus ce que vous voulez. Ainsi, si vous avez par exemple envie de reproduire les emitter de Jumpers des cartes officiels, vous aurez besoin de deux textures. La première est celle de petit point qui s'envole, qui n'ont rien de bien particulier. Par contre, il y a une texture de quadrillage qui a une propriété spéciale : elle est toujours parallèle au sol comment faire ? Et bien créons un emitter pour vous montrer. La texture se trouve dans le package epicparticles, dans le group JumPad : c'est la texture en grille

Texture de grille.

Dans l'onglet sprite, se trouve l'outil dont vous avez besoin : UseDirectionAS : il est à défaut à PTDU_None, qui indique que la texture est toujours visible dans son entier (donc vous fait toujours face). Il suffit de changer ça en PTDU_Normal. Votre texture sera parallèle au sol quel que soit votre angle de vue :

Texture parallèle au sol.

2005-2016, by Hellkeeper.

Valid XHTML 1.1 CSS 2.1