Neue Header-Dropdown- / Benachrichtigungsmenü-Stile

Insgesamt denke ich, dass wir hier große Fortschritte machen, die rechte Seite funktioniert, aber ich finde den Kontrast bei Lesestoff sehr schwer zu lesen und zu sehen, da Grau ein wenig traurig ist.

Vergleichen Sie dies mit diesem interaktiven Artefakt (klickbar, probieren Sie es aus)

Ich mag die letzte Option am besten, da sie klar und übersichtlich ist, aber die ersten beiden fühlen sich auch gut an.

Gedanken? (und was ist mit Nathan los … was für ein Avatar :slight_smile: )

(Auch der reduzierte Randradius fühlt sich ein kleines bisschen besser an)

4 „Gefällt mir“

Heute haben einige der Designer und ich uns mit dem Paaren und Iterieren von Stilen beschäftigt. Hier sind wir gelandet.

  • Den blauen Hintergrund wieder einführen, aber etwas gedämpfter.
  • Das neue „Lesen“-Styling beibehalten, um Themenlisten zu imitieren
  • Die Hervorhebung des „aktiven“ Hintergrunds des aktiven Navigationspunkts verringern
  • Den blauen Kreis als Hintergrund für Symbole von ungelesenen Elementen beibehalten


Sam, mir gefallen auch die ersten beiden Optionen, die dein Artefakt zeigt. Ich werde mir diese genauer ansehen. Vorerst denke ich, dass unsere letzte Iteration uns an einen Punkt bringt, an dem die Unterscheidung etwas klarer ist.

Um weiterzukommen, denke ich, dass wir einige Anpassungen an der Vorlage und dem Text benötigen.

CSI ENHANCE

Scheint normal

6 „Gefällt mir“

Der letzte sieht ziemlich gut aus! Er kommuniziert den ungelesenen Status klar, ist aber immer noch sehr dezent. Ähnlich gefällt mir der erste (obwohl ich nicht denke, dass der blaue Kreis notwendig ist, sodass der letzte im Vergleich gewinnt). Alle anderen Designs sind für meinen persönlichen Geschmack „zu viel“.

Auf Mobilgeräten erhalte ich einen „rötlichen“ Hintergrund anstelle von Blau.

Ich finde das Hellgrau sehr schwer zu lesen, es wirkt ausgewaschen. Vielleicht versuchen wir, nur die Avatar-Dekoration zu grauen?

Der Kontrast ist hier einfach sehr, sehr anstrengend für die Augen, besonders bei nicht fettgedrucktem Text.

Ich glaube, deshalb hat Gmail schließlich die Schriftstärke für die Abgrenzung verwendet.

Auch auf dem Desktop gibt es 2 verschiedene Blautöne, was verwirrend ist.

Ja, ich finde dieses Feedback interessant. Es muss an der Nähe, der Fettdruckung, dem Abstand und der kürzeren Textbreite liegen.

Ich verwende die gleiche Farbe, um “gelesen” zu signalisieren, wie unsere Themenlisten sie verwenden.

Das gesagt, ich denke, der Icon-Hintergrund hat auch etwas damit zu tun, weshalb ich @keegans Vorschlag hier mag:

Eine weitere Option, die ich gerne implementieren würde, ist ein Inline-Titel mit Beschreibung. So etwas wie hier:

Ist das beim Hovern? Oder zeigt die Liste tatsächlich unterschiedlich blaue Hintergründe bei verschiedenen Elementen an?

Dieses hier, ja, zwei verschiedene Farben. Sie müssen ein Konto erstellen, um die lokale Genehmigung anzufordern, um dies zu sehen.

1 „Gefällt mir“

Ah okay, die Stile werden auf ungelesene Elemente angewendet. Ich werde etwas CSS hinzufügen, um auch dieses zu adressieren.

Kannst du einen Screenshot des mobilen rötlichen Hintergrunds senden?

1 „Gefällt mir“

Die neuesten Updates sind nun seit ein paar Tagen live. Bin gespannt, wie alle hier dazu stehen.

Ich komme im Allgemeinen gut damit zurecht, aber diese hellgraue Textfarbe stört mich immer noch. Ich bevorzuge sie immer noch in Schwarz. Können wir das versuchen? Lass das Symbol grau, aber behalte den Text bei Benachrichtigungen, die als gelesen markiert sind, in Schwarz?

