質問しよう
トップ
/
ナビゲーションUIの基本
/
グローバルナビゲーションの基本

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

August 5, 2022
情報設計
保存
保存中
すべてを閲覧するにはBONOメンバーシップに登録しよう
BONO - プロと学ぶUIとUXのコミュニティ
詳細

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

この動画では「グローバルナビゲーション」の基本を習得します。 「グローバルナビゲーション」とはアプリでもデスクトップのサービスでも、その全体像を把握する要になる概念です。サービスであれば、提供したい価値を体験するために必要な情報などへ導くための導線になります。

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

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

▽リデザインして欲しい素材
※Figma以外の方はスクショなどで対応していただけたらと思います🙏

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=1%3A114


▽ ダメUIのプロトタイプ

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=1%3A114&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=1%3A114&show-proto-sidebar=1

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=48%3A4861&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=48%3A5967&show-proto-sidebar=1

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

この動画では「グローバルナビゲーション」の基本を習得します。 「グローバルナビゲーション」とはアプリでもデスクトップのサービスでも、その全体像を把握する要になる概念です。サービスであれば、提供したい価値を体験するために必要な情報などへ導くための導線になります。

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

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

▽リデザインして欲しい素材
※Figma以外の方はスクショなどで対応していただけたらと思います🙏

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=1%3A114


▽ ダメUIのプロトタイプ

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=1%3A114&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=1%3A114&show-proto-sidebar=1

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=48%3A4861&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=48%3A5967&show-proto-sidebar=1

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

この動画では「グローバルナビゲーション」の基本を習得します。 「グローバルナビゲーション」とはアプリでもデスクトップのサービスでも、その全体像を把握する要になる概念です。サービスであれば、提供したい価値を体験するために必要な情報などへ導くための導線になります。

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

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=1%3A114&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=1%3A114&show-proto-sidebar=1

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=48%3A4861&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=48%3A5967&show-proto-sidebar=1

ナビゲーションUIの基本

8
使いやすいUIをデザインしたいなら『ナビゲーション』を理解しよう
08:06
使いやすいUIをデザインしたいなら『ナビゲーション』を理解しよう

使いやすいUIをデザインしたいなら『ナビゲーション』を理解しよう

グローバルナビゲーションの基本
13:21
グローバルナビゲーションの基本

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

お題解答 : ゴールがグロナビの在り方を決めます
12:27
お題解答 : ゴールがグロナビの在り方を決めます

お題解答 : ゴールがグロナビの在り方を決めます

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

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

お題解答:ユーザーに”位置”を伝えるUIは使いやすい
08:43
お題解答:ユーザーに”位置”を伝えるUIは使いやすい

お題解答:ユーザーに”位置”を伝えるUIは使いやすい

モーダルナビゲーションの基本
16:30
モーダルナビゲーションの基本

モーダルナビゲーションの基本

お題解答:アクションのデザインはコンテンツとの関係が鍵
12:11
お題解答:アクションのデザインはコンテンツとの関係が鍵

お題解答:アクションのデザインはコンテンツとの関係が鍵

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

August 5, 2022
情報設計
すべてを閲覧するにはBONOメンバーシップに登録しよう
BONO - プロと学ぶUIとUXのコミュニティ
詳細

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

この動画では「グローバルナビゲーション」の基本を習得します。 「グローバルナビゲーション」とはアプリでもデスクトップのサービスでも、その全体像を把握する要になる概念です。サービスであれば、提供したい価値を体験するために必要な情報などへ導くための導線になります。

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

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

▽リデザインして欲しい素材
※Figma以外の方はスクショなどで対応していただけたらと思います🙏

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=1%3A114


▽ ダメUIのプロトタイプ

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=1%3A114&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=1%3A114&show-proto-sidebar=1

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=48%3A4861&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=48%3A5967&show-proto-sidebar=1

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

この動画では「グローバルナビゲーション」の基本を習得します。 「グローバルナビゲーション」とはアプリでもデスクトップのサービスでも、その全体像を把握する要になる概念です。サービスであれば、提供したい価値を体験するために必要な情報などへ導くための導線になります。

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

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

▽リデザインして欲しい素材
※Figma以外の方はスクショなどで対応していただけたらと思います🙏

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=1%3A114


▽ ダメUIのプロトタイプ

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=1%3A114&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=1%3A114&show-proto-sidebar=1

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=48%3A4861&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=48%3A5967&show-proto-sidebar=1

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

この動画では「グローバルナビゲーション」の基本を習得します。 「グローバルナビゲーション」とはアプリでもデスクトップのサービスでも、その全体像を把握する要になる概念です。サービスであれば、提供したい価値を体験するために必要な情報などへ導くための導線になります。

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

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=1%3A114&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=1%3A114&show-proto-sidebar=1

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

https://www.figma.com/proto/BlZSubEgojxbcdf63T5Mxp/🍣-悪いUIから学ぶ-ナビゲーションの基本?page-id=0%3A1&node-id=48%3A4861&viewport=750%2C328%2C0.06&scaling=min-zoom&starting-point-node-id=48%3A5967&show-proto-sidebar=1

ナビゲーションUIの基本

8
使いやすいUIをデザインしたいなら『ナビゲーション』を理解しよう
08:06
使いやすいUIをデザインしたいなら『ナビゲーション』を理解しよう

使いやすいUIをデザインしたいなら『ナビゲーション』を理解しよう

グローバルナビゲーションの基本
13:21
グローバルナビゲーションの基本

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

お題解答 : ゴールがグロナビの在り方を決めます
12:27
お題解答 : ゴールがグロナビの在り方を決めます

お題解答 : ゴールがグロナビの在り方を決めます

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

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

お題解答:ユーザーに”位置”を伝えるUIは使いやすい
08:43
お題解答:ユーザーに”位置”を伝えるUIは使いやすい

お題解答:ユーザーに”位置”を伝えるUIは使いやすい

モーダルナビゲーションの基本
16:30
モーダルナビゲーションの基本

モーダルナビゲーションの基本

お題解答:アクションのデザインはコンテンツとの関係が鍵
12:11
お題解答:アクションのデザインはコンテンツとの関係が鍵

お題解答:アクションのデザインはコンテンツとの関係が鍵