Spotify Redesigns 'Encore' System for AI
Spotify is redesigning its design system, known as "Encore," to be AI-ready, focusing on a modular architecture and machine-readable documentation. The new system is designed to enable rapid rollouts of AI-driven recommendations and search features. The architecture aims to keep AI models, UI, and user data loosely coupled for easier iteration and explainability.
- The initiative to make the Encore system AI-ready was presented by Web Engineer Victoria Tholerus and Senior Product Designer Aleksander Djordjevic, who identified a critical risk: developers are now consulting AI agents first, potentially bypassing established design documentation and leading to inconsistent user interfaces. - To counter this, Spotify built a Model Context Protocol (MCP) server, which exposes design system documentation directly to AI agents. This allows code-generation tools like Cursor to create UI components that are automatically aligned with Spotify's standards. - The redesigned system uses a layered architecture, separating a foundational layer (tokens for color, spacing), a component style layer, and a component behavior layer. It also utilizes "headless" components built on systems like React ARIA for interaction logic, allowing Encore to focus purely on brand consistency. - A new testing framework was developed to validate AI-generated code by comparing it against official Encore components, checking for lint errors, similarity scores, and visual output. - Encore was originally introduced around 2019 as a "system of systems" to unify what had become 22 disconnected design systems across the company, which supports products on over 45 unique platforms. - This evolution of the design system supports a broader push into AI-driven features across the platform, which already includes an AI DJ for personalized commentary and the "Prompt Playlists" feature that generates playlists from natural language text descriptions. - The push for an AI-centric design system is also reflected in hiring, with Spotify actively recruiting for a Senior Manager to lead the team and drive the integration of AI capabilities like generative design and intelligent components.
