You are able to customize the look of the Skillz UI using our “Custom Theme” feature so that it can feel native to your game. Although we recommend customizing your theme, it is not mandatory, and you may opt to stick with our default “Dark Theme.” You can edit your game’s theme before you launch or edit a previously launched game.
Finding the Theme Page
First Time Users
Open the integration process by either starting a new project, or continuing one in progress, by clicking the corresponding button in the top right corner of your home screen.
Once you’ve completed all required preliminary steps from the left menu within the “Integrate” section, you’ll be able to access the “SDK Theme” as the first step within the “Configure” section.
If you’ve finished launching a game or have more than one game in progress, go to your dashboard and click the "edit game" button for any of your previously integrated games and then access the SDK Theme page on your sidebar.
Selecting a Theme
To choose one of the Skillz pre-made themes, select an option from the dropdown menu. Please note that a game without a theme will default to the "Dark" setting.
You can then further customize any of the colors or icons by clicking "Create a custom theme to better match your game” and then editing any of the form fields within the dropdown menu.
Once you’re happy with your changes, click “Save” and we’ll compile a .JSON file that will be available for you to download.
Please note: A game may only have 1 custom theme, so making additional changes and clicking “Save” will overwrite the previous theme.
The advanced settings allow you to edit and customize each detail of the UI. Colors and gradients can be changed by specifying either RGB or Hex values. The majority of images such as the tournament icons or background can be changed.
Downloading Your Custom Theme
A preview is available for each of the pre-made themes, however there are no previews for custom themes. Follow the instructions below to download, implement, and view your new custom theme within the sandbox environment.
There are two different ways to view your custom theme with iOS.
Once you hit save, we will email you a new SDK that includes your custom theme - please give a few minutes for the email to arrive in your inbox. Then you can integrated the Custom SDK like you would for the normal SDK (instructions here).
You may also download the JSON file itself within the download table.
Next, you’ll open your game’s XCode project and find the file Skillz.framework
Select the option “Show in Finder.”
Next, find the old JSON file within the folder and replace it with the file theme.json that you’ve just downloaded.
Now you should be able to open your app, launch Skillz and take a look at your new theme within Sandbox. To ensure you are viewing the latest theme, force quit (double-tap home button and swipe away) and restart your game after each change.
To apply a custom theme to your Android game:
Download your JSON file either from a link sent out via email or the table pictured below.
Create an assets folder in Android Studio if your project does not already have one:
Then press the FINISH button on the subsequent dialog that appears:
Now select the assets folder you just created in your project’s Android view, and right click it to bring up a contextual menu:
Choose “Reveal in Finder” (or “Reveal in Explorer” on Windows). This will open the corresponding assets folder on your hard drive.
Now locate the custom_theme.json file that you downloaded and drag it into the assets folder on your hard drive:
Finally, confirm that the custom_theme.json file has now been added to your Android Studio project:
If the custom_theme.json file appears in the project as shown above, then you have successfully applied your custom Skillz theme to your Android game!
Now you should be able to open your app, launch Skillz and take a look! To ensure you are viewing the latest theme, force quit (double-tap home button and swipe away) and restart your game after each change.
The Unity SDK does not come packaged with a custom theme, and you will need to integrate the custom theme separately for iOS and/or Android. Access your files either via the email sent to you or within the download table.
- For Unity-Android: Follow the instructions for Android
- For Unity-iOS: Follow the instructions for iOS by downloading the JSON file first.
Syncing your theme to Production
First time users: click “Next” to continue integrating your game. Your new custom them will sync when you complete integration and publish your game.
Returning users: once you’re happy with your theme on sandbox click request sync pictured as below. Our integration team will emails you within 5 business days to let you know when your theme has been synced to your production game.