青色の「変更を保存」ボタンは、最初はグレーであるべきです

設定では、保存できるものが実際にあるまで、このボタンはグレー表示されるべきです。その後、青色になります。


保存が正常に完了した後、再びグレー表示されるべきです。

現在、ユーザーは「保存済み」という単語を探すために、それに頼らざるを得ません。
はい、その単語はそのままにしておいてください。しかし、ボタンを修正、つまり強化してください。よろしくお願いします。

「いいね!」 8

はい、これもカテゴリ設定の問題です。たとえば次のようになります。

(Locations プラグインがインストールされています)

コミットする設定変更がない場合にも、これもグレー表示されると非常に良いのですが…

「いいね!」 5

そして、保存後に設定を調整して再度保存した場合、最初の保存後と同じように見えるため、2回目の保存が実際に行ったことを確認することはできません。

「いいね!」 2

これには同意できません。要素の状態が動的に変化すると、エンドユーザーは混乱し、気が散ってしまいます。

このようなUIは、実際にどのような場所で見られますか?

以前、投稿が許可されるまで「返信」ボタンをグレーアウトしていましたが、これは非常に紛らわしく、多くのサポート問題を引き起こしていました。最近では、すぐにクリックして何が間違っているのかを発見できます。

「いいね!」 3

incognitoモードと通常モードの両方で https://meta.discourse.org/fb.com を試しましたが、クリックできないリンクはすべて削除されていました。そのため、今日は例がありません。
投稿の下にある「共有」「ブックマーク」「フラグ」「ウォッチ」はすべてグレー表示になっていますが、クリックできないという意味ではありません。したがって、グレー表示は気にしないでください。
「設定」では、何も変更していなくても「保存」を1000回クリックできます。

いずれにせよ、まだ保存する必要のある変更がない場合は、「保存」ボタンはまったく表示されないはずです。

明らかに、それが2023年のやり方です。

「いいね!」 1

それにもかかわらず、それは広く使用されています。非常にすぐに消える「OK」以外の応答が得られないため、少なくとも2回クリックする必要があります。見逃した場合、保存が成功したのか、それとも何らかのグリッチがあったのかわかりません。

実際…ここではすでに同じようなシステムが機能しています。たとえば、すべての設定です。

「いいね!」 1

えーと、Discourseの設定はすべて動的に変更されます(醜いビデオですみません、.webmの問題のようです)。そして、それは非常に役立ちます!

「いいね!」 1

これは異なるUIパラダイムですね…

しかし、確かに、FacebookとGoogleの両方がこのパターンに従っているという点で、私の間違いを認めます。


Facebook


@Designers 皆さんはどう思われますか?ユーザープロフィールも同様のパラダイムに従うべきでしょうか。

  • 青を薄くしますか?
  • グレーにしますか?
  • Googleのようにキャンセルボタンを提供しますか?
「いいね!」 6

従うべきです。すべての保存ボタンがそれに従うべきです。色がグレーであるか、薄暗いか、その他は多かれ少なかれ好みの問題ですが、それこそCSSと呼ばれる発明がある理由です :wink:

「いいね!」 3

私にとっては、視覚的な注意を引く度合いを下げるために、暗くしたりグレーにしたりしても構いません。ただし(これはいくら強調してもしすぎることはありませんが)、それでもクリック可能である限り、ユーザーは送信試行後に何が欠けているか/機能していないかを知ることができます。

そして、これには強く反対します。保存ボタンを表示することは、物事を変更して保存できることを明確に示すものです。また、まったく新しいUI要素がポップアップ表示されるのも、優れたUXとは言えません。

「いいね!」 6

さらに別の例を示します。ここでのクイック編集はどのように機能しますか… :wink:

ここから

これに:

「いいね!」 5

GoogleとFacebookのモデルに従うべきだと思います。(シークレットモードだったので、ボタンがすべてなくなったと思っていました。)

Have the Save Edit button grey until the user has typed something では、別のボタンについて報告しています。

「いいね!」 1