web-dev-qa-db-ja.com

マテリアルデザインの戻るアイコンと閉じるアイコン

一部の Material Design アプリは、ツールバーの一般的な「戻る」アイコンの代わりに「閉じる」アイコンを使用します。次に例を示します。

enter image description here

https://stackoverflow.com/questions/27125340/material-close-button-in-toolbar-instead-of-back から)

これに関するガイドラインはありますか?または、最も適切と思われるものを選択するための最良のアプローチは何ですか?

15
fhucho

ああ、UX.SEでこの標準的な回答をして申し訳ありませんが、本当に場合によって異なりますです。

ページを閉じているか、ページから戻っているかによって異なります。製品を閉じる必要があるかどうかは、製品を必要としない、または製品から離れる必要がないためです。

個人的には、閉じるアイコンは削除と破棄に関連しており、この場合はそうではありません。あるページから別のページに前後に移動しているため、矢印がX:sよりも優れていると感じます。 Xが終了し、矢印がナビゲートします。

したがって、ナビゲートしている場合は、矢印を使用します。削除する場合はXを使用します。

9
Benny Skogberg

これに関するがある公式ガイドライン-- ここ

ガイドラインから:

全画面ダイアログで使用される「X」は、ビューの状態が常に保存されていることを示す上矢印とは異なります。たとえば、[設定]で使用される上矢印は、すべての変更が明示的な確認またはキャンセルアクションなしで直ちにコミットされることを示します。

その動作については:

破棄アクション(画面の左上にある「X」)と[戻る]ボタンの両方で全画面ダイアログが閉じ、変更が破棄されます。

(ここでの「戻るボタン」とは、システム内の戻るボタンを指し、アプリ内で使用される左向きの上矢印ではありません。)

7
Tin Man

ベニーが言うように、それはアプリの全体的なナビゲーションのメタファー/パラダイムに依存します。私が作成した1つのアプリでは、メタファーはホームページであり、ユーザーは上部に追加のウィンドウを開いてエンティティ/オブジェクトの詳細を表示しました。それらはすべて(ポップアップダイアログとは異なり)全画面表示でしたが、メタファーはナビゲーションステップではなく「レイヤー」でした。その場合、Xは最上層を削除して前の画面に戻るのに適していました。別のアプリでは、ナビゲーションのメタファーはよりパンくずのようなものであり、前後の矢印(ブラウザーのような)がより適切でした。

したがって、ナビゲーションがstackまたはlayerベースである場合、私は[〜#〜] x [〜#〜]と言います

あなたのナビゲーションがpathまたはgraphベースである場合、私はArrowsと言います

マテリアルデザインにはレイヤーまたはZディメンションがあるため、アプリはXアイコンを使用したのはそのためだと思います。

5
J. Dimeo