🎨 Textes ,langues et ressources
Ce chapitre a pour but d'apprendre à utiliser les données contenues dans le dossier «Ressource» du mod, ces fichiers correspond beaucoup où sont placés les textes, dans quelle police.
Le dossier resource/ contient tous les éléments de l'interface utilisateur de votre mod :
- 🎨 Apparence : Couleurs, polices, styles
- 🖼️ Disposition : Position des éléments HUD
- 📝 Textes : Traductions, dialogues, sous-titres
- 🎮 Menus : Configuration du menu principal
- ⚙️ Options : Configuration des paramètres
Pourquoi c'est important ? Une bonne interface utilisateur peut :
✅ Améliorer l'expérience joueur ✅ Renforcer l'identité visuelle de votre mod ✅ Faciliter l'accessibilité (langues, sous-titres) ✅ Rendre votre mod plus professionnel
🗂️ Structure des fichiers de ressources
Arborescence complète
resource/
├── 📄 ClientScheme.res ← Apparence globale (couleurs, polices)
├── 📄 GameMenu.res ← Boutons du menu principal
├── 📄 SourceScheme.res ← Thème de l'interface
├── 📄 HudLayout.res ← Position des éléments HUD
├── 📄 HudAnimations.txt ← Animations du HUD
├── 📄 ChatScheme.res ← Apparence du chat (MP)
│
├── 📁 fonts/ ← Polices personnalisées
│ ├── CustomFont.ttf
│ └── AnotherFont.otf
│
├── 📁 flash/ ← Interface Scaleform (avancé)
│
├── 📁 ui/ ← Images de l'interface
│ ├── logo.vmt
│ ├── logo.vtf
│ └── menu_background.vtf
│
├── 📄 closecaption_english.txt ← Sous-titres anglais
├── 📄 closecaption_french.txt ← Sous-titres français
├── 📄 gameui_english.txt ← Textes UI anglais
└── 📄 gameui_french.txt ← Textes UI français
Tableau de référence des fichiers
| Fichier | Description | Modification fréquente |
|---|---|---|
ClientScheme.res |
Couleurs, polices, styles de l'interface | ⭐⭐⭐ |
GameMenu.res |
Boutons et options du menu principal | ⭐⭐⭐ |
HudLayout.res |
Position et taille des éléments HUD | ⭐⭐⭐ |
HudAnimations.txt |
Animations des éléments HUD | ⭐⭐ |
SourceScheme.res |
Thème visuel général | ⭐⭐ |
closecaption_*.txt |
Sous-titres par langue | ⭐ |
gameui_*.txt |
Traductions de l'interface | ⭐ |
Changer la police du jeu
Étape 1 : Placer le fichier de police
Copiez votre fichier .ttf ou .otf dans :
resource/fonts/MaPolice.ttf
Étape 2 : Déclarer la police
Éditez resource/ClientScheme.res et ajoutez votre police dans la section CustomFontFiles :
"Scheme"
{
"Fonts"
{
// Polices définies plus bas
}
"CustomFontFiles"
{
"1" "resource/HALFLIFE2.ttf"
"2" "resource/HL2EP2.ttf"
"3" "resource/fonts/MaPolice.ttf" ← Votre police
"4" "resource/fonts/AutrePolice.ttf"
}
}
Ajouter votre police dans la liste, vous pouvez changer maintenant utiliser cette police, nous pouvons changer la police du titre du jeu
ClientTitleFont
{
"1"
{
"name" "MaPolice"
"tall" "32"
"tall_hidef" "46"
"weight" "0"
"additive" "0"
"antialias" "1"
"custom" "1" [$OSX]
}
}
Changer le menu
⚠️ Important :
- Les numéros doivent être uniques
- Chemins relatifs à partir de la racine du mod
- Extensions supportées : .ttf, .otf
Étape 3 : Utiliser la police
Définissez la police dans la section Fonts :
"Fonts"
{
// Police du titre du jeu
"ClientTitleFont"
{
"1"
{
"name" "MaPolice" ← Nom exact du fichier
"tall" "48" ← Taille (pixels)
"weight" "700" ← Épaisseur (400=normal, 700=gras)
"antialias" "1" ← Anti-aliasing (1=oui)
"additive" "0" ← Mode additif
"custom" "1" [$OSX] ← Sur Mac uniquement
}
}
// Police pour le HUD
"HudNumbers"
{
"1"
{
"name" "MaPolice"
"tall" "32"
"weight" "700"
"antialias" "1"
}
}
// Police pour les menus
"MenuFont"
{
"1"
{
"name" "MaPolice"
"tall" "24"
"weight" "400"
"antialias" "1"
}
}
}
Paramètres des polices
| Paramètre | Type | Description | Valeurs |
|---|---|---|---|
name |
String | Nom de la police | Nom du fichier sans extension |
tall |
Integer | Hauteur en pixels | 8-128 (typiquement) |
weight |
Integer | Épaisseur | 100-900 (400=normal, 700=gras) |
antialias |
Boolean | Lissage des contours | 0=non, 1=oui |
additive |
Boolean | Mode additif (glow) | 0=non, 1=oui |
outline |
Boolean | Contour | 0=non, 1=oui |
dropshadow |
Boolean | Ombre portée | 0=non, 1=oui |
blur |
Integer | Flou | 0-10 |
scanlines |
Integer | Lignes de scan | 0-10 |
custom |
Boolean | Police personnalisée | 0=non, 1=oui |
Exemple : Créer une police avec effet
"TitleFontGlow"
{
"1"
{
"name" "Impact"
"tall" "56"
"weight" "900"
"antialias" "1"
"additive" "1" ← Effet lumineux
"outline" "1" ← Contour
"dropshadow" "1" ← Ombre
"blur" "2" ← Léger flou
}
}
Polices système vs personnalisées
Polices système (installées sur Windows) :
"name" "Arial"
"name" "Times New Roman"
"name" "Courier New"
Polices personnalisées (fichier .ttf) :
"name" "MaPolice"
"custom" "1"
⚠️ Attention : Les polices système peuvent varier selon l'OS du joueur. Préférez toujours des polices personnalisées pour la cohérence !
🎮 Menu principal (GameMenu.res)
Le fichier resource/GameMenu.res définit les boutons du menu principal.
Structure de base
"GameMenu"
{
"1"
{
"label" "#GameUI_GameMenu_ResumeGame"
"command" "ResumeGame"
"OnlyInGame" "1"
}
"2"
{
"label" "#GameUI_GameMenu_NewGame"
"command" "OpenNewGameDialog"
"notmulti" "1"
}
"3"
{
"label" "#GameUI_GameMenu_LoadGame"
"command" "OpenLoadGameDialog"
"notmulti" "1"
}
}
Paramètres des boutons
| Paramètre | Description | Exemple |
|---|---|---|
label |
Texte affiché (ou clé de traduction) | "Nouvelle Partie" ou "#GameUI_NewGame" |
command |
Commande exécutée au clic | "ResumeGame", "map dm_test" |
OnlyInGame |
Visible uniquement en jeu | "1" = oui |
OnlyAtMenu |
Visible uniquement au menu | "1" = oui |
notmulti |
Caché en multijoueur | "1" = oui |
notsingle |
Caché en solo | "1" = oui |
Interface utilisateur
https://developer.valvesoftware.com/wiki/HudLayout.res
L'interface utilisateur est codé en C++ avec la bibliothèque VGUI qui permet de définir les priorités de la fenêtre, c'est ensuite à nous de modifier les variables avec le fichier scripts/hudlayout.res et définir les animations avec hudanimation.txt.
(0,0) ──────────────────────► X
│
│ ┌────────────────┐
│ │ Élément HUD │
│ │ xpos, ypos │
│ │ wide × tall │
│ └────────────────┘
│
▼
Y
Positionnement relatif :
"xpos" "r100" → 100 pixels depuis la DROITE
"ypos" "r50" → 50 pixels depuis le BAS
"xpos" "c-50" → 50 pixels à gauche du CENTRE
"ypos" "c+20" → 20 pixels sous le CENTRE
Le fichier scripts/HudLayout.res définit la position et l'apparence de tous les éléments du HUD.
Structure d'un élément HUD
"Resource/HudLayout.res"
{
HudHealth
{
"fieldName" "HudHealth" ← Nom unique de l'élément
"xpos" "16" ← Position X (pixels depuis la gauche)
"ypos" "432" ← Position Y (pixels depuis le haut)
"wide" "102" ← Largeur
"tall" "36" ← Hauteur
"visible" "1" ← Visible (1=oui, 0=non)
"enabled" "1" ← Activé (1=oui, 0=non)
"PaintBackgroundType" "2" ← Type de fond (0=aucun, 2=avec bord)
"text_xpos" "8" ← Position texte X (relatif)
"text_ypos" "20" ← Position texte Y (relatif)
"digit_xpos" "50" ← Position chiffres X
"digit_ypos" "2" ← Position chiffres Y
}
}
🌈 Personnalisation des couleurs
Dans resource/ClientScheme.res, section BaseSettings :
Structure des couleurs
"BaseSettings"
{
// Couleur au format RGBA (Rouge, Vert, Bleu, Alpha)
// Valeurs : 0-255 pour chaque canal
"FgColor" "255 255 255 255" ← Blanc opaque
"BgColor" "0 0 0 128" ← Noir semi-transparent
"Panel.FgColor" "200 200 200 255" ← Gris clair
"Panel.BgColor" "50 50 50 200" ← Gris foncé
}
Format RGBA expliqué
"255 0 0 255" → Rouge vif opaque
│ │ │ │
│ │ │ └─ Alpha (opacité) : 0=transparent, 255=opaque
│ │ └─── Bleu : 0-255
│ └───── Vert : 0-255
└───────── Rouge : 0-255
Couleurs principales du HUD
"BaseSettings"
{
// Texte
"FgColor" "255 255 255 255" ← Texte normal
"BrightFg" "255 220 0 255" ← Texte surligné
// Arrière-plans
"BgColor" "0 0 0 76" ← Fond normal
"DamagedBg" "180 0 0 200" ← Fond quand blessé
"DamagedFg" "180 0 0 230" ← Texte quand blessé
"BrightDamagedFg" "255 0 0 255" ← Texte critique
// Sélection d'armes
"SelectionNumberFg" "255 255 255 255" ← Numéro arme
"SelectionTextFg" "255 255 255 255" ← Nom arme
"SelectionEmptyBoxBg" "0 0 0 80" ← Slot vide
"SelectionBoxBg" "0 0 0 80" ← Slot avec arme
"SelectionSelectedBoxBg" "0 0 0 80" ← Arme sélectionnée
// Zoom (sniper, etc.)
"ZoomReticleColor" "255 220 0 255" ← Couleur réticule
// Style HL1 (optionnel)
"Yellowish" "255 160 0 255" ← Jaune orangé
"Normal" "255 208 64 255" ← Jaune normal
"Caution" "255 48 0 255" ← Rouge prudence
}
Modifier une fenêtre VGUI
Mettre votre souris sur une fenêtre et faire SHIFT+CTRL+ALT+B. Vous ouvrez le VGUI Build Mode Editor permettant de modifier une fenêtre.
Dans le fichier «ressource/clientscheme.res» nous pouvons modifier où est affiché le logo du jeu dans le menu.
On modifie sa position en X et Y les chiffres correspondent au pixel.
// Top-left corner of the /"Half-Life 2 /" on the main screen
"Main.Title1.X" "53"
"Main.Title1.Y" "190"
"Main.Title1.Y_hidef" "184"
"Main.Title1.Color" "255 255 255 255"
Pour Changer la couleur des menus, dans le fichier «ressource/clientscheme.res».
///////////////////// BASE SETTINGS ////////////////////////
//
// default settings for all panels
// controls use these to determine their settings
BaseSettings
{
"FgColor" "0 255 0 100"
"FgColor_vrmode" "0 255 0 200"
"BgColor" "0 0 0 76"
"Panel.FgColor" "0 255 0 100"
"Panel.BgColor" "0 0 0 76"
"BrightFg" "0 255 0 255"
"DamagedBg" "180 0 0 200"
"DamagedFg" "180 0 0 230"
"BrightDamagedFg" "255 0 0 255"
// weapon selection colors
"SelectionNumberFg" "0 255 0 255"
"SelectionTextFg" "0 255 0 255"
"SelectionEmptyBoxBg" "0 0 0 80"
"SelectionBoxBg" "0 0 0 80"
"SelectionSelectedBoxBg" "0 0 0 80"
"ZoomReticleColor" " 255 220 0 255"
// HL1-style HUD colors
"Yellowish" "0 255 0 255"
"Normal" "255 208 64 255"
"Caution" "255 48 0 255"