Skip to content

[Feature] Adopt “Liquid Glass” (visual-only) on iOS 26 for Session #547

@mikeldev0

Description

@mikeldev0

Adopt Apple’s new Liquid Glass visual language on iOS 26 to modernize Session’s look & feel while preserving performance and accessibility. Scope is visual-only (no auth/security changes). Use Apple’s updated design guidance and APIs introduced at WWDC25 for materials, controls, and transitions. ([Apple]1)

Scope

  • Components: Navigation bar, tab bar, headers/toolbars, cards, sheets/modals, toasts, context panels.
  • Tech: SwiftUI-first adoption of Liquid Glass materials & updated controls; UIKit wrappers where needed. Legacy fallback (< iOS 26) uses existing opaque/translucent styles (e.g., UIVisualEffectView blur/vibrancy). ([The Verge]2)
  • Out of scope: Session isolation, encryption, snapshot redaction, auth flows.

Goals

  • Consistent Liquid Glass visuals across targeted surfaces on iOS 26.
  • 60/120 fps fluidity on supported devices; graceful degradation on lower tiers.
  • Full Dark/Light support and Accessibility (Reduce Motion/Transparency; contrast).

Non-Goals

  • New navigation patterns, server/API changes, or platform backports below iOS 26.

Design Tokens (proposed)

  • Blur: lg.blur.{xs,s,m,l} (≈6/12/20/28).
  • Saturation: lg.sat.{low,med,high} (≈1.0/1.3/1.6).
  • Tint/Opacity: lg.tint.{light,dark} with adaptive alpha by backdrop luminance.
  • Stroke: lg.stroke.hairline (1 px) with dynamic alpha; optional inner highlight.
  • Radius/Elevation: radius.2xl default; elevation map per component.
  • Preset: lg.preset.{full,lite,opaque} (feature-flaggable).

Implementation (high-level)

  1. Capability gating & flags

    • Enable on iOS 26 via remote flag with kill-switch and “preset” override (full|lite|opaque).
  2. Foundation

    • Create LiquidGlassView wrapper (SwiftUI) composing blur + saturation + tint + stroke; expose presets.
    • Provide UIKit adapter for screens not yet SwiftUI.
  3. Apply to components

    • Nav/Tab bars → Liquid Glass materials & updated controls; responsive shrink/expand on scroll where appropriate.
    • Cards/Sheets/Toasts → Liquid Glass presets with careful overdraw limits.
  4. Accessibility

    • Respect Reduce Transparency/Motion; auto-switch to opaque or toned-down animations.
    • Enforce WCAG AA contrast with dynamic foreground on complex backdrops. ([Nielsen Norman Group]5)
  5. Performance guardrails

    • Target P95 resume/transition smoothness; cap additional peak memory during transitions.

Performance Budgets

  • FPS: Sustain 60/120 fps on Tier A devices during transitions/scroll.
  • CPU (avg fg): ≤ +3% vs baseline on targeted screens.
  • Peak memory: ≤ +20 MB during modal/sheet animations.

Testing Plan

  • Visual regression: snapshots per component in Light/Dark + Increased Contrast.
  • UI tests: bar transitions (shrink/expand), sheet presentations, theme switches.
  • Perf: automated scroll benchmarks for long lists with glass cards; capture FPS/memory deltas.
  • A11y manual: VoiceOver focus, Reduce Motion/Transparency toggles, readability over varied wallpapers.

Rollout

  1. Phase 1 (dogfood): NavBar + TabBar with full preset; metrics on FPS/memory.
  2. Phase 2 (beta): Cards + Sheets; tune lite preset for mid-tier devices.
  3. Phase 3 (GA): Toasts/overlays; finalize tokens & documentation.

Telemetry (optional)

ui.liquid_glass.enabled
ui.liquid_glass.preset (full|lite|opaque)
ui.fps.transition.avg/min
ui.mem.delta_mb.peak

Acceptance Criteria

  • Nav/Tab bars, Cards, Sheets, Toasts use Liquid Glass presets on iOS 26 with FPS within budget.
  • Dark/Light and contrast meet guidelines; Reduce Transparency/Motion respected.
  • Fallbacks render correctly on < iOS 26 with no regressions.
  • Visual QA sign-off on key screens (home, chat, settings).

References: Apple WWDC25 announcement & APIs for Liquid Glass (design & adoption guidance; updated controls/materials), plus accessibility best practices for glassmorphism. (Apple, [The Verge]2, [YouTube]4, [Nielsen Norman Group]5)


How I got there (step-by-step)

  1. Primary source: Confirmé en Apple Newsroom que “Liquid Glass” es material/lenguaje oficial, con descripción, plataformas y que hay APIs actualizadas para desarrolladores. ([Apple]1)
  2. Secondary coverage: Verifiqué en The Verge/TechCrunch el alcance, superficies afectadas y el carácter de mayor rediseño desde iOS 7. ([The Verge]2, [TechCrunch]3)
  3. Guidance for builders: Usé las sesiones/vídeos WWDC (“Meet Liquid Glass”) como soporte de implementación. ([YouTube]4)
  4. Best practices: Contrasté con Nielsen Norman Group para accesibilidad/contraste en interfaces translúcidas (glassmorphism). ([Nielsen Norman Group]5)
  5. UIKit fallback: Mantengo UIVisualEffectView para capas legacy. ([The Verge]2)

Alternatives you might consider

  • Progressive adoption: Start with Nav/Tab bars only, then cards/sheets after perf tuning.
  • Device tiering: Auto-switch lite preset on thermally constrained or older A-series devices.
  • Theme switch: Offer brand “opaque” theme for teams/markets que prefieran máximo contraste.

Practical action plan (apply now)

  1. Create lg.* design tokens + LiquidGlassView wrapper (SwiftUI) and UIKit adapter.
  2. Implement NavBar/TabBar with full preset; instrument FPS/memory.
  3. Roll to Cards/Sheets, refine presets, run a11y audits; lock Acceptance Criteria.
  4. Launch phase rollout behind remote flag & kill-switch; document usage in the design system.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions