Bootstrapping Simple Server Driven Ui from a Design System
summary
Careem builds a server-driven UI layer on top of its design system using Jetpack Compose and SwiftUI and a polymorphic payload model that deserializes into a Component wrapper. Components implement a component interface with content() to self-render on Android; alternatives considered include Kotlin Multiplatform sharing, code‑gen from a YAML spec, or expect/actual. User events are handled as actions and routed by composition locals, and extensibility is either open deserialization (plugin components) or open primitives (rows/columns). Demo runs on Android, desktop and web; code is on GitHub.
AI-written summary · about
chapters (9)
- 0:00Introduction to server-driven UI
- 4:47Design system benefits for SDUI
- 8:17Building server-driven UI components
- 15:46Finalizing the server-driven UI API
- 19:22Handling interactive events
- 25:41Extending server-driven UI
- 31:19Live demo of SDUI
- 36:36Multi-platform support
- 38:01Q&A and future challenges
related talks
45mHow We Built a Design System in Jetpack Compose
29mImplementing a Design System
39mA Design System, it Composes!
15mBuild beautiful Material Design apps with Jetpack Compose
37mConsistency is Key - Working with a Design System
33mHow to Build a Universal Design System
42mUsing Jetpack Compose to Create Apps From Figma UI Sketches
35mCompose Yourself: Designing a Kotlin First UI Toolkit