Lyxo | The Modern Loading Screen

New update on it, added skip button, play button (can be both activated on the configuration object)
image

Hey there, sorry for the bump, but I found this resource super nice looking and wanted to use it, only issue I had was that it’s not modular (and I like having all my systems be modular), and it didn’t provide the customization that I needed.

So I went ahead and rewrote the thing from scratch in the form of a module, SwiftLoader, and thought it’d be cool to share it (would of made a separate post, but I don’t own this, so I figured it’s best to share it here).

Here’s how it looks when preloading one of my games (ignore the cutscene, it’s unfinished):

Some key differences between Lyxo and SwiftLoader are that:

  • SwiftLoader doesn’t have a fixed duration, it loads all the assets you throw at it in order, and once done or skipped it’ll close.
  • It provides an indicator so the user can tell how much assets are and remain to be loaded.
  • It’s designed to scale with most games as it provides the ability to throw multiple collections of assets at it.
  • Offers a slightly higher level of customization, but still not a whole lot.

And some cons are that:

  • I am not an UI designer (thus why I’m using Lyxo as a base), so the transitions might be uglier (in fact, I removed some of the glow as I couldn’t tell what it did).
  • I didn’t really bother ensuring the CoreGuis disabled properly with a pcall like you do, they get disabled fine on my end, but maybe it doesn’t on yours. It retries forever until sucessful now.
  • If an asset fails to load, it won’t retry. This is because I read on the forums that retrying to load failed assets is useless and won’t actually load the asset as they get cached when they fail or something like that.
  • I like the default loading screen, so I left it in. This triggers right as that screen is done loading.
Getting Started

If you want to use this for a serious project, refer to the documentation, but for a quick test simply throw the module anywhere with RunContext set to client, edit the example script’s assets table so it contains the assets you want loaded, and done, the module should work by default.

SL.StartGame will trigger the loading screen, SL.State will tell you the current state of the loading screen, and SL.StateChanged will tell you when said state changes, use this with your menus and such to smoothly load the game.

Documentation
@class SwiftLoader
Preload your games with ease.

@type States
Enum representing the possible states of SwiftLoader.
- `Unloaded`: SwiftLoader hasnt been called or is initializing.
- `Loading`: SwiftLoader is loading assets.
- `Skipped`: The player has skipped the loading process.
- `Preloaded`: The game has loaded, and SwiftLoader is fading out.
- `Loaded`: The game is fully loaded and SwiftLoader is done animating.

@type Assets
A table representing the assets to be loaded.
Example:
{
   [1] = { "Models": {Model1, Model2} },
   [2] = { "Sounds": {Sound1, Sound2} }
}

@type Properties
An optional table of properties for customizing the loading screen.
- `LoadSwiftLoader: boolean?` Optional, true by default. Preloads SwiftLoader and all of its components.
- `SkipIndex: number?` Optional, 2 by default if LoadSwiftLoader is true, 1 otherwise. The index at which the skip button appears.
- `SkipEnabled: boolean?` Optional, true by default. Whether the skip button is visible.
- `CoreGui: {Enum.CoreGuiType}?` Optional, "All" by default. Specify CoreGui elements to disable.
- `IconEnabled: boolean?` Optional, true by default. Whether the game icon is displayed.
- `BarEnabled: boolean?` Optional, true by default. Whether the loading bar is displayed.
- `LabelEnabled: boolean?` Optional, true by default. Whether the progress label is displayed.
- `AnimatedIcon: boolean?` Optional, true by default. Animate the game icon during loading.
- `AnimatedLabel: boolean?` Optional, true by default. Animate the label during loading.
- `AnimatedSkip: boolean?` Optional, true by default. Animate the skip button.
- `LoadingSound: Sound?` Optional. Custom sound to play during loading.
- `SkippedSound: Sound?` Optional. Custom sound to play when skipping.
- `LoadedSound: Sound?` Optional. Custom sound to play when loading is complete.

@field State string
The current state of SwiftLoader (e.g., `"PreLoading"`, `"Loaded"`).

@field StateChanged RBXScriptSignal
Fired whenever the state of SwiftLoader changes.
Example:
SwiftLoader.StateChanged:Connect(function(newState)
    print("Loading state changed to:", newState)
end)

@method LoadGame
Triggers SwiftLoader and starts the game loading process.
@param assets Assets Table of assets to load.
@param properties Properties? Optional table of properties for customizing the loader.
@return nil
Example:
SwiftLoader.LoadGame({
    [1] = { "Models": {Model1, Model2} },
    [2] = { "Textures": {Texture1, Texture2} }
}, {
    SkipEnabled = true,
    IconEnabled = true,
    BarEnabled = true
})
Download

SwiftLoader 1.0.0 (35.9 KB)
SwiftLoader 1.0.1 (36.0 KB)
SwiftLoader 2.0.0 (47.8 KB)

Bug Fixes

1.0.1 - 12/17/23:

  • CoreGui will now retry forever until it succeeds on being disabled.
  • Label transition displays the previous text as opposed to the new one on both labels.
  • The content in the assets table in the example handler script is slightly different now as I was editing on a different place, but the properties and all of that should still be the same (you’ll want to change it to load the appropiate assets in your game).

2.0.0 - 10/19/24:

  • Major refactor.
    • The code is now better separated and easier to read.
    • The module is correctly strict typed now and should autocomplete correctly (changed the signal class to fit this).
    • Swapped SPR dependancy for a simpler wrapper I made.
    • The naming has been changed to be more intuitive (read the new documentation to check how it works, TDLR: You use StateChanged + State now).
    • I’ve gone ahead and rewritten the documentation.
    • I’ve added a license so roblox can’t train their AI with it, cuz screw that.
  • If you opened this in a place file it probably errored due to the PlaceId, that’s fixed now.
  • Skip button’s hover would get stuck if hovered on while it faded in, that’s fixed.

I wouldn’t have made this thing if I hadn’t come across Lyxo, so regardless if this thing I made is worse or not I’d like to thank you for the awesome resouce, and I wish everyone reading this a merry christmas and a happy new year!

6 Likes

Thanks for enhancing lyxo! I don’t have much faith to this product, cause it’s been months since I last updated this.

Well, sometimes it works and sometimes it don’t but most of the time it does, so I added a pcall to protect the script from interruption caused by errors. CoreGui is in restricted place that’s why it may throw some various errors.

1 Like

OH my goodness, this is truly great, I love everything about it.

Hey I know this post was from last year but I would like to say you did not make it worse you’ve done an amazing job on rewriting it and @blve_hxrizon I would like to say you have made an amazing loading screen even though you have not updated for months it’s still amazing!

2 Likes

Hi, did u add cut scenes to the player and open source it ? Thanks

No, the cutscene is from an old game of mine, I left it in the video to showcase the usage of the “Preloaded” state of the loading screen (which fires before the transition so you can fade in things like cutscenes smoothly).

I’d open source the cutscene system but it’s old, outdated, and you are better off just hardcoding it anyways (if a plugin maker out there is interested in making a good cutscene system though, I suggest checking out Godot’s animation system, that’s imo the best possible way to handle cutscenes and it’s sad Roblox doesn’t have anything like it).


Also unrelated but for anyone reading in the future I refactored SL entirely last night, I suggest using the newer version, you can find the changes in the bugfixes thing.