Configurable Sprites
These can drastically change how your theme looks, if you're good at art.
Table Of Contents (Want to see a specific topic? Skip to the action here :)
Configurable Sprites
There's no file for this one, because Poly Beats automatically picks these up.
The key to make all this work is via file names. Your file names have to EXACTLY match the ones used in-game (yes, this means you'll have to use .pngs most of the time!), so make sure to check them carefully!
This step isn't required for the game to pick up the sprites, but to just keep our folder clean, let's go back to Henry (the folder we made in the Introduction page), and create a new folder in him called "Sprites".
Then...
Cool! Now, let's list out every configurable sprite at the moment. (If you grab the template in the Introduction, it will come with all of these.)
"Main" Sprites
Most of these are reused throughout the menus, so be careful what you remake them as. <3
File Name: "Cursor.png"
Dimensions: 920px x 920px
Used: As the player's cursor.
Best Practices: Preferably keep a style similar to this, where the inside is one color and the outer color is a harsh contrast, so that you can see the cursor at all times.
File Name: "Selector.png"
Dimensions: 256px x 256px
Used: As the selection image for the Difficuly Selector, and for the 'Latest' icon in the Marketplace Menu. It is 9-sliced inside Unity, by 29 on each dimension (L: 29, T: 29, R: 29, B: 29).
Best Practices: None. Just make it good I guess.
File Name: "Song Button.png"
Dimensions: 1021px x 179px
Used: As the button for songs and as the button for themes. It is 9-sliced inside Unity, by 23 on each dimension (L: 23, T: 23, R: 23, B: 23).
Best Practices: This uses Unity UI's Color Tint to animate & respond to the player, so keep that in mind.
File Name: "Splicable_Circle_Filled.png"
Dimensions: 256px x 256px
Used: To bring rounded corners to the map/theme cover arts in the Marketplace Menus, and for legacy menus that use this for some reason. It is 9-sliced inside Unity, by 110 on each dimension (L: 110, T: 110, R: 110, B: 110).
Best Practices: Preferably keep a style similar to this, where the inside is one color and the outer color is a harsh contrast.
File Name: "Splicable_HardSquare_Filled [Thin].png"
Dimensions: 256px x 256px
Used: for the top and bottoms of scrollbars, but mainly in the Stream! Editor (Developers get access to this until we feel its ready for public use.) It is 9-sliced inside Unity, by 5 on each dimension (L: 5, T: 5, R: 5, B: 5).
Best Practices: Preferably keep a style similar to this, where the inside is one color and the outer color is a harsh contrast.
File Name: "Splicable_RoundedSquare [BrightWhite].png"
Dimensions: 256px x 256px
Used: as a mask for images in-game that require to have rounded corners, therefore any designs put in here will be reflected on anything that loads images! (So if you leave transparency anywhere, thats where nothing will be rendered.) It is 9-sliced inside Unity, by 25 on each dimension (L: 25, T: 25, R: 25, B: 25).
Best Practices: Preferably no over-the-top designs, like for example a dotty pattern throughout is not good for the player's eyes, but a minimal stripy design might be fine.
File Name: "Splicable_RoundedSquare_Filled.png"
Dimensions: 256px x 256px
Used: for almost everything else. Scrollbars, dropdowns, input fields, you name it. Almost any other UI element in Poly Beats uses this texture. It is 9-sliced inside Unity, by 25 on each dimension (L: 25, T: 25, R: 25, B: 25).
Best Practices: Preferably no over-the-top designs, since this is used everywhere. Or just leave it alone.
File Name: "Toggle.png"
Dimensions: 482px x 482px
Used: for toggles, which are on dropdowns, but mainly inside the Settings menu. This is NOT used on the menu as the bouncing "hexagon" design.
Best Practices: Do what you want with this, it's there to be customized. But keep it white, as its color is changed in game unless you change it yourself in the config files.
File Name: "UI Button [Long].png"
Dimensions: 700px x 172px
Used: as buttons... EVERYWHERE.
Best Practices: Do what you want with this, it's there to be customized. But keep it white, and uses Unity UI's Color Tint to animate & respond to the player.
Reactive Menu Sprites
The sprites used for the menu that shows 5 options. Usually shown after completing a map, or after loading all the songs in the game.
File Name: "NorthLeft Streak.png"
Dimensions: 1920px x 1080px
Used: as the top-left streak in Poly Beats, which is used to take the player to the song selector.
Best Practices: Do whatever you want. Make it cool though!
File Name: "NorthRight Streak.png"
Dimensions: 1920px x 1080px
Used: as the top-right streak in Poly Beats, which is used to take the player to the Rags to Riches gamemode.
Best Practices: Do whatever you want. Make it cool though!
File Name: "SouthRight Streak.png"
Dimensions: 1920px x 1080px
Used: as the bottom-right streak in Poly Beats, which is used to take the player to the settings menu.
Best Practices: Do whatever you want. Make it cool though!
File Name: "Pedestal.png"
Dimensions: 1920px x 1080px
Used: as the bottom-center streak in Poly Beats, which is used to take the player to the leaderboards.
Best Practices: Do whatever you want. Make it cool though!
File Name: "SouthLeft Streak.png"
Dimensions: 1920px x 1080px
Used: as the bottom-center streak in Poly Beats, which is used to let the player exit the game.
Best Practices: Do whatever you want. Make it cool though!
File Name: "PlainBlack.png"
Dimensions: 1920px x 1080px
Used: as the general artwork in the menu and Transition panels inside Poly Beats.
Best Practices: Do whatever you want. Make it cool though! It's not recolored unless you do in the config files, so go crazy!
File Name: "TransparentHexagon.png"
Dimensions: 1920px x 1080px
Used: for the dynamics of the menu, and it moves around.
Best Practices: Do whatever you want with this, but keep a bit of transparency on its edges!
File Name: "TransparentTriangle.png"
Dimensions: 1920px x 1080px
Used: for the dynamics of the menu, and it moves around. There's 2 of them.
Best Practices: Do whatever you want with this, but keep a bit of transparency on its edges!
File Name: "MainHexagon.png"
Dimensions: 482px x 482px
Used: for the bouncing animation and as a game title logo holder in the center of the screen.
Best Practices: Do whatever you want with this!
Menu Icon Sprites
You can get pretty damn expressive with these. Have fun!
File Name: "Mania.png"
Dimensions: 512px x 512px
Used: for the "Freeplay" icon on the home screen.
Best Practices: Do whatever you want with this!
File Name: "Person.png"
Dimensions: 512px x 512px
Used: for the "Rags To Riches" icon on the home screen, the "My Levels" filter in the Marketplace, and in the Leaderboard as the "Around Me" sprite.
Best Practices: Do whatever you want with this!
File Name: "People.png"
Dimensions: 512px x 512px
Used: for the Leaderboard as the "Just Friends" sprite, and the "Friend Levels" filter in the Marketplace.
Best Practices: Do whatever you want with this!
File Name: "Global.png"
Dimensions: 512px x 512px
Used: for ALL Leaderboards as the "Global" sprite, and the "Famous!" filter in the Marketplace.
Best Practices: Do whatever you want with this!
File Name: "Settings.png"
Dimensions: 512px x 512px
Used: as the "Settings" icon in the home screen.
Best Practices: Do whatever you want with this!
File Name: "Exit.png"
Dimensions: 512px x 512px
Used: for the "Exit" icon on the home screen.
Best Practices: Do whatever you want with this!
Marketplace Sprites
A small section, but these are important.
File Name: "DownloadButton.png"
Dimensions: 1024px x 1024px
Used: throughout the Marketplace as a download icon.
Best Practices: Do whatever you want with this! It's recolored in game though, unless you change that in the config files.
File Name: "ReportButton.png"
Dimensions: 1024px x 1024px
Used: throughout the Marketplace as a report icon.
Best Practices: Do whatever you want with this!
File Name: "TrashCan.png"
Dimensions: 1024px x 1024px
Used: throughout the Marketplace as a report icon.
Best Practices: Do whatever you want with this!
Game Sprites
One of the most important things to get right in terms of visuals. It's not easy makin' art for Poly Beats, y'know?
File Name: "Track.png"
Dimensions: 286px x 1428px
Used: as a track throughout Poly Beats.
Best Practices: Preferably no over-the-top designs, and also this is recolored so keep it white.
File Name: "Note.png"
Dimensions: 268px x 98px
Used: as a note throughout Poly Beats, and also as the hitbox visuals.
Best Practices: Preferably no over-the-top designs, and also this is recolored so keep it white.
File Name: "WhitePress.png"
Dimensions: 268px x 98px
Used: as the VFX that shows up when you click a key that corresponds to a track.
Best Practices: This should be kept white at all times.
File Name: "Key.png"
Dimensions: 286px x 383px
Used: as a "key" throughout Poly Beats, "key" being the thing that holds the text that shows what keyboard key to press to light up the track this key is on.
Best Practices: Preferably no over-the-top designs, and also this is recolored so keep it white.
Next Section: Configurable Audio Clips
Sound is really important in a video game. Let's sort yours out for your theme.
Need any help, or just wanna chat with us? Follow us on our socials! :)
