階層ナビゲーションの基本

グローバルナビゲーションの基本を習得

この動画では「階層」の基本を習得します。 「階層」は全てのページ構造の基本です。今回は階層の理解を深めるとともに、普段無意識に操作している階層に関わるUIにフォーカスを当てていきます。

なぜこの位置にこのUIがよくあるのか？どういう意味があるのか？をしっかり動画を観て理解してください。

‍

ダメなUIをリデザインしよう

今回は以下のUIをリデザインしていきましょう。 ダメな点は動画で解説しています。改善ポイントを把握してリデザインしてみましょう！

‍

▽改善して欲しいデザインの素材

https://www.figma.com/file/BlZSubEgojxbcdf63T5Mxp/%F0%9F%8D%A3-%E6%82%AA%E3%81%84UI%E3%81%8B%E3%82%89%E5%AD%A6%E3%81%B6-%E3%83%8A%E3%83%93%E3%82%B2%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E5%9F%BA%E6%9C%AC?node-id=5%3A1190

‍

▽ ダメUIのプロトタイプを見る

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=4%3A688&node-id=5%3A1190&viewport=720%2C610%2C0.25&scaling=min-zoom&starting-point-node-id=5%3A1190&show-proto-sidebar=1

‍

スライドのデータはこちら

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=4%3A688&node-id=55%3A3862&viewport=397%2C111%2C0.05&scaling=scale-down-width&starting-point-node-id=55%3A3153&show-proto-sidebar=1

‍

グローバルナビゲーションの基本を習得

この動画では「階層」の基本を習得します。 「階層」は全てのページ構造の基本です。今回は階層の理解を深めるとともに、普段無意識に操作している階層に関わるUIにフォーカスを当てていきます。

なぜこの位置にこのUIがよくあるのか？どういう意味があるのか？をしっかり動画を観て理解してください。

ダメなUIをリデザインしよう

今回は以下のUIをリデザインしていきましょう。 ダメな点は動画で解説しています。改善ポイントを把握してリデザインしてみましょう！

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=4%3A688&node-id=5%3A1190&viewport=720%2C610%2C0.25&scaling=min-zoom&starting-point-node-id=5%3A1190&show-proto-sidebar=1

スライドのデータはこちら

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=4%3A688&node-id=55%3A3862&viewport=397%2C111%2C0.05&scaling=scale-down-width&starting-point-node-id=55%3A3153&show-proto-sidebar=1

‍