# Screenshot gallery

[Project overview](../README.md) · [User guide](USER-GUIDE.md) · [Themes](THEMES.md) · [Android](ANDROID.md) · [Downloads](https://github.com/sPROFFEs/Aoede/releases/latest)

Explore the current **Aoede 1.3.1** web interface and **Android 1.2.9** native client. Expand a feature group and click any image to open it at full resolution.

These are captures of the real application interfaces, with fictional accounts, demonstration artwork, sample track metadata and synthetic service responses. They are not design mockups or screenshots of a production server. Example provider connections, listening totals and host metrics illustrate their screens; they do not describe a live deployment.

| Gallery | What is captured |
|---|---|
| [Desktop web](#desktop-web) | The actual frontend at 1440 × 960. Desktop wrappers use this frontend inside their application window. |
| [Mobile web / PWA](#mobile-web-and-pwa) | The responsive frontend at 400 × 850, also used by web-based compatibility clients. |
| [Native Android APK](#native-android-apk) | The actual Android views at a 400 × 850 viewport in Android's local test runtime; dialog captures use their own bounds. |
| [Android widgets and music island](#android-widgets-and-music-island) | The actual native components rendered independently of a launcher or lock screen. |

Each themed comparison runs left to right: **Classic (dark)**, **Glass (dark)**, **Vitrine (light)**. Glass and Vitrine also follow the device's light/dark preference. Captures show paused playback where controls need a stable frame; animations and background audio cannot be demonstrated by a still image.

## Desktop web

The sidebar, compact player and page controls remain part of the captured frontend. Content below the viewport is reached by scrolling.

<details>
<summary><strong>Home and your collections</strong></summary>

Saved playlists and curated albums share collection controls while remaining distinct library types.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Home and personal mixes</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-home.webp"><img src="images/screenshots/desktop-classic-home.webp" alt="Desktop · Classic · Home and personal mixes" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-home.webp"><img src="images/screenshots/desktop-glass-home.webp" alt="Desktop · Glass · Home and personal mixes" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-home.webp"><img src="images/screenshots/desktop-vitrine-home.webp" alt="Desktop · Vitrine · Home and personal mixes" width="100%"></a></td>
</tr>
<tr><th colspan="3">Your Library</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-library.webp"><img src="images/screenshots/desktop-classic-library.webp" alt="Desktop · Classic · Your Library" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-library.webp"><img src="images/screenshots/desktop-glass-library.webp" alt="Desktop · Glass · Your Library" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-library.webp"><img src="images/screenshots/desktop-vitrine-library.webp" alt="Desktop · Vitrine · Your Library" width="100%"></a></td>
</tr>
<tr><th colspan="3">Playlist details</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-playlist.webp"><img src="images/screenshots/desktop-classic-playlist.webp" alt="Desktop · Classic · Playlist details" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-playlist.webp"><img src="images/screenshots/desktop-glass-playlist.webp" alt="Desktop · Glass · Playlist details" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-playlist.webp"><img src="images/screenshots/desktop-vitrine-playlist.webp" alt="Desktop · Vitrine · Playlist details" width="100%"></a></td>
</tr>
<tr><th colspan="3">Curated album details</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-album.webp"><img src="images/screenshots/desktop-classic-album.webp" alt="Desktop · Classic · Curated album details" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-album.webp"><img src="images/screenshots/desktop-glass-album.webp" alt="Desktop · Glass · Curated album details" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-album.webp"><img src="images/screenshots/desktop-vitrine-album.webp" alt="Desktop · Vitrine · Curated album details" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Discovery, search and collection imports</strong></summary>

Request a recommendation category, preview supported tracks, explore an artist or review an ordered collection before importing. Provider availability and account configuration determine results. [Import guide](IMPORTING-MUSIC.md)

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Discovery and recommendation explanations</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-discovery.webp"><img src="images/screenshots/desktop-classic-discovery.webp" alt="Desktop · Classic · Discovery and recommendation explanations" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-discovery.webp"><img src="images/screenshots/desktop-glass-discovery.webp" alt="Desktop · Glass · Discovery and recommendation explanations" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-discovery.webp"><img src="images/screenshots/desktop-vitrine-discovery.webp" alt="Desktop · Vitrine · Discovery and recommendation explanations" width="100%"></a></td>
</tr>
<tr><th colspan="3">Music search and source filters</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-search.webp"><img src="images/screenshots/desktop-classic-search.webp" alt="Desktop · Classic · Music search and source filters" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-search.webp"><img src="images/screenshots/desktop-glass-search.webp" alt="Desktop · Glass · Music search and source filters" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-search.webp"><img src="images/screenshots/desktop-vitrine-search.webp" alt="Desktop · Vitrine · Music search and source filters" width="100%"></a></td>
</tr>
<tr><th colspan="3">Artist page</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-artist.webp"><img src="images/screenshots/desktop-classic-artist.webp" alt="Desktop · Classic · Artist page" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-artist.webp"><img src="images/screenshots/desktop-glass-artist.webp" alt="Desktop · Glass · Artist page" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-artist.webp"><img src="images/screenshots/desktop-vitrine-artist.webp" alt="Desktop · Vitrine · Artist page" width="100%"></a></td>
</tr>
<tr><th colspan="3">Album / playlist import preview</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-import.webp"><img src="images/screenshots/desktop-classic-import.webp" alt="Desktop · Classic · Album / playlist import preview" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-import.webp"><img src="images/screenshots/desktop-glass-import.webp" alt="Desktop · Glass · Album / playlist import preview" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-import.webp"><img src="images/screenshots/desktop-vitrine-import.webp" alt="Desktop · Vitrine · Album / playlist import preview" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Public profiles, collaboration and parties</strong></summary>

Public visibility, collaborator editing rights and Party Room membership are separate controls. Federation connects compatible, configured nodes; a local gallery capture is not evidence of a live federated session. [Shared listening guide](PARTY-ROOMS.md)

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Public collections</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-public.webp"><img src="images/screenshots/desktop-classic-public.webp" alt="Desktop · Classic · Public collections" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-public.webp"><img src="images/screenshots/desktop-glass-public.webp" alt="Desktop · Glass · Public collections" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-public.webp"><img src="images/screenshots/desktop-vitrine-public.webp" alt="Desktop · Vitrine · Public collections" width="100%"></a></td>
</tr>
<tr><th colspan="3">Public profile</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-profile.webp"><img src="images/screenshots/desktop-classic-profile.webp" alt="Desktop · Classic · Public profile" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-profile.webp"><img src="images/screenshots/desktop-glass-profile.webp" alt="Desktop · Glass · Public profile" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-profile.webp"><img src="images/screenshots/desktop-vitrine-profile.webp" alt="Desktop · Vitrine · Public profile" width="100%"></a></td>
</tr>
<tr><th colspan="3">Party Rooms</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-party.webp"><img src="images/screenshots/desktop-classic-party.webp" alt="Desktop · Classic · Party Rooms" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-party.webp"><img src="images/screenshots/desktop-glass-party.webp" alt="Desktop · Glass · Party Rooms" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-party.webp"><img src="images/screenshots/desktop-vitrine-party.webp" alt="Desktop · Vitrine · Party Rooms" width="100%"></a></td>
</tr>
<tr><th colspan="3">Playlist collaborators</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-collaborators.webp"><img src="images/screenshots/desktop-classic-collaborators.webp" alt="Desktop · Classic · Playlist collaborators" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-collaborators.webp"><img src="images/screenshots/desktop-glass-collaborators.webp" alt="Desktop · Glass · Playlist collaborators" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-collaborators.webp"><img src="images/screenshots/desktop-vitrine-collaborators.webp" alt="Desktop · Vitrine · Playlist collaborators" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Playback, lyrics and offline listening</strong></summary>

The fullscreen player shares its playback session with the compact player. Offline screenshots contain sample recordings saved through the real browser download flow. These silent demonstration files do not contain the named commercial recordings.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Fullscreen player</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-player.webp"><img src="images/screenshots/desktop-classic-player.webp" alt="Desktop · Classic · Fullscreen player" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-player.webp"><img src="images/screenshots/desktop-glass-player.webp" alt="Desktop · Glass · Fullscreen player" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-player.webp"><img src="images/screenshots/desktop-vitrine-player.webp" alt="Desktop · Vitrine · Fullscreen player" width="100%"></a></td>
</tr>
<tr><th colspan="3">Lyrics view</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-lyrics.webp"><img src="images/screenshots/desktop-classic-lyrics.webp" alt="Desktop · Classic · Lyrics view" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-lyrics.webp"><img src="images/screenshots/desktop-glass-lyrics.webp" alt="Desktop · Glass · Lyrics view" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-lyrics.webp"><img src="images/screenshots/desktop-vitrine-lyrics.webp" alt="Desktop · Vitrine · Lyrics view" width="100%"></a></td>
</tr>
<tr><th colspan="3">Device downloads</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-offline.webp"><img src="images/screenshots/desktop-classic-offline.webp" alt="Desktop · Classic · Device downloads" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-offline.webp"><img src="images/screenshots/desktop-glass-offline.webp" alt="Desktop · Glass · Device downloads" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-offline.webp"><img src="images/screenshots/desktop-vitrine-offline.webp" alt="Desktop · Vitrine · Device downloads" width="100%"></a></td>
</tr>
<tr><th colspan="3">Download jobs</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-downloads.webp"><img src="images/screenshots/desktop-classic-downloads.webp" alt="Desktop · Classic · Download jobs" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-downloads.webp"><img src="images/screenshots/desktop-glass-downloads.webp" alt="Desktop · Glass · Download jobs" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-downloads.webp"><img src="images/screenshots/desktop-vitrine-downloads.webp" alt="Desktop · Vitrine · Download jobs" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Wrapped, preferences and sign-in</strong></summary>

Wrapped is available when enabled by the administrator. Theme preferences follow the account; playback and storage settings have device-specific options.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Annual Wrapped summary</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-wrapped.webp"><img src="images/screenshots/desktop-classic-wrapped.webp" alt="Desktop · Classic · Annual Wrapped summary" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-wrapped.webp"><img src="images/screenshots/desktop-glass-wrapped.webp" alt="Desktop · Glass · Annual Wrapped summary" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-wrapped.webp"><img src="images/screenshots/desktop-vitrine-wrapped.webp" alt="Desktop · Vitrine · Annual Wrapped summary" width="100%"></a></td>
</tr>
<tr><th colspan="3">Account settings</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-settings.webp"><img src="images/screenshots/desktop-classic-settings.webp" alt="Desktop · Classic · Account settings" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-settings.webp"><img src="images/screenshots/desktop-glass-settings.webp" alt="Desktop · Glass · Account settings" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-settings.webp"><img src="images/screenshots/desktop-vitrine-settings.webp" alt="Desktop · Vitrine · Account settings" width="100%"></a></td>
</tr>
<tr><th colspan="3">Sign-in</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-login.webp"><img src="images/screenshots/desktop-classic-login.webp" alt="Desktop · Classic · Sign-in" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-login.webp"><img src="images/screenshots/desktop-glass-login.webp" alt="Desktop · Glass · Sign-in" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-login.webp"><img src="images/screenshots/desktop-vitrine-login.webp" alt="Desktop · Vitrine · Sign-in" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Administration and server operations</strong></summary>

These controls require administrator access. Duplicate review does not delete recordings automatically. Provider-session status and host metrics are synthetic demonstration data. [Administration guide](ADMINISTRATION.md)

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">User administration</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-admin.webp"><img src="images/screenshots/desktop-classic-admin.webp" alt="Desktop · Classic · User administration" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-admin.webp"><img src="images/screenshots/desktop-glass-admin.webp" alt="Desktop · Glass · User administration" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-admin.webp"><img src="images/screenshots/desktop-vitrine-admin.webp" alt="Desktop · Vitrine · User administration" width="100%"></a></td>
</tr>
<tr><th colspan="3">Duplicate review</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-duplicates.webp"><img src="images/screenshots/desktop-classic-duplicates.webp" alt="Desktop · Classic · Duplicate review" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-duplicates.webp"><img src="images/screenshots/desktop-glass-duplicates.webp" alt="Desktop · Glass · Duplicate review" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-duplicates.webp"><img src="images/screenshots/desktop-vitrine-duplicates.webp" alt="Desktop · Vitrine · Duplicate review" width="100%"></a></td>
</tr>
<tr><th colspan="3">Federation settings</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-federation.webp"><img src="images/screenshots/desktop-classic-federation.webp" alt="Desktop · Classic · Federation settings" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-federation.webp"><img src="images/screenshots/desktop-glass-federation.webp" alt="Desktop · Glass · Federation settings" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-federation.webp"><img src="images/screenshots/desktop-vitrine-federation.webp" alt="Desktop · Vitrine · Federation settings" width="100%"></a></td>
</tr>
<tr><th colspan="3">System Monitor</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-monitor.webp"><img src="images/screenshots/desktop-classic-monitor.webp" alt="Desktop · Classic · System Monitor" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-monitor.webp"><img src="images/screenshots/desktop-glass-monitor.webp" alt="Desktop · Glass · System Monitor" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-monitor.webp"><img src="images/screenshots/desktop-vitrine-monitor.webp" alt="Desktop · Vitrine · System Monitor" width="100%"></a></td>
</tr>
<tr><th colspan="3">Download Manager · provider sessions</th></tr>
<tr>
  <td><a href="images/screenshots/desktop-classic-providers.webp"><img src="images/screenshots/desktop-classic-providers.webp" alt="Desktop · Classic · Download Manager · provider sessions" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-glass-providers.webp"><img src="images/screenshots/desktop-glass-providers.webp" alt="Desktop · Glass · Download Manager · provider sessions" width="100%"></a></td>
  <td><a href="images/screenshots/desktop-vitrine-providers.webp"><img src="images/screenshots/desktop-vitrine-providers.webp" alt="Desktop · Vitrine · Download Manager · provider sessions" width="100%"></a></td>
</tr>
</table>

</details>

## Mobile web and PWA

These are browser captures of the responsive interface. Browser installation, background playback and offline storage depend on the browser and operating system. They are not native Android screenshots.

<details>
<summary><strong>Browse and collect on a phone</strong></summary>

The mobile header, touch controls and bottom navigation are captured as rendered.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Mobile Home</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-home.webp"><img src="images/screenshots/mobile-classic-home.webp" alt="Mobile · Classic · Mobile Home" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-home.webp"><img src="images/screenshots/mobile-glass-home.webp" alt="Mobile · Glass · Mobile Home" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-home.webp"><img src="images/screenshots/mobile-vitrine-home.webp" alt="Mobile · Vitrine · Mobile Home" width="100%"></a></td>
</tr>
<tr><th colspan="3">Mobile Library</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-library.webp"><img src="images/screenshots/mobile-classic-library.webp" alt="Mobile · Classic · Mobile Library" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-library.webp"><img src="images/screenshots/mobile-glass-library.webp" alt="Mobile · Glass · Mobile Library" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-library.webp"><img src="images/screenshots/mobile-vitrine-library.webp" alt="Mobile · Vitrine · Mobile Library" width="100%"></a></td>
</tr>
<tr><th colspan="3">Mobile Discovery</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-discovery.webp"><img src="images/screenshots/mobile-classic-discovery.webp" alt="Mobile · Classic · Mobile Discovery" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-discovery.webp"><img src="images/screenshots/mobile-glass-discovery.webp" alt="Mobile · Glass · Mobile Discovery" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-discovery.webp"><img src="images/screenshots/mobile-vitrine-discovery.webp" alt="Mobile · Vitrine · Mobile Discovery" width="100%"></a></td>
</tr>
<tr><th colspan="3">Mobile playlist</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-playlist.webp"><img src="images/screenshots/mobile-classic-playlist.webp" alt="Mobile · Classic · Mobile playlist" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-playlist.webp"><img src="images/screenshots/mobile-glass-playlist.webp" alt="Mobile · Glass · Mobile playlist" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-playlist.webp"><img src="images/screenshots/mobile-vitrine-playlist.webp" alt="Mobile · Vitrine · Mobile playlist" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Mobile playback, offline and sign-in</strong></summary>

The compact and fullscreen players, downloaded collections and login adapt to the same phone viewport.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Mobile fullscreen player</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-player.webp"><img src="images/screenshots/mobile-classic-player.webp" alt="Mobile · Classic · Mobile fullscreen player" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-player.webp"><img src="images/screenshots/mobile-glass-player.webp" alt="Mobile · Glass · Mobile fullscreen player" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-player.webp"><img src="images/screenshots/mobile-vitrine-player.webp" alt="Mobile · Vitrine · Mobile fullscreen player" width="100%"></a></td>
</tr>
<tr><th colspan="3">Mobile lyrics</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-lyrics.webp"><img src="images/screenshots/mobile-classic-lyrics.webp" alt="Mobile · Classic · Mobile lyrics" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-lyrics.webp"><img src="images/screenshots/mobile-glass-lyrics.webp" alt="Mobile · Glass · Mobile lyrics" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-lyrics.webp"><img src="images/screenshots/mobile-vitrine-lyrics.webp" alt="Mobile · Vitrine · Mobile lyrics" width="100%"></a></td>
</tr>
<tr><th colspan="3">Mobile device downloads</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-offline.webp"><img src="images/screenshots/mobile-classic-offline.webp" alt="Mobile · Classic · Mobile device downloads" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-offline.webp"><img src="images/screenshots/mobile-glass-offline.webp" alt="Mobile · Glass · Mobile device downloads" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-offline.webp"><img src="images/screenshots/mobile-vitrine-offline.webp" alt="Mobile · Vitrine · Mobile device downloads" width="100%"></a></td>
</tr>
<tr><th colspan="3">Mobile sign-in</th></tr>
<tr>
  <td><a href="images/screenshots/mobile-classic-login.webp"><img src="images/screenshots/mobile-classic-login.webp" alt="Mobile · Classic · Mobile sign-in" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-glass-login.webp"><img src="images/screenshots/mobile-glass-login.webp" alt="Mobile · Glass · Mobile sign-in" width="100%"></a></td>
  <td><a href="images/screenshots/mobile-vitrine-login.webp"><img src="images/screenshots/mobile-vitrine-login.webp" alt="Mobile · Vitrine · Mobile sign-in" width="100%"></a></td>
</tr>
</table>

</details>

## Native Android APK

These images render the APK's actual native Android views, not HTML inside WebView. Normal native browsing and playback use the configured Aoede backend; explicit compatibility mode uses the installed web client instead. The local Android rendering runtime is used for these captures, so no phone frame, OS status icons or launcher are added. [Android installation and usage](ANDROID.md)

<details>
<summary><strong>Native browsing and discovery</strong></summary>

Browse your server and open artist pages directly from the native interface.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Native Home</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-home.webp"><img src="images/screenshots/android-classic-home.webp" alt="Android · Classic · Native Home" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-home.webp"><img src="images/screenshots/android-glass-home.webp" alt="Android · Glass · Native Home" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-home.webp"><img src="images/screenshots/android-vitrine-home.webp" alt="Android · Vitrine · Native Home" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native Library</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-library.webp"><img src="images/screenshots/android-classic-library.webp" alt="Android · Classic · Native Library" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-library.webp"><img src="images/screenshots/android-glass-library.webp" alt="Android · Glass · Native Library" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-library.webp"><img src="images/screenshots/android-vitrine-library.webp" alt="Android · Vitrine · Native Library" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native Discovery</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-discovery.webp"><img src="images/screenshots/android-classic-discovery.webp" alt="Android · Classic · Native Discovery" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-discovery.webp"><img src="images/screenshots/android-glass-discovery.webp" alt="Android · Glass · Native Discovery" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-discovery.webp"><img src="images/screenshots/android-vitrine-discovery.webp" alt="Android · Vitrine · Native Discovery" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native artist page</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-artist.webp"><img src="images/screenshots/android-classic-artist.webp" alt="Android · Classic · Native artist page" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-artist.webp"><img src="images/screenshots/android-glass-artist.webp" alt="Android · Glass · Native artist page" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-artist.webp"><img src="images/screenshots/android-vitrine-artist.webp" alt="Android · Vitrine · Native artist page" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Native collections and collaboration</strong></summary>

Public profiles use compact collection covers. Owners manage collaborators separately from public visibility.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Native playlist</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-playlist.webp"><img src="images/screenshots/android-classic-playlist.webp" alt="Android · Classic · Native playlist" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-playlist.webp"><img src="images/screenshots/android-glass-playlist.webp" alt="Android · Glass · Native playlist" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-playlist.webp"><img src="images/screenshots/android-vitrine-playlist.webp" alt="Android · Vitrine · Native playlist" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native public collections</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-public.webp"><img src="images/screenshots/android-classic-public.webp" alt="Android · Classic · Native public collections" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-public.webp"><img src="images/screenshots/android-glass-public.webp" alt="Android · Glass · Native public collections" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-public.webp"><img src="images/screenshots/android-vitrine-public.webp" alt="Android · Vitrine · Native public collections" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native public profile</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-profile.webp"><img src="images/screenshots/android-classic-profile.webp" alt="Android · Classic · Native public profile" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-profile.webp"><img src="images/screenshots/android-glass-profile.webp" alt="Android · Glass · Native public profile" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-profile.webp"><img src="images/screenshots/android-vitrine-profile.webp" alt="Android · Vitrine · Native public profile" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native collaborators</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-collaborators.webp"><img src="images/screenshots/android-classic-collaborators.webp" alt="Android · Classic · Native collaborators" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-collaborators.webp"><img src="images/screenshots/android-glass-collaborators.webp" alt="Android · Glass · Native collaborators" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-collaborators.webp"><img src="images/screenshots/android-vitrine-collaborators.webp" alt="Android · Vitrine · Native collaborators" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Native listening and shared queues</strong></summary>

The player, lyrics and queue use the native playback session; Party Rooms retain their own shared listening controls.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Native fullscreen player</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-player.webp"><img src="images/screenshots/android-classic-player.webp" alt="Android · Classic · Native fullscreen player" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-player.webp"><img src="images/screenshots/android-glass-player.webp" alt="Android · Glass · Native fullscreen player" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-player.webp"><img src="images/screenshots/android-vitrine-player.webp" alt="Android · Vitrine · Native fullscreen player" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native lyrics</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-lyrics.webp"><img src="images/screenshots/android-classic-lyrics.webp" alt="Android · Classic · Native lyrics" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-lyrics.webp"><img src="images/screenshots/android-glass-lyrics.webp" alt="Android · Glass · Native lyrics" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-lyrics.webp"><img src="images/screenshots/android-vitrine-lyrics.webp" alt="Android · Vitrine · Native lyrics" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native queue</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-queue.webp"><img src="images/screenshots/android-classic-queue.webp" alt="Android · Classic · Native queue" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-queue.webp"><img src="images/screenshots/android-glass-queue.webp" alt="Android · Glass · Native queue" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-queue.webp"><img src="images/screenshots/android-vitrine-queue.webp" alt="Android · Vitrine · Native queue" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native Party Room</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-party-room.webp"><img src="images/screenshots/android-classic-party-room.webp" alt="Android · Classic · Native Party Room" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-party-room.webp"><img src="images/screenshots/android-glass-party-room.webp" alt="Android · Glass · Native Party Room" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-party-room.webp"><img src="images/screenshots/android-vitrine-party-room.webp" alt="Android · Vitrine · Native Party Room" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Native imports, downloads and radio</strong></summary>

Import previews and rules are editable before submission. The native offline screenshot shows the real empty device state; download supported local recordings from a collection to populate it.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Native collection import</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-import.webp"><img src="images/screenshots/android-classic-import.webp" alt="Android · Classic · Native collection import" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-import.webp"><img src="images/screenshots/android-glass-import.webp" alt="Android · Glass · Native collection import" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-import.webp"><img src="images/screenshots/android-vitrine-import.webp" alt="Android · Vitrine · Native collection import" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native smart-playlist rules</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-smart-playlist.webp"><img src="images/screenshots/android-classic-smart-playlist.webp" alt="Android · Classic · Native smart-playlist rules" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-smart-playlist.webp"><img src="images/screenshots/android-glass-smart-playlist.webp" alt="Android · Glass · Native smart-playlist rules" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-smart-playlist.webp"><img src="images/screenshots/android-vitrine-smart-playlist.webp" alt="Android · Vitrine · Native smart-playlist rules" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native download jobs</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-downloads.webp"><img src="images/screenshots/android-classic-downloads.webp" alt="Android · Classic · Native download jobs" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-downloads.webp"><img src="images/screenshots/android-glass-downloads.webp" alt="Android · Glass · Native download jobs" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-downloads.webp"><img src="images/screenshots/android-vitrine-downloads.webp" alt="Android · Vitrine · Native download jobs" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native radio search</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-radios.webp"><img src="images/screenshots/android-classic-radios.webp" alt="Android · Classic · Native radio search" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-radios.webp"><img src="images/screenshots/android-glass-radios.webp" alt="Android · Glass · Native radio search" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-radios.webp"><img src="images/screenshots/android-vitrine-radios.webp" alt="Android · Vitrine · Native radio search" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Native preferences and offline entry</strong></summary>

Appearance, sign-in and account-bound storage use native controls. Device downloads remain separate from the server library.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Native account settings</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-settings.webp"><img src="images/screenshots/android-classic-settings.webp" alt="Android · Classic · Native account settings" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-settings.webp"><img src="images/screenshots/android-glass-settings.webp" alt="Android · Glass · Native account settings" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-settings.webp"><img src="images/screenshots/android-vitrine-settings.webp" alt="Android · Vitrine · Native account settings" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native appearance settings</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-appearance.webp"><img src="images/screenshots/android-classic-appearance.webp" alt="Android · Classic · Native appearance settings" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-appearance.webp"><img src="images/screenshots/android-glass-appearance.webp" alt="Android · Glass · Native appearance settings" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-appearance.webp"><img src="images/screenshots/android-vitrine-appearance.webp" alt="Android · Vitrine · Native appearance settings" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native device downloads · empty state</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-offline.webp"><img src="images/screenshots/android-classic-offline.webp" alt="Android · Classic · Native device downloads · empty state" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-offline.webp"><img src="images/screenshots/android-glass-offline.webp" alt="Android · Glass · Native device downloads · empty state" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-offline.webp"><img src="images/screenshots/android-vitrine-offline.webp" alt="Android · Vitrine · Native device downloads · empty state" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native sign-in</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-login.webp"><img src="images/screenshots/android-classic-login.webp" alt="Android · Classic · Native sign-in" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-login.webp"><img src="images/screenshots/android-glass-login.webp" alt="Android · Glass · Native sign-in" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-login.webp"><img src="images/screenshots/android-vitrine-login.webp" alt="Android · Vitrine · Native sign-in" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Native Wrapped and administration</strong></summary>

The same account permissions apply to native administration. Demonstration statistics and host metrics do not describe a live server.

<table>
<tr><th width="33%">Classic</th><th width="33%">Glass</th><th width="33%">Vitrine</th></tr>
<tr><th colspan="3">Native Wrapped summary</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-wrapped.webp"><img src="images/screenshots/android-classic-wrapped.webp" alt="Android · Classic · Native Wrapped summary" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-wrapped.webp"><img src="images/screenshots/android-glass-wrapped.webp" alt="Android · Glass · Native Wrapped summary" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-wrapped.webp"><img src="images/screenshots/android-vitrine-wrapped.webp" alt="Android · Vitrine · Native Wrapped summary" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native user administration</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-admin.webp"><img src="images/screenshots/android-classic-admin.webp" alt="Android · Classic · Native user administration" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-admin.webp"><img src="images/screenshots/android-glass-admin.webp" alt="Android · Glass · Native user administration" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-admin.webp"><img src="images/screenshots/android-vitrine-admin.webp" alt="Android · Vitrine · Native user administration" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native System Monitor</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-monitor.webp"><img src="images/screenshots/android-classic-monitor.webp" alt="Android · Classic · Native System Monitor" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-monitor.webp"><img src="images/screenshots/android-glass-monitor.webp" alt="Android · Glass · Native System Monitor" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-monitor.webp"><img src="images/screenshots/android-vitrine-monitor.webp" alt="Android · Vitrine · Native System Monitor" width="100%"></a></td>
</tr>
<tr><th colspan="3">Native listening statistics</th></tr>
<tr>
  <td><a href="images/screenshots/android-classic-statistics.webp"><img src="images/screenshots/android-classic-statistics.webp" alt="Android · Classic · Native listening statistics" width="100%"></a></td>
  <td><a href="images/screenshots/android-glass-statistics.webp"><img src="images/screenshots/android-glass-statistics.webp" alt="Android · Glass · Native listening statistics" width="100%"></a></td>
  <td><a href="images/screenshots/android-vitrine-statistics.webp"><img src="images/screenshots/android-vitrine-statistics.webp" alt="Android · Vitrine · Native listening statistics" width="100%"></a></td>
</tr>
</table>

</details>

<details>
<summary><strong>Vitrine in dark appearance</strong></summary>

Vitrine also follows a dark device appearance. These are additional native captures of the same Home and player views.

<table><tr>
<td width="50%"><a href="images/screenshots/android-vitrine-dark-home.webp"><img src="images/screenshots/android-vitrine-dark-home.webp" alt="Native Vitrine in dark appearance · home" width="100%"></a></td>
<td width="50%"><a href="images/screenshots/android-vitrine-dark-player.webp"><img src="images/screenshots/android-vitrine-dark-player.webp" alt="Native Vitrine in dark appearance · player" width="100%"></a></td>
</tr></table>

</details>

## Android widgets and music island

These are actual native component renders with demonstration artwork and metadata. The widgets adapt to their allocated size. The music island is optional and exclusive to the installed Android client; its visibility and permissions are configured in the app. The expanded island below uses a large font setting to show its accessible layout. No launcher, notification shade or phone lock screen is simulated. [Widget and island controls](ANDROID.md#dynamic-island-and-widgets)

<table>
<tr><th>Home-screen widget</th><th>Expanded widget</th></tr>
<tr>
<td width="50%" align="center"><a href="images/screenshots/android-widget.webp"><img src="images/screenshots/android-widget.webp" alt="Native Android android-widget" width="320"></a></td>
<td width="50%" align="center"><a href="images/screenshots/android-widget-expanded.webp"><img src="images/screenshots/android-widget-expanded.webp" alt="Native Android android-widget-expanded" width="320"></a></td>
</tr>
<tr><th>Compact island</th><th>Expanded island</th></tr>
<tr>
<td width="50%" align="center"><a href="images/screenshots/android-island.webp"><img src="images/screenshots/android-island.webp" alt="Native Android android-island" width="240"></a></td>
<td width="50%" align="center"><a href="images/screenshots/android-island-expanded.webp"><img src="images/screenshots/android-island-expanded.webp" alt="Native Android android-island-expanded" width="240"></a></td>
</tr></table>

[Back to the project overview](../README.md) · [Browse the user guide](USER-GUIDE.md) · [Download the current clients](https://github.com/sPROFFEs/Aoede/releases/latest)