YouTube Dark Mode Desktop UI-Mockup

A detailed UI mockup of a video streaming homepage in dark mode on a desktop OS, useful for web design references and layout generation.

{
  "type": "Desktop-Webbrowser UI-Screenshot",
  "environment": "{argument name=\"os environment\" default=\"Windows 11 Desktop\"}",
  "theme": "{argument name=\"ui theme\" default=\"Dark Mode\"}",
  "browser_window": {
    "tabs": ["YouTube", "Neuer Tab"],
    "url_bar": "youtube.com",
    "profile_icon": "{argument name=\"profile initial\" default=\"M\"}"
  },
  "app_interface": {
    "header": {
      "logo": "{argument name=\"website name\" default=\"YouTube\"} GB",
      "search_bar": "Suchen",
      "icons": ["Mikrofon", "Erstellen", "Benachrichtigungen", "Profil"]
    },
    "filter_bar": {
      "active_filter": "{argument name=\"active filter\" default=\"Alle\"}",
      "count": 11,
      "labels": ["Alle", "Gaming", "Musik", "Live", "Podcasts", "Mixes", "Wissenschaft", "Lo-fi", "Thriller", "Kürzlich hochgeladen", "Angesehen"]
    },
    "sidebar": {
      "sections": [
        { "title": "Hauptmenü", "count": 3, "labels": ["Start", "Shorts", "Abos"] },
        { "title": "Du", "count": 6, "labels": ["Dein Kanal", "Verlauf", "Playlists", "Deine Videos", "Später ansehen", "Videos mit 'Mag ich'-Bewertung"] },
        { "title": "Abos", "count": 8, "labels": ["Linus Tech Tips", "MrBeast", "Kurzgesagt - In a Nutshell", "ColdFusion", "3Blue1Brown", "Khan Academy", "Veritasium", "Mehr anzeigen"] },
        { "title": "Explore", "count": 7, "labels": ["Trends", "Musik", "Filme", "Live", "Gaming", "Nachrichten", "Sport"] },
        { "title": "Mehr von YouTube", "count": 3, "labels": ["YouTube Premium", "YouTube Music", "YouTube Kids"] }
      ]
    },
    "main_content": {
      "layout": "3 Spalten mal 4 Zeilen Raster",
      "count": 12,
      "video_cards": [
        { "title": "Warum es fast unmöglich ist, eine eigene GPU zu bauen", "channel": "Linus Tech Tips", "stats": "164 Tsd. Aufrufe • vor 1 Tag", "thumbnail": "CPU/GPU-Chip" },
        { "title": "Überlebe 100 Tage im Kreis, gewinne 500.000 $", "channel": "MrBeast", "stats": "40 Mio. Aufrufe • vor 5 Tagen", "thumbnail": "MrBeast mit Menschenmenge in blauen Trainingsanzügen" },
        { "title": "Was wäre, wenn wir einen Asteroiden mit Atomwaffen beschießen?", "channel": "Kurzgesagt - In a Nutshell", "stats": "4,2 Mio. Aufrufe • vor 6 Stunden", "thumbnail": "Rakete trifft Asteroiden im Weltraum" },
        { "title": "Wie Dubai zu einer 10-Milliarden-Dollar-Stadt wurde", "channel": "ColdFusion", "stats": "1,6 Mio. Aufrufe • vor 2 Wochen", "thumbnail": "Mann und Skyline von Dubai" },
        { "title": "Die wunderschöne Mathematik der Eulerschen Identität", "channel": "3Blue1Brown", "stats": "2,8 Mio. Aufrufe • vor 3 Monaten", "thumbnail": "Mathematische Gleichung und Spiralgraph" },
        { "title": "Die Welt im Jahr 2040 - Bevölkerung, Klima & mehr", "channel": "Veritasium", "stats": "7,7 Mio. Aufrufe • vor 2 Wochen", "thumbnail": "Luftaufnahme eines üppigen grünen Waldes" },
        { "title": "Ich nutze Linux seit 12 Jahren, das ist es, was mich endlich...", "channel": "DistroTube", "stats": "160 Tsd. Aufrufe • vor 3 Tagen", "thumbnail": "Laptop und Smartphone mit Linux-Logo" },
        { "title": "Schwarze Löcher erklärt - Von der Geburt bis zum Tod", "channel": "Khan Academy", "stats": "3,9 Mio. Aufrufe • vor 3 Monaten", "thumbnail": "Leuchtende Akkretionsscheibe eines schwarzen Lochs" },
        { "title": "Das Problem mit Diätratschlägen", "channel": "Andrew Huberman", "stats": "4,4 Mio. Aufrufe • vor 6 Tagen", "thumbnail": "Mann mit Brille spricht" },
        { "title": "Wie man alles lernt (evidenzbasiert)", "channel": "Ali Abdaal", "stats": "2,7 Mio. Aufrufe • vor 3 Monaten", "thumbnail": "Vektorillustration eines Mannes, der ein Buch liest" },
        { "title": "The Last of Us Part 2 ist ein Meisterwerk", "channel": "Naughty Dog", "stats": "2,3 Mio. Aufrufe • vor 3 Jahren", "thumbnail": "Ellie aus The Last of Us" },
        { "title": "lofi hip hop radio - beats to relax/study to", "channel": "Lofi Girl", "stats": "LIVE", "thumbnail": "Lofi-Mädchen lernt am Schreibtisch" }
      ]
    }
  },
  "taskbar": {
    "os": "Windows",
    "icons": ["Start", "Suche", "Taskansicht", "Datei-Explorer", "Edge", "Spotify"],
    "system_tray": "08:34 03.04.2024"
  }
}

Maschinell übersetzt — das Original hat dieses Ergebnis erzeugt.

✨ Generieren Speichern Prompt kopieren Teilen Originalbeitrag In Hitboard öffnen