🖼️ Media Customization

Ringtones

Adding Custom Ringtones

To add personalized ringtones to your phone system:

Step 1: Configure in JSON

Navigate to config/config.json and add a new entry to the ringtones array:

json
Copy
{
  "ringtones": [
    {
      "key": "GalaxyBells",
      "name": "Galaxy Bells", 
      "extension": "mp3"
    },
    {
      "key": "CustomRing",
      "name": "Custom Ring",
      "extension": "wav"
    }
  ]
}

Step 2: Add Audio File

Add your sound file to /ui/build/(humanoid/yos)/sounds/ringtones/ and name it exactly the same as the key field (without extension).

Ringtone Configuration Fields

Supported Audio Formats

• MP3: Recommended for smaller file sizes
• WAV: Higher quality, larger files
• OGG: Good compression, web-friendly

Notification Sounds

Adding Custom Notification Sounds

To add personalized notification sounds:

Step 1: Configure in JSON

Navigate to config/config.json and add a new entry to the notifications array:

json
Copy
{
  "notifications": [
    {
      "key": "Spaceline",
      "name": "Spaceline",
      "extension": "mp3"
    },
    {
      "key": "CustomAlert", 
      "name": "Custom Alert",
      "extension": "wav"
    }
  ]
}

Step 2: Add Audio File

Add your sound file to /ui/build/(humanoid/yos)/sounds/notifications/ and name it exactly the same as the key field (without extension).

Notification Sound Types

App Notifications

• Messages: SMS/Text alerts
• Calls: Incoming call alerts
• Email: Email notifications
• Social: Social media alerts

System Notifications

• Battery: Low battery alerts
• System: System status alerts
• Security: Security notifications

Wallpapers

Adding Custom Wallpapers

To add personalized wallpapers:

Step 1: Configure in JSON

Navigate to config/config.json and add a new entry to the wallpapers array:

json
Copy
{
  "wallpapers": [
    {
      "key": "Graphite",
      "name": "Graphite", 
      "extension": "png"
    },
    {
      "key": "CustomBackground",
      "name": "Custom Background", 
      "extension": "jpg"
    }
  ]
}

Step 2: Add Image File

Add your wallpaper to /ui/build/backgrounds-front/ and name it exactly the same as the key field (without extension).

Wallpaper Specifications

Image Requirements

• Resolution: Recommended 1080x1920 (phone aspect ratio)
• Format: PNG (recommended), JPG, WEBP
• Size: Keep under 2MB for performance
• Quality: High resolution for crisp display

Design Guidelines

• Safe Area: Keep important elements away from edges
• Contrast: Ensure good contrast with UI elements
• Colors: Consider how icons will appear on background
• Theme: Match server theme and atmosphere

Supported Image Formats

• PNG: Best quality, supports transparency
• JPG: Smaller file size, good for photos
• WEBP: Modern format, excellent compression

File Organization

Naming Conventions

• Consistency: Use consistent naming patterns
• No Spaces: Use camelCase or underscores instead of spaces
• Descriptive: Names should describe the content
• Short: Keep names reasonably short

Advanced Configuration

Dynamic Categories

Organize media into categories:

json
Copy
{
  "ringtones": [
    {
      "key": "classical_symphony",
      "name": "Classical Symphony",
      "extension": "mp3",
      "category": "classical"
    },
    {
      "key": "electronic_beat", 
      "name": "Electronic Beat",
      "extension": "mp3",
      "category": "electronic"
    }
  ]
}

Best Practices

File Optimization

1. Audio Files:
   • Use MP3 at 128-192 kbps for ringtones
   • Keep notification sounds under 2 seconds
   • Normalize audio levels across all files
2. Image Files:
   • Optimize file sizes without losing quality
   • Use appropriate formats (PNG for graphics, JPG for photos)
   • Test on different screen sizes

Troubleshooting

Common Issues

1. Media not appearing:
   • Check file naming matches JSON key exactly
   • Verify file is in correct directory
   • Ensure JSON syntax is valid
2. Audio not playing:
   • Check audio format is supported
   • Verify file isn't corrupted
   • Test audio file outside of game
3. Images not displaying:
   • Check image format is supported
   • Verify image isn't corrupted
   • Check file size isn't too large

Debug Steps

1. File Validation: Test media files in external players/viewers
2. Path Verification: Double-check file paths and naming
3. JSON Validation: Validate configuration JSON syntax
4. Console Logs: Check for media loading errors
5. Browser Tools: Use browser dev tools to check for 404 errors