ClickteamFusion

Introduction

Clickteam est une entreprise française fondée en 1993, étant principalement connue pour son outil de programmation Clickteam Fusion (outil auteur) permettant de développer des jeux vidéos ou d’autres outils interactifs à l’aide d’une interface graphique et sans avoir besoin d’écrire du code.

Description de Clickteam Fusion

ClickTeam Fusion est un outil de création d’applications ou jeux vidéos - outil-auteur - ne nécessitant pas de maîtriser un langage de programmation. Voici les principales forces de Clickteam Fusion, selon ses auteurs : CF est décrit comme accessible à tout le monde, et du fait de son format “code-free” il est dit qu’il est possible d’apprendre à développer en une heure. L’outil intègre tout ce qui est nécessaire pour créer une application basique de A à Z, il utilise un moteur physique (Box2d) pour les mouvements notamment et permet à vos applications de tirer profiter de l'accélération matérielle des utilisateurs. CF permet d’exporter vos applications ou jeux compatibles Windows (gratuitement) mais aussi sous format flash (swf), iOS, Android, HTML5 (option payante).

Une des forces de Clickteam Fusion est donc ses modules d’exportation. Parmi ces modules nous avons six possibilités d’exportation : en application swf/flash pour des modules utilisant la technologie d’adobe, iOS pour les terminaux mobiles de Apple, Android pour les terminaux Android, HTML5 pour des jeux jouables dans un navigateur sans logiciel supplémentaire, et XNA pour des applications pouvant s’éxecuter sur les produits Windows (dont la XBox et les Windows Phone).

ClickTeam Fusion 2.5 est la dernière version de cet outil. Celui-ci a cependant plusieurs fois changé de nom, comme on peut le constater en parcourant le web. Il s’est tout d’abord appelé Klik & Play (KnP), puis The Games Factory (TGF), et enfin Multimedia Fusion (MMF) avant d’adopter son nom actuel Clickteam Fusion (CF).

Exemples des jeux

Jeux pour Windows

• Enlightenus
• NightSky
• Luor : “Shoot ’em up” opposant la lumière à l'obscurité.

Jeux en Flash

• MagnetKid
• CaboBay
• Fashion&glamour : permet au joueur de créer un “avatar” féminin, intègre différentes possibilités de personnalisation. Une fois l’avatar créé le joueur est limité à rejouer cependant (avec la version gratuite) ou à envoyer son avatar par courriel (version deluxe uniquement).

Jeux pour iOS

• Pocket Ninjas
• AWESOME Land
• Alphabet Learn

Programmer avec Clickteam Fusion

Trucs & Astuces

Clickteam Fusion est un outil puissant, mais pas toujours intuitif. De plus, comme tout programme, certains éléments peuvent ne pas fonctionner entièrement correctement ou posséder quelques bugs. Cette section est là pour donner des astuces simples pour programmer son jeu avec CTF sans perdre trop de temps.

Commentaires

Cela peut paraître bête, mais un code commenté vous fait toujours gagner du temps à la relecture, surtout si le projet est long et que plusieurs personnes y participent. Pour ajouter un commentaire, il suffit de cliquer sur la bordure avec les numéros des conditions dans vos gestionnaires d'événements et d'insérer un commentaire. Aussi, pour plus de visibilité, vous pouvez changer la couleur de fond.

Utiliser des variables pour vos expressions

Dans Clickteam Fusion, il est possible de faire des conditions avec des expressions (par exemple, si ma variable est égale à x + y /5), mais parfois, ces expressions ne sont pas correctement prises en compte par le logiciel, il est donc fortement conseillé de mettre son expression dans une variable, puis de faire sa condition sur la variable. Cette astuce peut vous faire gagner plusieurs heures, car CTF ne vous indiquera pas que votre expression n'est pas prise en compte. De plus ce petit truc vous offre un meilleur contrôle de vos éléments (via le debugger).

Incrémenter vos variables avec des conditions

