ALFMOB-437: Modern Design Rollout — Startup / Splash screen

[khoinguyen-mindera]

ALFMOB-437 — Modern Design Rollout: Startup / Splash screen

Restyles the app startup screen to the modern Figma design, adds the design-system Loading Spinner component, and (for launch→in-app consistency) updates the native launch screen. Visual-only; no behaviour, timing, or boot-sequence change. No feature flag (app unreleased). Dark mode deferred.

Jira: https://mindera.atlassian.net/browse/ALFMOB-437
Figma: Loading screen (iOS) · Loading Spinner (DS)

What changed

• In-app startup screen (AppFeature): new SplashView — the MINDERA/ALFIE wordmark centred (vertically aligned with the launch screen, no jump on hand-off) with the loading spinner hanging below it via .overlay. Replaces the animated GIF ThemedLoaderView for the .loading state; background bleeds full-screen.
• DS Loading Spinner (LoadingSpinner, SharedUI): the Figma spinner artwork (ThemedImage.loadingSpinner, an angular "comet" arc PNG) rotated continuously, sizes S/M/L (24/32/48) via a Size config. Splash uses .small. (Rendered from the exported image because the design's conic gradient can't be carried into Xcode by SVG.)
• Wordmark asset: ThemedImage.splashLogo, shared by both screens.
• Native launch screen (LaunchScreen.storyboard): new MINDERA/ALFIE LaunchLogo, resized to the lockup aspect (160×49), preserves-vector-representation restored.
• AccessibilityID.Splash.screen; AccessibilityIdentifiers wired into the AppFeature target.

Acceptance criteria

• ✅ Splash matches the approved Figma.
• ✅ Consumes SharedUI components + tokens — no bespoke hardcoded colours/spacing/typography.
• ⚠️ Appearance test deferred. The snapshot suite is disabled repo-wide; a render smoke test added no real signal for a logic-free view, so it was removed. Appearance verification (splash + DS spinner) is deferred to a separate snapshot-suite-revival ticket. Verified manually in the simulator for this PR.
• ✅ No startup/boot regression — AppStartupServiceTests unchanged and green.

Notes on scope

• Loading-indicator animation is included. The ticket deferred motion only because the DS loading indicator wasn't finalized; design has since completed it (Figma 6619-47520), so the animated component ships here.
• Native launch screen update is a small, intentional addition (ticket lists it out of scope) so the OS launch screen matches the in-app splash. Launch screen is static (OS-rendered) — no spinner there.
• Follow-up: revive repo-wide snapshot testing and add snapshots for the splash + DS spinner (splash needs a non-animating LoadingSpinner seam to be deterministic).

Testing

• ./Alfie/scripts/verify.sh --skip-integration → ✅ build + unit tests passing.
• Manual simulator check: launch screen and in-app splash align (no wordmark jump); spinner rotates. (iOS caches the launch screen — delete/reinstall to see asset changes.)

Plan / decisions: Docs/Plans/ALFMOB-437-splash-redesign/

[Copilot]

Pull request overview

Updates Alfie’s startup/splash experience to match the “modern design” spec by introducing a dedicated in-app SplashView (wordmark + static spinner) and aligning the native LaunchScreen.storyboard logo sizing/asset handling for launch→in-app visual consistency.

Changes:

• Added a new SplashView in AppFeature and wired it into the .loading startup screen (replacing the animated ThemedLoaderView).
• Introduced SharedUI building blocks: ThemedImage.splashLogo (new wordmark asset) and ThemedSpinnerView (static, non-animated indicator).
• Updated launch screen assets/layout and added a small unit test + accessibility identifier plumbing.

Reviewed changes

Copilot reviewed 13 out of 15 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
Docs/Plans/ALFMOB-437-splash-redesign/scope.md	Captures current-state analysis and target layout requirements.
Docs/Plans/ALFMOB-437-splash-redesign/plan.md	Documents the phased implementation plan and decisions.
Docs/Plans/ALFMOB-437-splash-redesign/grill.md	Records final design/implementation decisions.
Docs/Plans/ALFMOB-437-splash-redesign/_status.md	Tracks execution status and verification notes.
Alfie/AlfieKit/Tests/AppFeatureTests/SplashViewTests.swift	Adds unit coverage for the new splash view/identifier.
Alfie/AlfieKit/Sources/SharedUI/Theme/Images/ThemedImages.xcassets/splash-wordmark.imageset/splash-wordmark.svg	Adds the new MINDERA/ALFIE wordmark vector asset for SharedUI.
Alfie/AlfieKit/Sources/SharedUI/Theme/Images/ThemedImages.xcassets/splash-wordmark.imageset/Contents.json	Ensures vector preservation for the new SharedUI wordmark asset.
Alfie/AlfieKit/Sources/SharedUI/Theme/Images/ThemedImage.swift	Exposes the new wordmark via ThemedImage.splashLogo.
Alfie/AlfieKit/Sources/SharedUI/Theme/Components/Loader/ThemedSpinnerView.swift	Adds a static (non-animated) spinner component in SharedUI.
Alfie/AlfieKit/Sources/AppFeature/UI/SplashView.swift	Implements the in-app splash layout and accessibility identifier.
Alfie/AlfieKit/Sources/AppFeature/Navigation/AppFeatureView.swift	Switches the .loading startup screen to the new SplashView.
Alfie/AlfieKit/Sources/AccessibilityIdentifiers/AccessibilityID.swift	Adds AccessibilityID.Splash.screen.
Alfie/AlfieKit/Package.swift	Wires AccessibilityIdentifiers into AppFeature + AppFeatureTests.
Alfie/Alfie/LaunchScreen.storyboard	Resizes the launch logo image view/resource metadata to match the new lockup aspect.
Alfie/Alfie/Assets.xcassets/LaunchLogo.imageset/LaunchLogo.svg	Updates the app launch logo artwork to the new lockup vector.

[Copilot]

Pull request overview

Copilot reviewed 13 out of 16 changed files in this pull request and generated 3 comments.

[hoangnhatdrk]

✅ Approving — safe to merge, no correctness issues.

Verified theme.spacing.space{200,300,400,600} = 16/24/32/48 (so LoadingSpinner S/M/L = 24/32/48 as described), theme.color.neutrals0, and ThemedImage.literalName/bundle all resolve on the branch. The .overlay + alignmentGuide approach keeps the wordmark centred so it aligns with the launch screen.

Two non-blocking accessibility polish items for a follow-up:

• Reduce Motion: LoadingSpinner uses .repeatForever with no @Environment(\.accessibilityReduceMotion) gate — a DS-level spinner is the right place to honour that setting.
• VoiceOver: SplashView replaces ThemedLoaderView(labelHidden: true, labelTitle: L10n.Loading.title) with only an accessibilityIdentifier, so the startup no longer announces a "Loading" cue. Minor regression given it's a brief splash.