ドロワーメニュー
状態:調査中
閲覧数:1,547
投稿日:2015-12-22
更新日:2015-12-26
ハンバーガーアイコン
・三本線
リスト型三本線
プラスマーク
ハンバーガーメニュー
・格納されているため、2タップの操作が必要
ドロワーメニュー
・横からぬるっと出てぬるっと引っ込む
アコーディオンメニュー
・三本線
リスト型三本線
プラスマーク
ハンバーガーメニュー
・格納されているため、2タップの操作が必要
ドロワーメニュー
・横からぬるっと出てぬるっと引っ込む
アコーディオンメニュー
Bootstrap4のスマホメニュー
感想
全然イケていないことに気が付く
・Bootstrap3とほぼ同じ
Bootstrapの進化は軟調?
・1.4を初めて見たとき、これは凄い! と思った
・その後、2系3系と順調に進化してきたように思うが、4系は少なくともデザインに関しては何も進展していないような気もする
・フォントアイコンが少なくなったことでむしろ退化?
部分利用も検討すべきかも
・これまでフル利用することしか考えていなかったが、どうせスマホメニューをカスタマイズするのなら、読込内容は必要最低限に留めた方がよいかも
・バージョンアップする毎にクラス名変更するのも面倒だし
・それに見合った完成度でもなくなってきたような気もする
スマホ対策として欲しい内容は?
・第1 … グリッドシステム
・第2 … スマホメニュー
リリース前なので
最低限の実装
・Bootstrap自体の挙動がこれから変更になると困るので、現時点ではなるべく最低限の実装に留めていた方が無難
具体例
メニュー文言
ホーム
・「Yahoo」「ユニクロ」何れも未使用
メニュー表示アニメーション方向
右から左
・「Yahoo」「ユニクロ」
表示範囲
全体を覆いつくす
・元画面内容が見えない
・ユニクロ
メニュー横幅は、全体のほぼ半分
・縦は下まで届く
・元画面は暗く表示
・Yahoo
実装方法
評価ポイント
表示切替
・「ハンバーガーメニュー」「×印」相互に切り替わるか
表示位置
・「ハンバーガーメニュー」「×印」表示位置は同じか
希望仕様
希望
表示範囲
・「ハンバーガーメニュー」「×印」以外は全てメニュー表示
表示アニメーション
・右から左
×印を押したら
・アニメーションせず画面切り替え(元画面)
許容範囲
表示アニメーション
・「右から左」ではなく「上から下」でも、使い勝手はほとんど変わらない