L'incrémentation d'une variable se fait généralement à travers des boucles, mais dans CTF il vaut mieux utiliser des conditions que des "fast loop" qui tournent dans le vide. Il est possible de limiter l'incrémentation avec une autre condition et si on veut que l'incrémentation se fasse à un moment spécifique, il est possible de créer des groupes d'événements. Néanmoins, si vous utilisez des "fast loop", attention avec l'utilisation de l'index des boucles rapides : mieux vaut créer une variable indépendante qui s'incrémente à chaque tour de la boucle, si vous voulez utiliser l'index dans une expression (par exemple : si ma variable = x + y / index). En effet, cela ne marche pas comme désiré.

Utiliser des variables globales

L'utilité des variables globales est similaire à l'utilisation des variables globales dans tous les langages informatiques, c'est-à-dire qu'elles vous permettent un accès global (à travers toutes vos scènes). Pour les créer, il suffit de sélectionner votre application (l'élément racine de votre projet sur la ligne avec le logo "éclair" de CTF dans votre "Barre espace de travail) et des les ajouter dans l'onglet "valeur". Les variables globales sont également très utiles pour faire des tests, car elles sont affichées automatiquement dans le debugger.

Utiliser des variables pour faire des tests

Chaque fois qu'un élément ne marche pas, n'hésitez pas à ajouter une "variable test" pour savoir si votre condition/boucle/expression est prise correctement en compte par l'outil auteur (Par exemple, si je crée une boucle, je peux fixer la valeur de ma variable test à 1 comme premier élément de ma boucle, pour voir dans le debugger si le logiciel rentre bien dans ma boucle). Certaines fonctionnalités sont très similaires et fonctionnent parfois seulement dans des cas particuliers, la "variable test" est l'outil de base pour tout programmateur, c'est un des premiers réflexes à avoir quand un élément ne marche pas comme vous le vouliz.

Debugger

Le debugger est un outil essentiel à toute programmation. Il permet de base de voir les informations systèmes et les différentes variables globales. Vous pouvez également ajouter vos objets au debugger pour voir le fonctionnement de vos variables en cliquant sur l'icône du petit rectangle en bas à droite de votre de debugger.

debugger

Même si celui qu'offre CTF de base est déjà très bien et sûrement suffisant pour de petits jeux, si vous le souhaitez, il est possible de faire votre propre debugger.

Utiliser des "qualifieurs" pour traiter vos objets dynamiquement

Les qualifieurs sont comme des classes, qui s'appliquent à tous les objets. Vous pouvez en ajouter à votre objet en cliquant dessus et en ajoutant un qualifieur dans l'onglet événement. Si vous comptez faire en sorte que plusieurs objets se comportent pareillement, il est plus simple de mettre à chacun de ces objets le même qualifieur et de faire les conditions sur ce même qualifieur au lieu de le faire sur chaque objet. De plus, il est possible d’accéder à chaque objet possédant le même qualifieur en faisant une boucle "for each" sur le qualifieur.

Conditions

Tout les événements dans CTF sont à voir comme des conditions, ce qui peut être contre-intuitif. En effet, il n'y a pas de condition "else" pour un traitement alternatif sur un objet : il faut donc ruser un peu pour l'obtenir. Nous allons voir quelques exemples pour mieux comprendre ces conditions Quelques exemples sur les conditions

• AND : Si on crée une première condition A (par exemple, "si mon objet touche un mur"), on peut soit insérer une nouvelle condition (clic droit + insérer) qui sera considéré comme une seconde condition obligatoire (un "AND"), par exemple, j'insère l’événement B ("si mon mur est visible"), ce qui fait que les actions seront soumises à la condition A et B ("Si mon objet touche un mur et que ce mur est visible").
• OR : Dans CTF, il existe deux possibilités de faire un ou (else if), le OR logique ou le OR filtré. Le OR logique prendra en compte vos actions si une seule de vos conditions est réalisée, alors que le OR filtré prendra en compte vos objet séparément. Par exemple, si on les conditions :

1. la souris est au-dessus de l'objet 1
2. OR (filtré)
3. la souris est au-dessus de l'objet 2

Avec les actions détruire l'objet 1 et détruire l'objet 2 en dessous. Dans cette condition, si on a la souris au-dessus de l'objet 1, alors l'objet 1 est détruit et si on a la souris au-dessus de l'objet 2, l'objet 2 est détruit. Avec un OR (logique), les deux objets seraient détruits à chaque fois, que l'on ait le curseur sur l'objet 1 ou 2.

• Else : Pour cette condition, il faut un peu ruser. La plupart du temps, vous pouvez copier-coller votre condition, cliquer sur la condition copiée et choisir "inverser" ce qui inversera la condition. Si votre condition porte sur une comparaison, par exemple, si la valeur de point de vie du personnage est égal à 0, il faudra créer une "expression inverse" si la valeur de point de vie du personnage est inégal à 0. Il est également possible, de fixer une valeur de base au préalable et de la modifier dans la condition ou d'activer des groupes où la condition se réalise ou encore de changer la valeur d'un drapeau pour les conditions binaires (on/off).

Drapeaux pour les variables binaires

Les drapeaux sont des variables pré-programmées liées à vos objets. Si vous désirez programmer une variable de type binaire (on/ff), il est conseillé d'utiliser les drapeaux et de faire des conditions sur l'état (on/off) de ces drapeaux. Il est toujours possible de faire une variable et de changer sa valeur en fonction de la situation (par exemple la fixer à 0 ou 1), mais le traitement des drapeaux est plus optimisé et vous évitera des bugs dans des expressions ou des boucles. Il ne faut pas fixer un drapeaux à on ou off sur un objet pour qu'une condition s'enclenche. Il vaut mieux mettre le drapeaux sur inverser sur l'objet désiré puis après programmer quand le drapeau est ON faire tel action et quand le drapeaux est OFF faire tel action.

Différentes boucles

Il existe différentes sortes de boucles sur CTF, les "fast loop" sont des boucles qui tournent dans le vide et qui sont extrêmement rapides, mais qui sont limitées dans le traitement des objets. La "fast loop" s'utilise en deux temps, ce qui est assez contre-intuitif : elle est créée par des "actions" et non en "condition", la "condition" permet d'utiliser une "fast loop" par son nom, et ce une fois avoir été créée dans une action. Si vous voulez faire une boucle sur des objets, utilisez plutôt une boucle du type "for each" qui prend en compte tous vos objets ou vos objets d'un certains type. Pour cela, il est conseillé de mettre un qualifieur à vos objet et d'utiliser une boucle "for each" via le qualifieur. Par exemple, vous pouvez lancer une condition en choisissant un nombre de fois que l'élément sera lancer via les conditions (par exemple, exécuter l'événement une fois) et faites une action sur votre qualifieur "comptage => pour chaque objet" et donner un nom à votre boucle. Après cela, faites une nouvelle condition, cliquer sur votre qualifieur et choisissez "boucle => pour chaque objet", redonnez ensuite le nom que vous aviez donner à votre boucle, puis vous pouvez choisir des actions.