Abgesehen davon bevorzuge ich dieses Styling gegenüber unserem ursprünglichen. Ich denke immer noch, dass es sich lohnt, radikalere Optionen zu erkunden, aber als Iteration fühlt es sich gut an.

Auch @lindsey, eine große Änderung, über die wir nachdenken sollten, ist, die Avatare standardmäßig anzuzeigen. Wir tun das nicht, und so viele Standardinstallationen erhalten diese weniger als optimale Standarderfahrung:

Die Änderungen, die @jordan.vidrine hier vorgenommen hat, sind Verfeinerungen im Gegensatz zu einer Neuerfindung, was gut ist.

  • Die Auswahl fühlt sich etwas besser an
  • Ein deutliches Symbol-Styling für gelesene und ungelesene Nachrichten fühlt sich besser an
  • Die blauen Links in Benachrichtigungen sind ein Ausreißer, es ist gut, diese in Schwarz zu haben.
3 „Gefällt mir“

Die Änderung wurde zusammengeführt.

1 „Gefällt mir“

Hm, haben wir das nicht kürzlich versucht? Ich dachte, wir hätten das ausprobiert und uns aus irgendeinem Grund dagegen entschieden. Aber die Idee gefällt mir sehr gut, das Benachrichtigungsmenü ist mit den Avataren viel interessanter und informativer.

2 „Gefällt mir“

Ich denke, ein guter Kompromiss wäre, es bei Neuinstallationen standardmäßig zu aktivieren.

Ich denke, der Hauptgrund, warum wir gezögert haben, sind die Anpassungen, die die Leute vorgenommen haben.

1 „Gefällt mir“

@jordan-vidrine Ich denke, wir können dieses Experiment jetzt global auf Meta aktivieren (und dieses Thema anheften) und sehen, ob sich jemand beschwert. Insgesamt denke ich, dass unser aktueller Stand besser ist als unser Standard.

@lindsey Gedanken?

Es ist eine evolutionäre Änderung, die auf subtile Weise in einigen Punkten besser ist.

3 „Gefällt mir“

Fertig!

Für alle trust_level_0 Benutzer aktiviert.

3 „Gefällt mir“

Ich finde den Unterschied zwischen Weiß auf Blau und Schwarz auf Weiß immer noch leichter zu erkennen als den Unterschied zwischen Weiß auf Blau und Weiß auf Dunkelgrau

Vielleicht liegt es daran, dass das Symbol der erste Ort ist, auf den ich schaue.
Es ist mir wichtiger als der Avatar. Weil dort auch steht, wer die Benachrichtigung ausgelöst hat, was ich benachrichtigt werde, ist nur bei verschobenen Beiträgen dort, ansonsten ist das Symbol der einzige Hinweis.

2 „Gefällt mir“

Hat sich etwas bezüglich der Schrift- oder Symbolgröße geändert? Mein erster Eindruck ist, dass sie jetzt etwas größer sind, aber das könnte auch am hinzugefügten Leerraum liegen. Dies führt zu einer leichten Diskrepanz zwischen den Benachrichtigungssymbolen und den Menüsymbolen.

Auch der Abstand rechts scheint mir etwas zu groß zu sein.

Nebenbemerkung: Ich verwende eine Browser-Skalierung von 90 % (bin mir nicht sicher, ob das Probleme verursachen würde, aber Browser sind manchmal seltsam :smile: ).

Die neueste (und wahrscheinlich endgültige) Iteration ist jetzt live. Ich setze mir für nächste Woche eine Lesezeichen-Erinnerung, um zusammenzuführen, falls es keine weiteren Kommentare gibt.

2 „Gefällt mir“

Danke für die Weiterentwicklung dieser netten Funktion. Sie ist viel besser als vor über einem Jahr.

Ich muss jedoch zugeben, dass ich vom Einsatz eines vollständigen neuen Zeilenumbruchs vor dem Detail-Element nicht vollständig überzeugt bin.

In meinem aktuellen Fall können Sie sehen, wie viel Platz gespart wird, indem das Detail direkt nach dem Benutzernamen beginnt und die Trennung in jedem Fall durch die fette Schrift des Benutzernamens gegenüber dem leichteren Schriftschnitt des Details erreicht wird.

Aber wenn wir die Möglichkeit behalten, dies über CSS zu ändern, bin ich zufrieden.

1 „Gefällt mir“

Ja, das sollte definitiv eine Klasse haben@

1 „Gefällt mir“