Gallery
See what others have created
yasshhi
@yasshhi
Dynamic Island (Compact ↔ Expanded)
Design the Dynamic Island for an ongoing activity on mobile, shown in both its compact pill and tapped-expanded states. Treat it as a live system surface, not an app screen.
The compact state needs to read instantly from the top edge: a small, active status that fits around the sensor cutout and signals call or now-playing without stealing attention from the current app.
The expanded state should feel like the same surface unfolding in place. It can reveal more controls or activity detail, but it must stay anchored to the island and preserve the sense of a floating system layer.
This challenge is about motion, hierarchy, and density. The transition should make the relationship between compact and expanded obvious, while keeping the current activity legible at a glance.
What to deliver
- Design the compact Dynamic Island pill state.
- Design the tapped-expanded Dynamic Island state.
- Show the transition between compact and expanded.
- Place the surface over a realistic mobile app background.
- Include the key content for either call or now-playing mode.
Use one strong visual anchor in both states — icon, timer, or track info — so the expansion feels like a reveal, not a new component.