Groupes d'événements comme actions imbriquées

Dans CTF, il n'est pas possible d'imbriquer directement une condition dans une autre, ou d'imbriquer une condition dans une boucle. Car l'interface de CTF, ne permet que d'avoir des conditions (reliées par des AND/OR) et leur actions, ce qui est problématique si l'on veut faire une condition qui tombe dans une boucle ou sous une autre condition. C'est pourquoi il est vital de comprendre l'utilisation des groupes d'événements. Il est possible de créer un groupe d'événements (clic droit sur la colonne avec les numéros des conditions et insérer un groupe d'événements) et de le désactiver (clic droit sur la ligne de l'événement => activé/désactivé la ligne). Toutes les conditions seront ainsi désactivées, et vous pourrez les réactiver au moment voulu (attention pour cela à ne désactiver que la ligne du groupe d'événements et pas les événements à l'intérieur, sinon ceux-ci ne seront pas pris en compte). Les actions seront donc activées à l'action "activer le groupe d'événement" et il est possible des les limiter (qu'elles ne s'activent qu'une fois lors de l'activation du groupe) ou de les laisser tourner tant que le groupe est activé. Par exemple, si je veux faire des conditions sur chacun de mes objets, je peux faire une boucle "for each" qui a comme unique action d'activer un groupe d'événements, dans lequel je pourrais mettre des conditions qui ont chacune leur propres actions.

