[{"data":1,"prerenderedAt":128},["ShallowReactive",2],{"blog-de-glass-is-not-a-background":3},{"id":4,"title":5,"body":6,"cover":112,"date":113,"description":114,"draft":115,"extension":116,"locale":117,"meta":118,"navigation":119,"path":120,"seo":121,"stem":122,"tags":123,"__hash__":127},"blog\u002Fblog\u002Fde\u002Fglass-is-not-a-background.md","Glas ist kein Hintergrund",{"type":7,"value":8,"toc":103},"minimark",[9,13,16,21,24,27,33,36,43,46,50,53,56,59,62,66,69,72,76,79,82,86,97,100],[10,11,12],"p",{},"Am einfachsten wäre es gewesen, der Bibliothek in meetre eine gläserne Seitenleiste zu geben, eine gläserne Toolbar und darauf eine Zusammenfassung auf einer gläsernen Karte. Als Screenshot sähe das unglaublich aus. Mit einem unruhigen Hintergrundbild dahinter wäre es unlesbar, und nach fünf Minuten Transkript-Scrollen würde dir leicht schummrig.",[10,14,15],{},"So habe ich Liquid Glass kennengelernt, das Material, das Apple mit macOS 26 überall eingeführt hat. Es ist wunderschön und sehr leicht falsch einzusetzen. Jedes Mal, wenn du mehr davon benutzt, wird der Screenshot besser und die App ein kleines bisschen schlechter.",[17,18,20],"h2",{"id":19},"glas-ist-für-dinge-die-schweben","Glas ist für Dinge, die schweben",[10,22,23],{},"Die Regel, die ich am Ende ins Design-Regelbuch von meetre geschrieben habe, ist kurz: Glas kommt auf schwebende Bedienelemente und sonst nirgends hin. Der Aufnahme-Button ist aus Glas. Die Aktionszeilen im Menüleisten-Popover sind aus Glas. Die kleinen Buttons in der Kopfzeile des Live-Transkripts sind aus Glas. Das sind alles Sachen, die über etwas liegen und sich auch so anfühlen sollen, ein Stück getrennt vom Inhalt.",[10,25,26],{},"Der Inhalt selbst, also Transkript und Zusammenfassung, liegt immer auf einem soliden Hintergrund. Nie Glas hinter langem Text. Einen Absatz durch eine durchscheinende Fläche zu lesen heißt, dass dein Auge ständig gegen die Farbe ankämpft, die sich darunter bewegt. Bei einem Label mit drei Wörtern geht das. Bei einem Transkript von 30 Minuten gibt es Kopfweh.",[28,29,30],"blockquote",{},[10,31,32],{},"Glas sagt: Das hier schwebt. Wenn alles schwebt, schwebt nichts mehr.",[10,34,35],{},"Die zweite Regel ergibt sich daraus: nie Glas auf Glas. Eine Glasschicht pro Bereich. Stapelst du zwei, ist der Effekt weg. Was Glas eigentlich mitteilt (das hier liegt über dem da), stimmt nicht mehr, wenn das \"da\" auch Glas ist. Raus kommt eine Art Nebelsuppe, in der nichts mehr eine klare Tiefe hat.",[10,37,38],{},[39,40],"img",{"alt":41,"src":42},"Die Bibliothek von meetre mit einem soliden dunklen Inhaltsbereich, der eine Meeting-Zusammenfassung mit Entscheidungen, Aufgaben und offenen Fragen zeigt","\u002Fimages\u002Fblog\u002Fmeetre\u002Flibrary-summary.png",[10,44,45],{},"Schau dir das Fenster heute an, und es ist fast langweilig. Solide Seitenleiste, solider Inhaltsbereich, eine kompakte Toolbar. Die Zusammenfassung hat eine maximale Zeilenlänge von etwa 72 Zeichen, damit sie sich liest wie eine Seite und nicht wie ein Banner. Das ganze Drama ist in die paar Elemente gewandert, die es sich wirklich verdient haben.",[17,47,49],{"id":48},"das-rezept-für-ein-panel-das-über-allem-lesbar-bleibt","Das Rezept für ein Panel, das über allem lesbar bleibt",[10,51,52],{},"Die schwebenden Overlays (Live-Transkript, Live-Zusammenfassung) waren der schwierigste Fall, weil sie über buchstäblich allem liegen: einem Videocall, einer Tabelle, deinem Hintergrundbild, einer weißen Notion-Seite. Reines Glas würde die Farbe von dem übernehmen, was dahinter ist, und der Text wäre je nach Fenster mal lesbar und mal einfach weg.",[10,54,55],{},"Deshalb sind die Overlays eigentlich gar kein Glas. Sie sind ein dunkles HUD-Material mit 94 Prozent Graphit-Tönung obendrauf, einem 1-Punkt-Rand in Weiß mit 14 Prozent Deckkraft, 14 Punkten Eckenradius und dem normalen Systemschatten. Die Tönung macht fast die ganze Arbeit. Bei 94 Prozent bleibt gerade genug Durchsicht, dass das Panel sich anfühlt wie ein Teil des Systems und nicht wie ein reinkopiertes Rechteck. Aber nicht genug, dass der Hintergrund den Text stört.",[10,57,58],{},"Die Overlays sind außerdem immer dunkel, egal ob du im hellen oder dunklen Modus bist. Eine helle Variante sähe auf einem dunklen Desktop super aus und wäre über einem weißen Dokument komplett verschwunden. Immer dunkel ist die einzige Version, die überall funktioniert.",[10,60,61],{},"Den Textkontrast prüfe ich gegen genau diese Graphit-Tönung, nicht gegen irgendein ideales Grau, das ich mir vorstelle. Das Minimum ist 4,5:1, und ich habe den HUD-Text gegen die echten Werte des Materials geprüft. Das ist der langweilige Teil an Glas, über den in keiner Keynote geredet wird: Gegen ein Material, das sich ständig ändert, kannst du keinen Kontrast messen. Also musst du erst festlegen, wie sehr es sich ändern darf.",[17,63,65],{"id":64},"rücksicht-auf-alle-die-es-ausschalten","Rücksicht auf alle, die es ausschalten",[10,67,68],{},"Manche Leute schalten in den Bedienungshilfen \"Transparenz reduzieren\" ein. Manchmal, weil ihnen von dem Effekt schwindelig wird, manchmal, weil er sie einfach ablenkt, manchmal, weil ihr Rechner älter ist und es hilft. Wenn die Einstellung an ist, wird in meetre jede Glasfläche solide. Genauso bei \"Kontrast erhöhen\" und bei \"Bewegung reduzieren\", das aus der langsam treibenden Aurora im Onboarding einfache Überblendungen macht.",[10,70,71],{},"Für mich ist das ein Test, ob das Design ohne Deko funktioniert. Wenn das Abschalten von Glas das Layout kaputt macht oder ein Element unkenntlich wird, hat das Glas einen Job erledigt, den es nie hätte haben sollen. In meetre sieht es dann einfach etwas schlichter aus. Genau so soll es sein.",[17,73,75],{"id":74},"das-onboarding-ist-der-eine-ort-an-dem-ich-mich-austobe","Das Onboarding ist der eine Ort, an dem ich mich austobe",[10,77,78],{},"Eine Ausnahme gibt es. Beim ersten Start ist meetre ein Vollbildfenster über deinem unscharfen Desktop, dahinter ein langsam treibender Mesh-Gradient in Indigo und Violett mit einem Hauch Grün, höchstens 55 Prozent deckend. Große, runde Schrift sagt \"Hi.\" und führt dich dann in ein paar kurzen Zeilen durch die Einrichtung. Der Installationsschritt ist eine einzige Glaskarte mit maximal fünf Schaltern.",[10,80,81],{},"Das darf atmosphärisch sein, weil es einmal passiert, weil es das Einzige auf dem Bildschirm ist und weil es dort keinen langen Text zu lesen gibt. Es ist auch der einzige Ort in der App, an dem runde Display-Schrift überhaupt erlaubt ist. Einen klar abgesteckten Platz für das Hübsche zu haben macht es viel leichter, überall sonst Nein zu sagen.",[17,83,85],{"id":84},"dieselbe-regel-anderes-medium","Dieselbe Regel, anderes Medium",[10,87,88,89,96],{},"Ich hätte nicht gedacht, dass diese Zurückhaltung ins Marketing rüberschwappt, aber genau das ist passiert. Bei den Screenshots für ",[90,91,95],"a",{"href":92,"rel":93},"https:\u002F\u002Fgithub.com\u002Fmaxlkatze\u002Ftaskalarm",[94],"nofollow","TaskAlarm"," hatte ich in der ersten Runde kleine Badges und Bildunterschriften unter den Screens. Alles, was App-Landingpages halt so haben. Ich habe es wieder rausgenommen. Im Markenguide steht es jetzt klar: einfacher schwarzer Hintergrund, echte Screenshots, das Icon und die Wortmarke, keine Verläufe, Badges, Sticker oder extra Bildunterschriften. Die App soll für sich selbst sprechen.",[10,98,99],{},"Es ist dasselbe Prinzip wie beim Glas. Deko um den Inhalt herum konkurriert mit dem Inhalt. Wenn der Screenshot auf Schwarz nicht interessant genug ist, rettet ihn ein lila Verlauf auch nicht.",[10,101,102],{},"Ich werde ständig gefragt, ob ich Liquid Glass mag. Sehr sogar. Am liebsten allerdings an den Stellen, an denen ich es fast weggelassen hätte.",{"title":104,"searchDepth":105,"depth":105,"links":106},"",2,[107,108,109,110,111],{"id":19,"depth":105,"text":20},{"id":48,"depth":105,"text":49},{"id":64,"depth":105,"text":65},{"id":74,"depth":105,"text":75},{"id":84,"depth":105,"text":85},"\u002Fimages\u002Fblog\u002Fmeetre\u002Fonboarding-done.png","2026-10-16","Gestalten mit Liquid Glass unter macOS 26 am Beispiel von meetre. Wo Glas hingehört, wo es auf keinen Fall hingehört, das genaue Rezept hinter den schwebenden Panels und warum dieselbe Zurückhaltung am Ende auch in meinen Marketing-Bildern gelandet ist.",false,"md","de",{},true,"\u002Fblog\u002Fde\u002Fglass-is-not-a-background",{"title":5,"description":114},"blog\u002Fde\u002Fglass-is-not-a-background",[124,125,126],"UI","Design","macOS","7Fd_hoOEIk35gKtLARSp2kygOs_bH7OPOzmDLlRzJmQ",1792165379523]