Dans cet article, nous vous expliquons comment crĂ©er les Ă©lĂ©ments graphiques liĂ©s Ă la mĂ©canique de jeu Rattrape-Tout. Ces Ă©lĂ©ments sont personnalisables et doivent ĂȘtre importĂ©s dans l'onglet Apparence de votre page de jeu.
Vous pouvez tĂ©lĂ©charger le fichier Photoshop (.psd) regroupant tous les Ă©lĂ©ments graphiques. Nous vous expliquons Ă©galement comment modifier facilement chaque Ă©lĂ©ment. Si vous le souhaitez, il est possible dâutiliser dâautres logiciels (Canva, Figma, etc.) pour crĂ©er vos propres Ă©lĂ©ments graphiques, Ă condition de respecter les dimensions indiquĂ©es ci-dessous.
Avant de commencer
Fichier Photoshop
Le template Photoshop contient deux plans de travail :
Vue Desktop : câest ici que vous pouvez modifier tous les Ă©lĂ©ments de la mĂ©canique de jeu.
Vue Mobile : elle sert uniquement à prévisualiser le rendu sur un appareil mobile (ne pas modifier directement).
Tous les Ă©lĂ©ments personnalisables se trouvent dans le groupe de calques bleu nommĂ© MODIFY / EXPORT. Ce groupe contient 6 calques, chacun Ă©tant un objet dynamique : double-cliquez dessus pour lâouvrir et le modifier.
ArriĂšre-plan et fond de jeu
La mĂ©canique de jeu est intĂ©grĂ©e par-dessus lâarriĂšre-plan de votre page. Vous pouvez prĂ©voir un espace dĂ©diĂ© Ă la mĂ©canique du jeu dans votre arriĂšre-plan.
Variables
Si vous souhaitez afficher des variables sur votre page, comme le temps restant ou le score du participant, pensez à prévoir un espace dédié dans votre conception graphique pour ces éléments.
Fond de jeu
Le visuel du fond du jeu est complĂštement personnalisable graphiquement.
Taille : 810 x 650 px
Visuel Rattrape-Tout
La taille du visuel est libre mais elle doit ĂȘtre proportionnelle aux visuels Ă Ă©viter et Ă rattraper et ne pas excĂ©der 200px de large pour ne pas empĂȘcher lâĂ©vitement des malus.
Taille libre
Taille recommandée : de 100/200 px x 100/200 px
Le visuel du Rattrape-Tout se place automatiquement Ă 10px au dessus du bas du fond de jeu :
ĂlĂ©ments Ă rattraper
Vous pouvez crĂ©er jusqu'Ă 6 visuels distincts pour les bonus. Chaque visuel se verra attribuer automatiquement un nombre de points allant de +10 Ă +60 en fonction du nombre de visuels crĂ©Ă©s. La taille des visuels est libre mais elle doit ĂȘtre proportionnelle au visuel du rattrape tout.
Taille libre
Taille recommandée : de 50/150 px x 50/150 px
ĂlĂ©ments Ă Ă©viter
Vous pouvez crĂ©er jusqu'Ă 6 visuels distincts pour les malus. Chaque visuel se verra attribuer automatiquement un nombre de points allant de -10 Ă -60 en fonction du nombre de visuels crĂ©Ă©s. La taille des visuels est libre mais elle doit ĂȘtre proportionnelle au visuel du rattrape-tout.
Taille libre
Taille recommandée : de 50/150 px x 50/150 px
Exportation
SĂ©lectionnez les calques
Cliquez droit sur lâun dâeux et sĂ©lectionnez Exporter sousâŠ
SĂ©lectionnez les paramĂštres suivants dans la popin dâexportation :
Format : PNG
Transparence : activée
Convertir en sRVB : activé
Incorporer le profil couleur : activé
Cliquez sur le bouton Tout exporter⊠et sĂ©lectionnez le dossier de destination âAssets - Rattrape Toutâ de votre rĂ©pertoire de Rendu.
Cette mĂ©thode rogne automatiquement lâespace vide autour des assets.
Quelle est la suite ?
Une fois vos Ă©lĂ©ments graphiques crĂ©Ă©s et optimisĂ©s selon les formats recommandĂ©s, il ne vous reste plus quâĂ les importer dans la section Apparence. Vous pourrez ensuite passer Ă la configuration de votre campagne, afin dâajuster les paramĂštres et finaliser sa mise en ligne.
Exemples