Configurer des évènements sur l'ensemble de votre application

Parfois il est utile et plus simple de configurer un évènement qui soit valable pour l'ensemble de l'application plutôt que de l'ajouter à toutes les scènes. Pour ce faire, il faut aller dans les propriétés de l'application. Puis sur évènement et enfin sur édition.

Création de calques

Les calques peuvent être très utiles pour ajouter des objets au dessus d'autres objets qu'on veut faire apparaitre ou disparaitre par exemple. Ou faire apparaitre une fenêtre par dessus la scène. Les calques se trouve dans la barre d'outils des calques, celles-ci se trouvant à droite. Dans cette barre d'outil vous pouvez ajouter des calques par dessus votre scène principale.

Exporter votre jeu pour utiliser dans le système Android

Si vous avez acheté "Android/OUYA Exporter" pour votre Clickteam Fusion, une fois vous avez terminé votre jeu, vous pouvez l'exporter sous la forme d'un fichier .apk pour utiliser dans le système d'android.

Avant de faire les opérations dans Clickteam Fusion, vous avez besoin d'installer dans l'ordre suivant: 1.Java SE development kit 2.Android SDK. Suivez les tutoriels officiels pour les deux installations.

Après toutes les installations susmentionnées, vous pouvez ouvrir Clickteam Fusion. Tout d'abord, suivez le chemin suivant pour régler les options concernant Android SDK et Java SE development kit dans Clickteam Fusion: Tools --> Preferences --> General-->Exporters Configurez les chemins (voir image 1) pour que Clickteam Fusion puisse accéder aux Android SDK et Java SE development kit que vous avez installé (Vous n'avez besoin de les configurer qu'une seule fois).

Image1

Maintenant vous pouvez ouvrir votre jeu et commencer les operations d'exportation. Dans un premier temps, il faut redimensionner la taille de fenêtre de votre jeu à une taille plus adaptable à l'écran d'un téléphone (plus ou moins 360 x 550). Attention, le changement de la taille de toute la fenêtre nécessite ensuite des changements correspondants des paramètres des éléments dans votre jeu pour qu'ils puissent rester dans l'espace juste (voir un exemple d'un changement à faire dans l'image 2). Donc il faut faire un control sur tous les paramètres concernant les coordonnées que vous avez établi auparavant. Une fois tout est réglé, allez vers "Build Type" (en français: type de construction) et choisir Android/OUYA Application(.apk) (voir image 3). Ce choix fait apparaître un petit icôn d'android à droite de la barre de propriétés (voir image 4). En cliquant sur l'icône d'android, des options telles que "Package name", "Build API" etc. apparaissent (voir image 4) et vous modifiez en fontcion de vos besoins.

Image2

Image3

Image4

Note: Si vous envisagez de mettre le jeu dans une plateforme telle que Googleplay, vous avez besoin de remplisser "Release mode" (voir image 5). Pour obtenir les informations requises sous "Release mode", vous pouvez télécharger dans Clickteam Community Android Keystore Generator Tool fourni par un utilisateur appelé Danny. Il y a aussi une instruction d'utilisation de cet outil dans la même page de téléchargement. Après que vous avez fini avec la configuration des toutes les options Android , suivez le chemin "File -> Build --> Application" pour exporter le jeu sous forme d'un fichier "nom_du_jeu.apk".

Image5

Liens & Tutoriels

• Pages officielles
  • Clickteam : Site officiel de Clickteam
  • CF - Product Comparisons : Comparaison des versions de CF
  • Modules d’exportation : Flash - iOS - Android - HTML5
• Tutoriels
  • Clickteam Tutorials : Tutoriels officiels
  • Chaine Youtube: Tutoriels videos pour Clickteam
• Ressources
  • Ressources officielles proposées sur le site de Clickteam
  • Opengameart, site contenant de nombreuses ressources. La navigation peut être laborieuse
• Autres
  • Youtube : 167 Indie games faits avec Multimedia Fusion (MMF)

Camacab0 (discussion)