Add splash screen (splash image and splash scene) tutorial

[akien-mga]

Follow-up on #301.

It would be good to have a complete tutorial about how to handle the splash screen. It should cover the two separate notions of:

• boot splash image (see Add boot splash tutorial #301), which is basically replacing the static Godot Engine logo on launch with another static image. Most basic, but very easy to implement (just set the image in the project settings)
• splash scene: The recommended way to have complex splash screens (with animations, loading bar, etc.) is to make a splash scene and load it as main scene. This main scene has then full access to all the Godot API and allows to use 2D and 3D animations, sound, video, etc. The splash scene can be used to dynamically load the relevant game resources (at least main menu, and if relevant other game assets) before switching scene to the "actual" main menu scene. That section of the tutorial would likely refer to https://github.com/godotengine/godot-docs/blob/master/learning/features/misc/background_loading.rst for more details, but should already give a hands-on example of background loading of a simple main menu. It has to be checked, but using the splash scene variant should ideally allow removing the static boot splash image; if it's not possible yet, the feature should likely be implemented.

[akien-mga]

Note that there are various video tutorials about this already which could be used as reference, e.g. Ivan's https://www.youtube.com/watch?v=9sHKaQBcgO8

[acarlson1994]

I know this is "older", and #301 is closed, but maybe we can improve on this.

@akien-mga you are correct, there are some generic tutorials teaching how to implement fairly simplistic splash screens. But what I have not found is a full fledged splash screen implementation that takes into consideration different screen sizes. From a functional perspective splash screens have been covered, but from a UI perspective (i.e. the UI specific nodes and their settings as well as project settings for multiple screen sizes), to me it seems there is a lack of tutorials in this respect.

Maybe I am missing something, but what I would like to see, specifically on the Godot splash screen step by step (https://docs.godotengine.org/en/3.1/getting_started/step_by_step/splash_screen.html), is a tutorial that goes over using nodes like Control(and friends). Properly setting up auto centered images, etc. Also, correct me if I am wrong, but this specific tutorial is actually more of a title screen tutorial (I may be incorrect on terminology).

Once I get more familiar with these subjects I will attempt to add a pull request for the Godot specific tutorial to include splash screen AND title screen implementation. Starting out simple and then hopefully including additional information and tutorial on multiple screen sizes / orientations.

Another item of discussion is the bootsplash. As far as I am aware, it is a simple image that is only shown during loading of the Godot engine, etc. Not offering much in the way of customization.

I haven't done much searching in this github for these topics, so I may be in the wrong place to discuss all of this again :P

[and-rad]

This is exactly what I'm researching right now. I can do a tutorial on this. Is this the right place to propose a draft on what the tutorial should cover? If so, I can write up one on the weekend.

But to get terminology straight, when we say "Splash Screen", we mean the typical sequence of videos and logos that appear at the start of the game, right? Taking Hellblade as an example, we are talking about this: https://youtu.be/zMo-jW-SSco.

[acarlson1994]

@and-rad I have yet to contribute here, so I do not know the exact answers to your questions but looking at https://github.com/godotengine/godot-docs, you should be able to quickly figure that out.

In terms of the conversations for this, I don't see why it couldn't happen here as it is an open issue, but one of the moderators would have to answer that.

As for what I personally think on the topic:
Current tutorial is not for splash screen. It is more of a title screen, as it has no purpose other than to display the game logo / title and wait for user input. While a splash screen and title screen can be one fluid screen / animation, with loading bar, etc, I feel it is far more effective to do a tutorial on the traditional expectations of a splash screen and title screen (I don't see why these couldn't be in the same tutorial though).

I feel that the main focus of a splash screen tutorial should be usage of the Control nodes, as well as AnimationPlayer to create your usual splash screens, centered logo/animation, fade in-out to next animation. Advanced tutorial info would potentially cover multiple screen sizes, orientations, etc, but that may be a stretch.

Title screen would basically be the current tutorial, in my opinion.

SPLASH screens: (potentially helpful definition: https://en.wikipedia.org/wiki/Splash_screen)
https://www.youtube.com/watch?v=ogGHDX2IYsk
https://www.youtube.com/watch?v=dLUc8U3PONM
https://www.youtube.com/watch?v=7gKUMuKntes

TITLE screens: (potentially helpful definition: https://en.wikipedia.org/wiki/Glossary_of_video_game_terms#Title_screen)
https://www.youtube.com/watch?v=hdCSf4WZIvw

Let me know what you think! Once I get my bearings on this, I will consider putting together a pull request to improve this (assuming no one takes it on, and I can figure out what I am doing).

[Calinou]

With #3390 in consideration, should we close this issue? The documentation is moving toward being a reference manual.

[skyace65]

@Calinou I say close this issue