ユーザーカードのリデザイン実験

Discordは、デフォルトのユーザーカードバナーに面白い機能を使っています。ユーザーのアバターから平均的なフラットカラーを使用しています。

例:

Get Average Color of Image を使用:

「いいね!」 5

これが私の例です。



しかし、これらは同じではありません。

更新:プリセットカラーを選択したため、色が同じではありませんでした。(私のミスです)

「いいね!」 1

うーん。何が起こっているのかわからない。もっと青いものを期待していた!

「いいね!」 2

参考までに、Discourseでも同様のことが行われています。トピックリストプレビューでは、「平均色」ではなく「主要色」を使用しています。

主要色の方が良い結果が得られると思います。

「いいね!」 5

このバグは、この再設計の一環として対処されていますか?

ユーザーカードから少し離れたところにあることは承知していますが、ユーザーカードで監視ワードと衝突した場合、重大な問題が発生します。

「いいね!」 4

ループを閉じるために、ネイサン:

「いいね!」 8

この新しいアップデートで追加されたのは以下の通りです。

サイト設定からユーザーの現在地にGoogleマップのリンクを追加

OpenStreetMapにも対応していただけると素晴らしいです。

「いいね!」 8

これで追加されました:smile: 設定でGoogleマップまたはOpenStreetMapのいずれかを選択できるようになりました:+1:

「いいね!」 5

全体的に良い再デザインだと思いますが、バッジのラベルも重要だと思います。同じアイコンのバッジを一覧で区別できることは、このようなクイックプレビューにとって非常に重要です。例えば、ラベルがないと、このアイコンが:
2023-03-06 16_03_48-Badges - Blender Artists Community
当サイトで設定されているように、「Famous Link」、「Great Reply」、「Great Topic」のどれなのか、一目でわかりません(環境によって異なる場合があります)。特に「Getting Started」カテゴリのバッジではさらに悪く、16個のバッジが全く同じアイコンを共有しており、その意味合いは大きく異なります。例えば、ガイドラインを読んだことに対するバッジをモデレーターとして見ることが重要ですが、この新しいデザインでは、そのバッジは他の15個の全く異なるバッジ(「First Onebox」や「New User of the Month」などを含む)と同じように見えます。

「いいね!」 4

Discourse にこの新しいユーザー カードを追加する際には、オプションにしてください。古いカードの方が新しいカードよりもはるかに優れており、カードに奇妙な背景色が追加されて見苦しくなっています。また、ユーザー カードには何も表示されず、情報がありません。

全体的に気に入らないので、Discourse に追加する際には強制しないでください。

「いいね!」 3

古いデザインのどのような点が気に入っているか、ぜひお聞かせください!

この点について詳しく教えていただけますか?あなたのカードをクリックしても、私のカードをクリックしても情報が表示されます。

「いいね!」 1

新しいもの

「いいね!」 3

ご自身のフォーラムでこれを使用していますか?

「いいね!」 3

これは私のテーマのようですね。透明度に基づいています。これまで長い間、あなたが抱えていたすべての問題について話してきましたが、残念ながらこれ以上お手伝いできる期間は長くないかもしれません。なぜなら、問題は実際のテーマにはなく、見つけられない互換性の問題だからです。

「いいね!」 2

コンソールにエラーはありますか?

「いいね!」 1

テーマの互換性の問題かもしれないと思いました。

いいえ。

ところで、背景色がプロフィール画像と同じ色になると不快に見えるので、私の意見を述べたいと思います。背景にプロフィール色ではなく、デフォルトの背景画像などを設定した方が良いでしょう。そして、この画像のように背景はぼかすべきです。

「いいね!」 1

個人的には、とても気に入っています。サイト全体の設定にした方がいいと思いますが、皆さんは気に入らないようです。

私の方では正常に動作しています。

「いいね!」 3

このことがずっと気になっていたので、調べてみたところ、

を見つけました。これは、平均を取るよりも、この目的にはるかに良い仕事をしていると思います。このスレッドのユーザーのアバターからの例を以下に示します。

コードはこちら: color-finder/src/colorfinder-1.1.js at master · pieroxy/color-finder · GitHub

「いいね!」 13

これは、最終的にこの種のパターンに切り替える意図です。しかし、問題は、画像がCDNでホストされているため、この種のことは機能しないことです。

注意:canvasオブジェクトの制限により、これは画像が独自のドメインから提供されている場合にのみ機能します。

Railsバックエンドの画像用にこれを行うものがありますが、テーマコンポーネントからはアクセスできません。これは現時点では実験にすぎないため、より簡単にできるようになるまで保留したいと思います。

「いいね!」 1

以前にこの件について投稿しました。earlier。これは「Dominant colour」と呼ばれています。

「いいね!」 4