web-dev-qa-db-ja.com

ユーザーが別のタブに切り替えた場合、保存されていないタブの変更を破棄しますか?

読み取り専用のコンテンツを持つタブを持つWebアプリケーションがあります。一部のユーザーはコンテンツを編集する権限を持っています。編集を押すと、タブのコンテンツを編集できます。

変更が保存されていない編集済みのタブで、ユーザーが別のタブに切り替えると、すべての変更が破棄されます。

これは優れたユーザーエクスペリエンスですか?それはどのヒューリスティックプリンシパルに従いませんか?

14
sushil bharwani

これはアプリケーションの構造によって異なりますが、一般にタブは、一度に複数のタブが開かれるように正確に作成されます。

したがって、ユーザーがタブを切り替えたときに常にユーザーに通知するのはかなり面倒です。

一般的な解決策は、各タブのステータスを維持し、「変更された」インジケーターをタブの見出し内に表示することです。例えば。 IntelliJでは、変更されたドキュメントの見出しが青になります。

Modified tab is blue

各タブにグローバルな「すべて保存」と「保存」を提供します。

ユーザーが「ドキュメント」全体を閉じることを決定したとき(たとえば、ユーザーがページを閉じる/離脱することを決定したとき)、「変更を本当に破棄しますか?」ポップアップが開くようになりました。

または、変更をドラフトとして保存し、ユーザーが再度入力したときにそれらをロードすることもできます。これにより、Popupの必要性が草案が上書きされるときまで移動します。

最初の文で述べたように、結局、それは構造と文脈に依存します。ユーザーはどのくらいの頻度でタブを切り替えますか?あなたのウェブページのデザイン/テクノロジーは、タブのさまざまな状態を処理できますか?

38
Lovis

ユーザーに警告せずに、保存されていない変更を取り消し不能に破棄してはなりません。これには2つの解決策があります。

  • ユーザーがタブを変更しようとすると、保存されていない変更があることを警告するダイアログがポップアップします。この時点で変更を破棄するかどうかを選択できます(続行して破棄するオプションがあるはずです)変更、および作業中のタブに戻るオプション。保存して続行するオプションもあります)。
  • すべてのタブからの保存されていない変更を記憶し、変更を保存することを選択したときに、変更されたタブからコンテンツを保存します。これには、保存されていない変更があることをページ上で永続的に示す必要があります。それ以外の場合は、動作タブの切り替えがあいまいになる場合。

L.Möllerが言及しているように、ユーザーに「本当ですか?」この場合、元に戻すアクションが意味をなさないと思いますが、2番目の提案は、ポップアップダイアログの煩わしさを回避する実装を提供します。

7
user31143

タブは、表示されているかどうかに関係なく状態を維持するためのものです。つまり、タブBに切り替えてからAに戻しても、タブAにあるものはまったく同じに見えるはずです。

Webブラウザーを使用して、タブでメールを書き始めてみてください。別のタブを開いて、メールに戻りますcomposerタブ。メールに書いた内容がなくなっていたら、驚くでしょう。

7
Henrik Ekblom

フローと構造を設計するとき、1つの操作/トランザクション/アクション/目標内で2つのタブを切り替えるために、ユーザーをそのような位置に置かないように最善を尽くします。アドレスをタブに配置した場合、タブに保存ボタンを配置しようとします。そうでない場合は、技術的な能力、メディア、ユーザー、データローミングなどに応じて、折りたたみ式および/または1つの長い画面で作業します。

タブで作業する必要があり、技術的な能力がある場合。少なくとも、どの情報が変更されたかについてのフィードバックをユーザーに提供することを試みることができます。たとえば、「保存済み」情報と「未保存」情報を異なるビジュアルで作成します。 (例:保存されたダークグレーとレギュラー、保存されていないライトグレーとボールド)これは、バンキングアプリケーションで時々使用するものです。

1
Esin

簡潔な答え:

99%の時間、優れたUXにはなりません。

私の選択はユーザーに通知するです:

  • 受動的にタブを離れるときおよび
  • ページを離れるときに積極的に

不要な長い答え:

どうして?ここに私の心に浮かぶいくつかの考えと推奨事項:

ユーザーは何を期待していますか?アプリケーションのユーザーがどのようなプログラムに慣れることができるかを考え、同様のアプローチに従うか、より良い(簡単、明確、詳細)な方法を試す必要があります直感的など)。

確かに、以前の回答で述べたように、ユーザーを怒らせたり混乱させたりする傾向がある暗黙の非直感的なアクションを作成することは禁止されていますユーザーが保持したい可能性のあるアクションを不必要に取り消す後で保存/確認することは間違いなく避けるべきことです。

いくつかの可能な解決策:

1)ユーザーのアクションの前にアプリの動作について通知します):動作は直感的であり、使用上の注意を必要としない傾向がありますが、場合によっては、またはUXの欠点よりも多くの利点があります。 「保存せずにタブを離れると、編集されたコンテンツは破棄されます」のようなもの
この場合、私はそれがまったく適切であるとは思いません。

2)未保存の変更されたコンテンツがあることをユーザーに通知します(ユーザーのアクション後):

いつ?:

  • a)タブを離れるとき
  • b)ページを離れる/変更するとき

どうやって?

  • a)積極的に:選択の余地はなく、タブ/ページを離れる瞬間に選択する。

  • b)受動的に:ユーザーに「常に」それをユーザーに知らせる警告が表示されますが、即時応答の要求はありません。 UIのデザインとアプリケーションに応じて、いくつかのことができます。たとえば、保存されていないタブのスタイルを変更します(開発者以外のユーザーには、*だけでは常に十分だとは思いません)。より多くの調整可能な記号は有益な集計になります。「参照バー」に「保存されていないタブ」があり、「保存されていないタブの色」が参照されている場合(編集可能なタブの量がかなりの場合、 1つまたは2つ)。

いくつかの特定のケースで役立つかもしれない他のもの:

  • タブでコンテンツを分割する現在の基準は適切ですか?各タブはどのように関連していますか?:

    ユーザーとして、タブで何かを編集している場合、アクションを完了するためにいくつかの情報を見つけるために別のタブに移動する必要はありません(2つの設定間の一貫性を維持するような別のタブに配置されます)。つまりタブの結合が少ないほど良いです。そうすることで、保存されていないコンテンツの存在を減らすことができます。アクションを完了するためにタブ間を移動するユーザーの傾向は、タブ内の情報分布を再分析するための良い理由かもしれません。

「わかりました。最善を尽くしましたが、それが間違っているとどうなりますか?

それをテストし、それから学び、それを改善してください。ユーザーの行動を追跡して、彼らが何をする傾向があるのか​​についての手がかりを見つけ、それに基づいてアプリケーションを変更することができます。

1

まず、変更を単に破棄することには(つまり、予告なしに)常に何か問題があります。

第二に、ユーザーが変更を保存するか、緩やかにしない限り、ユーザーがタブを切り替えるのを防ぐことはあまり良くありません。複数のタブがある場合は、1つのタブから別のタブに切り替えることができます。または、編集中のタブが一番上の要素になるようにデザインを変更する必要があります(たとえば、淡色のbgのポップアップとして)

最後に、別のタブに移動できる間にタブを変更すると危険な場合があります。ユーザーに通知できます(*は常に良いです。タブヘッダーの色が異なります...)。また、最初のポイントでループするために、ユーザーがアプリケーションを閉じても入力が失われないようにする必要があります。アラートを使用するか(たとえばgmailを参照)、下書きをバックグラウンドで保存するか、またはその両方を行います。

0
njzk2