Der Splash Screen ist der erste Eindruck, den Nutzer von deiner App bekommen. Hier konfigurierst du das Aussehen des Startbildschirms.
Der Splash Screen wird angezeigt, während die App lädt. Er besteht aus:
Hintergrund - Farbe, Gradient oder Bild
Logo/Bild - Dein App-Logo oder ein benutzerdefiniertes Bild
Ladeanimation - Optional, zeigt Ladefortschritt
App-Name - Optional, Textanzeige
Öffne die Theme Suite
Wähle den Tab “Seiten”
Tippe auf “Splash Screen”
Option Beschreibung Farbe Einfarbiger Hintergrund Gradient Farbverlauf Bild Vollbild-Hintergrundbild
Einstellung Beschreibung Hintergrundfarbe Farbe des gesamten Hintergrunds Dark Mode Farbe Separate Farbe für Dark Mode
Einstellung Beschreibung Startfarbe Erste Farbe des Verlaufs Endfarbe Zweite Farbe des Verlaufs Richtung Horizontal, Vertikal, Diagonal Dark Mode Variante Separate Farben für Dark Mode
Einstellung Beschreibung Bild hochladen Dein Hintergrundbild Skalierung Cover, Contain, Fill Dark Mode Bild Separates Bild für Dark Mode
Das zentrale Element deines Splash Screens.
Option Beschreibung Aus Branding Verwendet das App-Logo aus den globalen Einstellungen Eigenes Bild Ein separates Splash-spezifisches Bild Kein Logo Nur Hintergrund und optional Ladeanimation
Einstellung Bereich Beschreibung Breite 0-500 px Breite des Logos (0 = automatisch) Höhe 0-500 px Höhe des Logos (0 = automatisch) Position - Oben, Mitte, Unten Versatz Y -200 bis +200 px Vertikaler Versatz zur Position Transparenz 0-100% Deckkraft des Logos
Du kannst bestimmen, wie das Logo auf dem Splash Screen dargestellt wird - besonders nützlich, wenn dein Logo nicht quadratisch ist.
Option Beschreibung Original Behält das Originalseitenverhältnis des Bildes Quadratisch Schneidet das Bild auf ein Quadrat zu Kreisförmig Schneidet das Bild als Kreis aus
Bei quadratischer oder kreisförmiger Form kannst du festlegen, wie das Bild in den Container passt:
Option Beschreibung Einpassen (Contain) Das gesamte Bild ist sichtbar, eventuell mit Rändern Ausfüllen (Cover) Der Container wird vollständig gefüllt, Teile des Bildes können abgeschnitten werden Strecken (Fill) Das Bild wird auf die Containergröße gestreckt
Automatische Anpassung beim Onboarding
Wenn du im Onboarding ein nicht-quadratisches Logo hochlädst, wird automatisch die quadratische Form mit 18px Eckenrundung eingestellt, damit dein Logo optimal aussieht.
Einstellung Bereich Beschreibung Border Radius 0-100 px Rundung der Ecken (nur bei Original/Quadratisch)
Einstellung Optionen Beschreibung Animationstyp Fade, Scale, Bounce Art der Einblendung Dauer 200-1000 ms Länge der Animation Verzögerung 0-500 ms Wartezeit vor Start
Optional: Eine Animation, die den Ladeprozess visualisiert.
Option Beschreibung Aktiviert Ladeanimation anzeigen Deaktiviert Keine Ladeanimation
Option Beschreibung Zirkulär Rotierender Kreis Linear Horizontaler Balken Punkte Pulsierende Punkte Benutzerdefiniert Eigene Animation (Lottie)
Einstellung Bereich Beschreibung Farbe - Farbe der Animation Größe 24-64 px Größe der Animation Position - Unter Logo, Unten, Angepasst Abstand 0-100 px Abstand zur Position
Optional kannst du den App-Namen anzeigen.
Option Beschreibung Aktiviert App-Name anzeigen Deaktiviert Kein Text
Einstellung Beschreibung Text Der anzuzeigende Text Schriftgröße Größe des Textes Schriftfarbe Farbe des Textes Schriftgewicht Light bis Bold Position Unter Logo, Unten Abstand Abstand zur Position
Steuere, wie lange der Splash Screen angezeigt wird.
Einstellung Bereich Beschreibung Mindestdauer 500-5000 ms Minimale Anzeigedauer Lade-Timeout 5-30 s Maximale Wartezeit
Wie der Splash Screen zur Haupt-App übergeht.
Option Beschreibung Fade Sanftes Ausblenden Slide Zur Seite schieben Scale Herauszoomen Keine Direkter Wechsel
Einstellung Bereich Beschreibung Dauer 200-800 ms Länge des Übergangs Kurve - Animationskurve
Der Editor bietet eine Live-Vorschau:
Zeigt alle Elemente mit aktuellen Einstellungen
Vorschau für Light und Dark Mode
Animation-Vorschau per Button
Aspekt Empfehlung Dauer 1.5-2.5 Sekunden (nicht länger) Logo-Größe Nicht zu groß (max. 200 px) Animation Dezent und schnell Hintergrund Passend zu deinem App-Design
Zu lange Anzeigedauer
Überladene Designs
Ablenkende Animationen
Schlechter Kontrast
Ladeanimation nur wenn nötig
Wenn deine App schnell lädt, kann die Ladeanimation weggelassen werden.
Wenn die App sehr schnell lädt und die Mindestdauer niedrig eingestellt ist, kann der Splash Screen kaum sichtbar sein. Erhöhe testweise die Mindestdauer.
Nein, aktuell werden nur statische Bilder unterstützt. Für animierte Inhalte nutze das Logo mit Animation oder eine Lottie-Animation.
Format: PNG oder JPG
Auflösung: Mindestens 1080x1920 px (Portrait)
Dateigröße: Unter 2 MB für schnelle Ladezeiten
Speichere deine Änderungen
Schließe die App vollständig
Öffne die App neu
Im Simulator/Emulator kannst du auch einen “Cold Start” erzwingen.