web-dev-qa-db-ja.com

モバイルアプリに引き出しがある場合、閉じる/戻るボタンをどこに置くのですか?

私はAndroid&iOSアプリを(できるだけ)似ていると思われます)設計しています。一部の画面には引き出しが残っています:

enter image description here

要件の1つは、左の引き出しと閉じる/戻るボタンを持つモーダル画面(他の画面の上に)を持つことです。問題はそのようなボタンを配置するのが適切な場所です

これは受け入れられますか(右の閉じるボタン):

enter image description here

マテリアルデザイン Googleによると、ドロワーメニュー(またはナビゲーションドロワー)には閉じるボタンは必要ありません。右側に表示されているコンテンツを操作するか、メニューのリンクを押すと、コンテンツが閉じます。

iOS Appleには、引き出しメニューに関する公式のガイドラインはありません。

コンテンツを脇に置くこれは、Dribbbleでよく目にする人気のある操作です。引き出しメニューはコンテンツを右に押します。ハンバーガーアイコンも一緒に移動します。ボタンまたはまだ表示されているコンテンツを操作すると、引き出しが閉じます。閉じるボタンは表示されません。

したがって、閉じるボタンはそれ自体必要ではなく、オプションです。
しかし、閉じるボタンを追加したい場合、どこに配置しますか?

Mac vs Windows要素を配置する場所を決定する優れた方法は、他の規則を考慮して、ユーザーがそれを期待する場所を考えることです。この問題は、このテーマの人々をWindowsユーザーとMacユーザーに分離できることです。 Windowsユーザーは、右上隅にそれを期待します。 Macユーザーは左側に慣れています。 Windowsグループは大きくなりますが、右側が最良であると想定するのは安全ではありません。

だからあなたは本当にしっかりした慣習に頼ることができない、あなたは何ができるのですか?

それを現実の物理学にできるだけ近づけることが答えだと思います。これを行うには、アニメーションのコンテキストを維持し、実際の動作をシミュレートします。

スライド
ナビゲーションドロワーがコンテンツの左側からスライドする場合、右上に閉じるボタンを配置します。実際の引き出しを閉じるときは、クローゼットの近くではなく、外側の端を押します。また、アニメーションは左から右に目を描画します。

コンテンツを右端まで押し出す
ナビゲーションドロワーがコンテンツを右端まで押すと、上記と同じ理由で、右上隅に閉じるボタンを配置します。
ただし、コンテンツがまだ部分的に表示されている場合は、閉じるボタンをまったく使用しないことを強くお勧めします。

上部のフェーディングレイヤー
ナビゲーションが画面全体でフェードインする場合は、ハンバーガーボタンと同じ場所に閉じるボタンを配置します。

デザインを見ると、ハンバーガーアイコンと閉じるアイコンの両方が表示されています。この時点でハンバーガーアイコンは何をしますか?だから、もしあなたの質問に正解なら答えてください。いいえ、まだ表示されているハンバーガーアイコンと組み合わせてはいけません。

お役に立てれば。

2